From d8cd4fe89aca32717e2ea1a183977554449ddf41 Mon Sep 17 00:00:00 2001
From: JayChou <xxx@gmail.com>
Date: Wed, 28 May 2025 19:37:21 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/registrationPersonage/index.vue  |   8 +-
 src/views/userInfo/components/reacList.vue |   3 +-
 src/views/userInfo/index.vue               | 103 ++++++++++++---------
 3 files changed, 65 insertions(+), 49 deletions(-)

diff --git a/src/views/registrationPersonage/index.vue b/src/views/registrationPersonage/index.vue
index 1494eee..b1051c4 100644
--- a/src/views/registrationPersonage/index.vue
+++ b/src/views/registrationPersonage/index.vue
@@ -594,7 +594,7 @@ getTopicListApi()*/
       // width: 780px;
       display: flex;
       flex-wrap: wrap;
-      justify-content: space-between;
+      // justify-content: space-between;
       row-gap: 32px;
 
       .head {
@@ -627,12 +627,12 @@ getTopicListApi()*/
           width: 377.333px;
         }
 
-        width: 176px;
+        width: 30%;
         height: 40px;
         display: flex;
         flex-direction: column;
-        justify-content: space-between;
-
+        // justify-content: space-between;
+        margin-left: 10px;
         .label {
           height: 22px;
           font-family:
diff --git a/src/views/userInfo/components/reacList.vue b/src/views/userInfo/components/reacList.vue
index 4c45edf..1d2cca4 100644
--- a/src/views/userInfo/components/reacList.vue
+++ b/src/views/userInfo/components/reacList.vue
@@ -51,7 +51,7 @@
 <!--            <el-tag v-else>已上传作品</el-tag>-->
 <!--          </template>-->
 <!--        </el-table-column>-->
-        <el-table-column label="操作" prop="fileName">
+        <el-table-column label="操作" prop="fileName" wdith="200">
           <template #default="{ row }">
             <div class="action-buttons">
             <el-button
@@ -342,6 +342,7 @@ const goAnswer = (code) => {
 <style scoped lang="scss">
 .action-buttons {
   display: flex;
+  flex-wrap: wrap;
   justify-content: space-between; /* 平均分布间距 */
   align-items: center;
 }
diff --git a/src/views/userInfo/index.vue b/src/views/userInfo/index.vue
index d435631..baa329c 100644
--- a/src/views/userInfo/index.vue
+++ b/src/views/userInfo/index.vue
@@ -19,7 +19,7 @@
                 </el-button>
               </div>
             </div>
-            <div class="info-box">
+            <div class="" style="margin: auto;">
               <div class="text">
                 <!-- <img style="width: 75px; height:75px ;" src="../../assets/images/item.png" alt="" srcset=""> -->
                 <el-image
@@ -31,34 +31,39 @@
                 />
               </div>
             </div>
-            <div class="info-box">
-              <div class="label">账号</div>
-              <div class="text">{{ useUserStore.userInfo.username }}</div>
-            </div>
-            <div class="info-box">
-              <div class="label">姓名</div>
-              <div class="text">{{ useUserStore.userInfo.realname }}</div>
-            </div>
-            
+            <div class="info-main">
+              <div class="info-box">
+                <div class="label">账号</div>
+                <div class="text">{{ useUserStore.userInfo.username }}</div>
+              </div>
+              <div class="info-box">
+                <div class="label">姓名</div>
+                <div class="text">{{ useUserStore.userInfo.realname }}</div>
+              </div>
 
-            <div class="info-box">
-              <div class="label">姓别</div>
-              <div class="text">
-                {{ useUserStore.userInfo.sex === 1 ? '男' : '女' }}
+              <div class="info-box">
+                <div class="label">姓别</div>
+                <div class="text">
+                  {{ useUserStore.userInfo.sex === 1 ? '男' : '女' }}
+                </div>
+              </div>
+              <div class="info-box">
+                <div class="label">生日</div>
+                <div class="text">{{ useUserStore.userInfo.birthday }}</div>
+              </div>
+              <div class="info-box">
+                <div class="label">学号</div>
+                <div class="text">{{ useUserStore.userInfo.workNo }}</div>
               </div>
-            </div>
-            <div class="info-box">
-              <div class="label">生日</div>
-              <div class="text">{{ useUserStore.userInfo.birthday }}</div>
-            </div>
-            <div class="info-box">
-              <div class="label">学号</div>
-              <div class="text">{{ useUserStore.userInfo.workNo }}</div>
-            </div>
 
-            <div class="info-box">
-              <div class="label">手机号</div>
-              <div class="text">{{ useUserStore.userInfo.phone }}</div>
+              <div class="info-box">
+                <div class="label">手机号</div>
+                <div class="text">{{ useUserStore.userInfo.phone }}</div>
+              </div>
+                <div class="info-box">
+              <div class="label">邮箱</div>
+              <div class="text">{{ useUserStore.userInfo.email }}</div>
+            </div>
             </div>
 
             <!-- <div class="info-box">
@@ -66,10 +71,7 @@
               <div class="text">国际教育学院</div>
             </div> -->
 
-            <div class="info-box">
-              <div class="label">邮箱</div>
-              <div class="text">{{ useUserStore.userInfo.email }}</div>
-            </div>
+          
           </div>
         </div>
         <!-- <div class="right">
@@ -96,7 +98,6 @@
     </el-card>
     <reacList />
     <awardeList />
-   
   </div>
   <el-dialog
     v-model="dialogVisible"
@@ -105,7 +106,13 @@
     width="90%"
     :before-close="handleClose"
   >
-    <el-form :model="form":rules="rules" ref="ruleFormRef" label-width="80" style="padding-right: 30px">
+    <el-form
+      :model="form"
+      :rules="rules"
+      ref="ruleFormRef"
+      label-width="80"
+      style="padding-right: 30px"
+    >
       <el-form-item label="头像">
         <el-upload
           v-model:file-list="fileList"
@@ -188,9 +195,9 @@ const rules = {
     { pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: 'blur' },
   ],
   email: [
-          // { required: true, message: '请输入邮箱', trigger: 'blur' },
-          { type: 'email', message: '请输入有效的邮箱地址', trigger: ['blur'] }
-        ],
+    // { required: true, message: '请输入邮箱', trigger: 'blur' },
+    { type: 'email', message: '请输入有效的邮箱地址', trigger: ['blur'] },
+  ],
 }
 // 修改用户信息
 const editUserInfo = () => {
@@ -220,7 +227,7 @@ const form = reactive({
   email: '',
   facultiesId: '',
   phone: '',
-  workNo:'',
+  workNo: '',
 })
 
 // 上传文件
@@ -252,7 +259,7 @@ const submit = async () => {
         facultiesId: form.facultiesId,
         phone: form.phone,
         avatar: avatar.value,
-        workNo: form.workNo
+        workNo: form.workNo,
       }
       for (const key in data) {
         if (data[key] === '') {
@@ -260,8 +267,8 @@ const submit = async () => {
         }
       }
       await editUserInfoApi(data).then((res: any) => {
-        console.log(res.code);
-        if(res.code != 200){
+        console.log(res.code)
+        if (res.code != 200) {
           return ElMessage.error(res.message)
         }
       })
@@ -343,7 +350,7 @@ const setImageUrl = (url: string) => {
   }
   .icon {
     position: absolute;
-    right: .5333rem;
+    right: 0.5333rem;
   }
 }
 .top {
@@ -413,6 +420,7 @@ const setImageUrl = (url: string) => {
 
       .right {
         .info-box {
+          margin-bottom: 10px;
           .name {
             height: 20px;
             font-family:
@@ -494,7 +502,7 @@ const setImageUrl = (url: string) => {
   .left {
     flex: 1;
     .personage-info {
-      margin: 30px 0 0 32px;
+      // margin: 30px 0 0 32px;
       // width: 780px;
       display: flex;
       flex-wrap: wrap;
@@ -523,17 +531,24 @@ const setImageUrl = (url: string) => {
           cursor: pointer;
         }
       }
-
+      .info-main{
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+      }
       .info-box {
         &.remark {
-          width: 377.333px;
+          // width: 377.333px;
         }
 
-        width: 165px;
+        width: 30%;
+
         height: 50px;
+        // padding: 0 20px;
         display: flex;
         flex-direction: column;
         justify-content: space-between;
+        margin-bottom: 10px;
 
         .label {
           height: 22px;