feat: 优化UI
This commit is contained in:
Blizzard
+44
-70
@@ -12,9 +12,36 @@ const app = getApp()
|
||||
const api = require('../../utils/api')
|
||||
const util = require('../../utils/util')
|
||||
|
||||
/**
|
||||
* 模块级函数：根据时间段随机返回文案
|
||||
* 必须在 Page() 外定义，才能在 data 初始化时同步调用，避免闪烁
|
||||
*/
|
||||
function _computeGreeting() {
|
||||
const hour = new Date().getHours()
|
||||
var pool
|
||||
if (hour >= 5 && hour < 9) {
|
||||
pool = ['新的一天，从声音开始', '早起的人，先听一段', '清晨的第一居声，属于你', '晚起不如早起，早起不如听起']
|
||||
} else if (hour >= 9 && hour < 12) {
|
||||
pool = ['上午充能量，声音加持', '专注工作，也别忘了呼吸', '高效早上，入耳知识', '好状态，从一段内容开始']
|
||||
} else if (hour >= 12 && hour < 14) {
|
||||
pool = ['午后小憩，听点轻松的', '借耳机隔绝喖鼺，中午也有自己的时间', '饭后十分钟，充电一下', '慢下来，下午还长']
|
||||
} else if (hour >= 14 && hour < 17) {
|
||||
pool = ['下午了，来点声音撤个困', '下午三点，刚好开始听一段', '下午的阳光和一段好内容', '止止广告，呜口内容']
|
||||
} else if (hour >= 17 && hour < 19) {
|
||||
pool = ['日落时分，放慢脚步', '下班了，耳机里换一个频道', '偶尔不刷短视频，试试听点实的', '归途中最适合听一段']
|
||||
} else if (hour >= 19 && hour < 22) {
|
||||
pool = ['夜晚温柔，适合倾听', '夜晚的声音，不用起时间', '放下手机，喂口内容', '夹着夜色，听一段值得的']
|
||||
} else {
|
||||
pool = ['夜深了，听点帮助入眠的', '出发前最后一段，晚安', '夜深的小时光，留给自己', '好梦将至，晚安']
|
||||
}
|
||||
return pool[Math.floor(Math.random() * pool.length)]
|
||||
}
|
||||
|
||||
Page({
|
||||
data: {
|
||||
greetingSub: '',
|
||||
// 同步计算，第一帧就正确，避免闪烁
|
||||
greetingSub: _computeGreeting(),
|
||||
statusBarHeight: app.globalData.statusBarHeight || 0,
|
||||
locationName: '',
|
||||
weather: null,
|
||||
dateDisplay: '',
|
||||
@@ -23,7 +50,6 @@ Page({
|
||||
freeChannels: [],
|
||||
isPlaying: false,
|
||||
isVip: false,
|
||||
statusBarHeight: 0,
|
||||
loadingSub: true,
|
||||
loadingFree: true
|
||||
},
|
||||
@@ -33,13 +59,13 @@ Page({
|
||||
onShow() {
|
||||
const gd = app.globalData
|
||||
this.setData({
|
||||
greetingSub: this._getGreeting(),
|
||||
greetingSub: _computeGreeting(), // 每次进页随机刷新文案
|
||||
dateDisplay: util.getDateDisplay(),
|
||||
weekDay: util.getWeekDay(),
|
||||
locationName: gd.locationName || '',
|
||||
weather: gd.weather || null,
|
||||
isVip: gd.isVip || false,
|
||||
statusBarHeight: gd.statusBarHeight || 0
|
||||
isVip: gd.isVip || false
|
||||
// statusBarHeight 小程序运行期间不会变化，无需重设
|
||||
})
|
||||
this._loadAll()
|
||||
this._bindEvents()
|
||||
@@ -96,18 +122,24 @@ Page({
|
||||
},
|
||||
|
||||
/**
|
||||
* 拉取免费频道列表
|
||||
* 首次无数据时显示骨架屏，后续静默刷新
|
||||
* 拉取频道列表（Section 2）
|
||||
* VIP 用户：全部频道；普通用户：仅免费频道
|
||||
*/
|
||||
_loadFreeChannels() {
|
||||
const self = this
|
||||
const gd = app.globalData
|
||||
const isFirstLoad = self.data.freeChannels.length === 0
|
||||
|
||||
if (isFirstLoad) {
|
||||
self.setData({ loadingFree: true })
|
||||
}
|
||||
|
||||
api.getFreeChannelList({ current: 1, pageSize: 20 })
|
||||
// VIP 用户加载全量频道，普通用户仅免费频道
|
||||
var apiCall = gd.isVip
|
||||
? api.getChannelList({ current: 1, pageSize: 50 })
|
||||
: api.getFreeChannelList({ current: 1, pageSize: 20 })
|
||||
|
||||
apiCall
|
||||
.then(function (res) {
|
||||
if (res.code !== 200 || !res.data) {
|
||||
self.setData({ freeChannels: [], loadingFree: false })
|
||||
@@ -115,23 +147,21 @@ Page({
|
||||
}
|
||||
|
||||
const list = res.data.list || []
|
||||
|
||||
const freeChannels = list.map(function (ch) {
|
||||
return {
|
||||
id: ch.id,
|
||||
name: ch.name || '未命名',
|
||||
// cover 直接是 emoji 字符串
|
||||
cover: ch.cover || '📻',
|
||||
bgColor: self._genColor(ch.id),
|
||||
programCount: (ch.Programs || ch.programs || []).length,
|
||||
isFree: ch.isFree
|
||||
isFree: ch.isFree,
|
||||
isVipOnly: ch.isVipOnly
|
||||
}
|
||||
})
|
||||
|
||||
self.setData({ freeChannels: freeChannels, loadingFree: false })
|
||||
})
|
||||
.catch(function (err) {
|
||||
console.error('[首页] 免费频道失败', err)
|
||||
console.error('[首页] 频道加载失败', err)
|
||||
self.setData({ loadingFree: false })
|
||||
})
|
||||
},
|
||||
@@ -261,61 +291,5 @@ Page({
|
||||
},
|
||||
|
||||
// ===================== 工具方法 =====================
|
||||
|
||||
/** 根据时间段返回问候语 */
|
||||
_getGreeting() {
|
||||
const hour = new Date().getHours()
|
||||
var pool
|
||||
if (hour >= 5 && hour < 9) {
|
||||
pool = [
|
||||
'新的一天，从声音开始',
|
||||
'早起的人，先听一段',
|
||||
'清晨的第一居声，属于你',
|
||||
'晚起不如早起，早起不如听起'
|
||||
]
|
||||
} else if (hour >= 9 && hour < 12) {
|
||||
pool = [
|
||||
'上午充能量，声音加持',
|
||||
'专注工作，也别忘了呼吸',
|
||||
'高效早上，入耳知识',
|
||||
'好状态，从一段内容开始'
|
||||
]
|
||||
} else if (hour >= 12 && hour < 14) {
|
||||
pool = [
|
||||
'午后小憩，听点轻松的',
|
||||
'借耳机隔绝喧嚣，中午也有自己的时间',
|
||||
'饭后十分钟，充电一下',
|
||||
'慢下来，下午还长'
|
||||
]
|
||||
} else if (hour >= 14 && hour < 17) {
|
||||
pool = [
|
||||
'下午了，来点声音撤个困',
|
||||
'下午三点，刚好开始听一段',
|
||||
'下午的阳光和一段好内容',
|
||||
'止止广告，喝口内容'
|
||||
]
|
||||
} else if (hour >= 17 && hour < 19) {
|
||||
pool = [
|
||||
'日落时分，放慢脚步',
|
||||
'下班了，耳机里换一个频道',
|
||||
'偶尔不刷短视频，试试听点实的',
|
||||
'归途中最适合听一段'
|
||||
]
|
||||
} else if (hour >= 19 && hour < 22) {
|
||||
pool = [
|
||||
'夜晚温柔，适合倾听',
|
||||
'夜晚的声音，不用赶时间',
|
||||
'放下手机，喂口内容',
|
||||
'夹着夜色，听一段值得的'
|
||||
]
|
||||
} else {
|
||||
pool = [
|
||||
'夜深了，听点帮助入眠的',
|
||||
'出发前最后一段，晚安',
|
||||
'夜奥的小时光，留给自己',
|
||||
'好梦将至，晚安'
|
||||
]
|
||||
}
|
||||
return pool[Math.floor(Math.random() * pool.length)]
|
||||
}
|
||||
// _computeGreeting 已提至模块级，可在 data 初始化时直接调用
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user