From c587fbdad6f75ba05e5440b41be144bd335703aa Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期四, 03 十二月 2020 17:16:29 +0800
Subject: [PATCH] 左侧目录树样式优化

---
 src/components/subComponents/CardItem.vue |   63 ++++++++++++++++++-------------
 1 files changed, 36 insertions(+), 27 deletions(-)

diff --git a/src/components/subComponents/CardItem.vue b/src/components/subComponents/CardItem.vue
index 9261c4e..a5d52f0 100644
--- a/src/components/subComponents/CardItem.vue
+++ b/src/components/subComponents/CardItem.vue
@@ -7,7 +7,7 @@
         <div class="card-img-box-compear">
           <div class="card-img-box-compear-left" ref="firstImg">
             <img
-              :src="'/httpImage/'+data.targetInfo[0].picSmUrl+'?width=160'"
+              :src="data.targetInfo[0].picSmUrl | httpImage"
               :id="'/compear/'+data.targetInfo[0].picSmUrl"
               class="cursor-pointer"
               @click="detailsClick($event)"
@@ -22,7 +22,7 @@
           >
             <el-carousel-item v-for="(item, index) in data.baseInfo" :key="index">
               <img
-                :src="'/httpImage/'+item.targetPicUrl+'?width=160'"
+                :src="item.targetPicUrl | httpImage"
                 class="cursor-pointer"
                 @click="detailsClick($event)"
               />
@@ -54,28 +54,24 @@
           @change="changeCarousel"
         >
           <el-carousel-item v-for="(item, index) in data.picMaxUrl" :key="index + 'img'">
-            <img
-              :src="'/httpImage/'+item+'?width=160'"
-              class="cursor-pointer"
-              @click="detailsClick($event)"
-            />
+            <img :src="item | httpImage" class="cursor-pointer" @click="detailsClick($event)" />
           </el-carousel-item>
         </el-carousel>
         <img
           v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''"
-          :src="'/httpImage/'+data.picMaxUrl[0]+'?width=160'"
+          :src="data.picMaxUrl[0] | httpImage"
           class="cursor-pointer"
           @click="detailsClick($event)"
         />
         <img
           v-else
-          :src="'/httpImage/'+data.targetInfo[0].picSmUrl+'?width=160'"
+          :src="data.targetInfo[0].picSmUrl | httpImage"
           class="cursor-pointer"
           @click="detailsClick($event)"
         />
       </div>
       <div class="s-card-left-box" v-else>
-        <img :src="'/httpImage/'+data.baseInfo[0].targetPicUrl+'?width=160'" class="cursor-pointer" />
+        <img :src="data.baseInfo[0] | httpImage" class="cursor-pointer" />
       </div>
     </div>
     <!-- 鍙充晶鏂囧瓧鍖哄煙 -->
@@ -133,7 +129,7 @@
               <span
                 class="fontStyle"
                 v-if="data.baseInfo[initialIndex].labels"
-              >/&nbsp;{{ data.baseInfo[initialIndex].labels.split("/")[1] }}</span>&nbsp;
+              >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard}}</span>&nbsp;
               <span
                 class="fontStyle"
                 v-if="data.baseInfo[initialIndex].monitorLevel"
@@ -159,7 +155,7 @@
               <span
                 class="fontStyle"
                 v-if="data.baseInfo[initialIndex].labels"
-              >/&nbsp;{{ data.baseInfo[initialIndex].labels.split("/")[1] }}</span>&nbsp;
+              >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard}}</span>&nbsp;
               <span
                 class="fontStyle"
                 v-if="data.baseInfo[initialIndex].monitorLevel"
@@ -205,7 +201,7 @@
           <span>{{ data.baseInfo[0].targetName }}</span>&nbsp;&nbsp;
           <span
             v-if="data.baseInfo[0].labels"
-          >/&nbsp;{{ data.baseInfo[0].labels.split("/")[1] }}</span>
+          >/&nbsp;{{ data.baseInfo[0].labels | idCard}}</span>
         </p>
       </div>
       <div class="card-icon-box">
@@ -358,15 +354,12 @@
           <div slot="content">
             <p v-for="(item,index) in data.baseInfo" :key="index+'base1'">
               <span class="fontStyle">{{item.tableName}}</span>&nbsp;
-              <span class="fontStyle" v-if="item.targetName !== ''">/&nbsp;{{item.targetName}}</span>&nbsp;
+              <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{item.targetName}}</span>&nbsp;
               <span
                 class="fontStyle"
-                v-if="item.labels !== '' && item.labels.split('/')[1] !== ''"
-              >/&nbsp;{{item.labels.split("/")[1]}}</span>&nbsp;
-              <span
-                class="fontStyle"
-                v-if="item.labels !== '' && item.labels.split('/')[0] !== ''"
-              >/&nbsp;{{item.labels.split("/")[0]}}</span>
+                v-if="item.labels.length"
+              >/&nbsp;{{item.labels | idCard}}</span>&nbsp;
+              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{item.labels | sex}}</span>
             </p>
           </div>
           <el-button
@@ -378,15 +371,12 @@
               :style="item.bwType == '1' ? 'color:red;font-size:12px;line-height:20px':'font-size:12px;line-height:20px'"
             >
               <span class="fontStyle">{{item.tableName}}</span>&nbsp;
-              <span class="fontStyle" v-if="item.targetName !== ''">/&nbsp;{{item.targetName}}</span>&nbsp;
+              <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{item.targetName}}</span>&nbsp;
               <span
                 class="fontStyle"
-                v-if="item.labels !== '' && item.labels.split('/')[1] !== ''"
-              >/&nbsp;{{item.labels.split("/")[1]}}</span>&nbsp;
-              <span
-                class="fontStyle"
-                v-if="item.labels !== '' && item.labels.split('/')[0] !== ''"
-              >/&nbsp;{{item.labels.split("/")[0]}}</span>
+                v-if="item.labels.length"
+              >/&nbsp;{{item.labels | idCard}}</span>&nbsp;
+              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{item.labels |sex }}</span>
             </span>
           </el-button>
         </el-tooltip>
@@ -525,6 +515,25 @@
     },
     percentage(score) {
       return score.toFixed(2) + "%"
+    },
+    idCard(v) {
+      try {
+        let obj = JSON.parse(v)
+        return obj.idCard
+      } catch (error) {
+        return v.split("/")[1]
+      }
+    },
+    sex(v) {
+      try {
+        let obj = JSON.parse(v)
+        return obj.sex
+      } catch (error) {
+        return v.split("/")[0]
+      }
+    },
+    httpImage(url) {
+      return '/httpImage/' + url + ((url.indexOf("?") >= 0) ? '&' : '?') + 'width=160'
     }
   },
   data() {

--
Gitblit v1.8.0