airz-uniapp/packages/account/profile/profile.uvue

<template>
	<view class="page" :style="pageStyle()">
		<AppHeader title="个人中心" :back="false" />
		<scroll-view scroll-y :style="contentStyle(226, false)">
			<view class="profile-content">
				<view class="profile-card" @click="openAccount"><view class="avatar"><image class="profile-avatar" :src="avatar.length > 0 ? avatar : DEFAULT_AVATAR" mode="aspectFill" @error="avatar = ''" /></view><view class="profile-main"><text class="profile-name">{{ displayName }}</text><text class="profile-phone">{{ loggedIn ? maskedPhone : '登录后管理您的融资信息' }}</text></view><text v-if="!loggedIn" class="account-state">未登录</text><AppIcon v-if="loggedIn" name="chevron-right" :size="28" /></view>
				<view class="stat-row"><view class="stat-item" @click="go('/packages/finance/archive/archive')"><text class="stat-value">{{ completion }}%</text><text class="stat-label">档案完整度</text></view><view class="stat-item" @click="openReport"><text class="stat-value">{{ hasReport ? '已生成' : '暂无' }}</text><text class="stat-label">评估报告</text></view><view class="stat-item" @click="go('/packages/account/points/points')"><AppIcon name="points" :size="42" /><text class="stat-label">积分中心</text></view></view>
				<view class="menu-list"><view class="menu-row" v-for="item in menus" :key="item.name" @click="open(item.key)"><AppIcon :name="item.icon" :size="46" /><text class="menu-name">{{ item.name }}</text><text v-if="item.note.length > 0" class="menu-note">{{ item.note }}</text><AppIcon name="chevron-right" :size="28" /></view></view>
				<button class="logout" @click="logout">{{ loggedIn ? '退出登录' : '登录 / 注册' }}</button>
				<text class="version-note">AI融资 · 让融资更简单</text>
			</view>
		</scroll-view>
		<BottomNav active="profile" />
	</view>
</template>

<script setup lang="uts">
	import { usePageLayout } from '@/services/layout.uts'
	import AppHeader from '@/components/AppHeader.uvue'
	import BottomNav from '@/components/BottomNav.uvue'
	import AppIcon from '@/components/AppIcon.uvue'
	import { clearSession, getSession } from '@/services/api.uts'
	import { activeAssessmentType, assessmentProgress, showAgreementNotice } from '@/services/assessment.uts'
	import { DEFAULT_AVATAR, getAccountProfile, maskPhone } from '@/packages/account/services/account.uts'
	const { contentStyle, pageStyle } = usePageLayout()
	type ProfileMenu = { icon: string, name: string, note: string, key: string }
	const menus: ProfileMenu[] = [{ icon: 'archive', name: '我的融资档案', note: '', key: 'archive' }, { icon: 'shield', name: '账户安全', note: '', key: 'security' }, { icon: 'privacy', name: '隐私与授权', note: '', key: 'privacy' }, { icon: 'help', name: '帮助与反馈', note: '', key: 'help' }, { icon: 'info', name: '关于我们', note: 'V1.0.0', key: 'about' }]
	const loggedIn = ref(false)
	const displayName = ref('登录 / 注册')
	const maskedPhone = ref('')
	const avatar = ref('')
	const completion = ref(0)
	const hasReport = ref(false)
	onShow(() => {
		const session = getSession()
		loggedIn.value = session != null
		const profile = getAccountProfile()
		maskedPhone.value = maskPhone(profile.phone); avatar.value = loggedIn.value ? profile.avatar : ''
		const type = activeAssessmentType()
		displayName.value = loggedIn.value ? profile.nickname : '登录 / 注册'
		completion.value = assessmentProgress(type).percent
		const latest = uni.getStorageSync('latestAssessment')
		hasReport.value = latest != null && typeof latest == 'object'
	})
	const go = (url: string) => { uni.navigateTo({ url }) }
	const openReport = () => { if (hasReport.value) go('/packages/finance/report/report'); else uni.showModal({ title: '暂无评估报告', content: '完善融资信息后，即可体验融资评估与方案匹配。', confirmText: '去完善', success: (result) => { if (result.confirm) go('/packages/finance/archive/archive') } }) }
	const open = (key: string) => {
		if (key == 'archive') go('/packages/finance/archive/archive')
		else if (key == 'help') go('/packages/content/help/help')
		else if (key == 'security') go(loggedIn.value ? '/packages/account/security/security' : '/packages/account/login/login')
		else if (key == 'privacy') uni.showActionSheet({ itemList: ['查看隐私说明', '管理资料与授权'], success: (result) => { if (result.tapIndex == 0) showAgreementNotice('隐私说明'); else if (result.tapIndex == 1) { uni.setStorageSync('assessmentEditStep', 3); go('/packages/finance/assessment/assessment?type=' + activeAssessmentType()) } } })
		else if (key == 'about') uni.showModal({ title: '关于 AI融资', content: '版本 V1.0.0\n帮助您整理融资信息、了解融资知识与融资方案。评估结果仅供参考，不构成授信承诺。', showCancel: false, confirmText: '我知道了' })
	}
	const openAccount = () => { go(loggedIn.value ? '/packages/account/edit-profile/edit-profile' : '/packages/account/login/login') }
	const logout = () => {
		if (!loggedIn.value) { go('/packages/account/login/login'); return }
		uni.showModal({ title: '退出登录', content: '退出后，本机保存的评估草稿仍会保留。', confirmText: '退出登录', success: (result) => { if (result.confirm) { clearSession(); uni.reLaunch({ url: '/packages/account/login/login' }) } } })
	}
