From 9efb4e77cf44f0adaf677662c6779b45954a0a2b Mon Sep 17 00:00:00 2001
From: 付延余 <f-yanyu@outlook.com>
Date: 星期五, 22 四月 2022 16:20:04 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 src/pages/components/jiuyeQingkuang/chengzhenXinzengJiuye.vue |  221 +++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 182 insertions(+), 39 deletions(-)

diff --git a/src/pages/components/jiuyeQingkuang/chengzhenXinzengJiuye.vue b/src/pages/components/jiuyeQingkuang/chengzhenXinzengJiuye.vue
index a7853e9..69634c8 100644
--- a/src/pages/components/jiuyeQingkuang/chengzhenXinzengJiuye.vue
+++ b/src/pages/components/jiuyeQingkuang/chengzhenXinzengJiuye.vue
@@ -6,107 +6,215 @@
         :header-cell-style="handleheader"
         style="width: 100%">
         <el-table-column
-          prop="shiqu"
+          prop="area"
           label="鍘匡紙甯傘�佸尯锛�"
           align="center"
           width="220">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <div class="cell-content-box">{{scope.row.area}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="january"
           label="1鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <div class="cell-content-box">{{scope.row.january.val}}</div>
+              <div class="paiming-box red-sanjiao"
+                   :class="scope.row.january.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.january.order != 0">
+                <div>{{scope.row.january.order}}</div>
+              </div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="february"
           label="2鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <div>{{scope.row.february.val}}</div>
+              <div class="paiming-box"
+                   :class="scope.row.february.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.february.order != 0">
+                <div>{{scope.row.february.order}}</div>
+              </div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="march"
           label="3鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <div>{{scope.row.march.val}}</div>
+              <div class="paiming-box"
+                   :class="scope.row.march.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.march.order != 0">{{scope.row.march.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="april"
           label="4鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.april.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.april.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.april.order != 0">{{scope.row.april.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="may"
           label="5鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.may.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.may.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.may.order != 0">{{scope.row.may.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="june"
           label="6鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.june.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.june.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.june.order != 0">{{scope.row.june.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="july"
           label="7鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.july.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.july.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.july.order != 0">{{scope.row.july.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="august"
           label="8鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.august.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.august.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.august.order != 0">{{scope.row.august.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="september"
           label="9鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.september.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.september.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.september.order != 0">{{scope.row.september.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="october"
           label="10鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.october.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.october.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.october.order != 0">{{scope.row.october.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="name"
+          width="280"
+          prop="november"
           label="11鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.november.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.november.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.november.order != 0">{{scope.row.november.order}}</div>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="address"
+          width="280"
+          prop="december"
           label="12鏈�"
           align="center">
+          <template slot-scope="scope">
+            <div class="sanjiao-box">
+              <span>{{scope.row.december.val}}</span>
+              <div class="paiming-box"
+                   :class="scope.row.december.order > 0 ? 'red-sanjiao' : 'green-sanjiao'"
+                   v-if="scope.row.december.order != 0">{{scope.row.december.order}}</div>
+            </div>
+          </template>
         </el-table-column>
       </el-table>
     </div>
 </template>
 
 <script>
+
     export default {
         name: "chengzhenXinzengJiuye",
+        props: {
+            tableData: {
+                type: Array,
+                default: () => {
+                    return []
+                }
+            }
+        },
         data() {
             return {
-                tableData: [{
-                    shiqu:'鍏ㄥ競',
-                    date: '233322',
-                    name: '4432',
-                    address: '122'
-                }, {
-                    shiqu:'闀垮畨鍖�',
-                    date: '23322',
-                    name: '12222',
-                    address: '4445'
-                }, {
-                    shiqu:'妗ヨタ鍖�',
-                    date: '4432',
-                    name: '455',
-                    address: '5999'
-                }, {
-                    shiqu:'鏂板崕鍖�',
-                    date: '5632',
-                    name: '145',
-                    address: '624'
-                }]
+
             }
+        },
+        mounted() {
         },
         methods: {
             handleheader(data) {
                 return {
-                    lineHeight: '0',
+                    lineHeight: '2.5',
                 }
             }
         }
@@ -122,7 +230,6 @@
       background-color:$color-blue;
     }
     .el-table .el-table__body-wrapper tr{
-      height: 0.25rem  /* 64/256 */;
     }
     .el-table tr:nth-child(odd){
       background-color: #CEF2FF;
@@ -143,7 +250,9 @@
       font-size: $fontSize-28;
       color: $color-darkGrey;
       font-weight: 300;
-      line-height: 1;
+      line-height: 0.265625rem  /* 68/256 */;
+      height: 0.265625rem  /* 68/256 */;
+      padding-left: 0;
     }
     .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
       border-bottom:1Px solid $color-grey; /*no*/
@@ -151,8 +260,42 @@
     .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
       border-right:1Px solid $color-grey; /*no*/
     }
+    .el-table .el-table__cell{
+      padding:0;
+    }
   }
 </style>
-<style scoped>
-
+<style lang="scss" scoped>
+  @import "../../../assets/css/base";
+  .sanjiao-box{
+    line-height: 0.265625rem  /* 68/256 */;
+    position: relative;
+    .paiming-box{
+      display: block;
+      color: $color-white;
+      position: absolute;
+      width: 0;
+      height: 0;
+      top: 0;
+      left: 0;
+      div{
+        position: relative;
+        left: 0px;
+        top: -0.3125rem  /* -80/256 */;
+        color: #fff;
+        width: 0.1328125rem  /* 34/256 */;
+      }
+    }
+    .red-sanjiao{
+      border-top: 0.265625rem  /* 68/256 */ solid #FF0000;
+      border-right: 0.265625rem  /* 68/256 */ solid transparent;
+    }
+    .green-sanjiao{
+      border-top: 0.265625rem  /* 68/256 */ solid #3ABF21;
+      border-right: 0.265625rem  /* 68/256 */ solid transparent;
+    }
+    .content{
+      /*line-height: 0.265625rem  !* 68/256 *!;*/
+    }
+  }
 </style>

--
Gitblit v1.9.1