From b9960d48954fbee6ebf72628720e84606c356998 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Wed, 24 Nov 2021 09:28:34 +0800
Subject: [PATCH] +状态颜色

---
 src/views/record/record.vue |  843 +++++++++++++++++++++++++++++--------------------------
 1 files changed, 448 insertions(+), 395 deletions(-)

diff --git a/src/views/record/record.vue b/src/views/record/record.vue
index 00cfb7c..a0cf008 100644
--- a/src/views/record/record.vue
+++ b/src/views/record/record.vue
@@ -1,48 +1,52 @@
 <template>
   <basic-container>
-    <avue-crud :option="option"
-               :table-loading="loading"
-               :data="data"
-               :page.sync="page"
-               :permission="permissionList"
-               :before-open="beforeOpen"
-               v-model="form"
-               ref="crud"
-               @row-update="rowUpdate"
-               @row-save="rowSave"
-               @row-del="rowDel"
-               @search-change="searchChange"
-               @search-reset="searchReset"
-               @selection-change="selectionChange"
-               @current-change="currentChange"
-               @size-change="sizeChange"
-               @refresh-change="refreshChange"
-               @on-load="onLoad">
+    <avue-crud
+      :option="option"
+      :table-loading="loading"
+      :data="data"
+      :page.sync="page"
+      :permission="permissionList"
+      :before-open="beforeOpen"
+      v-model="form"
+      ref="crud"
+      @row-update="rowUpdate"
+      @row-save="rowSave"
+      @row-del="rowDel"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @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="permission.record_delete"
-                   @click="handleDelete">删 除
+        <el-button
+          type="danger"
+          size="small"
+          icon="el-icon-delete"
+          plain
+          v-if="permission.record_delete"
+          @click="handleDelete"
+          >删 除
         </el-button>
       </template>
-      <template slot-scope="{type,size,row}"
-                slot="menu">
-        <el-button icon="icon-zhengjian"
-                   :size="size"
-                   :type="type"
-                   class="zhengJian-icon"
-                   @click.stop="handleCredentialsr(row)">附件上传</el-button>
+      <template slot-scope="{ type, size, row }" slot="menu">
+        <el-button
+          icon="icon-zhengjian"
+          :size="size"
+          :type="type"
+          class="zhengJian-icon"
+          @click.stop="handleCredentialsr(row)"
+          >附件上传</el-button
+        >
       </template>
       <template class="tdtype" slot-scope="{ row }" slot="type">
         <el-tag class="dtype">
-          {{
-            row.type == "0" ? "通过" : row.type == "1" ? "不通过":"待审核"
-          }}
-          <i class="gz" v-if="row.type == '0' "></i>
-          <i class="yj" v-if="row.type == '1' "></i>
-          <i class="zc" v-if="row.type == '2' "></i>
+          {{ row.type == "0" ? "通过" : row.type == "1" ? "不通过" : "待审核" }}
+          <i class="gz" v-if="row.type == '2'"></i>
+          <i class="yj" v-if="row.type == '1'"></i>
+          <i class="zc" v-if="row.type == '0'"></i>
         </el-tag>
       </template>
     </avue-crud>
@@ -50,423 +54,473 @@
 </template>
 
 <script>
-  import {getList, getDetail, add,addnw, update, remove} from "@/api/record/record";
-  import {mapGetters} from "vuex";
+import {
+  getList,
+  getDetail,
+  add,
+  addnw,
+  update,
+  remove,
+} from "@/api/record/record";
+import { mapGetters } from "vuex";
 