</script>

<style>
	.profile-content { padding: 26rpx 30rpx 90rpx; }
	.profile-card { min-height: 166rpx; padding: 28rpx 24rpx; border-radius: 18rpx 18rpx 0 0; background-color: #fff; flex-direction: row; align-items: center; }
	.avatar { width: 84rpx; height: 84rpx; align-items: center; justify-content: center; margin-right: 20rpx; flex-shrink: 0; }
	.profile-avatar { width: 84rpx; height: 84rpx; border-radius: 42rpx; background-color: #eaf2ff; }
	.profile-main { flex: 1; min-width: 0; }
	.profile-name { color: #23344e; font-size: 32rpx; font-weight: 700; }
	.profile-phone { color: #8190a4; font-size: 24rpx; line-height: 36rpx; margin-top: 8rpx; }
	.account-state { padding: 8rpx 12rpx; border-radius: 8rpx; background-color: #eef4fd; color: #6c84a5; font-size: 22rpx; flex-shrink: 0; margin-left: 10rpx; }
	.stat-row { min-height: 136rpx; background-color: #fff; border-top: 1rpx solid #edf1f6; border-radius: 0 0 18rpx 18rpx; flex-direction: row; }
	.stat-item { flex: 1; align-items: center; justify-content: center; }
	.stat-value { font-size: 31rpx; font-weight: 700; color: #173864; line-height: 44rpx; }
	.stat-label { color: #7d8ca1; font-size: 24rpx; margin-top: 10rpx; }
	.menu-list { margin-top: 24rpx; padding: 0 24rpx; border-radius: 18rpx; background-color: #fff; }
	.menu-row { min-height: 106rpx; flex-direction: row; align-items: center; border-bottom: 1rpx solid #edf1f6; }
	.menu-name { flex: 1; font-size: 28rpx; color: #2a3a53; margin-left: 20rpx; }
	.menu-note { color: #8793a6; font-size: 23rpx; margin-right: 12rpx; }
	.logout { margin-top: 26rpx; height: 92rpx; line-height: 92rpx; border-radius: 16rpx; color: #56667d; background-color: #fff; border: 1rpx solid #e5ecf5; font-size: 28rpx; }
	.version-note { color: #94a0b0; font-size: 22rpx; text-align: center; margin-top: 28rpx; }
</style>