diff --git a/apps/mini-user/src/assets/qualification-disclosure.png b/apps/mini-user/src/assets/qualification-disclosure.png new file mode 100644 index 0000000..d41c73a Binary files /dev/null and b/apps/mini-user/src/assets/qualification-disclosure.png differ diff --git a/apps/mini-user/src/pages/mine/index.tsx b/apps/mini-user/src/pages/mine/index.tsx index 3a0246a..64ba1d0 100644 --- a/apps/mini-user/src/pages/mine/index.tsx +++ b/apps/mini-user/src/pages/mine/index.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react'; -import { View, Text, Image, Button, Input } from '@tarojs/components'; +import { View, Text, Image, Button, Input, ScrollView } from '@tarojs/components'; import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro'; import { isWxAuthorizeEnabled, type ClientRuntimeConfig } from '@dukang/shared-types'; import PageShell from '../../components/PageShell'; @@ -18,6 +18,7 @@ import { } from '../../lib/mini-wechat-profile'; import { isLoggedIn, logout, request, toast, type UserProfile } from '../../lib/api'; import { isWechatEnv } from '../../lib/weixin'; +import qualificationDisclosureImg from '../../assets/qualification-disclosure.png'; const ORDER_SHORTCUTS = [ { tab: 'pending_pay', icon: '付', label: '待付款' }, @@ -29,6 +30,7 @@ const SERVICES = [ { icon: '址', label: '地址管理', url: '/pages/addresses/index' }, { icon: '店', label: '可用门店', tab: '/pages/stores/index' }, { icon: '服', label: '联系客服', url: '/pages/customer-service/index' }, + { icon: '资', label: '资质公示', action: 'qualification' as const }, { icon: '关', label: '关于我们', action: 'about' as const }, ] as const; @@ -51,6 +53,7 @@ export default function MinePage() { const [draftNickname, setDraftNickname] = useState(''); const [savingProfile, setSavingProfile] = useState(false); const [profileLoadError, setProfileLoadError] = useState(''); + const [qualificationOpen, setQualificationOpen] = useState(false); function resetGuestState() { setProfile(null); @@ -254,6 +257,10 @@ export default function MinePage() { Taro.switchTab({ url: item.tab }); return; } + if ('action' in item && item.action === 'qualification') { + setQualificationOpen(true); + return; + } if ('action' in item && item.action === 'about') { toast('杜康好客 · 传承千年酒文化'); } @@ -507,14 +514,32 @@ export default function MinePage() { void saveWxProfile()} + onClick={() => { + if (!savingProfile) void saveWxProfile(); + }} > - {savingProfile ? '保存中...' : '保存'} + {savingProfile ? '保存中…' : '保存'} ) : null} + + {qualificationOpen ? ( + setQualificationOpen(false)} + > + + + + 点击任意处关闭 + + ) : null} ); } diff --git a/apps/mini-user/src/styles/mine.css b/apps/mini-user/src/styles/mine.css index 7a285ad..ac484b9 100644 --- a/apps/mini-user/src/styles/mine.css +++ b/apps/mini-user/src/styles/mine.css @@ -498,3 +498,38 @@ opacity: 0.65; pointer-events: none; } + +.mine-qualification-mask { + position: fixed; + inset: 0; + z-index: 1200; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 10px; + padding: 24px 16px; + background: rgba(0, 0, 0, 0.72); + box-sizing: border-box; +} + +.mine-qualification-scroll { + width: 100%; + max-width: 420px; + max-height: calc(86vh - 36px); + border-radius: 8px; + overflow: hidden; + background: #fff; +} + +.mine-qualification-img { + display: block; + width: 100%; + pointer-events: none; +} + +.mine-qualification-hint { + text-align: center; + font-size: 12px; + color: rgba(255, 255, 255, 0.82); +}