From f60b16409a2e7271f81401c2a70c4e00813596cd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cyansj=E2=80=9D?= <yansj@ydool.com>
Date: Thu, 19 Dec 2024 09:28:22 +0800
Subject: [PATCH] gx

---
 src/view/person/index.vue | 332 ++++++++++++++++++--------------------
 1 file changed, 158 insertions(+), 174 deletions(-)

diff --git a/src/view/person/index.vue b/src/view/person/index.vue
index 39a0b37..1a6b5be 100644
--- a/src/view/person/index.vue
+++ b/src/view/person/index.vue
@@ -74,37 +74,41 @@
             v-for="item in dataMyTag.myTag"
             :key="item"
             @click="item.show ? onClickTag(item) : ''"
-            :class="item.show ? 'my-tag-item_active' : ''"
-          >
+            :class="item.show ? 'my-tag-item_active' : ''">
             <p>
               {{ item.name }}
             </p>
           </div>
         </div>
       </div>
-      <div class="person-main">
-        <div
-          v-for="(item, index) in dataMyTag.myTag1"
-          class="main-tag-item"
-          :class="[
-            item.name == '身后事' && !isShs
-              ? 'main-tag-item2'
-              : 'main-tag-item',
-            item.name == tableType.title ? 'main-tag-item_active' : '',
-          ]"
-          @click="onClickTag2(item.name, item.label)"
-        >
-          <span v-if="item.name == '退休养老'"> 退休<br />养老</span>
-          <span v-else>{{ item.name }}</span>
-        </div>
-        <div class="person-main-person"></div>
+      <div class="person-content">
         <div class="back" @click="back()">
           <img src="@/assets/person/back.png" alt="" />
           <p>返回</p>
         </div>
-        <!-- v-if="dataMyTag.camera" -->
-        <div class="videoCamera" v-if="dataMyTag.camera" @click="openCamera()">
-          <img src="@/assets/images/sxt_detail.png" alt="" />
+        <div class="person-main">
+          <div
+            v-for="(item, index) in dataMyTag.myTag1"
+            :key="index"
+            class="main-tag-item"
+            :class="[
+              item.name == '身后事' && !isShs
+                ? 'main-tag-item2'
+                : 'main-tag-item',
+              item.name == tableType.title ? 'main-tag-item_active' : '',
+            ]"
+            @click="onClickTag2(item.name, item.label)">
+            <span v-if="item.name == '退休养老'"> 退休<br />养老</span>
+            <span v-else>{{ item.name }}</span>
+          </div>
+          <div class="person-main-person"></div>
+          <!-- v-if="dataMyTag.camera" -->
+          <div
+            class="videoCamera"
+            v-if="dataMyTag.camera"
+            @click="openCamera()">
+            <img src="@/assets/images/sxt_detail.png" alt="" />
+          </div>
         </div>
         <div class="main_table">
           <el-table
@@ -125,16 +129,14 @@
               height: '50px',
               backgroundColor: 'rgba(31, 63, 113, 1)',
               color: '#fff',
-            }"
-          >
+            }">
             <template v-for="item in tableMain.columns">
               <el-table-column
                 v-if="item.type == 'slot'"
                 :label="item.label"
                 :prop="item.property"
                 :width="item.width"
-                :align="item.align || 'left'"
-              >
+                :align="item.align || 'left'">
                 <template #default="scope">
                   <!-- 医疗保险类型 -->
                   <div v-if="item.property == 'xs'">
@@ -148,12 +150,12 @@
                 :width="item.width"
                 :prop="item.property"
                 :label="item.label"
-                :align="item.align || 'left'"
-              />
+                :align="item.align || 'left'" />
             </template>
           </el-table>
         </div>
       </div>
+
       <div class="person-side">
         <div v-if="dataMyTag.title == '医疗保险'">
           <div>
@@ -178,14 +180,12 @@
                   height: '50px',
                   backgroundColor: 'rgba(31, 63, 113, 1)',
                   color: '#fff',
