From a4e06ccd3cd976fbe4eef99e188d42ec9f3ad054 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 08 Apr 2021 09:32:05 +0800
Subject: [PATCH] 样式修改

---
 src/views/healthcode/healthcode.vue |  199 ++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 163 insertions(+), 36 deletions(-)

diff --git a/src/views/healthcode/healthcode.vue b/src/views/healthcode/healthcode.vue
index 9803fcb..343e725 100644
--- a/src/views/healthcode/healthcode.vue
+++ b/src/views/healthcode/healthcode.vue
@@ -8,6 +8,8 @@
                :before-open="beforeOpen"
                v-model="form"
                ref="crud"
+               :row-style="rowStyle"
+               :search.sync="search"
                @row-update="rowUpdate"
                @row-save="rowSave"
                @row-del="rowDel"
@@ -18,15 +20,27 @@
                @size-change="sizeChange"
                @refresh-change="refreshChange"
                @on-load="onLoad">
-      <template slot="menuLeft">
-        <el-button type="danger"
-                   size="small"
-                   icon="el-icon-delete"
-                   plain
-                   v-if="true"
-                   @click="handleDelete">删 除
-        </el-button>
-      </template>
+        <template slot="menuLeft">
+          <el-button
+            v-bind:class="activeClass == 0 ? 'btn-color' : ''"
+            size="medium "
+            @click="getHealthcodeData(0)"
+            >本日
+          </el-button>
+          <el-button
+            v-bind:class="activeClass == 1 ? 'btn-color' : ''"
+            size="medium "
+            @click="getHealthcodeData(1)"
+            >本周
+          </el-button>
+          <el-button
+            v-bind:class="activeClass == 2 ? 'btn-color' : ''"
+            size="medium "
+            @click="getHealthcodeData(2)"
+            >本月
+          </el-button>
+        </template>
+
     </avue-crud>
   </basic-container>
 </template>
@@ -40,6 +54,7 @@
       return {
         form: {},
         query: {},
+        search:{},
         loading: true,
         page: {
           pageSize: 10,
@@ -48,12 +63,15 @@
         },
         selectionList: [],
         option: {
+          menu:false,
           height:'auto',
           calcHeight: 30,
+          border: false,
+          stripe:true,
           tip: false,
           searchShow: true,
           searchMenuSpan: 6,
-          border: true,
+          activeClass: 0,
           index: true,
           viewBtn: true,
           selection: true,
@@ -103,53 +121,87 @@
               ]
             },
             {
-              label: "行政区",
-              searchSpan: 4,
-              prop: "addvcd",
+              label: '省份',
+              prop: 'province',
               search: true,
-              type: "tree",
-              dicUrl: "/api/blade-jfpts/district/district/selectd",
+              searchSpan: 3,
+              type: 'select',
               props: {
-                label: "addvnm",
-                value: "addvcds"
-              }
+                label: 'name',
+                value: 'name'
+              },
+              cascaderItem: ['city', 'district'],
+              dicUrl: '/api/blade-system/region/select',
+              span: 6,
+            },
+            {
+              label: '地市',
+              prop: 'city',
+              type: 'select',
+              searchSpan: 3,
+              search: true,
+              props: {
+                label: 'name',
+                value: 'name'
+              },
+              dicUrl: '/api/blade-system/region/select?code={{key}}',
+              span: 6,
+            },
+            {
+              label: '区县',
+              searchSpan: 3,
+              search: true,
+              prop: 'district',
+              type: 'select',
+              props: {
+                label: 'name',
+                value: 'name'
+              },
+              dicUrl: '/api/blade-system/region/select?code={{key}}',
+              span: 6,
             },
             {
               label: "健康码颜色",
               search: true,
-              searchLabelWidth: 120,
+              searchLabelWidth:120,
               prop: "type",
-              searchSpan: 5,
-              width:110,
+              searchSpan: 4,
+              searchValue: this.getHealthcodeType(),
+              width:210,
               type: "select",
               dicData: [
                 {
                   label: "绿色",
-                  value: 1
+                  value: "1"
                 },
                 {
                   label: "黄色",
-                  value: 2
+                  value: "2"
                 },
                 {
                   label: "红色",
-                  value: 3
+                  value: "3"
                 }
               ],
             }
           ]
         },
-        data: []
+        data: [],
+        isActive: false,
+        recorder: null,
       };
+    },
+    mounted:{
+
     },
     computed: {
       ...mapGetters(["permission"]),
       permissionList() {
         return {
-          addBtn: this.vaildData(null, true),
-          viewBtn: this.vaildData(null, true),
-          delBtn: this.vaildData(null, true),
-          editBtn: this.vaildData(null, true)
+          addBtn: this.vaildData(null, false),
+          viewBtn: this.vaildData(null, false),
+          delBtn: this.vaildData(null, false),
+          editBtn: this.vaildData(null, false)
         };
       },
       ids() {
@@ -189,15 +241,83 @@
       refreshChange() {
         this.onLoad(this.page, this.query);
       },
+      rowStyle({row, column, rowIndex}){
+         if(row.type=="3"){
+           return {
+             color:"#fe1515"
+           }
+         }
+      },
+      getHealthcodeType(){
+          if (this.$route.query.type != undefined) {
+              var type = this.$route.query.type+"";
+              this.$route.query = {};
+              return type;
+          }
+      },
+      getHealthcodeData(e) {
+        var that = this;
+        that.activeClass = e;
+        //status 0:本日  1:本月  2:本年   type: 1:绿色   2:黄色  3:红色
+        var params = {
+          status: e
+        };
+        this.query = params;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+      },
       onLoad(page, params = {}) {
-        this.loading = true;
-        console.log("status="+this.$route.query.status);
-        params ={
-          status:this.$route.query.status,
-          type:this.$route.query.type
+        const { dateTime } = this.query;
+        let values = {
+          ...params,
+        };
+
+        if (this.$route.query.status!=undefined && this.$route.query != undefined && this.$route.query != null && this.$route.query != "" ) {
+            if (this.$route.query.type != undefined) {
+              this.activeClass = this.$route.query.status;
+              this.page.currentPage = 1;
+              params = {
+                status:this.$route.query.status,
+                type:this.$route.query.type
+              }
+            } else {
+              this.activeClass = 0;
+              this.page.currentPage = 1;
+              params = {
+                type:this.$route.query.status
+              };
+            }
+        }else if(this.$route.query.type != undefined){
+          params = {
+            type: this.$route.query.type,
+            begTime: this.$route.query.startTime,
+            endTime: this.$route.query.endTime
+          }
+        }else{
+            params = {
+                status:this.$route.query.status,
+                type:this.$route.query.type
+            }
+
         }
-        console.log("params="+params);
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+
+        if (dateTime) {
+          values = {
+            ...params,
+            begTime: dateTime[0],
+            endTime: dateTime[1],
+            ...this.query,
+          };
+          values.dateTime = null;
+        } else {
+          values = {
+            ...params,
+            ...this.query,
+          };
+        }
+
+        this.loading = true;
+        getList(page.currentPage, page.pageSize,values).then(res => {
           const data = res.data.data;
           this.page.total = data.total;
           this.data = data.records;
@@ -208,3 +328,10 @@
     }
   };
 </script>
+<style scoped>
+  .el-button.btn-color {
+    color: rgb(255, 255, 255);
+    background-color: rgb(64, 158, 255);
+    border-color: rgb(64, 158, 255);
+  }
+</style>

--
Gitblit v1.9.3