feat: 小程序UI重构为Apple设计系统并添加tabBar

- 全局样式重构为Apple Design System风格
- 添加底部tabBar导航(首页/发布/历史/私信/我的)
- 更紧凑的spacing和更小的字体尺寸
- pill圆角按钮和状态标签
- Action Blue (#0066cc) 单一accent色
- 添加tabBar图标资源

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
刘正航
2026-05-01 12:06:37 +08:00
parent f5b706d892
commit f7fdc635c7
17 changed files with 404 additions and 272 deletions

View File

@@ -1,11 +1,7 @@
const { request } = require('../../utils/request')
const USER_MODULES = [
{ name: '信息发布', desc: '发布公开 / 私有 / 私信文本并实时检测', tag: '发布检测', path: '/pages/detect/index' },
{ name: '批量识别', desc: '多条文本批量检测并给出风险汇总', tag: '批量筛查', path: '/pages/batch/index' },
{ name: '发布历史', desc: '查看发布状态、概率和申诉进度', tag: '历史追踪', path: '/pages/history/index' },
{ name: '私信收件箱', desc: '查看通过检测后成功送达的私信', tag: '私信查看', path: '/pages/inbox/index' },
{ name: '个人中心', desc: '维护个人资料与密码设置', tag: '账号设置', path: '/pages/profile/index' }
{ name: '批量识别', desc: '多条文本批量检测并给出风险汇总', tag: '批量筛查', path: '/pages/batch/index' }
]
const ADMIN_MODULES = [

View File

@@ -33,8 +33,8 @@
</view>
<view class="card fade-up fade-up-delay-2">
<view class="card-title">用户功能</view>
<view class="card-desc">常用操作入口,覆盖发布、检测、历史和账号设置。</view>
<view class="card-title">更多功能</view>
<view class="card-desc">批量检测与管理功能入口。</view>
<view class="grid-2">
<view class="module-card" wx:for="{{userModules}}" wx:key="name" data-path="{{item.path}}" bindtap="goto">
<view class="module-name">{{item.name}}</view>
@@ -55,6 +55,4 @@
</view>
</view>
</view>
<button class="btn btn-ghost fade-up fade-up-delay-3" bindtap="logout">退出登录</button>
</view>

View File

@@ -3,6 +3,7 @@ const { request } = require('../../utils/request')
Page({
data: {
loading: false,
user: null,
form: {
nickname: '',
company: '',
@@ -17,6 +18,9 @@ Page({
},
async loadProfile() {
const app = getApp()
const user = app.globalData.user || wx.getStorageSync('user')
this.setData({ user })
const profile = await request({ url: '/user/profile' })
this.setData({
form: {
@@ -29,6 +33,12 @@ Page({
})
},
goto(e) {
const path = e.currentTarget.dataset.path
if (!path) return
wx.navigateTo({ url: path })
},
onInput(e) {
const field = e.currentTarget.dataset.field
this.setData({ [`form.${field}`]: (e.detail.value || '').trim() })
@@ -57,5 +67,18 @@ Page({
} finally {
this.setData({ loading: false })
}
},
logout() {
wx.showModal({
title: '退出登录',
content: '确定要退出登录吗?',
success: (res) => {
if (res.confirm) {
getApp().clearAuth()
wx.reLaunch({ url: '/pages/login/index' })
}
}
})
}
})

View File

@@ -1,7 +1,7 @@
<view class="container">
<view class="hero fade-up">
<view class="hero-badge">PROFILE</view>
<view class="hero-title">个人资料设置</view>
<view class="hero-title">个人中心</view>
<view class="hero-sub">完善你的身份信息,便于审计追踪和团队协同。</view>
</view>
@@ -36,4 +36,35 @@
<button class="btn btn-primary" loading="{{loading}}" bindtap="save">保存资料</button>
</view>
</view>
<view class="card fade-up fade-up-delay-2" wx:if="{{user && user.is_admin}}">
<view class="card-title">管理员入口</view>
<view class="card-desc">管理后台功能快速访问。</view>
<view class="grid-2">
<view class="module-card" data-path="/pages/admin-dashboard/index" bindtap="goto">
<view class="module-name">运营看板</view>
<view class="module-desc">监控发布、拦截、样本和模型状态</view>
<view class="module-tag">数据概览</view>
</view>
<view class="module-card" data-path="/pages/admin-review/index" bindtap="goto">
<view class="module-name">复核与申诉</view>
<view class="module-desc">处理拦截复核和用户申诉</view>
<view class="module-tag">审核处理</view>
</view>
<view class="module-card" data-path="/pages/admin-samples/index" bindtap="goto">
<view class="module-name">样本管理</view>
<view class="module-desc">维护训练样本并触发模型重训</view>
<view class="module-tag">模型迭代</view>
</view>
<view class="module-card" data-path="/pages/admin-users/index" bindtap="goto">
<view class="module-name">用户管理</view>
<view class="module-desc">编辑用户信息和权限</view>
<view class="module-tag">权限管理</view>
</view>
</view>
</view>
<view class="card fade-up fade-up-delay-3">
<button class="btn btn-ghost" bindtap="logout">退出登录</button>
</view>
</view>