-                }"
-              >
+                }">
                 <template v-for="item in tableType.columns">
                   <el-table-column
                     v-if="item.type == 'slot'"
                     :label="item.label"
-                    :prop="item.property"
-                  >
+                    :prop="item.property">
                     <template #default="scope">
                       <!-- 医疗保险类型 -->
                       <div v-if="item.property == 'ylbxlx'">
@@ -200,8 +200,7 @@
                     v-else
                     :width="item.width"
                     :prop="item.property"
-                    :label="item.label"
-                  />
+                    :label="item.label" />
                 </template>
               </el-table>
               <el-pagination
@@ -212,8 +211,7 @@
                 prev-text="上一页"
                 next-text="下一页"
                 v-model:current-page="pagination.current"
-                @current-change="handlePagination"
-              />
+                @current-change="handlePagination" />
             </div>
           </div>
           <div>
@@ -238,14 +236,12 @@
                   height: '50px',
                   backgroundColor: 'rgba(31, 63, 113, 1)',
                   color: '#fff',
-                }"
-              >
+                }">
                 <template v-for="item in dataMyTag.form.column">
                   <el-table-column
                     :width="item.width"
                     :prop="item.property"
-                    :label="item.label"
-                  />
+                    :label="item.label" />
                 </template>
               </el-table>
               <el-pagination
@@ -256,8 +252,7 @@
                 prev-text="上一页"
                 next-text="下一页"
                 v-model:current-page="zhpagination.current"
-                @current-change="handlePagination1"
-              />
+                @current-change="handlePagination1" />
             </div>
           </div>
           <div>
@@ -282,14 +277,12 @@
                   height: '50px',
                   backgroundColor: 'rgba(31, 63, 113, 1)',
                   color: '#fff',
-                }"
-              >
+                }">
                 <template v-for="item in dataMyTag.zfForm.column">
                   <el-table-column
                     :width="item.width"
                     :prop="item.property"
-                    :label="item.label"
-                  />
+                    :label="item.label" />
                 </template>
               </el-table>
               <el-pagination
@@ -300,8 +293,7 @@
                 prev-text="上一页"
                 next-text="下一页"
                 v-model:current-page="zfpagination.current"
-                @current-change="handlePagination2"
-              />
+                @current-change="handlePagination2" />
             </div>
           </div>
         </div>
@@ -327,14 +319,12 @@
                 height: '50px',
                 backgroundColor: 'rgba(31, 63, 113, 1)',
                 color: '#fff',
-              }"
-            >
+              }">
               <template v-for="item in tableType.columns">
                 <el-table-column
                   v-if="item.type == 'slot'"
                   :label="item.label"
-                  :prop="item.property"
-                >
+                  :prop="item.property">
                   <template #default="scope">
                     <!-- 医疗保险类型 -->
                     <div v-if="item.property == 'ylbxlx'">
@@ -357,8 +347,7 @@
                   v-else
                   :width="item.width"
                   :prop="item.property"
-                  :label="item.label"
-                />
+                  :label="item.label" />
               </template>
             </el-table>
             <el-pagination
@@ -369,8 +358,7 @@
               prev-text="上一页"
               next-text="下一页"
               v-model:current-page="pagination.current"
-              @current-change="handlePagination"
-            />
+              @current-change="handlePagination" />
           </div>
         </div>
         <div v-else>
@@ -380,8 +368,7 @@
           <div class="my-info">
             <div
               class="my-info-item"
-              v-if="dataMyTag.title == '学习' && baseInfo.eduPhase"
-            >
+              v-if="dataMyTag.title == '学习' && baseInfo.eduPhase">
               <div class="my-info-label" style="min-width: 40px">学历</div>
               <div class="my-info-content">
                 <p>{{ baseInfo.eduPhase || "" }}</p>
@@ -389,8 +376,7 @@
             </div>
             <div
               class="my-info-item"
-              v-if="dataMyTag.title == '婚育' && baseInfo.maritalStatus"
-            >
+              v-if="dataMyTag.title == '婚育' && baseInfo.maritalStatus">
               <div class="my-info-label">婚姻状况</div>
               <div class="my-info-content">
                 <p>{{ baseInfo.maritalStatus || "" }}</p>
