feat(miniprogram): 初始化 Taro 4 + React 小程序项目
- 手动创建 Taro 4.2 + React 18 + TypeScript 项目骨架 - 配置 webpack5 编译、SCSS 样式、医疗清新主题 - 实现 API 请求层(JWT 自动注入 + token 刷新) - 实现 auth store(微信登录 + 手机号绑定 + 就诊人管理) - 实现登录页(微信一键登录 + 手机号授权绑定) - 实现首页(问候栏 + 今日健康卡片 + 快捷服务 + 即将到来) - 实现我的页面(个人信息 + 功能菜单 + 退出登录) - 健康/预约/资讯占位页 - TabBar 5 个入口:首页/健康/预约/资讯/我的
This commit is contained in:
41
apps/miniprogram/src/pages/profile/index.tsx
Normal file
41
apps/miniprogram/src/pages/profile/index.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import '../health/index.scss';
|
||||
|
||||
export default function Profile() {
|
||||
const { user, logout } = useAuthStore();
|
||||
|
||||
return (
|
||||
<View className='profile-page'>
|
||||
<View className='profile-header'>
|
||||
<View className='profile-avatar'>
|
||||
<Text className='profile-avatar-text'>
|
||||
{user?.display_name?.[0] || '?'}
|
||||
</Text>
|
||||
</View>
|
||||
<Text className='profile-name'>{user?.display_name || '未登录'}</Text>
|
||||
<Text className='profile-phone'>{user?.phone || ''}</Text>
|
||||
</View>
|
||||
|
||||
<View className='profile-menu'>
|
||||
{[
|
||||
{ label: '就诊人管理', icon: '👥' },
|
||||
{ label: '我的报告', icon: '📋' },
|
||||
{ label: '我的随访', icon: '💬' },
|
||||
{ label: '用药提醒', icon: '💊' },
|
||||
{ label: '设置', icon: '⚙️' },
|
||||
].map((item) => (
|
||||
<View className='menu-item' key={item.label}>
|
||||
<Text className='menu-icon'>{item.icon}</Text>
|
||||
<Text className='menu-label'>{item.label}</Text>
|
||||
<Text className='menu-arrow'>›</Text>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
|
||||
<View className='profile-logout' onClick={logout}>
|
||||
<Text className='logout-text'>退出登录</Text>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user