Merge branch 'dev-feature-client-weijia'

* dev-feature-client-weijia: 调整用户中心页面内容区域的顶部边距，并优化返回按钮的样式和定位。 feat: 新增用户中心估值记录、对公转账、发票管理和侧边栏组件，并重构用户中心页面。 refactor: 使用自定义useAppDark替代vueuse的useDark feat: 添加返回导航功能 feat: 完成客户端个人中心和抬头管理功能 feat: 添加独立首页路由，优化登录后跳转逻辑 feat: 添加短信验证码登录功能，优化登录页面交互体验
调整用户中心页面内容区域的顶部边距，并优化返回按钮的样式和定位。
2025-11-20 10:34:52 +08:00 · 2025-11-19 16:51:08 +08:00 · 2025-11-19 14:39:07 +08:00 · 2025-11-18 15:39:34 +08:00 · 2025-11-17 18:46:13 +08:00 · 2025-11-17 18:38:16 +08:00
10 changed files with 2080 additions and 28 deletions
--- a/web1/src/api/index.js
+++ b/web1/src/api/index.js
@ -8,6 +8,9 @@ export default {
  // 手机号
  registerPhone: (data) => request.post('/app-user/register', data, { noNeedToken: true }),
  loginPhone: (data) => request.post('/app-user/login', data, { noNeedToken: true }),
+  // 短信验证码（待后端实现）
+  sendVerifyCode: (data) => request.post('/app-user/send-verify-code', data, { noNeedToken: true }),
+  loginWithVerifyCode: (data) => request.post('/app-user/login-with-code', data, { noNeedToken: true }),
  // pages
  getIndustryList: () => request.get('/industry/list'),
  getHistoryList: (params) => request.get('/app-valuations/', { params }),
--- a/web1/src/router/routes/index.js
+++ b/web1/src/router/routes/index.js
@ -6,9 +6,63 @@ const Layout = () => import('@/layout/index.vue')
 export const basicRoutes = [
  {
    path: '/',
-    redirect: '/pages', // 默认跳转到首页
+    redirect: '/home', // 默认跳转到首页
    meta: { order: 0 },
  },
+  {
+    name: 'Home',
+    path: '/home',
+    component: () => import('@/views/home/index.vue'),
+    isHidden: true,
+    meta: {
+      title: '首页',
+    },
+  },
+  {
+    name: 'UserCenter',
+    path: '/user-center',
+    component: () => import('@/views/user-center/index.vue'),
+    redirect: '/user-center/history',
+    isHidden: true,
+    meta: {
+      title: '个人中心',
+    },
+    children: [
+      {
+        name: 'ValuationHistory',
+        path: 'history',
+        component: () => import('@/views/user-center/components/ValuationHistory.vue'),
+        meta: {
+          title: '估值记录',
+        },
+      },
+      {
+        name: 'CorporateTransfer',
+        path: 'transfer',
+        component: () => import('@/views/user-center/components/CorporateTransfer.vue'),
+        meta: {
+          title: '对公转账',
+        },
+      },
+      {
+        name: 'InvoiceManagement',
+        path: 'invoice',
+        component: () => import('@/views/user-center/components/InvoiceManagement.vue'),
+        meta: {
+          title: '开票管理',
+        },
+      },
+    ],
+  },
+  {
+    name: 'InvoiceHeaderAdd',
+    path: '/invoice-header/add',
+    component: () => import('@/views/invoice-header/add.vue'),
+    isHidden: true,
+    meta: {
+      title: '添加抬头',
+    },
+  },
  {
    name: t('views.workbench.label_workbench'),
    path: '/workbench',
--- a/web1/src/views/home/index.vue
+++ b/web1/src/views/home/index.vue
@ -0,0 +1,162 @@
+<template>
+  <div class="home-container">
+    <div class="header">
+      <div class="logo-section">
+        <img src="@/assets/images/logo.png" alt="logo" class="logo" />
+        <div class="user-center" @click="handleUserCenter">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <circle cx="12" cy="8" r="4" stroke="currentColor" stroke-width="2"/>
+            <path d="M6 21C6 17.134 8.686 14 12 14C15.314 14 18 17.134 18 21" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
+          </svg>
+          <span>个人中心</span>
+        </div>
+      </div>
+    </div>
+    
+    <div class="content">
+      <div class="title-section">
+        <h1 class="main-title">非遗IP价值评估系统</h1>
+        <p class="subtitle">基于深度学习算法的智能评估系统，为您的知识产权和非物质文化遗产提供专业的价值评估服务</p>
+      </div>
+      
+      <div class="action-section">
+        <n-button
+          type="primary"
+          size="large"
+          class="start-btn"
+          @click="handleStartEvaluation"
+        >
+          开始评估
+        </n-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const router = useRouter()
+
+function handleStartEvaluation() {
+  router.push('/pages')
+}
+
+function handleUserCenter() {
+  router.push('/user-center')
+}
+</script>
+
+<style scoped>
+.home-container {
+  min-height: 100vh;
+  background: linear-gradient(135deg, #f5f7fa 0%, #e8eef5 100%);
+  display: flex;
+  flex-direction: column;
+}
+
+.header {
+  padding: 20px 40px;
+  background: rgba(255, 255, 255, 0.9);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+}
+
+.logo-section {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.logo {
+  height: 32px;
+  width: auto;
+}
+
+.user-center {
+  font-size: 16px;
+  color: #303133;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 16px;
+  border-radius: 8px;
+  transition: all 0.3s ease;
+}
+
+.user-center:hover {
+  background: rgba(136, 12, 34, 0.05);
+  color: #880C22;
+}
+
+.user-center svg {
+  color: currentColor;
+}
+
+.content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px 20px;
+}
+
+.title-section {
+  text-align: center;
+  margin-bottom: 60px;
+}
+
+.main-title {
+  font-size: 48px;
+  font-weight: 600;
+  color: #303133;
+  line-height: 1.2;
+  margin: 0 0 20px 0;
+}
+
+.subtitle {
+  font-size: 16px;
+  color: #606266;
+  line-height: 1.6;
+  max-width: 700px;
+  margin: 0 auto;
+}
+
+.action-section {
+  display: flex;
+  justify-content: center;
+}
+
+.start-btn {
+  height: 50px;
+  padding: 0 60px;
+  font-size: 18px;
+  background: linear-gradient(93deg, #880C22 0%, #A30113 100%);
+  border: none;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.start-btn:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 8px 16px rgba(136, 12, 34, 0.3);
+}
+
+@media (max-width: 768px) {
+  .main-title {
+    font-size: 32px;
+  }
+  
+  .subtitle {
+    font-size: 14px;
+  }
+  
+  .start-btn {
+    height: 44px;
+    padding: 0 40px;
+    font-size: 16px;
+  }
+}
+</style>
--- a/web1/src/views/invoice-header/add.vue
+++ b/web1/src/views/invoice-header/add.vue
@ -0,0 +1,496 @@
+<template>
+  <div class="invoice-header-add">
+    <!-- 左侧边栏 -->
+    <div class="sidebar">
+      <!-- 用户信息 -->
+      <div class="user-info">
+        <div class="avatar">
+          <svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <circle cx="12" cy="8" r="4" stroke="white" stroke-width="2"/>
+            <path d="M6 21C6 17.134 8.686 14 12 14C15.314 14 18 17.134 18 21" stroke="white" stroke-width="2" stroke-linecap="round"/>
+          </svg>
+        </div>
+        <div class="user-phone">{{ userPhone }}</div>
+        <div class="user-count">累计估值次数: {{ valuationCount }}</div>
+      </div>
+
+      <!-- 菜单列表 -->
+      <div class="menu-list">
+        <div 
+          v-for="menu in menuList" 
+          :key="menu.id" 
+          class="menu-item"
+          :class="{ active: menu.id === 'invoice' }"
+          @click="handleMenuClick(menu)"
+        >
+          <component :is="menu.icon" class="menu-icon" />
+          <span class="menu-text">{{ menu.label }}</span>
+          <svg v-if="menu.id !== 'invoice'" width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M9 18L15 12L9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </div>
+      </div>
+    </div>
+
+    <!-- 右侧表单区 -->
+    <div class="content-area">
+      <div class="content-section">
+        <!-- 返回按钮 -->
+        <div class="back-button" @click="handleBack">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M15 18L9 12L15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+          <span>返回</span>
+        </div>
+
+        <n-form
+          ref="formRef"
+          :model="formData"
+          :rules="formRules"
+          label-placement="left"
+          label-width="auto"
+          require-mark-placement="left"
+          class="invoice-form"
+        >
+          <n-form-item label="公司名称" path="company_name">
+            <n-input 
+              v-model:value="formData.company_name" 
+              placeholder="请输入公司名称"
+              :maxlength="100"
+            />
+          </n-form-item>
+
+          <n-form-item label="公司税号" path="tax_number">
+            <n-input 
+              v-model:value="formData.tax_number" 
+              placeholder="请输入公司税号"
+              :maxlength="50"
+            />
+          </n-form-item>
+
+          <n-form-item label="注册地址" path="address">
+            <n-input 
+              v-model:value="formData.address" 
+              placeholder="请输入注册地址"
+              :maxlength="200"
+            />
+          </n-form-item>
+
+          <n-form-item label="注册电话" path="phone">
+            <n-input 
+              v-model:value="formData.phone" 
+              placeholder="请输入注册电话"
+              :maxlength="20"
+            />
+          </n-form-item>
+
+          <n-form-item label="开户银行" path="bank_name">
+            <n-input 
+              v-model:value="formData.bank_name" 
+              placeholder="请输入开户银行"
+              :maxlength="100"
+            />
+          </n-form-item>
+
+          <n-form-item label="银行账号" path="bank_account">
+            <n-input 
+              v-model:value="formData.bank_account" 
+              placeholder="请输入银行账号"
+              :maxlength="50"
+            />
+          </n-form-item>
+
+          <n-form-item label="邮箱" path="email">
+            <n-input 
+              v-model:value="formData.email" 
+              placeholder="请输入邮箱"
+              :maxlength="100"
+            />
+          </n-form-item>
+
+          <div class="form-actions">
+            <n-button 
+              type="primary" 
+              :loading="loading"
+              @click="handleSubmit"
+            >
+              保存
+            </n-button>
+          </div>
+        </n-form>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, h } from 'vue'
+import { useRouter } from 'vue-router'
+import api from '@/api'
+
+const router = useRouter()
+
+// 用户信息
+const userPhone = ref('')
+const valuationCount = ref(0)
+
+// 表单数据
+const formRef = ref(null)
+const loading = ref(false)
+const formData = ref({
+  company_name: '',
+  tax_number: '',
+  address: '',
+  phone: '',
+  bank_name: '',
+  bank_account: '',
+  email: ''
+})
+
+// 表单验证规则
+const formRules = {
+  company_name: [
+    { required: true, message: '请输入公司名称', trigger: 'blur' }
+  ],
+  tax_number: [
+    { required: true, message: '请输入公司税号', trigger: 'blur' }
+  ],
+  address: [
+    { required: false, message: '请输入注册地址', trigger: 'blur' }
+  ],
+  phone: [
+    { required: false, message: '请输入注册电话', trigger: 'blur' }
+  ],
+  bank_name: [
+    { required: false, message: '请输入开户银行', trigger: 'blur' }
+  ],
+  bank_account: [
+    { required: false, message: '请输入银行账号', trigger: 'blur' }
+  ],
+  email: [
+    { required: false, message: '请输入邮箱', trigger: 'blur' },
+    { type: 'email', message: '请输入正确的邮箱格式', trigger: 'blur' }
+  ]
+}
+
+// 菜单列表
+const menuList = ref([
+  {
+    id: 'history',
+    label: '估值记录',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('path', {
+        d: 'M12 8V12L15 15',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      }),
+      h('circle', {
+        cx: 12,
+        cy: 12,
+        r: 9,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      })
+    ])
+  },
+  {
+    id: 'transfer',
+    label: '对公转账',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('path', {
+        d: 'M12 2V6M12 18V22M6 12H2M22 12H18',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      }),
+      h('circle', {
+        cx: 12,
+        cy: 12,
+        r: 4,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      })
+    ])
+  },
+  {
+    id: 'invoice',
+    label: '抬头管理',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('rect', {
+        x: 3,
+        y: 3,
+        width: 18,
+        height: 18,
+        rx: 2,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      }),
+      h('path', {
+        d: 'M8 12H16M8 16H13',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      })
+    ])
+  }
+])
+
+// 返回
+function handleBack() {
+  router.push('/user-center')
+}
+
+// 菜单点击
+function handleMenuClick(menu) {
+  if (menu.id === 'invoice') return
+  router.push('/user-center')
+}
+
+// 提交表单
+async function handleSubmit() {
+  formRef.value?.validate(async (errors) => {
+    if (errors) return
+
+    loading.value = true
+    try {
+      // TODO: 调用添加抬头接口
+      // await api.addInvoiceHeader(formData.value)
+      
+      $message.success('保存成功')
+      // 返回个人中心
+      setTimeout(() => {
+        router.push('/user-center')
+      }, 500)
+    } catch (error) {
+      $message.error('保存失败，请重试')
+    } finally {
+      loading.value = false
+    }
+  })
+}
+
+// 加载用户信息
+async function loadUserInfo() {
+  try {
+    const phone = localStorage.getItem('phone')
+    if (phone) {
+      userPhone.value = phone
+    }
+
+    const res = await api.getHistoryList()
+    if (res && res.results) {
+      valuationCount.value = res.results.length
+    }
+  } catch (error) {
+    console.error('加载用户信息失败:', error)
+  }
+}
+
+onMounted(() => {
+  loadUserInfo()
+})
+</script>
+
+<style scoped>
+.invoice-header-add {
+  display: flex;
+  min-height: 100vh;
+  background: #F5F7FA;
+}
+
+/* 左侧边栏 */
+.sidebar {
+  width: 240px;
+  background: white;
+  padding: 20px;
+  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);
+}
+
+.user-info {
+  text-align: center;
+  padding-bottom: 20px;
+  border-bottom: 1px solid #EEEEEE;
+  margin-bottom: 20px;
+}
+
+.avatar {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+  background: linear-gradient(93deg, #880C22 0%, #A30113 100%);
+  margin: 0 auto 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.user-phone {
+  font-size: 16px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 8px;
+}
+
+.user-count {
+  font-size: 12px;
+  color: #909399;
+}
+
+.menu-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.menu-item {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  color: #606266;
+}
+
+.menu-item:hover {
+  background: #F5F7FA;
+}
+
+.menu-item.active {
+  background: rgba(163, 1, 19, 0.08);
+  color: #A30113;
+}
+
+.menu-icon {
+  width: 20px;
+  height: 20px;
+  margin-right: 12px;
+}
+
+.menu-text {
+  flex: 1;
+  font-size: 14px;
+}
+
+/* 右侧内容区 */
+.content-area {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+}
+
+.content-section {
+  background: white;
+  border-radius: 8px;
+  padding: 60px;
+  min-height: calc(100vh - 40px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+
+.back-button {
+  position: absolute;
+  top: 24px;
+  left: 24px;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 16px;
+  color: #606266;
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  font-size: 14px;
+}
+
+.back-button:hover {
+  background: #F5F7FA;
+  color: #A30113;
+}
+
+.back-button svg {
+  transition: transform 0.3s ease;
+}
+
+.back-button:hover svg {
+  transform: translateX(-2px);
+}
+
+.invoice-form {
+  width: 100%;
+  max-width: 500px;
+}
+
+.invoice-form :deep(.n-form-item) {
+  margin-bottom: 24px;
+}
+
+.invoice-form :deep(.n-form-item-label) {
+  font-size: 14px;
+  color: #303133;
+  padding-right: 16px;
+  min-width: 100px;
+  text-align: right;
+}
+
+.invoice-form :deep(.n-input) {
+  height: 36px;
+}
+
+.form-actions {
+  margin-top: 48px;
+  text-align: center;
+}
+
+.form-actions .n-button {
+  width: 120px;
+  height: 40px;
+  background: #A30113;
+  border-radius: 4px;
+  border: none;
+  font-size: 14px;
+}
+
+.form-actions .n-button:hover {
+  background: #880C22;
+}
+
+@media (max-width: 768px) {
+  .invoice-header-add {
+    flex-direction: column;
+  }
+  
+  .sidebar {
+    width: 100%;
+  }
+  
+  .content-area {
+    padding: 20px;
+  }
+  
+  .form-container {
+    padding: 24px;
+  }
+}
+</style>
--- a/web1/src/views/login/index.vue
+++ b/web1/src/views/login/index.vue
@ -5,7 +5,7 @@
      class="m-auto max-w-1500 min-w-750 f-c-c rounded-12 bg-white bg-opacity-80"
      dark:bg-dark
    >
-      <div w-750 px-20 style="height: 400px; padding-top: 50px; text-align: center;">
+      <div w-750 px-20 style="height: 480px; padding-top: 50px; text-align: center;">
        <img style="width: 371px; height: 60px; margin: auto;" src="@/assets/images/logo.png" alt="">
        <div mt-50 style="text-align: center; font-size: 48px; color: #303133; line-height: 48px; font-weight: 600; ">
          非遗IP价值评估系统
@ -18,8 +18,8 @@
            v-model:value="loginInfo.phone"
            style="display: inline-block; width: 260px; height: 42px; text-align: left; line-height: 42px;"
            placeholder="请输入手机号"
-            :maxlength="20"
-            @keypress.enter="handleRegister"
+            :maxlength="11"
+            @keypress.enter="handleLogin"
          >
           <template #prefix>
            <img style="width: 18px; height: 18px; margin-right: 8px;" src="@/assets/images/phone.png" alt="">
@ -32,12 +32,29 @@
            rounded-5
            type="primary"
            style="background: linear-gradient( 93deg, #880C22 0%, #A30113 100%); margin-left: 20px; font-size: 16px; border: none !important;"
-            @click="handleRegister"
+            @click="handleLogin"
          >
            立即登录
            <img style="width: 18px; height: 18px; margin-left: 2px;" src="@/assets/images/go.png" alt="">
          </n-button>
        </div>
+        
+        <div mt-20 style="display: flex; justify-content: center; align-items: center;">
+          <n-input
+            v-model:value="loginInfo.verifyCode"
+            style="width: 260px; height: 42px;"
+            placeholder="验证码"
+            :maxlength="6"
+            @keypress.enter="handleLogin"
+          />
+          <n-button
+            style="width: 126px; height: 42px; margin-left: 12px; font-size: 14px;"
+            :disabled="countdown > 0"
+            @click="handleSendCode"
+          >
+            {{ countdown > 0 ? `${countdown}秒后重试` : '发送验证码' }}
+          </n-button>
+        </div>
      </div>
    </div>
  </AppPage>
@ -56,8 +73,12 @@ const { t } = useI18n({ useScope: 'global' })

 const loginInfo = ref({
  phone: '',
+  verifyCode: '',
 })

+const countdown = ref(0)
+let countdownTimer = null
+
 initLoginInfo()

 function initLoginInfo() {
@ -73,37 +94,110 @@ function initLoginInfo() {

 const loading = ref(false)

-async function handleRegister() {
+// 验证手机号格式
+function validatePhone(phone) {
+  const phoneReg = /^1[3-9]\d{9}$/
+  return phoneReg.test(phone)
+}
+
+// 发送验证码
+async function handleSendCode() {
  const { phone } = loginInfo.value
+  
  if (!phone) {
    $message.warning('请输入手机号')
    return
  }
-  loading.value = true
-  await api.registerPhone({ phone })
-  .then(res=>{
-    handleLogin()
-  })
-  .catch(res=>{
-    handleLogin()
-  })
+  
+  if (!validatePhone(phone)) {
+    $message.warning('请输入正确的手机号')
+    return
+  }
+  
+  try {
+    // TODO: 调用发送验证码接口
+    // await api.sendVerifyCode({ phone })
+    
+    // 模拟发送成功
+    $message.success('验证码已发送')
+    
+    // 开始倒计时
+    countdown.value = 60
+    countdownTimer = setInterval(() => {
+      countdown.value--
+      if (countdown.value <= 0) {
+        clearInterval(countdownTimer)
+        countdownTimer = null
+      }
+    }, 1000)
+  } catch (error) {
+    $message.error('验证码发送失败，请重试')
+  }
 }

+// 登录
 async function handleLogin() {
-  const { phone } = loginInfo.value
-  loading.value = true
-  await api.loginPhone({ phone, password: phone.slice(5,11) }).catch(res=>{
-    setToken(res.error.access_token)
-    if (query.redirect) {
-      const path = query.redirect
-      localStorage.setItem('phone', phone)
-      Reflect.deleteProperty(query, 'redirect')
-      router.push({ path, query })
-    } else {
-      router.push('/')
-    }
-    loading.value = false
-  })
+  const { phone, verifyCode } = loginInfo.value
  
+  if (!phone) {
+    $message.warning('请输入手机号')
+    return
+  }
+  
+  if (!validatePhone(phone)) {
+    $message.warning('请输入正确的手机号')
+    return
+  }
+  
+  // TODO: 等待后端接口完成后再启用验证码验证
+  // if (!verifyCode) {
+  //   $message.warning('请输入验证码')
+  //   return
+  // }
+  // 
+  // if (verifyCode.length < 4) {
+  //   $message.warning('请输入完整的验证码')
+  //   return
+  // }
+  
+  loading.value = true
+  
+  try {
+    // TODO: 调用登录接口，传入手机号和验证码
+    // const res = await api.loginWithVerifyCode({ phone, verifyCode })
+    // setToken(res.access_token)
+    
+    // 模拟登录成功（暂时使用原有的注册+登录逻辑）
+    await api.registerPhone({ phone })
+      .then(res => {
+        return api.loginPhone({ phone, password: phone.slice(5, 11) })
+      })
+      .catch(res => {
+        if (res.error && res.error.access_token) {
+          setToken(res.error.access_token)
+          localStorage.setItem('phone', phone)
+          
+          if (query.redirect) {
+            const path = query.redirect
+            Reflect.deleteProperty(query, 'redirect')
+            router.push({ path, query })
+          } else {
+            router.push('/home')
+          }
+        }
+      })
+  } catch (error) {
+    $message.error('登录失败，请重试')
+  } finally {
+    loading.value = false
+  }
 }
+
+// 组件卸载时清除定时器
+onBeforeUnmount(() => {
+  if (countdownTimer) {
+    clearInterval(countdownTimer)
+    countdownTimer = null
+  }
+})
 </script>
--- a/web1/src/views/user-center/components/CorporateTransfer.vue
+++ b/web1/src/views/user-center/components/CorporateTransfer.vue
@ -0,0 +1,532 @@
+<template>
+  <div class="content-section">
+    <div class="transfer-container">
+      <!-- 步骤条 -->
+      <div class="steps">
+        <div class="step" :class="{ active: currentStep >= 1 }">
+          <div class="step-number">1</div>
+          <div class="step-label">对公汇款</div>
+        </div>
+        <div class="step-line" :class="{ active: currentStep >= 2 }"></div>
+        <div class="step" :class="{ active: currentStep >= 2 }">
+          <div class="step-number">2</div>
+          <div class="step-label">上传凭证</div>
+        </div>
+        <div class="step-line" :class="{ active: currentStep >= 3 }"></div>
+        <div class="step" :class="{ active: currentStep >= 3 }">
+          <div class="step-number">3</div>
+          <div class="step-label">等待到账</div>
+        </div>
+      </div>
+
+      <!-- 第一步：转账信息 -->
+      <div v-if="currentStep === 1" class="transfer-info">
+        <div class="info-title">第一步</div>
+        <div class="info-content">
+          <div class="info-row">
+            <span class="label">评估收费标准：</span>
+            <span class="value highlight">6000元/次</span>
+          </div>
+          <div class="info-row">
+            <span class="label">请汇款以下账户：</span>
+          </div>
+          <div class="info-row">
+            <span class="label">公司名称：</span>
+            <span class="value">成都文化产权交易所有限公司</span>
+          </div>
+          <div class="info-row">
+            <span class="label">税号：</span>
+            <span class="value">91510104586429590T</span>
+          </div>
+          <div class="info-row">
+            <span class="label">注册地址：</span>
+            <span class="value">成都市锦江区工业园区三色路38号</span>
+          </div>
+          <div class="info-row">
+            <span class="label">开户行：</span>
+            <span class="value">中国民生银行股份有限公司成都科华支行</span>
+          </div>
+          <div class="info-row">
+            <span class="label">开户账号：</span>
+            <span class="value">6343 8264 7</span>
+          </div>
+          <div class="info-row">
+            <span class="label">电话：</span>
+            <span class="value">(028) 85915289</span>
+          </div>
+        </div>
+        <n-button class="next-btn" @click="handleNextStep">
+          下一步
+        </n-button>
+      </div>
+
+      <!-- 第二步：上传凭证 -->
+      <div v-if="currentStep === 2" class="upload-section">
+        <div class="info-title">第二步：</div>
+        
+        <div class="upload-form">
+          <!-- 上传支付凭证 -->
+          <div class="form-item">
+            <div class="form-label">上传支付凭证：</div>
+            <div class="upload-area" @click="triggerFileInput">
+              <input 
+                ref="fileInput" 
+                type="file" 
+                accept="image/*" 
+                style="display: none" 
+                @change="handleFileChange"
+              />
+              <div v-if="!uploadedFile" class="upload-placeholder">
+                <svg width="48" height="48" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                  <path d="M12 5V19M5 12H19" stroke="#909399" stroke-width="2" stroke-linecap="round"/>
+                </svg>
+                <div class="upload-hint">仅支持图片格式</div>
+              </div>
+              <div v-else class="upload-preview">
+                <img :src="uploadedFileUrl" alt="支付凭证" />
+                <div class="upload-remove" @click.stop="removeFile">
+                  <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M18 6L6 18M6 6L18 18" stroke="white" stroke-width="2" stroke-linecap="round"/>
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 开票抬头 -->
+          <div class="form-item">
+            <div class="form-label">开票抬头：</div>
+            <n-select 
+              v-model:value="selectedInvoiceHeader" 
+              :options="invoiceHeaderOptions"
+              placeholder="请选择开票抬头"
+            />
+          </div>
+
+          <!-- 开票类型 -->
+          <div class="form-item">
+            <div class="form-label">开票类型：</div>
+            <n-select 
+              v-model:value="selectedInvoiceType" 
+              :options="invoiceTypeOptions"
+              placeholder="请选择开票类型"
+            />
+          </div>
+
+          <!-- 上传按钮 -->
+          <n-button 
+            class="upload-btn" 
+            :disabled="!uploadedFile || !selectedInvoiceHeader || !selectedInvoiceType"
+            @click="handleUploadSubmit"
+          >
+            上传
+          </n-button>
+        </div>
+      </div>
+
+      <!-- 第三步：等待到账 -->
+      <div v-if="currentStep === 3" class="success-section">
+        <div class="success-message">
+          <div class="success-title">上传成功！预计N个小时内到账</div>
+          <div class="success-subtitle">请耐心等待</div>
+        </div>
+        <n-button class="return-btn" @click="handleReturnHome">
+          返回首页
+        </n-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+const emit = defineEmits(['return-home'])
+
+// 当前步骤
+const currentStep = ref(1)
+
+// 文件上传相关
+const fileInput = ref(null)
+const uploadedFile = ref(null)
+const uploadedFileUrl = ref('')
+
+// 表单选择相关
+const selectedInvoiceHeader = ref(null)
+const selectedInvoiceType = ref(null)
+
+// 开票抬头选项
+const invoiceHeaderOptions = ref([
+  { label: '抬头1', value: 'header1' },
+  { label: '抬头2', value: 'header2' },
+  { label: '抬头3', value: 'header3' }
+])
+
+// 开票类型选项
+const invoiceTypeOptions = ref([
+  { label: '普通发票', value: 'normal' },
+  { label: '增值税专用发票', value: 'vat' }
+])
+
+// 下一步
+function handleNextStep() {
+  if (currentStep.value < 3) {
+    currentStep.value++
+  }
+}
+
+// 触发文件选择
+function triggerFileInput() {
+  fileInput.value?.click()
+}
+
+// 处理文件选择
+function handleFileChange(event) {
+  const file = event.target.files?.[0]
+  if (file) {
+    // 验证文件类型
+    if (!file.type.startsWith('image/')) {
+      $message.warning('请上传图片格式的文件')
+      return
+    }
+    
+    uploadedFile.value = file
+    uploadedFileUrl.value = URL.createObjectURL(file)
+  }
+}
+
+// 移除文件
+function removeFile() {
+  uploadedFile.value = null
+  uploadedFileUrl.value = ''
+  if (fileInput.value) {
+    fileInput.value.value = ''
+  }
+}
+
+// 提交上传
+function handleUploadSubmit() {
+  if (!uploadedFile.value || !selectedInvoiceHeader.value || !selectedInvoiceType.value) {
+    $message.warning('请完成所有必填项')
+    return
+  }
+  
+  // 这里可以调用API上传文件
+  // 暂时直接进入下一步
+  $message.success('上传成功')
+  currentStep.value = 3
+}
+
+// 返回首页
+function handleReturnHome() {
+  emit('return-home')
+}
+
+// 重置步骤
+function resetStep() {
+  currentStep.value = 1
+}
+
+defineExpose({
+  resetStep
+})
+</script>
+
+<style scoped>
+.content-section {
+  background: white;
+  border-radius: 8px;
+  padding: 24px;
+  min-height: calc(100vh - 40px);
+  position: relative;
+
+}
+
+.transfer-container {
+  max-width: 800px;
+  margin: 0 auto;
+}
+
+.steps {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 40px;
+}
+
+.step {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+}
+
+.step-number {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: #EEEEEE;
+  color: #909399;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16px;
+  font-weight: 500;
+  transition: all 0.3s ease;
+}
+
+.step.active .step-number {
+  background: linear-gradient(93deg, #880C22 0%, #A30113 100%);
+  color: white;
+}
+
+.step-label {
+  font-size: 14px;
+  color: #909399;
+}
+
+.step.active .step-label {
+  color: #303133;
+  font-weight: 500;
+}
+
+.step-line {
+  width: 100px;
+  height: 2px;
+  background: #EEEEEE;
+  margin: 0 16px;
+  transition: all 0.3s ease;
+}
+
+.step-line.active {
+  background: #A30113;
+}
+
+.transfer-info {
+  background: #F5F7FA;
+  border-radius: 8px;
+  padding: 24px;
+  border: 1px solid #EEEEEE;
+}
+
+.info-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 20px;
+  padding-left: 12px;
+  border-left: 4px solid #A30113;
+}
+
+.info-content {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-bottom: 24px;
+}
+
+.info-row {
+  display: flex;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.info-row .label {
+  color: #606266;
+  min-width: 120px;
+}
+
+.info-row .value {
+  color: #303133;
+  flex: 1;
+}
+
+.info-row .value.highlight {
+  color: #A30113;
+  font-weight: 600;
+}
+
+.next-btn {
+  width: 180px;
+  height: 40px;
+  margin: 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #A30113;
+  color: white;
+  border-radius: 4px;
+  border: none;
+}
+
+.next-btn:hover,
+.next-btn:focus,
+.next-btn:active {
+  background: #A30113;
+  opacity: 1;
+}
+
+/* 第二步：上传凭证 */
+.upload-section {
+  background: #F5F7FA;
+  border-radius: 8px;
+  padding: 24px;
+  border: 1px solid #EEEEEE;
+}
+
+.upload-form {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.form-item {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.form-label {
+  font-size: 14px;
+  color: #606266;
+  font-weight: 500;
+}
+
+.upload-area {
+  width: 100%;
+  max-width: 400px;
+  height: 200px;
+  border: 2px dashed #DCDFE6;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  background: white;
+  position: relative;
+  overflow: hidden;
+}
+
+.upload-area:hover {
+  border-color: #4A90E2;
+  background: #F5F9FF;
+}
+
+.upload-placeholder {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+}
+
+.upload-hint {
+  font-size: 12px;
+  color: #909399;
+}
+
+.upload-preview {
+  width: 100%;
+  height: 100%;
+  position: relative;
+}
+
+.upload-preview img {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+}
+
+.upload-remove {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  width: 32px;
+  height: 32px;
+  background: rgba(0, 0, 0, 0.5);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.upload-remove:hover {
+  background: rgba(0, 0, 0, 0.7);
+  transform: scale(1.1);
+}
+
+.upload-btn {
+  width: 180px;
+  height: 40px;
+  margin: 20px auto 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  background: #A30113;
+  color: white;
+  border: none;
+}
+
+.upload-btn:disabled {
+  background: #fab6b6;
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+
+.upload-btn:not(:disabled):hover,
+.upload-btn:not(:disabled):focus,
+.upload-btn:not(:disabled):active {
+  background: #A30113;
+  opacity: 1;
+}
+
+/* 第三步：等待到账 */
+.success-section {
+  background: #F5F7FA;
+  border-radius: 8px;
+  padding: 60px 24px;
+  border: 1px solid #EEEEEE;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 40px;
+}
+
+.success-message {
+  text-align: center;
+}
+
+.success-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 12px;
+}
+
+.success-subtitle {
+  font-size: 14px;
+  color: #606266;
+}
+
+.return-btn {
+  width: 180px;
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  background: #A30113;
+  color: white;
+  border: none;
+}
+
+.return-btn:hover,
+.return-btn:focus,
+.return-btn:active {
+  background: #A30113;
+  opacity: 1;
+}
+</style>
--- a/web1/src/views/user-center/components/InvoiceManagement.vue
+++ b/web1/src/views/user-center/components/InvoiceManagement.vue
@ -0,0 +1,157 @@
+<template>
+  <div class="content-section">
+    <div class="invoice-container">
+      <div class="add-card" @click="handleAddInvoice">
+        <div class="add-text">添加</div>
+      </div>
+      <div class="invoice-list">
+        <div 
+          v-for="invoice in invoiceList" 
+          :key="invoice.id" 
+          class="invoice-card"
+        >
+          <div class="invoice-icon">
+            <svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <rect x="3" y="3" width="18" height="18" rx="2" stroke="#909399" stroke-width="2"/>
+              <path d="M8 12H16M8 16H13" stroke="#909399" stroke-width="2" stroke-linecap="round"/>
+            </svg>
+          </div>
+          <div class="invoice-info">
+            <div class="invoice-name">{{ invoice.name }}</div>
+            <div class="invoice-status">{{ invoice.status }}</div>
+          </div>
+          <div class="invoice-action" @click="handleDeleteInvoice(invoice)">
+            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M3 6H21M8 6V4C8 3.44772 8.44772 3 9 3H15C15.5523 3 16 3.44772 16 4V6M19 6V20C19 20.5523 18.5523 21 18 21H6C5.44772 21 5 20.5523 5 20V6H19Z" stroke="#909399" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+
+defineProps({
+  invoiceList: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const emit = defineEmits(['add-invoice', 'delete-invoice'])
+
+// 添加开票
+function handleAddInvoice() {
+  router.push('/invoice-header/add')
+}
+
+// 删除开票
+function handleDeleteInvoice(invoice) {
+  $message.info('删除开票功能开发中')
+}
+</script>
+
+<style scoped>
+.content-section {
+  background: white;
+  border-radius: 8px;
+  padding: 24px;
+  min-height: calc(100vh - 40px);
+  position: relative;
+
+}
+
+.invoice-container {
+  max-width: 1000px;
+}
+
+.add-card {
+  position: absolute;
+  top: 24px;
+  right: 24px;
+  width: 80px;
+  height: 32px;
+  background: #A30113;
+  border-radius: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.add-card:hover {
+  background: #880C22;
+}
+
+.add-text {
+  color: white;
+  font-size: 14px;
+}
+
+.invoice-list {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  gap: 16px;
+  margin-top: 60px;
+}
+
+.invoice-card {
+  background: #F5F7FA;
+  border-radius: 8px;
+  padding: 20px;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  transition: all 0.3s ease;
+  border: 1px solid #EEEEEE;
+}
+
+.invoice-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 12px rgba(163, 1, 19, 0.1);
+  border-color: #A30113;
+}
+
+.invoice-icon {
+  flex-shrink: 0;
+}
+
+.invoice-info {
+  flex: 1;
+}
+
+.invoice-name {
+  font-size: 16px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 4px;
+}
+
+.invoice-status {
+  font-size: 12px;
+  color: #909399;
+}
+
+.invoice-action {
+  cursor: pointer;
+  padding: 8px;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+}
+
+.invoice-action:hover {
+  background: rgba(163, 1, 19, 0.1);
+}
+
+@media (max-width: 768px) {
+  .invoice-list {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
--- a/web1/src/views/user-center/components/UserSidebar.vue
+++ b/web1/src/views/user-center/components/UserSidebar.vue
@ -0,0 +1,140 @@
+<template>
+  <div class="sidebar">
+    <!-- 用户信息 -->
+    <div class="user-info">
+      <div class="avatar">
+        <svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <circle cx="12" cy="8" r="4" stroke="white" stroke-width="2"/>
+          <path d="M6 21C6 17.134 8.686 14 12 14C15.314 14 18 17.134 18 21" stroke="white" stroke-width="2" stroke-linecap="round"/>
+        </svg>
+      </div>
+      <div class="user-phone">{{ userPhone }}</div>
+      <div class="user-count">累计估值次数: {{ valuationCount }}</div>
+    </div>
+
+    <!-- 菜单列表 -->
+    <div class="menu-list">
+      <div 
+        v-for="menu in menuList" 
+        :key="menu.id" 
+        class="menu-item"
+        :class="{ active: currentMenu === menu.id }"
+        @click="handleMenuClick(menu)"
+      >
+        <component :is="menu.icon" class="menu-icon" />
+        <span class="menu-text">{{ menu.label }}</span>
+        <svg v-if="menu.id !== currentMenu" width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M9 18L15 12L9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+        </svg>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  userPhone: {
+    type: String,
+    default: ''
+  },
+  valuationCount: {
+    type: Number,
+    default: 0
+  },
+  currentMenu: {
+    type: String,
+    required: true
+  },
+  menuList: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const emit = defineEmits(['menu-click'])
+
+function handleMenuClick(menu) {
+  emit('menu-click', menu)
+}
+</script>
+
+<style scoped>
+.sidebar {
+  width: 240px;
+  background: white;
+  padding: 20px;
+  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);
+}
+
+.user-info {
+  text-align: center;
+  padding-bottom: 20px;
+  border-bottom: 1px solid #EEEEEE;
+  margin-bottom: 20px;
+}
+
+.avatar {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+  background: linear-gradient(93deg, #880C22 0%, #A30113 100%);
+  margin: 0 auto 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.user-phone {
+  font-size: 16px;
+  font-weight: 500;
+  color: #303133;
+  margin-bottom: 8px;
+}
+
+.user-count {
+  font-size: 12px;
+  color: #909399;
+}
+
+.menu-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.menu-item {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  color: #606266;
+}
+
+.menu-item:hover {
+  background: #F5F7FA;
+}
+
+.menu-item.active {
+  background: rgba(163, 1, 19, 0.08);
+  color: #A30113;
+}
+
+.menu-icon {
+  width: 20px;
+  height: 20px;
+  margin-right: 12px;
+}
+
+.menu-text {
+  flex: 1;
+  font-size: 14px;
+}
+
+@media (max-width: 768px) {
+  .sidebar {
+    width: 100%;
+  }
+}
+</style>
--- a/web1/src/views/user-center/components/ValuationHistory.vue
+++ b/web1/src/views/user-center/components/ValuationHistory.vue
@ -0,0 +1,187 @@
+<template>
+  <div class="content-section">
+    <div class="asset-grid">
+      <div 
+        v-for="item in assetList" 
+        :key="item.id" 
+        class="asset-card"
+      >
+        <div class="asset-header">
+          <div class="asset-title">资产名称</div>
+          <div class="asset-status" :class="getStatusClass(item.status)">
+            {{ getStatusText(item.status) }}
+          </div>
+        </div>
+        <div class="asset-date">{{ formatDate(item.created_at) }}</div>
+        <div class="asset-actions">
+          <div class="action-item" @click="handleDownloadReport(item)">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M12 3V16M12 16L7 11M12 16L17 11" stroke="#4A90E2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              <path d="M3 20H21" stroke="#4A90E2" stroke-width="2" stroke-linecap="round"/>
+            </svg>
+            <span>报告</span>
+          </div>
+          <div class="action-item" @click="handleDownloadCertificate(item)">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M12 3V16M12 16L7 11M12 16L17 11" stroke="#4A90E2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              <path d="M3 20H21" stroke="#4A90E2" stroke-width="2" stroke-linecap="round"/>
+            </svg>
+            <span>证书</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  assetList: {
+    type: Array,
+    default: () => []
+  }
+})
+
+// 格式化日期
+function formatDate(dateStr) {
+  if (!dateStr) return ''
+  return dateStr.slice(0, 10) + ' ' + dateStr.slice(11, 16)
+}
+
+// 获取状态文本
+function getStatusText(status) {
+  const statusMap = {
+    'pending': '审核中',
+    'approved': '已通过',
+    'rejected': '已拒绝',
+    'processing': '评估中'
+  }
+  return statusMap[status] || status
+}
+
+// 获取状态样式类
+function getStatusClass(status) {
+  return `status-${status}`
+}
+
+// 下载报告
+function handleDownloadReport(item) {
+  $message.info('下载报告功能开发中')
+}
+
+// 下载证书
+function handleDownloadCertificate(item) {
+  $message.info('下载证书功能开发中')
+}
+</script>
+
+<style scoped>
+.content-section {
+  background: white;
+  border-radius: 8px;
+  padding: 24px;
+  min-height: calc(100vh - 40px);
+  position: relative;
+
+}
+
+.asset-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+  gap: 16px;
+}
+
+.asset-card {
+  background: #F5F7FA;
+  border-radius: 8px;
+  padding: 16px;
+  transition: all 0.3s ease;
+  border: 1px solid #EEEEEE;
+}
+
+.asset-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 12px rgba(163, 1, 19, 0.1);
+  border-color: #A30113;
+}
+
+.asset-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 8px;
+}
+
+.asset-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #303133;
+}
+
+.asset-date {
+  font-size: 12px;
+  color: #909399;
+  margin-bottom: 12px;
+}
+
+.asset-actions {
+  display: flex;
+  gap: 8px;
+}
+
+.action-item {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 6px 12px;
+  background: white;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #A30113;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  border: 1px solid #EEEEEE;
+}
+
+.action-item:hover {
+  background: #A30113;
+  color: white;
+  border-color: #A30113;
+}
+
+.action-item:hover svg path {
+  stroke: white;
+}
+
+.asset-status {
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+}
+
+.status-pending {
+  background: #FFF3E0;
+  color: #F57C00;
+}
+
+.status-approved {
+  background: #E8F5E9;
+  color: #2E7D32;
+}
+
+.status-rejected {
+  background: #FFEBEE;
+  color: #C62828;
+}
+
+.status-processing {
+  background: #E3F2FD;
+  color: #1565C0;
+}
+
+@media (max-width: 768px) {
+  .asset-grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
--- a/web1/src/views/user-center/index.vue
+++ b/web1/src/views/user-center/index.vue
@ -0,0 +1,227 @@
+<template>
+  <div class="user-center-container">
+    <!-- 左侧边栏 -->
+    <UserSidebar
+      :user-phone="userPhone"
+      :valuation-count="valuationCount"
+      :current-menu="currentMenu"
+      :menu-list="menuList"
+      @menu-click="handleMenuClick"
+    />
+
+    <!-- 右侧内容区 -->
+    <div class="content-area">
+      <!-- 返回按钮 -->
+      <div class="back-button" @click="handleBackToHome">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M15 18L9 12L15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+        </svg>
+        <span>返回首页</span>
+      </div>
+
+      <!-- 子路由视图 -->
+      <router-view 
+        :asset-list="assetList"
+        :invoice-list="invoiceList"
+        @return-home="handleBackToHome"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, h, watch, computed } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import api from '@/api'
+import UserSidebar from './components/UserSidebar.vue'
+
+const router = useRouter() 
+const route = useRoute()
+
+// 当前菜单（从路由路径计算）
+const currentMenu = computed(() => {
+  const path = route.path
+  if (path.includes('/history')) return 'history'
+  if (path.includes('/transfer')) return 'transfer'
+  if (path.includes('/invoice')) return 'invoice'
+  return 'history'
+})
+
+// 用户信息
+const userPhone = ref('')
+const valuationCount = ref(0)
+
+// 资产列表
+const assetList = ref([])
+
+// 开票列表
+const invoiceList = ref([
+  { id: 1, name: '某某公司', status: '待审' },
+  { id: 2, name: '某某公司', status: '待审' }
+])
+
+// 菜单列表
+const menuList = ref([
+  {
+    id: 'history',
+    label: '估值记录',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('path', {
+        d: 'M12 8V12L15 15',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      }),
+      h('circle', {
+        cx: 12,
+        cy: 12,
+        r: 9,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      })
+    ])
+  },
+  {
+    id: 'transfer',
+    label: '对公转账',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('path', {
+        d: 'M12 2V6M12 18V22M6 12H2M22 12H18',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      }),
+      h('circle', {
+        cx: 12,
+        cy: 12,
+        r: 4,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      })
+    ])
+  },
+  {
+    id: 'invoice',
+    label: '开票管理',
+    icon: () => h('svg', {
+      width: 20,
+      height: 20,
+      viewBox: '0 0 24 24',
+      fill: 'none',
+      xmlns: 'http://www.w3.org/2000/svg'
+    }, [
+      h('rect', {
+        x: 3,
+        y: 3,
+        width: 18,
+        height: 18,
+        rx: 2,
+        stroke: 'currentColor',
+        'stroke-width': 2
+      }),
+      h('path', {
+        d: 'M8 12H16M8 16H13',
+        stroke: 'currentColor',
+        'stroke-width': 2,
+        'stroke-linecap': 'round'
+      })
+    ])
+  }
+])
+
+// 返回首页
+function handleBackToHome() {
+  router.push('/home')
+}
+
+// 菜单点击
+function handleMenuClick(menu) {
+  // 使用路由导航
+  router.push(`/user-center/${menu.id}`)
+}
+
+// 加载数据
+async function loadData() {
+  try {
+    const phone = localStorage.getItem('phone')
+    if (phone) {
+      userPhone.value = phone
+    }
+
+    const res = await api.getHistoryList()
+    if (res && res.results) {
+      assetList.value = res.results
+      valuationCount.value = res.results.length
+    }
+  } catch (error) {
+    console.error('加载数据失败:', error)
+  }
+}
+
+onMounted(() => {
+  loadData()
+})
+</script>
+
+<style scoped>
+.user-center-container {
+  display: flex;
+  min-height: 100vh;
+  background: #F5F7FA;
+}
+
+/* 右侧内容区 */
+.content-area {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+  position: relative;
+}
+
+.back-button {
+  position: absolute;
+  top: 44px; /* Align with the content card's top padding area */
+  left: 44px; /* Align with the content card's left padding area */
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 0;
+  color: #606266;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  font-size: 14px;
+  background: transparent;
+  z-index: 10;
+  box-shadow: none;
+}
+
+.back-button:hover {
+  color: #A30113;
+}
+
+.back-button svg {
+  transition: transform 0.3s ease;
+}
+
+.back-button:hover svg {
+  transform: translateX(-4px);
+}
+
+@media (max-width: 768px) {
+  .user-center-container {
+    flex-direction: column;
+  }
+}
+</style>
Author	SHA1	Message	Date
Wei_佳	b050b1c875	Merge branch 'dev-feature-client-weijia' * dev-feature-client-weijia: 调整用户中心页面内容区域的顶部边距，并优化返回按钮的样式和定位。 feat: 新增用户中心估值记录、对公转账、发票管理和侧边栏组件，并重构用户中心页面。 refactor: 使用自定义useAppDark替代vueuse的useDark feat: 添加返回导航功能 feat: 完成客户端个人中心和抬头管理功能 feat: 添加独立首页路由，优化登录后跳转逻辑 feat: 添加短信验证码登录功能，优化登录页面交互体验	2025-11-20 10:34:52 +08:00
Wei_佳	24bf93f0b3	调整用户中心页面内容区域的顶部边距，并优化返回按钮的样式和定位。	2025-11-19 16:51:08 +08:00
Wei_佳	62354c9e23	feat: 新增用户中心估值记录、对公转账、发票管理和侧边栏组件，并重构用户中心页面。	2025-11-19 14:39:07 +08:00
Wei_佳	26701c25cf	refactor: 使用自定义useAppDark替代vueuse的useDark 将ThemeMode组件和app store中的useDark替换为自定义的useAppDark composable,统一暗色模式管理逻辑 (cherry picked from commit 2ec91a6085a7df2432bbe2d242daa2d018c1c64c)	2025-11-18 15:39:34 +08:00
Wei_佳	0eff495f75	feat: 添加返回导航功能 - 个人中心页面添加返回首页按钮 - 抬头管理添加页面添加返回按钮 - 优化页面导航流程，提升用户体验	2025-11-17 18:46:13 +08:00
Wei_佳	ee580ff22c	feat: 完成客户端个人中心和抬头管理功能 - 新增首页，登录后跳转到首页 - 新增个人中心页面，包含估值记录、对公转账、抬头管理三个模块 - 新增抬头管理添加页面，支持添加发票抬头信息 - 优化登录流程，添加短信验证码输入框 - 统一使用系统配色方案和设计风格 - 对公转账定价设置为6000元/次	2025-11-17 18:38:16 +08:00
Wei_佳	bde761864b	feat: 添加独立首页路由，优化登录后跳转逻辑 - 新增/home路由指向独立首页组件 - 将根路径重定向从/pages改为/home - 更新登录成功后默认跳转路径为/home - 设置首页路由为隐藏状态，不在菜单中显示	2025-11-17 18:15:02 +08:00
Wei_佳	2ce82f3401	feat: 添加短信验证码登录功能，优化登录页面交互体验 - 新增验证码输入框和发送验证码按钮，支持60秒倒计时 - 添加手机号格式验证（11位，1开头） - 新增sendVerifyCode和loginWithVerifyCode API接口（待后端实现） - 优化登录流程，添加完整的表单验证和错误提示 - 调整登录容器高度以适应新增的验证码输入区域 - 添加组件卸载时的定时器清理逻辑 - 保留原有登录逻辑作为临时方案，	2025-11-17 18:13:33 +08:00