箱分布统计加粗加红

src/views/kaihe/containerNews/boxDistributionStatistics/index.vue

@@ -2,7 +2,7 @@
   <div class="app-container">
     <table class="altrowstable">
       <tr>
-        <th rowspan="2">港口</th>
+        <th rowspan="2" @click="getList">港口</th>
         <th rowspan="2">堆场</th>
         <th></th>
         <th colspan="5">20</th>
@@ -29,19 +29,19 @@
         <td :rowspan="item.number" v-if="item.haven !== false">{{item.haven}}</td>
         <td :rowspan="item.numberSize" v-if="item.address !== false">{{item.address}}</td>
         <td>{{item.opcTnStatus}}</td>
-        <td>{{item.twentygp}}</td>
-        <td>{{item.twentyrf}}</td>
-        <td>{{item.twentyot}}</td>
-        <td>{{item.twentyfr}}</td>
-        <td>{{item.twentytk}}</td>
-        <td>{{item.fortygp}}</td>
-        <td>{{item.fortyhc}}</td>
-        <td>{{item.fortyhr}}</td>
-        <td>{{item.fortyot}}</td>
-        <td>{{item.fortyfr}}</td>
-        <td>{{item.fortytk}}</td>
-        <td>{{item.unit}}</td>
-        <td>{{item.teu}}</td>
+        <td :style="{color:item.twentygp != 0?'red':'#000',fontWeight:item.twentygp != 0?'900':'100'}">{{item.twentygp}}</td>
+        <td :style="{color:item.twentyrf != 0?'red':'#000',fontWeight:item.twentyrf != 0?'900':'100'}">{{item.twentyrf}}</td>
+        <td :style="{color:item.twentyot != 0?'red':'#000',fontWeight:item.twentyot != 0?'900':'100'}">{{item.twentyot}}</td>
+        <td :style="{color:item.twentyfr != 0?'red':'#000',fontWeight:item.twentyfr != 0?'900':'100'}">{{item.twentyfr}}</td>
+        <td :style="{color:item.twentytk != 0?'red':'#000',fontWeight:item.twentytk != 0?'900':'100'}">{{item.twentytk}}</td>
+        <td :style="{color:item.fortygp != 0?'red':'#000',fontWeight:item.fortygp != 0?'900':'100'}">{{item.fortygp}}</td>
+        <td :style="{color:item.fortyhc != 0?'red':'#000',fontWeight:item.fortyhc != 0?'900':'100'}">{{item.fortyhc}}</td>
+        <td :style="{color:item.fortyhr != 0?'red':'#000',fontWeight:item.fortyhr != 0?'900':'100'}">{{item.fortyhr}}</td>
+        <td :style="{color:item.fortyot != 0?'red':'#000',fontWeight:item.fortyot != 0?'900':'100'}">{{item.fortyot}}</td>
+        <td :style="{color:item.fortyfr != 0?'red':'#000',fontWeight:item.fortyfr != 0?'900':'100'}">{{item.fortyfr}}</td>
+        <td :style="{color:item.fortytk != 0?'red':'#000',fontWeight:item.fortytk != 0?'900':'100'}">{{item.fortytk}}</td>
+        <td :style="{color:item.unit != 0?'red':'#000',fontWeight:item.unit != 0?'900':'100'}">{{item.unit}}</td>
+        <td :style="{color:item.teu != 0?'red':'#000',fontWeight:item.teu != 0?'900':'100'}">{{item.teu}}</td>
       </tr>
     </table>
   </div>