feat: 样式调整

This commit is contained in:
Blizzard
2026-04-28 10:32:19 +08:00
parent 7f51b2a0a8
commit ce91e2cbbe
33 changed files with 1553 additions and 619 deletions
+154 -29
View File
@@ -7,12 +7,16 @@ const util = require('../../utils/util')
Page({
data: {
tab: 'history', // 'history' | 'favorite'
tab: 'history',
historyList: [],
isPlaying: false,
loading: true
loading: true,
channelFilters: [],
selectedChannel: '全部'
},
_allHistoryList: [],
onShow() {
const self = this
const gd = app.globalData
@@ -40,15 +44,18 @@ Page({
setTab(e) {
const tab = e.currentTarget.dataset.val
if (tab === this.data.tab) return
this.setData({ tab, historyList: [], loading: true })
this.setData({ tab, historyList: [], loading: true, channelFilters: [], selectedChannel: '全部' })
this._allHistoryList = []
this._refresh()
},
_refresh() {
if (this.data.tab === 'history') {
this._loadHistory()
} else {
} else if (this.data.tab === 'favorite') {
this._loadFavorites()
} else {
this._loadLikes()
}
},
@@ -59,31 +66,32 @@ Page({
api.getHistoryList({ current: 1, pageSize: 30 }).then(function (res) {
if (res.code === 200 && res.data) {
var list = (res.data.list || []).map(function (item) {
// program 嵌套在 item.program 下
var program = item.program || {}
// channel 可能为 nullchannel cover 在 program.cover
var channel = program.channel || {}
var channel = program.channel || null
// 历史用 item.duration(记录收听时长),优先级高于 program.duration
var dur = item.duration || program.duration || 0
var bgColors = ['#FFE8CC', '#FFF0E0', '#FFE4D6', '#FFF3DC', '#FFE9F0']
var cid = program.channelId || ''
var colorIdx = cid ? (cid.charCodeAt(cid.length - 1) % bgColors.length) : 0
return {
// 播放所需字段
id: program.id,
title: program.title || '未知节目',
channelId: program.channelId || '',
content: program.content || '',
audioId: program.audioId || '',
// 用历史记录的 durationprogram.duration 可能是 0
duration: item.duration || program.duration || 0,
// 显示字段
_domainName: channel.name || '',
_icon: program.cover || channel.cover || '📻',
_bgColor: '#FFE8CC',
duration: dur,
_domainName: channel ? (channel.name || '') : '',
_icon: program.cover || (channel && channel.cover) || '📻',
_bgColor: bgColors[colorIdx],
_friendlyDate: util.getFriendlyDate(item.createdAtStr ? item.createdAtStr.substring(0, 10) : ''),
durationText: util.formatTime(item.duration || 0),
// 播放进度
durationText: dur > 0 ? util.formatTime(dur) : '',
_progress: item.progress || 0,
_isThisPlaying: gd.activeContent && gd.activeContent.id === program.id
}
})
self.setData({ historyList: list, isPlaying: gd.isPlaying, loading: false })
self._allHistoryList = list
self._extractChannelFilters(list)
} else {
self.setData({ historyList: [], loading: false })
}
@@ -100,24 +108,35 @@ Page({
api.getFavoriteList({ current: 1, pageSize: 30 }).then(function (res) {
if (res.code === 200 && res.data) {
var list = (res.data.list || []).map(function (item) {
var program = item.program || item
var channel = program.channel || {}
// program 嵌套在 item.program 下,channel 可能为 null
var program = item.program || {}
var channel = program.channel || null
var dur = program.duration || 0
// 根据 channelId 末位生成固定暖色,增加视觉区分
var bgColors = ['#FFE8CC', '#FFF0E0', '#FFE4D6', '#FFF3DC', '#FFE9F0']
var cid = program.channelId || ''
var colorIdx = cid ? (cid.charCodeAt(cid.length - 1) % bgColors.length) : 0
return {
id: program.id,
title: program.title || '未知节目',
channelId: program.channelId || '',
content: program.content || '',
audioId: program.audioId || '',
duration: program.duration || 0,
_domainName: channel.name || '',
_icon: program.cover || channel.cover || '📻',
_bgColor: '#FFE8CC',
duration: dur,
// channel 为 null 时不显示频道名
_domainName: channel ? (channel.name || '') : '',
_icon: program.cover || (channel && channel.cover) || '📻',
_bgColor: bgColors[colorIdx],
// 收藏时间用 item.createdAtStr
_friendlyDate: util.getFriendlyDate(item.createdAtStr ? item.createdAtStr.substring(0, 10) : ''),
durationText: util.formatTime(program.duration || 0),
// duration 为 0 则不显示时长
durationText: dur > 0 ? util.formatTime(dur) : '',
_isThisPlaying: gd.activeContent && gd.activeContent.id === program.id
}
})
self.setData({ historyList: list, isPlaying: gd.isPlaying, loading: false })
self._allHistoryList = list
self._extractChannelFilters(list)
} else {
self.setData({ historyList: [], loading: false })
}
@@ -127,6 +146,53 @@ Page({
})
},
_loadLikes() {
const self = this
const gd = app.globalData
api.getLikeList({ current: 1, pageSize: 30 }).then(function (res) {
if (res.code === 200 && res.data) {
var list = (res.data.list || []).map(function (item) {
// RadioLike → program → channel (可能为 null)
var program = item.program || {}
var channel = program.channel || null
// duration 为 0 时不显示时长
var dur = program.duration || 0
// 从 channelId 生成一个固定暖色背景,增加视觉区分
var bgColors = ['#FFE8CC', '#FFF0E0', '#FFE4D6', '#FFF3DC', '#FFE9F0']
var cid = program.channelId || ''
var colorIdx = cid ? (cid.charCodeAt(cid.length - 1) % bgColors.length) : 0
return {
id: program.id,
title: program.title || '未知节目',
channelId: program.channelId || '',
content: program.content || '',
audioId: program.audioId || '',
duration: dur,
// channel 为 null 时频道名不显示
_domainName: channel ? (channel.name || '') : '',
_icon: program.cover || (channel && channel.cover) || '📻',
_bgColor: bgColors[colorIdx],
// 显示"点赞时间",用 item.createdAtStr(点赞时间)
_friendlyDate: util.getFriendlyDate(item.createdAtStr ? item.createdAtStr.substring(0, 10) : ''),
// duration 为 0 则不显示时长,避免展示 "00:00"
durationText: dur > 0 ? util.formatTime(dur) : '',
_isLiked: true,
_isThisPlaying: gd.activeContent && gd.activeContent.id === program.id
}
})
self.setData({ historyList: list, isPlaying: gd.isPlaying, loading: false })
self._allHistoryList = list
self._extractChannelFilters(list)
} else {
self.setData({ historyList: [], loading: false })
}
}).catch(function (err) {
console.error('[History] 加载点赞失败:', err)
self.setData({ loading: false })
})
},
_updatePlayState() {
var gd = app.globalData
var list = this.data.historyList.map(function (item) {
@@ -137,6 +203,32 @@ Page({
this.setData({ historyList: list, isPlaying: gd.isPlaying })
},
_extractChannelFilters(list) {
var names = {}
list.forEach(function (item) {
if (item._domainName) names[item._domainName] = true
})
var filters = ['全部'].concat(Object.keys(names).sort())
this.setData({ channelFilters: filters })
},
onChannelFilter(e) {
var name = e.currentTarget.dataset.name
this.setData({ selectedChannel: name })
this._applyChannelFilter(name)
},
_applyChannelFilter(name) {
if (name === '全部') {
this.setData({ historyList: this._allHistoryList })
} else {
var filtered = this._allHistoryList.filter(function (item) {
return item._domainName === name
})
this.setData({ historyList: filtered })
}
},
onPlay(e) {
const id = e.currentTarget.dataset.id
const gd = app.globalData
@@ -175,8 +267,30 @@ Page({
const id = e.currentTarget.dataset.id
const tab = this.data.tab
const self = this
const label = tab === 'history' ? '历史' : '收藏'
// 赞过 tab 点击爱心可取消点赞
if (tab === 'like') {
wx.showModal({
title: '取消点赞',
content: '确定取消对这个节目的点赞吗?',
success(res) {
if (!res.confirm) return
api.toggleLike(id).then(function (r) {
if (r.code === 200) {
var list = self.data.historyList.filter(function (item) { return item.id !== id })
self.setData({ historyList: list })
} else {
wx.showToast({ title: r.msg || '操作失败', icon: 'none' })
}
}).catch(function () {
wx.showToast({ title: '网络异常', icon: 'none' })
})
}
})
return
}
const label = tab === 'history' ? '历史' : '收藏'
wx.showModal({
title: '删除' + label,
content: '确定删除这条' + label + '吗?',
@@ -188,7 +302,6 @@ Page({
fn.then(function (r) {
if (r.code === 200) {
// 本地即时移除
var list = self.data.historyList.filter(function (item) { return item.id !== id })
self.setData({ historyList: list })
} else {
@@ -204,15 +317,27 @@ Page({
onClear() {
const self = this
const tab = this.data.tab
const label = tab === 'history' ? '收听历史' : '全部收藏'
var label = ''
var fn = null
if (tab === 'history') {
label = '收听历史'
fn = api.deleteAllHistory()
} else if (tab === 'favorite') {
label = '全部收藏'
fn = api.removeAllFavorites()
} else if (tab === 'like') {
label = '全部点赞'
fn = api.removeAllLikes()
}
if (!fn) return
wx.showModal({
title: '清空' + label,
content: '确定要清空所有' + label + '吗?',
success(res) {
if (!res.confirm) return
const fn = tab === 'history'
? api.deleteAllHistory()
: api.removeAllFavorites()
fn.then(function (r) {
if (r.code === 200) {
self.setData({ historyList: [] })