feat:完成首页、分类页内容管理功能开发
This commit is contained in:
R524809
@@ -15,6 +15,7 @@
|
||||
"debug/debug",
|
||||
"categoryManage/categoryManage",
|
||||
"categoryContentManage/categoryContentManage",
|
||||
"homeContentManage/homeContentManage",
|
||||
"index/index",
|
||||
"mathIndex/mathIndex",
|
||||
"focusIndex/focusIndex",
|
||||
|
||||
@@ -4,15 +4,46 @@ export const ALL_CATEGORY: CategoryType = {
|
||||
id: 'all',
|
||||
name: '全部',
|
||||
icon: '📋',
|
||||
path: '/pages/category/category?id=all',
|
||||
};
|
||||
|
||||
export const CATEGORY_LIST: CategoryType[] = [
|
||||
{ id: 'math', name: '数感启蒙', icon: '📐' },
|
||||
{ id: 'puzzle', name: '益智游戏', icon: '🧩' },
|
||||
{ id: 'pinyin', name: '汉语拼音', icon: '🔤' },
|
||||
{ id: 'chinese', name: '趣味识字', icon: '✏️' },
|
||||
{ id: 'english', name: '英语启蒙', icon: '🔤' },
|
||||
{ id: 'craft', name: '创意手工', icon: '🌈' },
|
||||
{
|
||||
id: 'math',
|
||||
name: '数感启蒙',
|
||||
icon: '📐',
|
||||
path: '/pages/category/category?id=math',
|
||||
},
|
||||
{
|
||||
id: 'puzzle',
|
||||
name: '益智游戏',
|
||||
icon: '🧩',
|
||||
path: '/pages/category/category?id=puzzle',
|
||||
},
|
||||
{
|
||||
id: 'pinyin',
|
||||
name: '汉语拼音',
|
||||
icon: '🔤',
|
||||
path: '/pages/category/category?id=pinyin',
|
||||
},
|
||||
{
|
||||
id: 'chinese',
|
||||
name: '趣味识字',
|
||||
icon: '✏️',
|
||||
path: '/pages/category/category?id=chinese',
|
||||
},
|
||||
{
|
||||
id: 'english',
|
||||
name: '英语启蒙',
|
||||
icon: '🔤',
|
||||
path: '/pages/category/category?id=english',
|
||||
},
|
||||
{
|
||||
id: 'craft',
|
||||
name: '创意手工',
|
||||
icon: '🌈',
|
||||
path: '/pages/category/category?id=craft',
|
||||
},
|
||||
];
|
||||
|
||||
export const CATEGORY_LIST_WITH_ALL: CategoryType[] = [
|
||||
|
||||
@@ -10,6 +10,7 @@ export type CategoryId =
|
||||
export interface CategoryType {
|
||||
id: string;
|
||||
name: string;
|
||||
path: string;
|
||||
icon: string;
|
||||
img?: string;
|
||||
color?: string;
|
||||
|
||||
@@ -67,6 +67,17 @@ Page({
|
||||
scrollIntoViewId: '',
|
||||
},
|
||||
|
||||
onLoad(options: Record<string, string>) {
|
||||
const id = options.id;
|
||||
if (id && id !== 'all') {
|
||||
const items = getItemsByCategory(id);
|
||||
this.setData({
|
||||
activeCategoryId: id,
|
||||
displayItems: items,
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onTapCategory(e: WechatMiniprogram.TouchEvent) {
|
||||
const id = e.currentTarget.dataset.id as string;
|
||||
if (!id || id === this.data.activeCategoryId) return;
|
||||
|
||||
@@ -62,7 +62,7 @@ page {
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
.ccm-stat + .ccm-stat {
|
||||
.ccm-stat+.ccm-stat {
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
@@ -96,6 +96,7 @@ page {
|
||||
// ── Worksheet List ──
|
||||
.ccm-page__list {
|
||||
margin-top: 24rpx;
|
||||
margin-bottom: 80rpx;
|
||||
}
|
||||
|
||||
.ws-card {
|
||||
@@ -125,11 +126,12 @@ page {
|
||||
}
|
||||
|
||||
.ws-card__img {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
width: 140rpx;
|
||||
height: 180rpx;
|
||||
border-radius: @radius;
|
||||
flex-shrink: 0;
|
||||
background: @bg-gray;
|
||||
border: @border;
|
||||
}
|
||||
|
||||
.ws-card__img--placeholder {
|
||||
@@ -144,6 +146,9 @@ page {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
margin-left: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.ws-card__title {
|
||||
@@ -158,7 +163,6 @@ page {
|
||||
|
||||
.ws-card__subtitle {
|
||||
display: block;
|
||||
margin-top: 6rpx;
|
||||
font-size: 22rpx;
|
||||
color: @text-secondary;
|
||||
overflow: hidden;
|
||||
@@ -182,11 +186,20 @@ page {
|
||||
|
||||
.ws-card__id {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size: 20rpx;
|
||||
font-size: 22rpx;
|
||||
color: @text-gray;
|
||||
}
|
||||
|
||||
.ws-card__tags {
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.ws-card__tags-text {
|
||||
font-size: 22rpx;
|
||||
color: @text-secondary;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.ws-card__footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -196,10 +209,13 @@ page {
|
||||
}
|
||||
|
||||
.ws-card__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 6rpx 16rpx;
|
||||
border-radius: 999rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.ws-card__badge--active {
|
||||
@@ -234,4 +250,4 @@ page {
|
||||
padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
|
||||
background: @bg-header;
|
||||
box-shadow: 0 -4rpx 16rpx rgba(50, 46, 37, 0.06);
|
||||
}
|
||||
}
|
||||
@@ -10,6 +10,7 @@ type WorksheetItem = {
|
||||
ageMax: number;
|
||||
difficulty: 1 | 2 | 3 | 4;
|
||||
tags: string[];
|
||||
tagsText: string;
|
||||
status: 'draft' | 'active' | 'hidden';
|
||||
sortOrder: number;
|
||||
updatedAt: string;
|
||||
@@ -19,6 +20,7 @@ type WorksheetItem = {
|
||||
statusText: string;
|
||||
actionText: string;
|
||||
actionTarget: string;
|
||||
actionType: string;
|
||||
};
|
||||
|
||||
type Stats = {
|
||||
@@ -44,11 +46,11 @@ const DIFFICULTY_LABELS: Record<number, string> = {
|
||||
|
||||
const STATUS_CONFIG: Record<
|
||||
string,
|
||||
{ text: string; action: string; target: string }
|
||||
{ text: string; action: string; target: string; actionType: string }
|
||||
> = {
|
||||
draft: { text: '草稿', action: '激活', target: 'active' },
|
||||
active: { text: '线上', action: '下架', target: 'hidden' },
|
||||
hidden: { text: '已隐藏', action: '恢复', target: 'draft' },
|
||||
draft: { text: '草稿', action: '激活', target: 'active', actionType: 'green' },
|
||||
active: { text: '线上', action: '下架', target: 'hidden', actionType: 'default' },
|
||||
hidden: { text: '已隐藏', action: '恢复', target: 'draft', actionType: 'primary' },
|
||||
};
|
||||
|
||||
function formatWorksheet(raw: Record<string, unknown>): WorksheetItem {
|
||||
@@ -68,6 +70,7 @@ function formatWorksheet(raw: Record<string, unknown>): WorksheetItem {
|
||||
ageMax,
|
||||
difficulty,
|
||||
tags: Array.isArray(raw.tags) ? raw.tags.map(String) : [],
|
||||
tagsText: Array.isArray(raw.tags) ? raw.tags.map(String).join('、') : '',
|
||||
status: status as WorksheetItem['status'],
|
||||
sortOrder: Number(raw.sortOrder) || 0,
|
||||
updatedAt: raw.updatedAt ? String(raw.updatedAt) : '',
|
||||
@@ -76,6 +79,7 @@ function formatWorksheet(raw: Record<string, unknown>): WorksheetItem {
|
||||
statusText: cfg.text,
|
||||
actionText: cfg.action,
|
||||
actionTarget: cfg.target,
|
||||
actionType: cfg.actionType,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@@ -59,21 +59,26 @@
|
||||
</view>
|
||||
<view class="ws-card__info">
|
||||
<text class="ws-card__title">{{item.title}}</text>
|
||||
<text class="ws-card__id">{{item._id}}</text>
|
||||
<text class="ws-card__subtitle">{{item.subtitle}}</text>
|
||||
<view class="ws-card__meta">
|
||||
<text class="ws-card__tag">{{item.ageBand}}</text>
|
||||
<text class="ws-card__tag">{{item.difficultyLabel}}</text>
|
||||
<text class="ws-card__tag"
|
||||
>{{item.difficultyLabel}}</text
|
||||
>
|
||||
</view>
|
||||
<text class="ws-card__id">{{item._id}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:if="{{item.tagsText}}" class="ws-card__tags">
|
||||
<text class="ws-card__tags-text">{{item.tagsText}}</text>
|
||||
</view>
|
||||
<view class="ws-card__footer">
|
||||
<text class="ws-card__badge ws-card__badge--{{item.status}}">
|
||||
{{item.statusText}}
|
||||
</text>
|
||||
<view class="ws-card__badge ws-card__badge--{{item.status}}">
|
||||
<text>{{item.statusText}}</text>
|
||||
</view>
|
||||
<text class="ws-card__sort">排序 {{item.sortOrder}}</text>
|
||||
<toy-button
|
||||
type="primary"
|
||||
type="{{item.actionType}}"
|
||||
size="small"
|
||||
data-id="{{item._id}}"
|
||||
data-target="{{item.actionTarget}}"
|
||||
@@ -89,10 +94,11 @@
|
||||
<view class="ccm-page__build">
|
||||
<toy-button
|
||||
type="primary"
|
||||
width="100%"
|
||||
loading="{{building}}"
|
||||
disabled="{{building}}"
|
||||
bindtap="onBuildTap">
|
||||
{{building ? '生成中...' : '更新分类页数据'}}
|
||||
</toy-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -21,6 +21,13 @@ const DEBUG_ENTRIES: DebugEntry[] = [
|
||||
icon: '📋',
|
||||
path: '/supportPages/categoryContentManage/categoryContentManage',
|
||||
},
|
||||
{
|
||||
id: 'home-content',
|
||||
title: '首页内容管理',
|
||||
subtitle: '编排首页推荐位、热门推荐和分类分区内容。',
|
||||
icon: '🏠',
|
||||
path: '/supportPages/homeContentManage/homeContentManage',
|
||||
},
|
||||
];
|
||||
|
||||
Page({
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"navigationBarTitleText": "首页内容管理",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarBackgroundColor": "#F8F0E0",
|
||||
"backgroundColor": "#F8F0E0",
|
||||
"enablePullDownRefresh": true,
|
||||
"usingComponents": {
|
||||
"toy-button": "/toy/button-v2/button"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,277 @@
|
||||
@import '../../style/theme.less';
|
||||
|
||||
page {
|
||||
min-height: 100%;
|
||||
background: @bg-header;
|
||||
}
|
||||
|
||||
.hcm-page {
|
||||
min-height: 100vh;
|
||||
padding: 24rpx;
|
||||
padding-bottom: 160rpx;
|
||||
background: @bg-header;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// ── Loading ──
|
||||
.hcm-page__loading {
|
||||
padding: 24rpx 28rpx;
|
||||
background: @bg-white;
|
||||
border-radius: @radius;
|
||||
font-size: 24rpx;
|
||||
color: @text-secondary;
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
// ── Section ──
|
||||
.hcm-timer-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24rpx;
|
||||
padding: 28rpx;
|
||||
background: @bg-white;
|
||||
border-radius: @radius-xl;
|
||||
box-shadow: @shadow;
|
||||
}
|
||||
|
||||
.hcm-timer-card__info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.hcm-timer-card__title {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
font-weight: 700;
|
||||
color: @text-title;
|
||||
}
|
||||
|
||||
.hcm-timer-card__desc {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size: 22rpx;
|
||||
color: @text-secondary;
|
||||
}
|
||||
|
||||
.hcm-timer-card__right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
flex-shrink: 0;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.hcm-timer-card__badge {
|
||||
padding: 6rpx 16rpx;
|
||||
border-radius: 999rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.hcm-timer-card__badge--on {
|
||||
background: fade(#93d333, 18%);
|
||||
color: #4a7a12;
|
||||
}
|
||||
|
||||
.hcm-timer-card__badge--off {
|
||||
background: fade(#8a8478, 15%);
|
||||
color: #605b50;
|
||||
}
|
||||
|
||||
.hcm-section {
|
||||
margin-bottom: 24rpx;
|
||||
padding: 28rpx;
|
||||
background: @bg-white;
|
||||
border-radius: @radius-xl;
|
||||
box-shadow: @shadow;
|
||||
|
||||
&.last {
|
||||
margin-bottom: 60rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.hcm-section__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.hcm-section__title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: @text-title;
|
||||
}
|
||||
|
||||
.hcm-section__count {
|
||||
font-size: 22rpx;
|
||||
color: @text-gray;
|
||||
}
|
||||
|
||||
.hcm-section__hint {
|
||||
margin-left: 12rpx;
|
||||
font-size: 22rpx;
|
||||
color: @text-gray;
|
||||
}
|
||||
|
||||
.hcm-section__empty {
|
||||
padding: 20rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: @text-gray;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
// ── Item List ──
|
||||
.hcm-item-list {
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.hcm-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 16rpx 0;
|
||||
border-bottom: @border;
|
||||
}
|
||||
|
||||
.hcm-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.hcm-item__img {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: @radius-sm;
|
||||
flex-shrink: 0;
|
||||
background: @bg-gray;
|
||||
}
|
||||
|
||||
.hcm-item__info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
margin-left: 16rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6rpx;
|
||||
}
|
||||
|
||||
.hcm-item__title {
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: @text-title;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hcm-item__id {
|
||||
font-size: 20rpx;
|
||||
color: @text-gray;
|
||||
}
|
||||
|
||||
// ── Build Button ──
|
||||
.hcm-page__build {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 24rpx 40rpx;
|
||||
padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
|
||||
background: @bg-header;
|
||||
box-shadow: 0 -4rpx 16rpx rgba(50, 46, 37, 0.06);
|
||||
}
|
||||
|
||||
// ── Selector Popup ──
|
||||
.hcm-selector-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.hcm-selector {
|
||||
width: 100%;
|
||||
max-height: 70vh;
|
||||
background: @bg-white;
|
||||
border-radius: @radius-xl @radius-xl 0 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.hcm-selector__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 28rpx 32rpx;
|
||||
border-bottom: @border;
|
||||
}
|
||||
|
||||
.hcm-selector__title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: @text-title;
|
||||
}
|
||||
|
||||
.hcm-selector__close {
|
||||
font-size: 26rpx;
|
||||
color: @text-secondary;
|
||||
padding: 8rpx 16rpx;
|
||||
}
|
||||
|
||||
.hcm-selector__list {
|
||||
flex: 1;
|
||||
max-height: 60vh;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.hcm-selector__empty {
|
||||
padding: 40rpx 0;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: @text-gray;
|
||||
}
|
||||
|
||||
.hcm-selector-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: @border;
|
||||
}
|
||||
|
||||
.hcm-selector-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.hcm-selector-item__img {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: @radius-sm;
|
||||
flex-shrink: 0;
|
||||
background: @bg-gray;
|
||||
}
|
||||
|
||||
.hcm-selector-item__info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
margin-left: 16rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6rpx;
|
||||
}
|
||||
|
||||
.hcm-selector-item__title {
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: @text-title;
|
||||
}
|
||||
|
||||
.hcm-selector-item__sub {
|
||||
font-size: 22rpx;
|
||||
color: @text-secondary;
|
||||
}
|
||||
@@ -0,0 +1,371 @@
|
||||
import { CATEGORY_LIST } from '../../core/data/categories';
|
||||
|
||||
type SimpleWorksheet = {
|
||||
_id: string;
|
||||
title: string;
|
||||
subtitle: string;
|
||||
category: string;
|
||||
previewImg: string;
|
||||
ageMin: number;
|
||||
ageMax: number;
|
||||
difficulty: number;
|
||||
isNew: boolean;
|
||||
isHot: boolean;
|
||||
path: string;
|
||||
ageBand: string;
|
||||
downloads: number;
|
||||
likes: number;
|
||||
};
|
||||
|
||||
type SectionConfig = {
|
||||
id: string;
|
||||
name: string;
|
||||
icon: string;
|
||||
subtitle?: string;
|
||||
morePath?: string;
|
||||
items: SimpleWorksheet[];
|
||||
};
|
||||
|
||||
type HomeConfigItem = {
|
||||
id: string;
|
||||
title?: string;
|
||||
subtitle?: string;
|
||||
morePath?: string;
|
||||
items: Array<{ id: string; path?: string; [key: string]: unknown }>;
|
||||
};
|
||||
|
||||
type PageConfig = {
|
||||
home?: {
|
||||
featured?: Array<{ id: string; [key: string]: unknown }>;
|
||||
hot?: Array<{ id: string; [key: string]: unknown }>;
|
||||
sections?: HomeConfigItem[];
|
||||
};
|
||||
[key: string]: unknown;
|
||||
};
|
||||
|
||||
type CloudFunctionResult<T> = {
|
||||
success?: boolean;
|
||||
message?: string;
|
||||
data?: T;
|
||||
};
|
||||
|
||||
function formatSimple(raw: Record<string, unknown>): SimpleWorksheet {
|
||||
const ageMin = Number(raw.ageMin) || 0;
|
||||
const ageMax = Number(raw.ageMax) || 0;
|
||||
return {
|
||||
_id: String(raw._id || ''),
|
||||
title: String(raw.title || ''),
|
||||
subtitle: String(raw.subtitle || ''),
|
||||
category: String(raw.category || ''),
|
||||
previewImg: String(raw.previewImg || ''),
|
||||
ageMin,
|
||||
ageMax,
|
||||
difficulty: Number(raw.difficulty) || 2,
|
||||
isNew: !!raw.isNew,
|
||||
isHot: !!raw.isHot,
|
||||
path: String(raw.path || ''),
|
||||
ageBand: `${ageMin}-${ageMax}岁`,
|
||||
downloads: Number(raw.downloads) || 0,
|
||||
likes: Number(raw.likes) || 0,
|
||||
};
|
||||
}
|
||||
|
||||
async function callCloudFunction<T>(
|
||||
name: string,
|
||||
data?: Record<string, unknown>,
|
||||
): Promise<CloudFunctionResult<T>> {
|
||||
const response = (await wx.cloud.callFunction({
|
||||
name,
|
||||
data: data || {},
|
||||
})) as { result?: CloudFunctionResult<T> };
|
||||
return response.result || {};
|
||||
}
|
||||
|
||||
Page({
|
||||
data: {
|
||||
featured: [] as SimpleWorksheet[],
|
||||
hot: [] as SimpleWorksheet[],
|
||||
sections: [] as SectionConfig[],
|
||||
// worksheet pool (all active)
|
||||
allActive: [] as SimpleWorksheet[],
|
||||
// selector popup
|
||||
selectorVisible: false,
|
||||
selectorTarget: '', // 'featured' | 'hot' | category id
|
||||
selectorTargetLabel: '',
|
||||
selectorItems: [] as SimpleWorksheet[],
|
||||
// timer
|
||||
timerEnabled: true,
|
||||
timerLoading: false,
|
||||
// states
|
||||
loading: false,
|
||||
building: false,
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
this.setData({
|
||||
sections: CATEGORY_LIST.map((c) => ({
|
||||
id: c.id,
|
||||
name: c.name,
|
||||
icon: c.icon,
|
||||
items: [],
|
||||
})),
|
||||
});
|
||||
void this.loadData();
|
||||
void this.loadTimerStatus();
|
||||
},
|
||||
|
||||
async onPullDownRefresh() {
|
||||
await this.loadData();
|
||||
await this.loadTimerStatus();
|
||||
wx.stopPullDownRefresh();
|
||||
},
|
||||
|
||||
async loadTimerStatus() {
|
||||
try {
|
||||
const db = wx.cloud.database();
|
||||
const { data } = await db
|
||||
.collection('settings')
|
||||
.doc('homeAutoRefresh')
|
||||
.get();
|
||||
this.setData({ timerEnabled: (data as { enabled?: boolean }).enabled !== false });
|
||||
} catch {
|
||||
// Document doesn't exist — default enabled
|
||||
this.setData({ timerEnabled: true });
|
||||
}
|
||||
},
|
||||
|
||||
async loadData() {
|
||||
this.setData({ loading: true });
|
||||
try {
|
||||
// Fetch in parallel: active worksheets + saved page config
|
||||
const [wsResult, configResult] = await Promise.all([
|
||||
callCloudFunction<SimpleWorksheet[]>('worksheetsQuery', {
|
||||
status: 'active',
|
||||
}),
|
||||
callCloudFunction<PageConfig>('pageConfigFetch'),
|
||||
]);
|
||||
|
||||
if (!wsResult.success) throw new Error(wsResult.message || '查询失败');
|
||||
|
||||
const allActive = (wsResult.data || []).map((raw) =>
|
||||
formatSimple(raw as unknown as Record<string, unknown>),
|
||||
);
|
||||
|
||||
// Build a lookup map for quick access
|
||||
const wsMap = new Map(allActive.map((w) => [w._id, w]));
|
||||
|
||||
// featured: always top-5 by downloads; hot: always top-5 by likes
|
||||
const featured: SimpleWorksheet[] = [...allActive]
|
||||
.sort((a, b) => (b.downloads ?? 0) - (a.downloads ?? 0))
|
||||
.slice(0, 5);
|
||||
const hot: SimpleWorksheet[] = [...allActive]
|
||||
.sort((a, b) => (b.likes ?? 0) - (a.likes ?? 0))
|
||||
.slice(0, 5);
|
||||
|
||||
// Restore saved sections from config
|
||||
const savedHome = (configResult.data as PageConfig | undefined)?.home;
|
||||
const savedSections: HomeConfigItem[] = savedHome?.sections || [];
|
||||
const savedSectionMap = new Map(savedSections.map((s) => [s.id, s]));
|
||||
|
||||
const sections: SectionConfig[] = CATEGORY_LIST.map((c) => {
|
||||
const saved = savedSectionMap.get(c.id);
|
||||
const items = saved
|
||||
? (saved.items || [])
|
||||
.map((item) => wsMap.get(item.id))
|
||||
.filter((w): w is SimpleWorksheet => !!w)
|
||||
: [];
|
||||
return {
|
||||
id: c.id,
|
||||
name: c.name,
|
||||
icon: c.icon,
|
||||
subtitle: saved?.subtitle || '',
|
||||
morePath: c.path,
|
||||
items,
|
||||
};
|
||||
});
|
||||
|
||||
this.setData({ loading: false, allActive, featured, hot, sections });
|
||||
} catch (error) {
|
||||
this.setData({ loading: false });
|
||||
wx.showToast({
|
||||
title: error instanceof Error ? error.message : '加载失败',
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// ── Timer Control ──
|
||||
|
||||
async onToggleTimer() {
|
||||
if (this.data.timerLoading) return;
|
||||
const newEnabled = !this.data.timerEnabled;
|
||||
|
||||
this.setData({ timerLoading: true });
|
||||
try {
|
||||
const result = await callCloudFunction('homeTimerControl', {
|
||||
enabled: newEnabled,
|
||||
});
|
||||
if (!result.success) {
|
||||
throw new Error(result.message || '操作失败');
|
||||
}
|
||||
this.setData({ timerEnabled: newEnabled });
|
||||
wx.showToast({
|
||||
title: newEnabled ? '定时任务已启动' : '定时任务已暂停',
|
||||
icon: 'success',
|
||||
});
|
||||
} catch (error) {
|
||||
wx.showToast({
|
||||
title: error instanceof Error ? error.message : '操作失败',
|
||||
icon: 'none',
|
||||
});
|
||||
} finally {
|
||||
this.setData({ timerLoading: false });
|
||||
}
|
||||
},
|
||||
|
||||
// ── Selector ──
|
||||
|
||||
onTapAdd(e: WechatMiniprogram.TouchEvent) {
|
||||
const target = e.currentTarget.dataset.target as string;
|
||||
if (!target) return;
|
||||
|
||||
let label = '';
|
||||
let selectedIds: Set<string>;
|
||||
|
||||
if (target === 'featured') {
|
||||
label = '今日推荐';
|
||||
selectedIds = new Set(this.data.featured.map((w) => w._id));
|
||||
} else if (target === 'hot') {
|
||||
label = '热门推荐';
|
||||
selectedIds = new Set(this.data.hot.map((w) => w._id));
|
||||
} else {
|
||||
const section = this.data.sections.find((s) => s.id === target);
|
||||
label = section?.name || target;
|
||||
selectedIds = new Set((section?.items || []).map((w) => w._id));
|
||||
}
|
||||
|
||||
// Filter: show active worksheets not already selected
|
||||
let pool = this.data.allActive.filter((w) => !selectedIds.has(w._id));
|
||||
// For sections, prefer same category
|
||||
if (target !== 'featured' && target !== 'hot') {
|
||||
pool = pool.filter((w) => w.category === target);
|
||||
}
|
||||
|
||||
this.setData({
|
||||
selectorVisible: true,
|
||||
selectorTarget: target,
|
||||
selectorTargetLabel: label,
|
||||
selectorItems: pool,
|
||||
});
|
||||
},
|
||||
|
||||
onCloseSelector() {
|
||||
this.setData({ selectorVisible: false });
|
||||
},
|
||||
|
||||
onSelectItem(e: WechatMiniprogram.TouchEvent) {
|
||||
const id = e.currentTarget.dataset.id as string;
|
||||
if (!id) return;
|
||||
|
||||
const ws = this.data.allActive.find((w) => w._id === id);
|
||||
if (!ws) return;
|
||||
|
||||
const target = this.data.selectorTarget;
|
||||
|
||||
if (target === 'featured') {
|
||||
this.setData({ featured: [...this.data.featured, ws] });
|
||||
} else if (target === 'hot') {
|
||||
this.setData({ hot: [...this.data.hot, ws] });
|
||||
} else {
|
||||
const sections = [...this.data.sections];
|
||||
const idx = sections.findIndex((s) => s.id === target);
|
||||
if (idx >= 0) {
|
||||
sections[idx] = {
|
||||
...sections[idx],
|
||||
items: [...sections[idx].items, ws],
|
||||
};
|
||||
this.setData({ sections });
|
||||
}
|
||||
}
|
||||
|
||||
this.setData({ selectorVisible: false });
|
||||
},
|
||||
|
||||
onRemoveItem(e: WechatMiniprogram.TouchEvent) {
|
||||
const target = e.currentTarget.dataset.target as string;
|
||||
const id = e.currentTarget.dataset.id as string;
|
||||
if (!target || !id) return;
|
||||
|
||||
if (target === 'featured') {
|
||||
this.setData({
|
||||
featured: this.data.featured.filter((w) => w._id !== id),
|
||||
});
|
||||
} else if (target === 'hot') {
|
||||
this.setData({
|
||||
hot: this.data.hot.filter((w) => w._id !== id),
|
||||
});
|
||||
} else {
|
||||
const sections = [...this.data.sections];
|
||||
const idx = sections.findIndex((s) => s.id === target);
|
||||
if (idx >= 0) {
|
||||
sections[idx] = {
|
||||
...sections[idx],
|
||||
items: sections[idx].items.filter((w) => w._id !== id),
|
||||
};
|
||||
this.setData({ sections });
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// ── Build ──
|
||||
|
||||
async onBuildTap() {
|
||||
if (this.data.building) return;
|
||||
|
||||
const confirmed = await new Promise<boolean>((resolve) => {
|
||||
wx.showModal({
|
||||
title: '更新首页数据',
|
||||
content: '将根据当前配置重新生成首页数据，确认继续？',
|
||||
success: (res) => resolve(!!res.confirm),
|
||||
fail: () => resolve(false),
|
||||
});
|
||||
});
|
||||
if (!confirmed) return;
|
||||
|
||||
this.setData({ building: true });
|
||||
|
||||
try {
|
||||
const result = await callCloudFunction<{
|
||||
version: number;
|
||||
}>('pageContentBuild', {
|
||||
page: 'home',
|
||||
featuredIds: this.data.featured.map((w) => w._id),
|
||||
hotIds: this.data.hot.map((w) => w._id),
|
||||
sections: this.data.sections
|
||||
.filter((s) => s.items.length > 0)
|
||||
.map((s) => ({
|
||||
id: s.id,
|
||||
subtitle: s.subtitle || '',
|
||||
morePath: s.morePath || '',
|
||||
worksheetIds: s.items.map((w) => w._id),
|
||||
})),
|
||||
});
|
||||
|
||||
if (!result.success) {
|
||||
throw new Error(result.message || '生成失败');
|
||||
}
|
||||
|
||||
wx.showToast({
|
||||
title: `生成成功 v${result.data?.version || 0}`,
|
||||
icon: 'success',
|
||||
});
|
||||
} catch (error) {
|
||||
wx.showToast({
|
||||
title: error instanceof Error ? error.message : '生成失败',
|
||||
icon: 'none',
|
||||
});
|
||||
} finally {
|
||||
this.setData({ building: false });
|
||||
}
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,217 @@
|
||||
<view class="hcm-page">
|
||||
<!-- Loading -->
|
||||
<view wx:if="{{loading}}" class="hcm-page__loading">
|
||||
正在加载 active worksheet 数据...
|
||||
</view>
|
||||
|
||||
<block wx:else>
|
||||
<!-- Timer Status -->
|
||||
<view class="hcm-timer-card">
|
||||
<view class="hcm-timer-card__info">
|
||||
<text class="hcm-timer-card__title">定时自动刷新</text>
|
||||
<text class="hcm-timer-card__desc"
|
||||
>每日 22:00 自动更新推荐位数据</text
|
||||
>
|
||||
</view>
|
||||
<view class="hcm-timer-card__right">
|
||||
<view
|
||||
class="hcm-timer-card__badge {{timerEnabled ? 'hcm-timer-card__badge--on' : 'hcm-timer-card__badge--off'}}">
|
||||
<text>{{timerEnabled ? '运行中' : '已暂停'}}</text>
|
||||
</view>
|
||||
<toy-button
|
||||
type="{{timerEnabled ? 'default' : 'green'}}"
|
||||
size="mini"
|
||||
disabled="{{timerLoading}}"
|
||||
bindtap="onToggleTimer">
|
||||
{{timerEnabled ? '暂停' : '启动'}}
|
||||
</toy-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Featured Section -->
|
||||
<view class="hcm-section">
|
||||
<view class="hcm-section__header">
|
||||
<view>
|
||||
<text class="hcm-section__title">今日推荐</text>
|
||||
<text class="hcm-section__hint">按下载量排序</text>
|
||||
</view>
|
||||
<text class="hcm-section__count">{{featured.length}} 个</text>
|
||||
</view>
|
||||
<view wx:if="{{featured.length}}" class="hcm-item-list">
|
||||
<view wx:for="{{featured}}" wx:key="_id" class="hcm-item">
|
||||
<image
|
||||
wx:if="{{item.previewImg}}"
|
||||
class="hcm-item__img"
|
||||
src="{{item.previewImg}}"
|
||||
mode="aspectFill" />
|
||||
<view class="hcm-item__info">
|
||||
<text class="hcm-item__title">{{item.title}}</text>
|
||||
<text class="hcm-item__id">{{item._id}}</text>
|
||||
</view>
|
||||
<toy-button
|
||||
type="default"
|
||||
size="mini"
|
||||
data-target="featured"
|
||||
data-id="{{item._id}}"
|
||||
bindtap="onRemoveItem">
|
||||
移除
|
||||
</toy-button>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:else class="hcm-section__empty">暂未选择内容</view>
|
||||
<toy-button
|
||||
type="primary"
|
||||
size="small"
|
||||
data-target="featured"
|
||||
bindtap="onTapAdd">
|
||||
添加
|
||||
</toy-button>
|
||||
</view>
|
||||
|
||||
<!-- WXML_APPEND_1 -->
|
||||
|
||||
<!-- Hot Section -->
|
||||
<view class="hcm-section">
|
||||
<view class="hcm-section__header">
|
||||
<view>
|
||||
<text class="hcm-section__title">热门推荐</text>
|
||||
<text class="hcm-section__hint">按点赞量排序</text>
|
||||
</view>
|
||||
<text class="hcm-section__count">{{hot.length}} 个</text>
|
||||
</view>
|
||||
<view wx:if="{{hot.length}}" class="hcm-item-list">
|
||||
<view wx:for="{{hot}}" wx:key="_id" class="hcm-item">
|
||||
<image
|
||||
wx:if="{{item.previewImg}}"
|
||||
class="hcm-item__img"
|
||||
src="{{item.previewImg}}"
|
||||
mode="aspectFill" />
|
||||
<view class="hcm-item__info">
|
||||
<text class="hcm-item__title">{{item.title}}</text>
|
||||
<text class="hcm-item__id">{{item._id}}</text>
|
||||
</view>
|
||||
<toy-button
|
||||
type="default"
|
||||
size="mini"
|
||||
data-target="hot"
|
||||
data-id="{{item._id}}"
|
||||
bindtap="onRemoveItem">
|
||||
移除
|
||||
</toy-button>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:else class="hcm-section__empty">暂未选择内容</view>
|
||||
<toy-button
|
||||
type="primary"
|
||||
size="small"
|
||||
data-target="hot"
|
||||
bindtap="onTapAdd">
|
||||
添加
|
||||
</toy-button>
|
||||
</view>
|
||||
|
||||
<!-- Category Sections -->
|
||||
<view
|
||||
wx:for="{{sections}}"
|
||||
wx:key="id"
|
||||
class="hcm-section {{index === sections.length - 1 ? 'last' : ''}}">
|
||||
<view class="hcm-section__header">
|
||||
<text class="hcm-section__title"
|
||||
>{{item.icon}} {{item.name}}</text
|
||||
>
|
||||
<text class="hcm-section__count">{{item.items.length}} 个</text>
|
||||
</view>
|
||||
<view wx:if="{{item.items.length}}" class="hcm-item-list">
|
||||
<view
|
||||
wx:for="{{item.items}}"
|
||||
wx:for-item="ws"
|
||||
wx:key="_id"
|
||||
class="hcm-item">
|
||||
<image
|
||||
wx:if="{{ws.previewImg}}"
|
||||
class="hcm-item__img"
|
||||
src="{{ws.previewImg}}"
|
||||
mode="aspectFill" />
|
||||
<view class="hcm-item__info">
|
||||
<text class="hcm-item__title">{{ws.title}}</text>
|
||||
<text class="hcm-item__id">{{ws._id}}</text>
|
||||
</view>
|
||||
<toy-button
|
||||
type="default"
|
||||
size="mini"
|
||||
data-target="{{item.id}}"
|
||||
data-id="{{ws._id}}"
|
||||
bindtap="onRemoveItem">
|
||||
移除
|
||||
</toy-button>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:else class="hcm-section__empty">暂未选择内容</view>
|
||||
<toy-button
|
||||
type="primary"
|
||||
size="small"
|
||||
data-target="{{item.id}}"
|
||||
bindtap="onTapAdd">
|
||||
添加
|
||||
</toy-button>
|
||||
</view>
|
||||
|
||||
<!-- WXML_APPEND_2 -->
|
||||
|
||||
<!-- Build Button -->
|
||||
<view class="hcm-page__build">
|
||||
<toy-button
|
||||
type="primary"
|
||||
width="100%"
|
||||
loading="{{building}}"
|
||||
disabled="{{building}}"
|
||||
bindtap="onBuildTap">
|
||||
{{building ? '生成中...' : '更新首页数据'}}
|
||||
</toy-button>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- Selector Popup -->
|
||||
<view
|
||||
wx:if="{{selectorVisible}}"
|
||||
class="hcm-selector-mask"
|
||||
bindtap="onCloseSelector">
|
||||
<view class="hcm-selector" catchtap="">
|
||||
<view class="hcm-selector__header">
|
||||
<text class="hcm-selector__title"
|
||||
>选择内容 - {{selectorTargetLabel}}</text
|
||||
>
|
||||
<text class="hcm-selector__close" bindtap="onCloseSelector"
|
||||
>关闭</text
|
||||
>
|
||||
</view>
|
||||
<scroll-view class="hcm-selector__list" scroll-y>
|
||||
<view
|
||||
wx:if="{{!selectorItems.length}}"
|
||||
class="hcm-selector__empty">
|
||||
暂无可选内容
|
||||
</view>
|
||||
<view
|
||||
wx:for="{{selectorItems}}"
|
||||
wx:key="_id"
|
||||
class="hcm-selector-item"
|
||||
data-id="{{item._id}}"
|
||||
bindtap="onSelectItem">
|
||||
<image
|
||||
wx:if="{{item.previewImg}}"
|
||||
class="hcm-selector-item__img"
|
||||
src="{{item.previewImg}}"
|
||||
mode="aspectFill" />
|
||||
<view class="hcm-selector-item__info">
|
||||
<text class="hcm-selector-item__title"
|
||||
>{{item.title}}</text
|
||||
>
|
||||
<text class="hcm-selector-item__sub"
|
||||
>{{item.ageBand}} · {{item._id}}</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
Reference in New Issue
Block a user