西海岸：应用详情：增加 审批通过可以查看马赛克内容 逻辑

front/src/views/detailsAll/components/Application/ApplicationAbilityTrial.vue

@@ -13,7 +13,11 @@
         <p>{{ dataFrom.linkName }}</p>
         <a-tooltip>
           <template #title>请申请后查看</template>
-          <p style="cursor: pointer; filter: blur(4px)">
+          <!-- <p style="cursor: pointer; filter: blur(4px)">
+            {{ dataFrom.link }}
+          </p> -->
+          <p style="cursor: pointer;"
+            :class="{ 'blur-word': approveStatus == '通过' && whoShow1.itShowXiHaiAn ? false : true}">
             {{ dataFrom.link }}
           </p>
         </a-tooltip>
@@ -22,12 +26,11 @@
         <p>{{ dataFrom.numberName }}</p>
         <a-tooltip>
           <template #title>请申请后查看</template>
-          <p style="filter: blur(4px)">{{ dataFrom.number }}</p>
+          <!-- <p style="filter: blur(4px)">{{ dataFrom.number }}</p> -->
+          <p :class="{ 'blur-word': approveStatus == '通过' && whoShow1.itShowXiHaiAn ? false : true}">{{ dataFrom.number
+          }}</p>
         </a-tooltip>
-        <div
+        <div @click="copyFunction(dataFrom.number, '复制账号')" v-if="dataFrom.number != '' && flag">
-          @click="copyFunction(dataFrom.number, '复制账号')"
-          v-if="dataFrom.number != '' && flag"
-        >
           复制账号
         </div>
         <!-- <div v-else id="zanwu">暂无</div> -->
@@ -37,11 +40,9 @@
         <a-tooltip>
           <template #title>请申请后查看</template>
           <p style="filter: blur(4px)">{{ dataFrom.password }}</p>
+          <p style="filter: blur(4px)" :class="{ 'blur-word': approveStatus == '通过' && whoShow1.itShowXiHaiAn ? false : true}">{{ dataFrom.password }}</p>
         </a-tooltip>
-        <div
+        <div @click="copyFunction(dataFrom.password2, '复制密码')" v-if="dataFrom.password2 != '' && flag">
-          @click="copyFunction(dataFrom.password2, '复制密码')"
-          v-if="dataFrom.password2 != '' && flag"
-        >
           复制密码
         </div>
         <!-- <div v-else id="zanwu">暂无</div> -->
@@ -68,8 +69,12 @@
   password: '**************************',
   password2: '',
 })
+console.log('props.dataList------------>', props.dataList);
+const approveStatus = ref('')
+
 if (props.dataList.infoList) {
-    let obj = props.dataList.approveStatus
+  let obj = props.dataList.approveStatus;
+  approveStatus.value = props.dataList.approveStatus
   if (obj !== '通过' && whoShow1.value.itShowQingDao) {
     flag.value = false
   }
@@ -120,6 +125,7 @@
   (val) => {
     if (val) {
       let obj = props.dataList.approveStatus
+      approveStatus.value = props.dataList.approveStatus
       if (obj !== '通过' && whoShow1.value.itShowQingDao) {
         flag.value = false
       }
@@ -144,6 +150,7 @@
   display: flex;
   flex-direction: column;
   align-items: center;
+
   .main {
     margin-top: 0.3rem;
     width: 13rem;
@@ -152,10 +159,12 @@
     display: grid;
     grid-template-columns: 33.33% 33.33% 33.33%;
     align-items: center;
+
     .main-left {
       border-right: 0.01rem #ffffff solid;
       padding-left: 0.7rem;
       padding-right: 1rem;
+
       &>p {
         overflow: hidden;
         text-overflow: ellipsis;
@@ -165,28 +174,34 @@
         -webkit-box-orient: vertical;
       }
     }
+
     .main-center {
       padding-left: 1rem;
       padding-right: 1rem;
     }
+
     .main-right {
       padding-right: 0.7rem;
     }
+
     &>div>p:first-child {
       font-size: 0.26rem;
       color: #ffffff;
       font-weight: bold;
     }
+
     &>div>p:nth-child(2) {
       font-size: 0.22rem;
       color: #ffffff;
       line-height: 0.34rem;
     }
+
     &>div:first-child>p:last-child {
       text-decoration: underline;
       word-wrap: break-word;
       word-break: normal;
     }
+
     &>div>div:last-child {
       height: 0.34rem;
       width: 1.1rem;
@@ -199,6 +214,7 @@
       line-height: 0.34rem;
     }
   }
+
   #zanwu {
     height: 0.34rem;
     width: 1.1rem;
@@ -207,6 +223,10 @@
     border: 0;
   }
 }
+
+.blur-word {
+  filter: blur(4px);
+}
 </style>
 <style>
 .custom-class {