@@ -399,14 +385,12 @@
             <div v-for="(item, index) in tableType.columns">
               <div
                 class="my-info-item"
-                v-if="rightList?.length != 0 && item.show == true"
-              >
+                v-if="rightList?.length != 0 && item.show == true">
                 <div
                   class="my-info-label"
                   :class="
                     item.label == '学校' || item.label == '班级' ? 'widu' : ''
-                  "
-                >
+                  ">
                   {{ item.label }}
                 </div>
                 <div class="my-info-content">
@@ -432,8 +416,7 @@
       :cameraShow="camerali.show"
       :hlsUriSsl="camerali.hlsUriSsl"
       :sxtnames="camerali.name"
-      @close="close1"
-    >
+      @close="close1">
     </DialogCamera>
   </div>
 </template>
@@ -1100,7 +1083,7 @@ const visitRecords = () => {
     });
 };
 //获取服务内容
-const getFw = async() => {
+const getFw = async () => {
   await http
     .get(
       `/api/ggfwyth/pg/fwjgqdxq?sfzhm=${routers.query.identNo}&xh=${routers.query.xh}`
@@ -1137,11 +1120,11 @@ const getFw = async() => {
         });
       }
     });
-    showFw.value = false;
+  showFw.value = false;
 };
 const showFw = ref(true);
 //获取服务内容(地图过来)
