合并代码

src/views/Profile.vue

@@ -43,6 +43,7 @@
         </div>
         <div class="user-info">
           <h2 class="username">{{ userInfo?.username }}</h2>
+          <p class="user-email">{{ userInfo?.email }}</p>
           
           <!-- 审核状态显示 -->
           <div class="audit-status">
@@ -91,7 +92,9 @@
             <el-input v-model="form.nickname" placeholder="请输入昵称" />
           </el-form-item>
           
-
+          <el-form-item label="邮箱" prop="email">
+            <el-input v-model="form.email" placeholder="请输入邮箱" />
+          </el-form-item>
           
           <el-form-item label="真实姓名" prop="realName">
             <el-input v-model="form.realName" placeholder="请输入真实姓名" />
@@ -358,7 +361,7 @@ const userInfo = ref({
   id: '',
   username: '',
   nickname: '',
-
+  email: '',
   phone: '',
   realName: '',
   idCard: '',
@@ -378,7 +381,7 @@ const userStats = ref({
 const form = reactive({
   username: '',
   nickname: '',
-
+  email: '',
   phone: '',
   realName: '',
   idCard: '',
@@ -414,7 +417,10 @@ const rules = {
     { required: true, message: '请输入用户名', trigger: 'blur' },
     { min: 3, max: 20, message: '用户名长度在 3 到 20 个字符', trigger: 'blur' }
   ],
-
+  email: [
+    { required: true, message: '请输入邮箱', trigger: 'blur' },
+    { type: 'email', message: '请输入正确的邮箱格式', trigger: 'blur' }
+  ],
   realName: [
     { required: true, message: '请输入真实姓名', trigger: 'blur' },
     { min: 2, max: 10, message: '真实姓名长度在 2 到 10 个字符', trigger: 'blur' }
@@ -937,7 +943,11 @@ onMounted(() => {
   font-weight: 600;
 }
 
-
+.user-email {
+  margin: 0 0 10px 0;
+  color: rgba(255, 255, 255, 0.8);
+  font-size: 14px;
+}
 
 .audit-status {
   margin-bottom: 20px;