feat: refresh profile and settings pages

This commit is contained in:
2026-08-07 17:21:05 +08:00
parent 8fb07f96c9
commit 2b6c74fc97
7 changed files with 63 additions and 70 deletions
+11 -11
View File
@@ -40,7 +40,7 @@
.default-tag {
margin-left: 12px;
background: var(--accent-pink);
background: var(--accent-primary);
color: #fff;
font-size: 20px;
padding: 2px 10px;
@@ -58,16 +58,16 @@
justify-content: flex-end;
gap: 24px;
padding-top: 16px;
border-top: 1px dashed rgba(0,0,0,0.06);
border-top: 1rpx solid var(--border);
}
.address-act {
font-size: 26px;
color: var(--accent-blue);
color: var(--accent-secondary);
}
.address-act.delete {
color: #ff6b6b;
color: var(--danger);
}
/* 表单弹窗 */
@@ -81,7 +81,7 @@
width: 100%;
height: 80px;
background: var(--bg-input);
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
border-radius: 16px;
padding: 0 24px;
font-size: 28px;
@@ -94,7 +94,7 @@
width: 100%;
height: 80px;
background: var(--bg-input);
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
border-radius: 16px;
display: flex;
align-items: center;
@@ -128,13 +128,13 @@
.checkbox {
width: 44px;
height: 44px;
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
border-radius: 10px;
}
.checkbox.checked {
background: var(--accent-pink);
border-color: var(--accent-pink);
background: var(--accent-primary);
border-color: var(--accent-primary);
}
.form-actions {
@@ -142,8 +142,8 @@
gap: 20px;
}
.form-actions .btn-outline,
.form-actions .btn-gradient {
.form-actions .btn-secondary,
.form-actions .btn-primary {
flex: 1;
padding: 20px 0;
text-align: center;
+6 -8
View File
@@ -98,8 +98,7 @@ export default function AddressPage() {
<ThemedPageMeta />
<View className='address-page'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='star-badge' />
<View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='flex-between' style={{ width: '100%' }}>
<Text className='back-btn' onTap={() => Taro.navigateBack()}></Text>
<Text className='page-title'></Text>
@@ -110,7 +109,7 @@ export default function AddressPage() {
{/* 地址列表 */}
<View className='address-list'>
{list.map(item => (
<View key={item.id} className='address-card dashed-card'>
<View key={item.id} className='address-card surface-card'>
<View className='address-header'>
<View className='address-user'>
<Text className='address-name'>{item.name}</Text>
@@ -144,7 +143,7 @@ export default function AddressPage() {
{/* 底部添加按钮 */}
<View className='action-bar'>
<View className='btn-gradient' onTap={openAdd}>
<View className='btn-primary' onTap={openAdd}>
<Text></Text>
</View>
</View>
@@ -152,8 +151,7 @@ export default function AddressPage() {
{/* 新增/编辑弹窗 */}
{showForm && (
<View className='modal-overlay'>
<View className='modal-card dashed-card address-form'>
<View className='star-badge' />
<View className='modal-card surface-card address-form'>
<Text className='modal-title'>{editing ? '编辑地址' : '新增地址'}</Text>
<Input className='form-input' placeholder='收货人姓名'
@@ -178,10 +176,10 @@ export default function AddressPage() {
</View>
<View className='form-actions'>
<View className='btn-outline' onTap={() => { setShowForm(false); resetForm() }}>
<View className='btn-secondary' onTap={() => { setShowForm(false); resetForm() }}>
<Text></Text>
</View>
<View className='btn-gradient' onTap={handleSave}>
<View className='btn-primary' onTap={handleSave}>
<Text></Text>
</View>
</View>
+2 -3
View File
@@ -1,5 +1,5 @@
.agreement-page {
padding: 0 24px 24px;
padding: 0 32px 32px;
}
.agreement-title {
@@ -8,11 +8,10 @@
color: var(--text-primary);
display: block;
margin-bottom: 32px;
padding-top: 24px;
}
.agreement-content {
padding: 40px 32px;
padding: 40px 0;
line-height: 1.8;
}
+10 -10
View File
@@ -19,7 +19,7 @@
width: 120px;
height: 120px;
border-radius: 50%;
border: 4px dashed var(--line-star);
border: 1rpx solid var(--border);
margin-right: 24px;
flex-shrink: 0;
}
@@ -28,12 +28,12 @@
width: 120px;
height: 120px;
border-radius: 50%;
background: linear-gradient(135deg, var(--bg-card) 0%, rgba(91, 140, 255, 0.1) 100%);
background: var(--bg-muted);
display: flex;
align-items: center;
justify-content: center;
margin-right: 24px;
border: 4px dashed var(--line-star);
border: 1rpx solid var(--border);
flex-shrink: 0;
}
@@ -89,7 +89,7 @@
.status-num {
font-size: 36px;
font-weight: 800;
color: var(--accent-pink);
color: var(--accent-primary);
margin-bottom: 8px;
}
@@ -101,14 +101,14 @@
.status-divider {
width: 2px;
height: 48px;
background: var(--line-star);
background: var(--border);
opacity: 0.25;
flex-shrink: 0;
}
.status-divider-h {
height: 2px;
background: var(--line-star);
background: var(--border);
opacity: 0.15;
margin: 0 16px;
}
@@ -240,7 +240,7 @@
border-radius: 50%;
margin: 0 auto 24px;
background: var(--bg-input);
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
display: flex;
align-items: center;
justify-content: center;
@@ -265,7 +265,7 @@
width: 100%;
height: 80px;
background: var(--bg-input);
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
border-radius: 16px;
padding: 0 24px;
font-size: 28px;
@@ -280,8 +280,8 @@
gap: 20px;
}
.login-actions .btn-outline,
.login-actions .btn-gradient {
.login-actions .btn-secondary,
.login-actions .btn-primary {
flex: 1;
padding: 20px 0;
text-align: center;
+16 -20
View File
@@ -73,7 +73,7 @@ export default function ProfilePage() {
const sync = () => {
const info = getUserInfo()
if (info?.openid) {
if (info && info.openid) {
setIsLoggedIn(true)
setUserInfoState({ nickName: info.nickName || '', avatarUrl: info.avatarUrl || '' })
} else {
@@ -134,7 +134,7 @@ export default function ProfilePage() {
console.log('[Profile] wx.login 成功,code=', wxLogin.code)
const result = await login(wxLogin.code)
console.log('[Profile] 后端 /auth/login 返回:', JSON.stringify(result))
if (!result?.accessToken) {
if (!result || !result.accessToken) {
loginFail('登录失败,未拿到 token')
return
}
@@ -142,7 +142,7 @@ export default function ProfilePage() {
let openid = ''
try {
const me = await getMe()
openid = me?.openid || ''
openid = (me && me.openid) || ''
} catch {
openid = ''
}
@@ -168,7 +168,7 @@ export default function ProfilePage() {
loginFinish(result.accessToken, openid, result.nickname || '', result.avatar || '')
} catch (e) {
console.error('[Profile] 登录流程出错:', e)
loginFail((e as Error)?.message || '后端连接失败,请检查网络')
loginFail((e && (e as Error).message) || '后端连接失败,请检查网络')
}
}
@@ -186,7 +186,7 @@ export default function ProfilePage() {
let openid = ''
try {
const me = await getMe()
openid = me?.openid || ''
openid = (me && me.openid) || ''
} catch {
openid = ''
}
@@ -196,14 +196,14 @@ export default function ProfilePage() {
}
const stored = getUserInfo()
loginFinish(
stored?.accessToken || getToken(),
(stored && stored.accessToken) || getToken(),
openid,
loginNickName,
loginAvatarUrl
)
} catch (e) {
console.error('[Profile] 保存资料出错:', e)
loginFail((e as Error)?.message || '保存失败')
loginFail((e && (e as Error).message) || '保存失败')
}
}
@@ -282,8 +282,7 @@ export default function ProfilePage() {
<View className='profile-page'>
{/* 用户信息头部 */}
<View className='profile-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='star-badge' />
<View className='profile-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='user-info'>
{isLoggedIn && userInfo.avatarUrl ? (
<Image className='avatar' src={userInfo.avatarUrl} mode='aspectFill' />
@@ -337,8 +336,7 @@ export default function ProfilePage() {
<Text className='section-title'></Text>
<View className='menu-grid'>
{MENU_ITEMS.map((item, idx) => (
<View key={idx} className='menu-card dashed-card' onTap={() => handleMenuClick(item.path, item.label)}>
<View className='star-badge' />
<View key={idx} className='menu-card surface-card' onTap={() => handleMenuClick(item.path, item.label)}>
<Image className='menu-icon-img' src={ICON_MAP[item.label]} mode='aspectFit' />
<Text className='menu-label'>{item.label}</Text>
</View>
@@ -347,8 +345,7 @@ export default function ProfilePage() {
</View>
{/* 企业定制入口 */}
<View className='enterprise-section dashed-card mt-20'>
<View className='star-badge' />
<View className='enterprise-section surface-card mt-20'>
<View className='flex-between'>
<View className='flex-column'>
<View className='flex-center'>
@@ -357,7 +354,7 @@ export default function ProfilePage() {
</View>
<Text className='enterprise-desc'></Text>
</View>
<View className='btn-gradient enterprise-btn'>
<View className='btn-primary enterprise-btn'>
<Text></Text>
</View>
</View>
@@ -368,18 +365,17 @@ export default function ProfilePage() {
{/* 登录弹窗 */}
{showLogin && (
<View className='modal-overlay'>
<View className='login-card dashed-card'>
<View className='star-badge' />
<View className='login-card surface-card'>
<Text className='login-title'></Text>
{loginStep === 'entry' ? (
<>
<Text className='login-desc'></Text>
<View className='login-actions'>
<View className='btn-outline' onTap={handleCloseLogin}>
<View className='btn-secondary' onTap={handleCloseLogin}>
<Text></Text>
</View>
<View className='btn-gradient' onTap={handleLogin}>
<View className='btn-primary' onTap={handleLogin}>
<Text></Text>
</View>
</View>
@@ -406,10 +402,10 @@ export default function ProfilePage() {
onInput={(e: any) => setLoginNickName(e.detail.value)}
/>
<View className='login-actions'>
<View className='btn-outline' onTap={handleCloseLogin}>
<View className='btn-secondary' onTap={handleCloseLogin}>
<Text></Text>
</View>
<View className='btn-gradient' onTap={handleSaveProfile}>
<View className='btn-primary' onTap={handleSaveProfile}>
<Text></Text>
</View>
</View>
+9 -9
View File
@@ -13,7 +13,7 @@
width: 100px;
height: 100px;
border-radius: 50%;
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
}
.settings-avatar-placeholder {
@@ -21,7 +21,7 @@
height: 100px;
border-radius: 50%;
background: var(--bg-input);
border: 3px dashed var(--line-star);
border: 1rpx solid var(--border);
display: flex;
align-items: center;
justify-content: center;
@@ -58,7 +58,7 @@
}
.settings-item.bordered {
border-bottom: 1px dashed rgba(0,0,0,0.06);
border-bottom: 1rpx solid var(--border);
}
.settings-item-icon-img {
@@ -78,8 +78,8 @@
.logout-btn {
text-align: center;
padding: 24px 0;
color: #ff6b6b;
border: 3px dashed #ff6b6b;
color: var(--danger);
border: 1rpx solid var(--danger);
}
/* --- 主题选择 --- */
@@ -107,7 +107,7 @@
padding: 24px 16px;
border-radius: 20px;
background: var(--bg-input);
border: 3px dashed transparent;
border: 1rpx solid transparent;
display: flex;
align-items: center;
justify-content: center;
@@ -116,8 +116,8 @@
}
.theme-option.active {
border-color: var(--accent-pink);
background: rgba(255, 154, 158, 0.08);
border-color: var(--accent-primary);
background: var(--accent-primary-soft);
}
.theme-option-text {
@@ -130,7 +130,7 @@
width: 16px;
height: 16px;
border-radius: 50%;
background: var(--accent-pink);
background: var(--accent-primary);
}
.theme-hint {
+9 -9
View File
@@ -72,7 +72,7 @@ export default function SettingsPage() {
<View className='settings-page'>
<View className='settings-area'>
<View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
<View className='flex-between' style={{ width: '100%' }}>
<Text className='back-btn' onTap={() => Taro.navigateBack()}></Text>
<Text className='page-title'></Text>
@@ -81,7 +81,7 @@ export default function SettingsPage() {
</View>
{/* 用户卡片 */}
<View className='settings-user dashed-card mt-20'>
<View className='settings-user surface-card mt-20'>
<View className='flex-between' onTap={() => setShowEdit(true)}>
<View className='flex-center'>
{user.avatarUrl ? (
@@ -101,7 +101,7 @@ export default function SettingsPage() {
</View>
{/* 主题设置 */}
<View className='settings-section dashed-card mt-20'>
<View className='settings-section surface-card mt-20'>
<Text className='section-label'></Text>
<View className='theme-options'>
{THEME_OPTIONS.map(opt => (
@@ -121,7 +121,7 @@ export default function SettingsPage() {
</View>
{/* 菜单列表 */}
<View className='settings-list dashed-card mt-20'>
<View className='settings-list surface-card mt-20'>
{MENU.map((item, idx) => (
<View key={idx} className={`settings-item ${idx < MENU.length - 1 ? 'bordered' : ''}`} onTap={() => item.action({ setShowEdit })}>
<Image className='settings-item-icon-img' src={item.icon} mode='aspectFit' />
@@ -132,9 +132,9 @@ export default function SettingsPage() {
</View>
{/* 退出登录 */}
{user?.openid && (
{user && user.openid && (
<View className='mt-20'>
<View className='btn-outline logout-btn' onTap={handleLogout}>
<View className='btn-secondary logout-btn' onTap={handleLogout}>
<Text>退</Text>
</View>
</View>
@@ -145,7 +145,7 @@ export default function SettingsPage() {
{/* 编辑弹窗 */}
{showEdit && (
<View className='modal-overlay'>
<View className='modal-card dashed-card'>
<View className='modal-card surface-card'>
<Text className='modal-title'></Text>
<Button className='avatar-btn' openType='chooseAvatar' onChooseAvatar={onChooseAvatar}>
{editAvatar ? (
@@ -161,10 +161,10 @@ export default function SettingsPage() {
onInput={(e: any) => setEditName(e.detail.value)}
/>
<View className='form-actions'>
<View className='btn-outline' onTap={() => setShowEdit(false)}>
<View className='btn-secondary' onTap={() => setShowEdit(false)}>
<Text></Text>
</View>
<View className='btn-gradient' onTap={handleSaveInfo}>
<View className='btn-primary' onTap={handleSaveInfo}>
<Text></Text>
</View>
</View>