-const getFw2 = async(identNo) => {
+const getFw2 = async (identNo) => {
   await http.get(`/api/ggfwyth/ysyzt/fwxq?sfzhm=${identNo}`).then((res) => {
     if (res.code == 200) {
       // tableType.data = res.data;
@@ -1168,7 +1151,6 @@ const getFw2 = async(identNo) => {
           tableMain.data.push(obj);
         });
       }
-      
     } else {
       ElMessage.warning({
         message: res.message,
@@ -1228,7 +1210,6 @@ watch(
     jump.value = "map";
     getshs();
     getFw2(props.message.identNo);
-  
   }
 );
 onMounted(() => {
@@ -1243,7 +1224,6 @@ onMounted(() => {
     onClickTag2("出生", "出生");
     getshs();
     getFw();
-   
   } else {
     jump.value = "map";
   }
@@ -1308,119 +1288,123 @@ onMounted(() => {
       background: rgba(255, 255, 255, 0.2);
     }
   }
-
-  .person-main {
-    flex: content;
+  .person-content {
     position: relative;
-    height: 100%;
+    flex: auto;
+    min-width: 300px;
+    .person-main {
+      width: 100%;
+      height: 100%;
+      position: relative;
 
-    .main-tag-item {
-      background: url("../../assets/person/tag.png") no-repeat;
-      background-size: 100% 100%;
-      width: 100px;
-      height: 100px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      font-family: Microsoft YaHei;
-      font-weight: bold;
-      color: #ffffff;
-      position: absolute;
-      cursor: pointer;
-      z-index: 5;
+      .main-tag-item {
+        background: url("../../assets/person/tag.png") no-repeat;
+        background-size: 100% 100%;
+        width: 100px;
+        height: 100px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 20px;
+        font-family: Microsoft YaHei;
+        font-weight: bold;
+        color: #ffffff;
+        position: absolute;
+        cursor: pointer;
+        z-index: 5;
 
-      font-family: YouSheBiaoTiHei;
-      font-size: 20px;
+        font-family: YouSheBiaoTiHei;
+        font-size: 20px;
 
-      text-shadow: 0px 2px 4px rgba(28, 68, 63, 0.5);
-      text-align: left;
-      font-style: normal;
+        text-shadow: 0px 2px 4px rgba(28, 68, 63, 0.5);
+        text-align: left;
+        font-style: normal;
 
-      &:nth-of-type(1) {
-        top: 70px;
-        left: 70px;
+        &:nth-of-type(1) {
+          top: 70px;
+          left: 70px;
+        }
+
+        &:nth-of-type(2) {
+          top: 170px;
+          left: 170px;
+        }
+
+        &:nth-of-type(3) {
+          top: 270px;
+          left: 80px;
+        }
+
+        &:nth-of-type(4) {
+          top: 420px;
+          left: 110px;
+        }
+
+        &:nth-of-type(5) {
+          top: 70px;
+          right: 70px;
+        }
+
+        &:nth-of-type(6) {
+          top: 170px;
+          right: 170px;
+        }
+
+        &:nth-of-type(7) {
+          top: 420px;
+          right: 110px;
+        }
+
+        &:nth-of-type(8) {
+          top: 270px;
+          right: 80px;
+        }
+
+        // &:hover {
+        //   background: url("../../assets/person/tag-active.png") no-repeat;
+        //   background-size: 100% 100%;
+        //   color: #00fffc;
+        // }
       }
+      .main-tag-item2 {
+        background: url("../../assets/person/noshs.png") no-repeat;
+        background-size: 100% 100%;
+        width: 100px;
+        height: 100px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 20px;
+        font-family: Microsoft YaHei;
+        font-weight: bold;
+        color: #b3b3b3;
+        position: absolute;
+        cursor: pointer;
+        z-index: 5;
 
-      &:nth-of-type(2) {
-        top: 170px;
-        left: 170px;
-      }
-
-      &:nth-of-type(3) {
-        top: 270px;
-        left: 80px;
-      }
-
-      &:nth-of-type(4) {
-        top: 420px;
-        left: 110px;
-      }
-
-      &:nth-of-type(5) {
-        top: 70px;
-        right: 70px;
-      }
-
-      &:nth-of-type(6) {
-        top: 170px;
-        right: 170px;
-      }
-
-      &:nth-of-type(7) {
-        top: 420px;
-        right: 110px;
-      }
-
-      &:nth-of-type(8) {
+        text-shadow: 0px 2px 4px rgba(28, 68, 63, 0.5);
+        text-align: left;
+        font-style: normal;
         top: 270px;
         right: 80px;
       }
+      .main-tag-item_active {
+        background: url("../../assets/person/tag-active.png") no-repeat;
+        background-size: 100% 100%;
+        color: #00fffc;
+      }
 
-      // &:hover {
-      //   background: url("../../assets/person/tag-active.png") no-repeat;
-      //   background-size: 100% 100%;
-      //   color: #00fffc;
-      // }
-    }
-    .main-tag-item2 {
-      background: url("../../assets/person/noshs.png") no-repeat;
-      background-size: 100% 100%;
-      width: 100px;
-      height: 100px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      font-family: Microsoft YaHei;
-      font-weight: bold;
-      color: #b3b3b3;
-      position: absolute;
-      cursor: pointer;
-      z-index: 5;
-
-      text-shadow: 0px 2px 4px rgba(28, 68, 63, 0.5);
-      text-align: left;
-      font-style: normal;
-      top: 270px;
-      right: 80px;
-    }
-    .main-tag-item_active {
-      background: url("../../assets/person/tag-active.png") no-repeat;
-      background-size: 100% 100%;
-      color: #00fffc;
-    }
-
-    .person-main-person {
-      position: absolute;
-      top: 55%;
-      left: 50%;
-      transform: translate(-50%, -48%);
-      width: 340px;
-      height: 813px;
-      background: url("../../assets/person/person.png") no-repeat;
-      background-size: 100% 100%;
-      z-index: 3;
+      .person-main-person {
+        position: absolute;
+        top: 55%;
+        left: 50%;
+        transform: translate(-50%, -48%);
+        width: 340px;
+        height: 813px;
+        background: url("../../assets/person/person.png") no-repeat;
+        background-size: 100% 100%;
+        z-index: 3;
+      }
     }
     .main_table {
       box-sizing: border-box;
@@ -1428,7 +1412,7 @@ onMounted(() => {
       opacity: 0.85;
       z-index: 5;
       position: absolute;
-      bottom: -30px;
+      bottom: 56px;
       left: 90px;
       width: 600px;
       height: 250px;