feat(miniprogram): 访客模式 + 长辈模式 + MCP 自动化脚本
访客模式: - 未登录用户可见首页(轮播图+健康资讯+登录引导)和"我的"页面 - 健康和消息 tab 显示 GuestGuard 登录拦截 - 登录页增加"暂不登录,先看看"跳过入口 - 401 拦截器增加 hasToken 检查,避免访客被重定向到登录页 - 退出登录后 reLaunch 到首页而非登录页 长辈模式: - 新增 stores/ui.ts 管理显示模式(标准/长辈) - 长辈模式放大字体 ×1.3、间距 ×1.2、按钮加大 - "我的 → 账号 → 长辈模式"切换页 - 设置持久化到 Storage 修复: - Health/Messages 页面 Hooks 顺序违规(条件 return 在 hooks 之间) 导致访客模式下页面白屏,所有 hooks 移到条件判断之前 工程: - scripts/mpsync.sh/ps1 自动清理残留 DevTools 进程 - project.config.json 默认关闭域名校验
This commit is contained in:
58
apps/miniprogram/src/pages/pkg-profile/elder-mode/index.tsx
Normal file
58
apps/miniprogram/src/pages/pkg-profile/elder-mode/index.tsx
Normal file
@@ -0,0 +1,58 @@
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import { useUIStore } from '../../../stores/ui';
|
||||
import './index.scss';
|
||||
|
||||
export default function ElderMode() {
|
||||
const mode = useUIStore((s) => s.mode);
|
||||
const setMode = useUIStore((s) => s.setMode);
|
||||
const isElder = mode === 'elder';
|
||||
|
||||
const handleToggle = () => {
|
||||
const next = isElder ? 'normal' : 'elder';
|
||||
setMode(next);
|
||||
Taro.showToast({
|
||||
title: next === 'elder' ? '已开启长辈模式' : '已关闭长辈模式',
|
||||
icon: 'none',
|
||||
duration: 1500,
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='elder-mode-page'>
|
||||
<View className='elder-mode-card'>
|
||||
<View className='elder-mode-header'>
|
||||
<Text className='elder-mode-icon'>老</Text>
|
||||
<View className='elder-mode-info'>
|
||||
<Text className='elder-mode-title'>长辈模式</Text>
|
||||
<Text className='elder-mode-desc'>放大字体和按钮,更易阅读和操作</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View className='elder-mode-status'>
|
||||
<Text className='elder-mode-status-text'>
|
||||
当前状态:{isElder ? '已开启' : '已关闭'}
|
||||
</Text>
|
||||
<View
|
||||
className={`elder-mode-switch ${isElder ? 'elder-mode-switch--on' : ''}`}
|
||||
onClick={handleToggle}
|
||||
>
|
||||
<View className='elder-mode-switch-thumb' />
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View className='elder-mode-preview'>
|
||||
<Text className='elder-mode-preview-title'>效果预览</Text>
|
||||
<View className='elder-mode-preview-card'>
|
||||
<Text className={`elder-mode-preview-sample ${isElder ? 'elder-mode-preview-sample--large' : ''}`}>
|
||||
{isElder ? '长辈模式字体示例' : '标准模式字体示例'}
|
||||
</Text>
|
||||
<Text className='elder-mode-preview-note'>
|
||||
{isElder ? '字号放大 1.3 倍,间距放大 1.2 倍' : '正常字号和间距'}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user