From b30f937a881fcdab016b9b026ab7a2c02a8d1c4c Mon Sep 17 00:00:00 2001
From: suyanyan <1321717064@qq.com>
Date: Tue, 8 Oct 2024 09:54:07 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A6=85=E9=81=93bug=E5=A4=84=E7=90=86938?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/violation/portrait/detail.vue   | 37 ++++++++++---------
 1 file changed, 20 insertions(+), 17 deletions(-)

diff --git a/SafeCampus.WEB/src/views/violation/portrait/detail.vue b/SafeCampus.WEB/src/views/violation/portrait/detail.vue
index 957fb53..2f8906e 100644
--- a/SafeCampus.WEB/src/views/violation/portrait/detail.vue
+++ b/SafeCampus.WEB/src/views/violation/portrait/detail.vue
@@ -6,7 +6,7 @@
       </div>
       <div class="topContent">
         <el-row>
-          <el-col :span="4" :offset="2">
+          <el-col :span="4" :offset="1">
             <div class="left">
               <el-image
                 class="avatar"
@@ -25,13 +25,13 @@
                 <Female class="gender GENDER_FEMALE" v-if="formData.gender == 'GENDER_FEMALE'"></Female>
               </span>
 
-              <span class="personId" :title="formData.personId">编号：{{ formData.personId }}</span>
+              <!-- <span class="personId" :title="formData.personId">编号：{{ formData.personId }}</span> -->
               <!-- <el-tag type="primary">学霸型</el-tag> -->
             </div></el-col
           >
-          <el-col :span="16">
+          <el-col :span="17">
             <div class="right">
-              <el-row>
+              <el-row :gutter="20">
                 <el-col :span="6">
                   <span v-if="formData.name"
                     >姓名拼音：{{ pinyin(formData.name, { toneType: "none", type: "array" }).flat().join(" ") }}</span
@@ -42,11 +42,7 @@
                 >
 
                 <el-col :span="6">
-                  <span
-                    :title="formData.personId"
-                    style="display: block; text-overflow: ellipsis; max-width: 100%; overflow: hidden; white-space: nowrap"
-                    >编号：{{ formData.personId }}</span
-                  ></el-col
+                  <span :title="formData.personId" class="ellipsis">编号：{{ formData.personId }}</span></el-col
                 >
 
                 <el-col :span="6"
@@ -57,20 +53,20 @@
                 >
 
                 <el-col :span="6"
-                  ><span>联系方式：{{ formData.phone }}</span>
+                  ><span :title="formData.phone" class="ellipsis">联系方式：{{ formData.phone }}</span>
                 </el-col>
 
                 <el-col :span="6"
-                  ><span>所属院系：{{ formData.depName }}</span>
+                  ><span :title="formData.depName" class="ellipsis">所属院系：{{ formData.depName }}</span>
                 </el-col>
                 <el-col :span="6"
-                  ><span>所属专业：{{ formData.majorName }}</span>
+                  ><span :title="formData.majorName" class="ellipsis">所属专业：{{ formData.majorName }}</span>
                 </el-col>
                 <el-col :span="6"
-                  ><span>所属班级：{{ formData.personSetName }}</span>
+                  ><span :title="formData.personSetName" class="ellipsis">所属班级：{{ formData.personSetName }}</span>
                 </el-col>
                 <el-col :span="6"
-                  ><span>寝室名称：{{ formData.dormitoryName }}</span>
+                  ><span :title="formData.dormitoryName" class="ellipsis">寝室名称：{{ formData.dormitoryName }}</span>
                 </el-col>
               </el-row>
             </div></el-col
@@ -631,13 +627,13 @@ onMounted(() => {
           }
         }
         .personId {
+          display: block;
+          max-width: 90%;
           margin-bottom: 10px;
+          overflow: hidden;
           font-size: 14px;
-          display: block;
           text-overflow: ellipsis;
-          overflow: hidden;
           white-space: nowrap;
-          max-width: 90%;
         }
       }
       .right {
@@ -647,6 +643,13 @@ onMounted(() => {
           .el-col {
             height: 50px;
             line-height: 50px;
+            .ellipsis {
+              display: block;
+              max-width: 100%;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+            }
           }
         }
       }