-  export default {
-    data() {
-      return {
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          labelWidth:130,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          headerAlign: 'center',
-          align: 'center',
-          column: [
-            {
-              label: "社会信用代码",
-              prop: "creditcode",
-              hide: true,
-              rules: [{
+export default {
+  data() {
+    return {
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0,
+      },
+      selectionList: [],
+      option: {
+        height: "auto",
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        labelWidth: 130,
+        border: true,
+        index: true,
+        viewBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        headerAlign: "center",
+        align: "center",
+        column: [
+          {
+            label: "社会信用代码",
+            prop: "creditcode",
+            hide: true,
+            rules: [
+              {
                 required: true,
                 message: "请输入统一社会信用代码",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "企业名称",
-              width: 180,
-              prop: "enterprisename",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "企业名称",
+            width: 180,
+            prop: "enterprisename",
+            rules: [
+              {
                 required: true,
                 message: "请输入企业名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "法定代表人",
-              prop: "representative",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "法定代表人",
+            prop: "representative",
+            rules: [
+              {
                 required: true,
                 message: "请输入法定代表人",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "注册资本(万元人民币)",
-              prop: "registeredcapital",
-              width:140,
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "注册资本(万元人民币)",
+            prop: "registeredcapital",
+            width: 140,
+            rules: [
+              {
                 required: true,
                 message: "请输入注册资本",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "成立日期",
-              prop: "establishtime",
-              type: "date",
-              format: "yyyy-MM-dd",
-              valueFormat: "yyyy-MM-dd",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "成立日期",
+            prop: "establishtime",
+            type: "date",
+            format: "yyyy-MM-dd",
+            valueFormat: "yyyy-MM-dd",
+            rules: [
+              {
                 required: true,
                 message: "请输入成立日期",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "组织机构代码",
-              prop: "organizationcode",
-              hide:true,
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "组织机构代码",
+            prop: "organizationcode",
+            hide: true,
+            rules: [
+              {
                 required: true,
                 message: "请输入组织机构代码",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "工商注册号",
-              hide:true,
-              prop: "registrationnumber",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "工商注册号",
+            hide: true,
+            prop: "registrationnumber",
+            rules: [
+              {
                 required: true,
                 message: "请输入工商注册号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "纳税人识别号",
-              addDisplay: false,
-              viewDisplay: false,
-              hide:true,
-              prop: "identificationnumber",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "纳税人识别号",
+            addDisplay: false,
+            viewDisplay: false,
+            hide: true,
+            prop: "identificationnumber",
+            rules: [
+              {
                 required: true,
                 message: "请输入纳税人识别号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "企业类型",
-              prop: "enterprises",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "企业类型",
+            prop: "enterprises",
+            rules: [
+              {
                 required: true,
                 message: "请输入企业类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "注册地址",
-              hide:true,
-              prop: "address",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "注册地址",
+            hide: true,
+            prop: "address",
+            rules: [
+              {
                 required: true,
                 message: "请输入注册地址",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属地区",
-              prop: "region",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "所属地区",
+            prop: "region",
+            rules: [
+              {
                 required: true,
                 message: "请输入所属地区",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "登记机关",
-              hide:true,
-              prop: "registration",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "登记机关",
+            hide: true,
+            prop: "registration",
+            rules: [
+              {
                 required: true,
                 message: "请输入登记机关",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属行业",
-              prop: "industry",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "所属行业",
+            prop: "industry",
+            rules: [
+              {
                 required: true,
                 message: "请输入所属行业",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属机构",
-              addDisplay: false,
-              prop: "deptid",
-              type: "select",
-              hide: true,
-              dicUrl: "/api/blade-system/dept/selectIn",
-              props: {
-                label: "deptname",
-                value: "deptid"
+                trigger: "blur",
               },
+            ],
+          },
+          {
+            label: "所属机构",
+            addDisplay: false,
+            prop: "deptid",
+            type: "select",
+            hide: true,
+            dicUrl: "/api/blade-system/dept/selectIn",
+            props: {
+              label: "deptname",
+              value: "deptid",
             },
+          },
 
-            {
-              label: "单位许可编号",
-              hide:true,
-              prop: "perid",
-              rules: [{
+          {
+            label: "单位许可编号",
+            hide: true,
+            prop: "perid",
+            rules: [
+              {
                 required: true,
                 message: "请输入服务单位许可编号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "许可发证机关",
-              prop: "offices",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "许可发证机关",
+            prop: "offices",
+            rules: [
+              {
                 required: true,
                 message: "请输入许可发证机关",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "发证时间",
-              prop: "officetime",
-              type: "date",
-              format: "yyyy-MM-dd HH:mm:ss",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              rules: [{
+                trigger: "blur",
+              },
+            ],
+          },
+          {
+            label: "发证时间",
+            prop: "officetime",
+            type: "date",
+            format: "yyyy-MM-dd HH:mm:ss",
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            rules: [
+              {
                 required: true,
                 message: "请输入发证时间",
-                trigger: "blur"
-              }]
-            },
+                trigger: "blur",
+              },
+            ],
+          },
 
-            {
-              label: "审核状态",
-              prop: "type",
-              addDisplay:false,
-              type: "select",
-              dicData: [
-                {
-                  label: "通过",
-                  value: '0'
-                },
-                {
-                  label: "不通过",
-                  value: '1'
-                },
-                {
-                  label: "待审核",
-                  value: '2'
-                }
-              ],
-            },
-            {
-              label: "经营范围",
-              prop: "business",
-              component: 'AvueUeditor',
-              hide: true,
-              minRows: 6,
-              span: 24,
-              rules: [{
+          {
+            label: "审核状态",
+            prop: "type",
+            addDisplay: false,
+            type: "select",
+            dicData: [
+              {
+                label: "通过",
+                value: "0",
+              },
+              {
+                label: "不通过",
+                value: "1",
+              },
+              {
+                label: "待审核",
+                value: "2",
+              },
+            ],
+          },
+          {
+            label: "经营范围",
+            prop: "business",
+            component: "AvueUeditor",
+            hide: true,
+            minRows: 6,
+            span: 24,
+            rules: [
+              {
                 required: true,
                 message: "请输入经营范围",
-                trigger: "blur"
-              }]
-            },
-          ]
-        },
-        data: []
+                trigger: "blur",
+              },
+            ],
+          },
+        ],
+      },
+      data: [],
+    };
+  },
+  computed: {
+    ...mapGetters(["permission", "userInfo"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.record_add, false),
+        viewBtn: this.vaildData(this.permission.record_view, false),
+        delBtn: this.vaildData(this.permission.record_delete, false),
+        editBtn: this.vaildData(this.permission.record_edit, false),
       };
     },
-    computed: {
-      ... mapGetters(["permission", "userInfo"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.record_add, false),
-          viewBtn: this.vaildData(this.permission.record_view, false),
-          delBtn: this.vaildData(this.permission.record_delete, false),
-          editBtn: this.vaildData(this.permission.record_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(",");
-      }
+    ids() {
+      let ids = [];
+      this.selectionList.forEach((ele) => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
     },
-    methods: {
-      handleCredentialsr(row) {
-        this.$router.push({
-          path: "/attach/index",
-          // redirect: { name: "foo" },
-          // query: { row: row },
-          query: {deptid: row.deptid, type: '1'},
-          // params: { row: row.identificationnumber },
-        });
-      },
-      rowSave(row, done, loading) {
-        row.deptid = this.userInfo.dept_id
-        add(row).then(() => {
+  },
+  methods: {
+    handleCredentialsr(row) {
+      this.$router.push({
+        path: "/attach/index",
+        // redirect: { name: "foo" },
+        // query: { row: row },
+        query: { deptid: row.deptid, type: "1" },
+        // params: { row: row.identificationnumber },
+      });
+    },
+    rowSave(row, done, loading) {
+      row.deptid = this.userInfo.dept_id;
+      add(row).then(
+        () => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
-            message: "操作成功!"
+            message: "操作成功!",
           });
           done();
-        }, error => {
+        },
+        (error) => {
           loading();
           window.console.log(error);
-        });
-        // addnw(row).then(() => {
-        //   this.onLoad(this.page);
-        //   this.$message({
-        //     type: "success",
-        //     message: "操作成功!"
-        //   });
-        //   done();
-        // }, error => {
-        //   loading();
-        //   window.console.log(error);
-        // });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+        }
+      );
+      // addnw(row).then(() => {
+      //   this.onLoad(this.page);
+      //   this.$message({
+      //     type: "success",
+      //     message: "操作成功!"
+      //   });
+      //   done();
+      // }, error => {
+      //   loading();
+      //   window.console.log(error);
+      // });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(
+        () => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
-            message: "操作成功!"
+            message: "操作成功!",
           });
           done();
-        }, error => {
+        },
+        (error) => {
           loading();
           console.log(error);
-        });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
         }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
+      );
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          return remove(row.id);
         })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
+        .then(() => {
+          this.onLoad(this.page);
+          this.$message({
+            type: "success",
+            message: "操作成功!",
           });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
         });
-      },
-      rowStyle({row, column, rowIndex}) {
-        if (row.dtype != null && row.dtype != "") {
-          if (row.dtype == '2') {
-            return {
-              color: "#F34A4A"
-            };
-          }
-          if(row.dtype=='1'){
-            return {
-              color: "#F48F57"
-            };
-          }
-
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
+          this.onLoad(this.page);
+          this.$message({
+            type: "success",
+            message: "操作成功!",
+          });
+          this.$refs.crud.toggleSelection();
+        });
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then((res) => {
+          this.form = res.data.data;
+        });
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      getList(
+        page.currentPage,
+        page.pageSize,
+        Object.assign(params, this.query)
+      ).then((res) => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
+    },
+    rowStyle({ row, column, rowIndex }) {
+      if (row.dtype != null && row.dtype != "") {
+        if (row.dtype == "2") {
+          return {
+            color: "#F34A4A",
+          };
+        }
+        if (row.dtype == "1") {
+          return {
+            color: "#F48F57",
+          };
         }
       }
-    }
-  };
+    },
+  },
+};
 </script>
 
 <style scoped>
-.dtype{
+.dtype {
   width: 80px;
 }
 
-.dx{
+.dx {
   position: absolute;
   top: 50%;
   margin-top: -5px;
@@ -474,9 +528,9 @@
   width: 10px;
   height: 10px;
   border-radius: 30%;
-  background: #DFDFDF;
+  background: #dfdfdf;
 }
-.zc{
+.zc {
   position: absolute;
   top: 50%;
   margin-top: -5px;
@@ -484,9 +538,9 @@
   width: 10px;
   height: 10px;
   border-radius: 30%;
-  background: #29C093;
+  background: #29c093;
 }
-.yj{
+.yj {
   position: absolute;
   top: 50%;
   margin-top: -5px;
@@ -494,9 +548,9 @@
   width: 10px;
   height: 10px;
   border-radius: 30%;
-  background: #F34A4A;
+  background: #f34a4a;
 }
-.gz{
+.gz {
   position: absolute;
   top: 50%;
   margin-top: -5px;
@@ -504,13 +558,12 @@
   width: 10px;
   height: 10px;
   border-radius: 30%;
-  background: #F48F57;
+  background: #f48f57;
 }
 
-.el-tag{
+.el-tag {
   display: inline-block;
   width: 80px;
   /*padding-right: 40px !important;*/
-
 }
 </style>

--
Gitblit v1.9.3