title 更新

src/views/sjfx/components/topContent.vue

@@ -7,17 +7,12 @@
         <p class="top03 ellipsis1">
           <span
             class="span01"
-            :class="gzqObj.Tbzt1 === 'up' ? 'upColor' : 'downColor'"
+            :class="getColor(gzqObj.Tbzt1)"
           >{{ gzqObj.Tb1 ? gzqObj.Tb1 : '0.00%' }}</span>
           <img
-            src="../images/up@2x.png"
+            :src="getImgUrl(gzqObj.Tbzt1)"
             class="img01"
-            v-if="gzqObj.Tbzt1 === 'up'"
-          />
-          <img
-            src="../images/down@2x.png"
-            class="img01"
-            v-else
+            v-if="gzqObj.Tbzt1 !== 'like'"
           />
           <span class="span02">同比去年</span>
         </p>
@@ -36,17 +31,12 @@
         <p class="top03 ellipsis1">
           <span
             class="span01"
-            :class="tyqObj.Tbzt2 === 'up' ? 'upColor' : 'downColor'"
+            :class="getColor(tyqObj.Tbzt2)"
           >{{ tyqObj.Tb2 ? tyqObj.Tb2 : '0.00%' }}</span>
           <img
-            src="../images/up@2x.png"
+            :src="getImgUrl(tyqObj.Tbzt2)"
             class="img01"
-            v-if="tyqObj.Tbzt2 === 'up'"
-          />
-          <img
-            src="../images/down@2x.png"
-            class="img01"
-            v-else
+            v-if="tyqObj.Tbzt2 !== 'like'"
           />
           <span class="span02">同比去年</span>
         </p>
@@ -65,19 +55,14 @@
         <p class="top03 ellipsis1">
           <span
             class="span01"
-            :class="zqObj.Tbzt3 === 'up' ? 'upColor' : 'downColor'"
+            :class="getColor(zqObj.Tbzt3)"
           >
             {{ zqObj.Tb3 ? zqObj.Tb3 : '0.00%' }}
           </span>
           <img
-            src="../images/up@2x.png"
-            class="img01"
-            v-if="zqObj.Tbzt3 === 'up'"
-          />
-          <img
-            src="../images/down@2x.png"
+            :src="getImgUrl(zqObj.Tbzt3)"
             class="img01"
-            v-else
+            v-if="zqObj.Tbzt3 !== 'like'"
           />
           <span class="span02">同比去年</span>
         </p>
@@ -96,17 +81,12 @@
         <p class="top03 ellipsis1">
           <span
             class="span01"
-            :class="jsryObj.Tbzt4 === 'up' ? 'upColor' : 'downColor'"
+            :class="getColor(jsryObj.Tbzt4)"
           >{{ jsryObj.Tb4 ? jsryObj.Tb4 : '0.00%' }}</span>
           <img
-            src="../images/up@2x.png"
+            :src="getImgUrl(jsryObj.Tbzt4)"
             class="img01"
-            v-if="jsryObj.Tbzt4 === 'up'"
-          />
-          <img
-            src="../images/down@2x.png"
-            class="img01"
-            v-else
+            v-if="jsryObj.Tbzt4 !== 'like'"
           />
           <span class="span02">同比去年</span>
         </p>
@@ -148,6 +128,36 @@ export default {
         }
       });
     },
+    getColor(flag) {
+      let color = "";
+      switch (flag) {
+        case "up":
+          color = "upColor";
+          break;
+        case "down":
+          color = "downColor";
+          break;
+        case "like":
+          color = "likeColor";
+          break;
+        default:
+          color = "likeColor";
+          break;
+      }
+      return color;
+    },
+    getImgUrl(flag) {
+      let imgUrl = "";
+      switch (flag) {
+        case "up":
+          imgUrl = require("../images/up@2x.png");
+          break;
+        case "down":
+          imgUrl = require("../images/down@2x.png");
+          break;
+      }
+      return imgUrl;
+    },
   },
 };
 </script>

src/views/sjfx/style/sjfxStyle.scss

@@ -65,16 +65,21 @@
             color: #30BE1A;
           }
 
+          .likeColor {
+            color: #242424;
+          }
+
           .span02 {
             font-size: 12px;
             color: #8B8B8B;
             font-weight: 400;
+            margin-left: 4px;
           }
 
           .img01 {
             width: 13px;
             height: 13px;
-            margin: -3px 4px 0 1px;
+            margin: -3px 0 0 1px;
           }
         }
       }