Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/jczz_web

shuishen

2024-01-16 3e5ffb4c27ae30046bdaa4793ff623a67c407e17

Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/jczz_web

 package-lock.json

@@ -25,6 +25,7 @@
        "script-loader": "^0.7.2",
        "vue": "^2.6.10",
        "vue-axios": "^2.1.2",
        "vue-cron": "^1.0.9",
        "vue-i18n": "^8.7.0",
        "vue-router": "^3.0.1",
        "vuex": "^3.1.1"
@@ -15587,6 +15588,17 @@
        "vue": ">= 1.0.0"
      }
    },
    "node_modules/vue-cron": {
      "version": "1.0.9",
      "resolved": "https://registry.npmjs.org/vue-cron/-/vue-cron-1.0.9.tgz",
      "integrity": "sha512-r8JnAjqpDsDj3a545156m7bca1xkrnIktks+N94KQA80OuKAiqhoz3Cq1JCyO+0ONXAOnLwvkjHiVCfL38XNbA==",
      "dependencies": {
        "babel-polyfill": "^6.26.0",
        "babel-runtime": "^6.26.0",
        "element-ui": "^2.0.7",
        "vue": "^2.5.9"
      }
    },
    "node_modules/vue-eslint-parser": {
      "version": "2.0.3",
      "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz",
@@ -29741,6 +29753,17 @@
      "integrity": "sha512-th5xVbInVoyIoe+qY+9GCflEVezxAvztD4xpFF39SRQYqpoKD2qkmX8yv08jJG9a2SgNOCjirjJGSwg/wTrbmA==",
      "requires": {}
    },
    "vue-cron": {
      "version": "1.0.9",
      "resolved": "https://registry.npmjs.org/vue-cron/-/vue-cron-1.0.9.tgz",
      "integrity": "sha512-r8JnAjqpDsDj3a545156m7bca1xkrnIktks+N94KQA80OuKAiqhoz3Cq1JCyO+0ONXAOnLwvkjHiVCfL38XNbA==",
      "requires": {
        "babel-polyfill": "^6.26.0",
        "babel-runtime": "^6.26.0",
        "element-ui": "^2.0.7",
        "vue": "^2.5.9"
      }
    },
    "vue-eslint-parser": {
      "version": "2.0.3",
      "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz",

 package.json

@@ -28,6 +28,7 @@
    "script-loader": "^0.7.2",
    "vue": "^2.6.10",
    "vue-axios": "^2.1.2",
    "vue-cron": "^1.0.9",
    "vue-i18n": "^8.7.0",
    "vue-router": "^3.0.1",
    "vuex": "^3.1.1"

 sh.exe.stackdump

New file
@@ -0,0 +1,11 @@
Stack trace:
Frame        Function    Args
000FFFFB540  00180064365 (00180275F10, 00180266FD1, 000FFFFCA60, 000FFFFBA20)
000FFFFBA70  001800499D2 (00100002000, 0018034EB10, 00000000001, 00000000150)
000FFFFCA80  00180049A11 (00000000001, 0018034EE20, 000FFFFCA60, 00000000008)
000FFFFCB10  0018005CFCD (00000000000, 000FFFFCC40, 001800DC3EF, 00000000000)
000FFFFCBF0  0018005D12B (000FFFFCDF0, 00000000000, FFFFFFFFFFFFFFD7, 00000000000)
000FFFFCCE0  0018004A1A8 (00000000000, 00000000000, 00000000000, 00000000000)
000FFFFCDA0  00180048A2A (00000000000, 00000000000, 00000000000, 00000000000)
000FFFFCE50  00180048AEC (00000000000, 00000000000, 00000000000, 00000000000)
End of stack trace

 src/api/subjectChoices/subjectChoices.js

New file
@@ -0,0 +1,49 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-subjectChoices/subjectChoices/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/blade-subjectChoices/subjectChoices/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/blade-subjectChoices/subjectChoices/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/blade-subjectChoices/subjectChoices/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/blade-subjectChoices/subjectChoices/submit',
    method: 'post',
    data: row
  })
}

 src/api/subjectOption/subjectOption.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-subjectOption/subjectOption/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/blade-subjectOption/subjectOption/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/blade-subjectOption/subjectOption/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/blade-subjectOption/subjectOption/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/blade-subjectOption/subjectOption/submit',
    method: 'post',
    data: row
  })
}


 src/api/userHouse/list/houseHold.js

@@ -12,7 +12,19 @@
  })
}

export const getAllHouseHold = ( params) => {
export const getKeynotePersonnelPage = (current, size, params) => {
  return request({
    url: '/api/blade-household/household/getKeynotePersonnelPage',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getAllHouseHold = (params) => {
  return request({
    url: '/api/blade-household/household/getAllHouseHold',
    method: 'get',
@@ -88,4 +100,4 @@
      type
    }
  })
}
}

 src/api/userHouse/list/userHouseList.js

@@ -88,7 +88,18 @@

export const statisticalLabels = (current, size, params) => {
  return request({
    url: '/api/blade-householdLabel/householdLabel/statisticalLabels',
    url: '/api/blade-householdLabel/householdLabel/getRegionStatisticalLabels',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}
export const getCommunityStatisticalLabels = (current, size, params) => {
  return request({
    url: '/api/blade-householdLabel/householdLabel/getCommunityStatisticalLabels',
    method: 'get',
    params: {
      ...params,

 src/views/article/components/publicSignUpChild.vue

@@ -177,8 +177,9 @@
            if (item.avatar.length > 0) {
              item.avatar = website.minioUrl + item.avatar
            }
            if (item.signaturePath.length > 0) {
            if (item.signaturePath && item.signaturePath.length > 0) {
              item.signaturePath = website.minioUrl + item.signaturePath
              console.log("=====>", item.signaturePath)
            }
          })
          this.loading = false

 src/views/article/publicSignUp.vue

@@ -17,12 +17,12 @@
        <el-button icon="el-icon-user" :size="size" :type="type" @click.stop="openUserPopup(row)">
          参与用户
        </el-button>
        <el-button v-if="row.publish == '1'" icon="el-icon-close" :size="size" :type="type" @click.stop="updateFb(row)">
        <!-- <el-button v-if="row.publish == '1'" icon="el-icon-close" :size="size" :type="type" @click.stop="updateFb(row)">
          撤销
        </el-button>
        <el-button v-if="row.publish == '0'" icon="el-icon-check" :size="size" :type="type" @click.stop="updateFb(row)">
        </el-button> -->
        <!-- <el-button v-if="row.publish == '0'" icon="el-icon-check" :size="size" :type="type" @click.stop="updateFb(row)">
          发布
        </el-button>
        </el-button> -->
      </template>

      <template slot-scope="{ row, size }" slot="publish">
@@ -185,7 +185,7 @@
              searchSpan: 4,
              value: 3,
              slot: true,
              search: true,
              // search: true,
              type: "select",
              rules: [{
                required: true,
@@ -229,9 +229,10 @@
              label: "发布状态",
              prop: "publish",
              searchSpan: 4,
              value: "0",
              value: "1",
              slot: true,
              search: true,
              hide: true,
              // search: true,
              type: "select",
              rules: [{
                required: true,

 src/views/cGovernance/gridWorkLog.vue

@@ -28,7 +28,7 @@
import website from '@/config/website'

export default {
    data () {
    data() {
        return {
            form: {},
            query: {},
@@ -182,6 +182,23 @@
                        display: false,
                        prop: "gridName",
                    },
                    {
                        width: 144,
                        label: "走访时间",
                        prop: "workTime",
                        searchLabelWidth: 120,
                        type: "date",
                        row: true,
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                        rules: [
                            {
                                required: true,
                                message: "请输入走访时间",
                                trigger: "blur",
                            },
                        ],
                    },

                    {
                        overHidden: true,
@@ -189,6 +206,13 @@
                        prop: "context",
                        type: "textarea",
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: "请输入走访内容",
                                trigger: "blur",
                            },
                        ],
                    },

                    {
@@ -215,25 +239,10 @@
                        prop: "createUserName",
                    },

                    {
                        width: 144,
                        label: "走访时间",
                        prop: "workTime",
                        searchLabelWidth: 120,
                        type: "date",
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                        rules: [
                            {
                                required: true,
                                message: "请输入走访时间",
                                trigger: "blur",
                            },
                        ],
                    },


                    {
                        dispaly: false,
                        display: false,
                        width: 144,
                        label: "上报时间",
                        prop: "createTime",
@@ -257,7 +266,7 @@

    watch: {
        "form.householdId": {
            handler (val) {
            handler(val) {
                if (val) {

                    householdDetail(val).then(res => {
@@ -272,7 +281,7 @@
        },

        'form.personType': {
            handler (newData) {
            handler(newData) {
                let householdIdColumn = this.findObject(
                    this.option.column,
                    'householdId'
@@ -287,7 +296,7 @@
        },

        'form.type': {
            handler (newData) {
            handler(newData) {
                let householdIdColumn = this.findObject(
                    this.option.column,
                    'householdId'
@@ -311,7 +320,7 @@

    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
        permissionList() {
            return {
                addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
                viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
@@ -319,7 +328,7 @@
                editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
            }
        },
        ids () {
        ids() {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
@@ -327,7 +336,7 @@
            return ids.join(",")
        },

        showNamePhone () {
        showNamePhone() {
            return (data) => {
                if (data.phoneNumber && data.phoneNumber.trim() != '') {
                    return `${data.name}(${data.phoneNumber})`
@@ -338,18 +347,18 @@
        }
    },

    created () {
    created() {
        this.getUserList()
    },

    methods: {
        getUserList (param = '') {
        getUserList(param = '') {
            let dicUrl = `/api/blade-household/household/selectHouseholdList?labelId=${param}&searchKey={{key}}&limit=20`
            const column = this.findObject(this.option.column, "householdId")
            column.dicUrl = dicUrl
        },

        rowSave (row, done, loading) {
        rowSave(row, done, loading) {
            if (row.url.length > 0) {
                var urls = []
                var split = row.url.split(",")
@@ -374,7 +383,7 @@
                }
            )
        },
        rowUpdate (row, index, done, loading) {
        rowUpdate(row, index, done, loading) {
            if (row.url.length > 0) {
                var urls = []
                var split = row.url.split(",")
@@ -399,7 +408,7 @@
                }
            )
        },
        rowDel (row) {
        rowDel(row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
@@ -416,24 +425,24 @@
                    })
                })
        },
        searchReset () {
        searchReset() {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
        searchChange(params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
        selectionChange(list) {
            this.selectionList = list
        },
        selectionClear () {
        selectionClear() {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },
        handleDelete () {
        handleDelete() {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
@@ -455,19 +464,20 @@
                    this.$refs.crud.toggleSelection()
                })
        },
        beforeOpen (done, type) {
        beforeOpen(done, type) {
            if (["edit", "view"].includes(type)) {
                getGridWorkLog(this.form.id).then((res) => {
                    this.form = res.data.data
                    if (this.form.url.length > 0) {
                        var urls = []
                        var names = this.form.url.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        this.form.url = urls.join(",")
                    if (this.form.url) {
                        if (this.form.url.length > 0) {
                            var urls = []
                            var names = this.form.url.split(",")
                            names.forEach(name => {
                                urls.push(website.minioUrl + name)
                            })
                            this.form.url = urls.join(",")
                        }
                    }

                    getPersonPublicSelect({
                        id: this.form.householdId
                    }).then(res => {
@@ -479,16 +489,16 @@
            // con
            done()
        },
        currentChange (currentPage) {
        currentChange(currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
        sizeChange(pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
        refreshChange() {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
        onLoad(page, params = {}) {
            const { dateTime } = this.query
            let values = {
                ...params,
@@ -508,13 +518,15 @@
                this.page.total = data.total
                this.data = data.records
                this.data.forEach(item => {
                    if (item.url.length > 0) {
                        var urls = []
                        var names = item.url.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        item.url = urls.join(",")
                    if (item.url) {
                        if (item.url.length > 0) {
                            var urls = []
                            var names = item.url.split(",")
                            names.forEach(name => {
                                urls.push(website.minioUrl + name)
                            })
                            item.url = urls.join(",")
                        }
                    }
                })
                this.loading = false

 src/views/exam/addsubject.vue

New file
@@ -0,0 +1,243 @@
<template>
  <el-dialog :title="this.id ? '修改' : '新增'" width="60%" modal-append-to-body="false" append-to-body="true"
    :close-on-click-model="true" :visible.sync="visible" @close="closeDialog">
    <avue-form ref="form" :option="option" v-model="form" @submit="submit"></avue-form>
  </el-dialog>
</template>

<script>
  import {
    getList,
    add
  } from "@/api/subjectChoices/subjectChoices";

  export default {
    name: "add",
    data() {
      return {
        inputs: {
          input1: 1,
        },
        editFlag: false,
        optionContentAId: null,
        optionContentBId: null,
        optionContentCId: null,
        optionContentDId: null,
        optionContentEId: null,
        arrContent: ["1"],
        list: [{
            data: 1,
          },
          {
            data: 1,
          },
          {
            data: 1,
          },
        ],
        visible: false,
        choicesType: "0",
        loading: false,
        form: {},
        option: {
          height: "auto",
          calcHeight: 80,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true, //liu
          stripe: true,
          align: "center",
          index: true,
          selection: true,
          viewBtn: true,
          defaultExpandAll: true,
          dialogClickModal: false,
          column: [{
              label: "类型",
              prop: "choicesType",
              slot: true,
              type: "select",
              dicData: [{
                  label: "单选题",
                  value: "0",
                },
                {
                  label: "多选题",
                  value: "1",
                },
                {
                  label: "填空题",
                  value: "3",
                },
              ],
              rules: [{
                required: true,
                message: "请选择类型",
                trigger: "blur",
              }, ],
              span: 24,
            },
            {
              label: "题目名称",
              prop: "subjectName",
              search: true,
              type: "textarea",
              rules: [{
                required: true,
                message: "请输入题目名称",
                trigger: "blur",
              }, ],
              span: 24,
            }, {
              label: '选项分值',
              prop: 'score',
              type: 'input',
            },
            {
              label: "题目大题",
              prop: "categoryName",
              slot: true,
              width: 96
            },
            {
              label: "题目小题",
              prop: "subclassName",
              slot: true,
              width: 96
            },
            {
              label: '选项内容',
              prop: 'subjectOptionList',
              type: 'dynamic',
              span: 24,
              children: {
                column: [{
                  label: '选项标题',
                  prop: 'optionName',
                  type: 'input',
                }, {
                  label: '选项分值',
                  prop: 'score',
                  type: 'input',
                }, {
                  label: '选项公式',
                  prop: 'formula',
                  type: 'input',
                }]
              }
            },
          ],
        },
        formCheckbox: {},

        formJudge: {},
        formFill: {},

        data: [{
          discussContent: '',
          optionContent: ''
        }, {
          discussContent: '',
          optionContent: ''
        }],
      };
    },
    computed: {
      // ...mapState({
      //   userInfo: (state) => state.user.userInfo,
      // }),
    },
    mounted() {},
    methods: {
      add() {
        this.editFlag = true
      },

      edit(row) {
        this.disCussFrom = row
        this.editFlag = true
      },
      //初始化
      inits(row) {
        // var formula = "2 + 3 * (4 - 1)"; // 要转换的字符串表达式
        // var result = eval(formula); // 调用eval()函数进行计算
        // console.log(result); // 输出结果：9
        console.table(row); // 输出结果为 "2"
        // this.id = id || 0;
        this.visible = true;
        this.form = row
        // this.list = [{
        //   data: 1
        // }];
        // if (this.id) {
        //   //查询题目信息
        //   this.getSubjectInfo(id);
        // }
      },

      //加一行
      addRows() {
        //获取已有行的数据
        // debugger;
        if (this.index == 6) {
          return;
        }
        this.index++;
        this.list.push({
          data: this.index,
        });
        this.inputs[`input${this.index + 1}`] = "";
      },
      //减一行
      deleteRows(index) {
        if (this.index == 1) {
          return;
        }
        this.index--;
        this.list.splice(index, 1);
      },
      //单选题提交（新增）数据
      submit(row, done, loading) {
        var that = this;
        add(row).then(
          () => {
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            that.visible = false;
            that.$refs.form.resetForm();
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      //关闭窗口清除数据
      closeDialog() {
        this.$refs.form.resetForm();
      },
    },
  };
</script>
<style scoped>
  .optionContent-suffix {
    margin-top: 5px;
  }

  .optionContent-suffix span {
    margin-left: -20px;
  }

  .optionContent-suffix .optionContent-input {
    width: 90%;
    margin-left: 10px;
  }

  .optionContent-suffix .optionContent-botton {
    margin-left: 10px;
  }
</style>

 src/views/exam/subject.vue

New file
@@ -0,0 +1,340 @@
/* * @Author: Morpheus * @Date: 2021-07-05 16:31:54 * @Last Modified by: liu *
@Last Modified time: 2021-11-23 14:14:38 * menu-name 题库查询 */
<template>
  <basic-container :class="">
    <avue-crud class="company-box tablesss" :option="questionBankOption" :search.sync="questionBankSearch"
      :table-loading="questionBankLoading" :data="questionBankData" ref="questionBankCrud" :page.sync="questionBankPage"
      @selection-change="questionBankSelectionChange" @search-change="questionBankSearchChange"
      @search-reset="questionBankSearchReset" @current-change="questionBankCurrentChange"
      @size-change="questionBankSizeChange" @row-del="questionBankHandleDel" @on-load="questionBankOnLoad">
      <template slot="menuLeft">
        <el-button type="primary" size="small" icon="el-icon-plus" @click="questionBankHandleAdd">新 增
        </el-button>
      </template>

      <template slot-scope="{ row }" slot="menu">
        <el-button type="text" size="mini" icon="el-icon-edit" @click="questionBankHandleEdit(row)">编辑
        </el-button>
        <el-button type="text" size="mini" icon="el-icon-delete" @click="questionBankHandleDel(row)">删除
        </el-button>
      </template>
    </avue-crud>

    <el-dialog title="题库导入" append-to-body :visible.sync="excelBox" width="555px">
      <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
        <template slot="excelTemplate">
          <el-button type="primary" @click="handleTemplate">
            点击下载<i class="el-icon-download el-icon--right"></i>
          </el-button>
        </template>
      </avue-form>
    </el-dialog>
    <addsubject ref="addsubject" v-on:refreshPage="refreshPage"></addsubject>
  </basic-container>
</template>

<script>
  import {
    getList,
    remove
  } from "@/api/subjectChoices/subjectChoices";

  import addsubject from "./addsubject.vue";
  // import {
  //   mapGetters,
  //   mapState
  // } from "vuex";
  import Qs from "qs";
  import {
    getToken
  } from "@/util/auth";
  export default {
    components: {
      addsubject
    },
    data() {
      return {
        excelBox: false,
        excelForm: {},
        excelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
              label: "模板上传",
              prop: "excelFile",
              type: "upload",
              drag: true,
              loadText: "模板上传中，请稍等",
              span: 24,
              propsHttp: {
                res: "data"
              },
              tip: "请上传 .xls,.xlsx 标准格式文件",
              action: "/api/examSubjectChoices/import-examSubject"
            },
            {
              label: "模板下载",
              prop: "excelTemplate",
              formslot: true,
              span: 24
            }
          ]
        },
        questionBankOption: {
          // 操作栏多余按钮去除
          delBtn: false,
          editBtn: false,
          addBtn: false,
          selection: true,
          menu: true,
          // 导出按钮
          excelBtn: true,
          excelBtnText: "题库导出",
          // title: '题库',
          align: "center",
          height: "auto",
          calcHeight: 80,
          tip: false,
          searchShow: true,
          searchMenuSpan: 4,
          index: true,
          indexLabel: "序号",
          viewBtn: true,
          //dialogType: 'drawer',
          dialogClickModal: false,
          // 操作栏宽度
          menuWidth: 226,
          // ...this.$store.state.control.clearOtherBut,
          // ...this.$store.state.control.searchOpen,
          column: [{
              label: "题目类型",
              prop: "choicesType",
              search: true,
              type: "select",
              searchSpan: 4,
              dicData: [{
                  label: "单选题",
                  value: 0
                },
                {
                  label: "多选题",
                  value: 1
                },
                {
                  label: "实操题",
                  value: 3
                }
              ],
              slot: true,
              width: 96
            }, {
              label: "题目名称",
              prop: "subjectName",
              searchSpan: 4,
              search: true,
              slot: true
            },
            {
              label: "题目分值",
              prop: "score",
              slot: true,
              width: 96
            },
            {
              label: "大类",
              prop: "categoryName",
              slot: true,
              search: true,
              width: 96
            }, {
              label: "细类",
              prop: "subclassName",
              slot: true,
              search: true,
              width: 96
            },
            {
              label: "创建时间",
              prop: "createDate",
              slot: true,
              width: 130
            },
            {
              label: "修改人",
              prop: "modifier",
              slot: true,
              width: 96
            },
            {
              label: "修改时间",
              prop: "modifyDate",
              slot: true,
              width: 130
            }
          ]
        },
        questionBankSearch: {},
        questionBankLoading: true,
        questionBankData: [],
        questionBankPage: {
          pageSize: 10,
          currentPage: 1,
          total: 16,
          // ...this.$store.state.control.changePageSize
        },
        questionBankQuery: {},
        questionBankSelectionList: []
      };
    },
    mounted() {
      this.$store.commit("setWindowSizeHeightAdd");
    },
    computed: {
      // ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          // addBtn: this.vaildData(this.permission.subject_add, false),
          // viewBtn: this.vaildData(this.permission.subject_view, false),
          // delBtn: this.vaildData(this.permission.subject_delete, false),
          // editBtn: this.vaildData(this.permission.subject_edit, false),
          // excelBtn: this.vaildData(this.permission.subject_report, false)
        };
      },
      ids() {
        let ids = [];
        this.questionBankSelectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    },
    methods: {
      //触发页面刷新
      refreshPage() {
        this.questionBankOnLoad(this.questionBankPage);
      },
      questionBankHandleAdd() {
        this.$refs.addsubject.inits();
      },
      questionBankHandleEdit(row) {
        this.$refs.addsubject.inits(row);
      },
      questionBankOnLoad(page, params = {}) {
        params = this.questionBankSearch;
        this.questionBankLoading = false;
        getList(
          page.currentPage,
          page.pageSize,
          Object.assign(params, this.query)
        ).then(res => {
          const data = res.data.data;
          this.questionBankPage.total = data.total;
          this.questionBankData = data.records;
          this.questionBankLoading = false;
          this.$store.commit("setWindowSizeHeightAdd");
          this.questionBankSelectionClear();
        });
      },
      questionBankSelectionClear() {
        this.questionBankSelectionList = [];
        this.$refs.questionBankCrud.toggleSelection();
      },
      questionBankSelectionChange(list) {
        this.questionBankSelectionList = list;
      },
      questionBankSearchChange(params, done) {
        this.questionBankQuery = params;
        this.questionBankPage.currentPage = 1;
        this.questionBankOnLoad(this.questionBankPage, params);
        done();
      },
      questionBankSearchReset() {
        this.questionBankQuery = {};
        this.questionBankOnLoad(this.questionBankPage);
      },
      questionBankCurrentChange(currentPage) {
        this.questionBankPage.currentPage = currentPage;
      },
      questionBankSizeChange(pageSize) {
        this.questionBankPage.pageSize = pageSize;
      },

      questionBankHandleDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.questionBankOnLoad(this.questionBankPage);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },

      questionBankHandleDelete() {
        if (this.questionBankSelectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.questionBankOnLoad(this.questionBankPage);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.questionBankCrud.toggleSelection();
          });
      },

      //导出数据
      handleExport() {
        this.$confirm("是否导出清册数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          window.open(
            `/api/apply/export-apply?examId=${this.$route.query.id}&${
            this.website.tokenHeader
          }=${getToken()}`
          );
        });
      },
      handleImport() {
        this.excelBox = true;
      },
      handleTemplate() {
        window.open(
          `/api/examSubjectChoices/export-template?${
          this.website.tokenHeader
        }=${getToken()}`
        );
      },
      uploadAfter(res, done, loading, column) {
        window.console.log(column);
        this.excelBox = false;
        this.refreshChange();
        done();
      },
      refreshChange() {
        this.questionBankOnLoad(this.page, this.query);
      }
    }
  };
</script>

<style lang="scss" scoped></style>

 src/views/property/components/propertyEdit.vue

New file
@@ -0,0 +1,206 @@
<template>

  <el-dialog title="" append-to-body :visible.sync="infoVisible" top="10vh" width="70%">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="基础信息" name="first"></el-tab-pane>
      <el-tab-pane label="基础信息" name="second"></el-tab-pane>
      <el-tab-pane label="良好行为信息" name="third"></el-tab-pane>
      <el-tab-pane label="不良行为信息" name="fourth"></el-tab-pane>
    </el-tabs>


    <avue-form :option="option" v-model="first" v-if="activeName == 'first'"></avue-form>

    <!-- <avue-form :option="option" v-model="second" v-if="activeName == 'second'"></avue-form> -->
    <div>

      <div v-for="(item, index) in questionBankData" :key="index">
        <div>
          {{ item.subjectName }}
        </div>
        <div v-for="(item1, index1) in item.subjectOptionList" :key="index1">
          <!-- <div>
            {{ item1.optionName }}
          </div> -->
          <el-radio-group>
            <el-radio :label="item1.id">{{item1.optionName}}</el-radio>
          </el-radio-group>

        </div>
      </div>

    </div>


  </el-dialog>

</template>
<script>
  import {
    getList,
    remove
  } from "@/api/subjectChoices/subjectChoices";
  export default {
    data() {
      return {
        activeName: 'first',
        infoVisible: false,
        page: {
          pageSize: 20,
          currentPage: 1,
        },
        questionBankData: [],
        query: {},
        option: {
          labelWidth: 120,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,

          height: "auto",
          calcHeight: 54,
          dialogWidth: 1150,
          tip: false,
          border: true,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [{
              overHidden: true,
              label: "物业公司名称",
              prop: "name",
              searchSpan: 5,
              searchLabelWidth: 124,
              search: true,
              span: 18,
              row: true,
              width: 260,
              rules: [{
                required: true,
                message: "请输入物业公司名称",
                trigger: "blur",
              }, ],
            },
            {
              label: '省份',
              prop: 'province',
              type: 'select',
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              span: 6,
              cascader: ['city'],
              dicUrl: `/api/blade-system/region/select`,
              rules: [{
                required: true,
                message: '请选择省份',
                trigger: 'blur'
              }]
            },
            {
              label: '城市',
              prop: 'city',
              type: 'select',
              span: 6,
              labelWidth: 60,
              cascader: ['area'],
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              dicUrl: `/api/blade-system/region/select?code={{key}}`,
              rules: [{
                required: true,
                message: '请选择城市',
                trigger: 'blur'
              }]
            },
            {
              label: '地区',
              prop: 'area',
              type: 'select',
              span: 6,
              labelWidth: 60,
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              dicUrl: `/api/blade-system/region/select?code={{key}}`,
              rules: [{
                required: true,
                message: '请选择地区',
                trigger: 'blur'
              }]
            },
            {
              overHidden: true,
              label: "地址",
              prop: "address",
              span: 18,
              row: true,
            },
            {
              label: "社会信用代码",
              prop: "socialCreditCode",
            },

            {
              label: "简介",
              prop: "remark",
              component: "AvueUeditor",
              options: {
                action: "/api/blade-resource/oss/endpoint/put-file-attach",
                props: {
                  res: "data",
                  url: "link",
                },
              },
              hide: true,
              minRows: 6,
              span: 24,
            },
          ],
        },
      };
    },
    methods: {

      questionBankOnLoad(page, params = {}) {
        // params = {}
        // this.questionBankLoading = false;
        getList(
          page.currentPage,
          page.pageSize,
          Object.assign(params, this.query)
        ).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.questionBankData = data.records;
          // this.questionBankLoading = false;
        });
      },

      init(row) {
        this.infoVisible = true
      },

      handleClick(tab, event) {
        console.log(tab, event);
        let param = {
          categoryName: tab.label
        }
        this.questionBankOnLoad(this.page, param)
      }
    }
  };
</script>

<style>
</style>

 src/views/property/propertyCompany.vue

@@ -1,535 +1,547 @@
<!-- 物业公司管理 -->
<template>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" @row-del="rowDel"
            v-model="form" :permission="permissionList" @row-update="rowUpdate" @row-save="rowSave"
            :before-open="beforeOpen" @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 size="small" icon="el-icon-delete" plain v-if="permission.propertyCompany_delete"
                    @click="handleDelete">删 除
                </el-button>
            </template>
  <basic-container>
    <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" @row-del="rowDel"
      v-model="form" :permission="permissionList" @row-update="rowUpdate" @row-save="rowSave" :before-open="beforeOpen"
      @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 size="small" icon="el-icon-delete" plain v-if="permission.propertyCompany_delete"
          @click="handleDelete">删 除
        </el-button>

            <template slot-scope="{row, size, index}" slot="menu">
                <el-button :size="size" v-if="permission.payInfo" type="text" icon="el-icon-circle-plus-outline"
                    @click="openPayConfig(row)">商户配置
                </el-button>
            </template>
        </avue-crud>

        <el-dialog title="商户配置" append-to-body :visible.sync="payInfoVisible" top="10vh" width="70%">
            <el-tabs v-model="currentTab">
                <el-tab-pane label="微信商户配置" name="wxInfo">
                    <avue-form ref="wxForm" :option="wxPayOption" v-model="wxPayForm" @submit="wxSubmit">
                    </avue-form>
                </el-tab-pane>
                <el-tab-pane label="支付宝商户配置" name="second">
                    <avue-form ref="aliForm" :option="aliPayOption" v-model="aliPayForm" @submit="aliSubmit">
                    </avue-form>
                </el-tab-pane>
      </template>

            </el-tabs>
      <template slot-scope="{row, size, index}" slot="menu">
        <el-button :size="size" v-if="permission.payInfo" type="text" icon="el-icon-circle-plus-outline"
          @click="openPayConfig(row)">商户配置
        </el-button>

            <!--      <div slot="footer" class="dialog-footer">-->
            <!--        <el-button @click="payInfoVisible = false">取 消</el-button>-->
            <!--        <el-button type="primary"@click="submit">提 交</el-button>-->
            <!--      </div>-->
        <el-button :size="size" icon="el-icon-circle-plus-outline" type="text" @click="addProperty()">新 增
        </el-button>
      </template>
    </avue-crud>

        </el-dialog>
    </basic-container>
    <el-dialog title="商户配置" append-to-body :visible.sync="payInfoVisible" top="10vh" width="70%">
      <el-tabs v-model="currentTab">
        <el-tab-pane label="微信商户配置" name="wxInfo">
          <avue-form ref="wxForm" :option="wxPayOption" v-model="wxPayForm" @submit="wxSubmit">
          </avue-form>
        </el-tab-pane>
        <el-tab-pane label="支付宝商户配置" name="second">
          <avue-form ref="aliForm" :option="aliPayOption" v-model="aliPayForm" @submit="aliSubmit">
          </avue-form>
        </el-tab-pane>

      </el-tabs>

      <!--      <div slot="footer" class="dialog-footer">-->
      <!--        <el-button @click="payInfoVisible = false">取 消</el-button>-->
      <!--        <el-button type="primary"@click="submit">提 交</el-button>-->
      <!--      </div>-->

    </el-dialog>

    <propertyEdit ref="propertyEdit"></propertyEdit>


  </basic-container>
</template>

<script>
import {
  import {
    getList,
    remove,
    update,
    add,
    getPropertyCompany,
    getPayConfig,
    saveOrUpdateWx, saveOrUpdateAli
} from "@/api/property/propertyCompany"
import { mapGetters } from "vuex"
import website from '@/config/website'
import func from "@/util/func"
    saveOrUpdateWx,
    saveOrUpdateAli
  } from "@/api/property/propertyCompany"
  import {
    mapGetters
  } from "vuex"
  import website from '@/config/website'
  import func from "@/util/func"

const labelWidth = 120
export default {
    data () {
        return {
            currentTab: "wxInfo",
            payInfoVisible: false,
            currentRow: {},
  import propertyEdit from './components/propertyEdit.vue'

            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
  const labelWidth = 120
  export default {
    components: {
      propertyEdit
    },
    data() {
      return {
        currentTab: "wxInfo",
        payInfoVisible: false,
        currentRow: {},

        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          labelWidth: 120,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,

          height: "auto",
          calcHeight: 54,
          dialogWidth: 1150,
          tip: false,
          border: true,
          //stripe:true,
          index: true,
          // viewBtn: true,
          delBtn: false,
          selection: true,
          dialogClickModal: false,
          column: [{
              overHidden: true,
              label: "物业公司名称",
              prop: "name",
              searchSpan: 5,
              searchLabelWidth: 124,
              search: true,
              span: 18,
              row: true,
              width: 260,
              rules: [{
                required: true,
                message: "请输入物业公司名称",
                trigger: "blur",
              }, ],
            },
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 1150,
                tip: false,
                border: true,
                //stripe:true,
                index: true,
                viewBtn: true,
                selection: true,
                dialogClickModal: false,
                column: [
                    {
                        overHidden: true,
                        label: "物业公司名称",
                        prop: "name",
                        searchSpan: 5,
                        searchLabelWidth: 124,
                        search: true,
                        span: 18,
                        row: true,
                        width: 260,
                        rules: [
                            {
                                required: true,
                                message: "请输入物业公司名称",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: '省份',
                        prop: 'province',
                        type: 'select',
                        props: {
                            label: 'name',
                            value: 'code'
                        },
                        hide: true,
                        span: 6,
                        cascader: ['city'],
                        dicUrl: `/api/blade-system/region/select`,
                        rules: [
                            {
                                required: true,
                                message: '请选择省份',
                                trigger: 'blur'
                            }
                        ]
                    },
                    {
                        label: '城市',
                        prop: 'city',
                        type: 'select',
                        span: 6,
                        labelWidth: 60,
                        cascader: ['area'],
                        props: {
                            label: 'name',
                            value: 'code'
                        },
                        hide: true,
                        dicUrl: `/api/blade-system/region/select?code={{key}}`,
                        rules: [
                            {
                                required: true,
                                message: '请选择城市',
                                trigger: 'blur'
                            }
                        ]
                    },
                    {
                        label: '地区',
                        prop: 'area',
                        type: 'select',
                        span: 6,
                        labelWidth: 60,
                        props: {
                            label: 'name',
                            value: 'code'
                        },
                        hide: true,
                        dicUrl: `/api/blade-system/region/select?code={{key}}`,
                        rules: [
                            {
                                required: true,
                                message: '请选择地区',
                                trigger: 'blur'
                            }
                        ]
                    },
                    {
                        overHidden: true,
                        label: "地址",
                        prop: "address",
                        span: 18,
                        row: true,
                    },
                    {
                        label: "社会信用代码",
                        prop: "socialCreditCode",
                    },

                    {
                        label: "简介",
                        prop: "remark",
                        component: "AvueUeditor",
                        options: {
                            action: "/api/blade-resource/oss/endpoint/put-file-attach",
                            props: {
                                res: "data",
                                url: "link",
                            },
                        },
                        hide: true,
                        minRows: 6,
                        span: 24,
                    },
                ],
            {
              label: '省份',
              prop: 'province',
              type: 'select',
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              span: 6,
              cascader: ['city'],
              dicUrl: `/api/blade-system/region/select`,
              rules: [{
                required: true,
                message: '请选择省份',
                trigger: 'blur'
              }]
            },
            data: [],

            wxPayForm: {},
            wxPayOption: {
                emptyBtn: false,
                height: "auto",
                calcHeight: 180,
                //stripe:true,
                column: [
                    {
                        label: "appId",
                        labelWidth: labelWidth,
                        prop: "appId",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入appId",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "mch-id",
                        labelWidth: labelWidth,
                        prop: "mchId",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入mch-id",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "mchKey",
                        labelWidth: labelWidth,
                        prop: "mchKey",
                        rules: [{
                            required: true,
                            message: "请输入mchKey",
                            trigger: ["blur", "change"]
                        },],
                        span: 24,
                    },
                    {
                        label: "appSecret",
                        labelWidth: labelWidth,
                        prop: "appSecret",
                        rules: [{
                            required: true,
                            message: "请输入appSecret",
                            trigger: ["blur", "change"]
                        },],
                        span: 24,
                    },
                    {
                        label: '安全证书',
                        labelWidth: labelWidth,
                        prop: 'keyPath',
                        type: 'upload',
                        drag: true,
                        limit: 1,
                        loadText: '上传中，请稍等',
                        span: 24,
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        propsHttp: {
                            res: "data",
                            name: 'name',
                            url: "link",
                        },
                        rules: [{
                            required: true,
                            message: "请上传安全证书",
                            trigger: ["blur", "change"]
                        },],
                    },
                ],
            {
              label: '城市',
              prop: 'city',
              type: 'select',
              span: 6,
              labelWidth: 60,
              cascader: ['area'],
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              dicUrl: `/api/blade-system/region/select?code={{key}}`,
              rules: [{
                required: true,
                message: '请选择城市',
                trigger: 'blur'
              }]
            },
            {
              label: '地区',
              prop: 'area',
              type: 'select',
              span: 6,
              labelWidth: 60,
              props: {
                label: 'name',
                value: 'code'
              },
              hide: true,
              dicUrl: `/api/blade-system/region/select?code={{key}}`,
              rules: [{
                required: true,
                message: '请选择地区',
                trigger: 'blur'
              }]
            },
            {
              overHidden: true,
              label: "地址",
              prop: "address",
              span: 18,
              row: true,
            },
            {
              label: "社会信用代码",
              prop: "socialCreditCode",
            },

            aliPayForm: {},
            aliPayOption: {
                emptyBtn: false,
                height: "auto",
                calcHeight: 180,
                //stripe:true,
                column: [
                    {
                        label: "appId",
                        labelWidth: labelWidth,
                        prop: "appId",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入appId",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "privateKey",
                        labelWidth: labelWidth,
                        prop: "privateKey",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入privateKey",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "publicKey",
                        labelWidth: labelWidth,
                        prop: "publicKey",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入publicKey",
                            trigger: ["blur", "change"]
                        },],
                    },
                ],
            }
            {
              label: "简介",
              prop: "remark",
              component: "AvueUeditor",
              options: {
                action: "/api/blade-resource/oss/endpoint/put-file-attach",
                props: {
                  res: "data",
                  url: "link",
                },
              },
              hide: true,
              minRows: 6,
              span: 24,
            },
          ],
        },
        data: [],

        wxPayForm: {},
        wxPayOption: {
          emptyBtn: false,
          height: "auto",
          calcHeight: 180,
          //stripe:true,
          column: [{
              label: "appId",
              labelWidth: labelWidth,
              prop: "appId",
              span: 24,
              rules: [{
                required: true,
                message: "请输入appId",
                trigger: ["blur", "change"]
              }, ],
            },
            {
              label: "mch-id",
              labelWidth: labelWidth,
              prop: "mchId",
              span: 24,
              rules: [{
                required: true,
                message: "请输入mch-id",
                trigger: ["blur", "change"]
              }, ],
            },
            {
              label: "mchKey",
              labelWidth: labelWidth,
              prop: "mchKey",
              rules: [{
                required: true,
                message: "请输入mchKey",
                trigger: ["blur", "change"]
              }, ],
              span: 24,
            },
            {
              label: "appSecret",
              labelWidth: labelWidth,
              prop: "appSecret",
              rules: [{
                required: true,
                message: "请输入appSecret",
                trigger: ["blur", "change"]
              }, ],
              span: 24,
            },
            {
              label: '安全证书',
              labelWidth: labelWidth,
              prop: 'keyPath',
              type: 'upload',
              drag: true,
              limit: 1,
              loadText: '上传中，请稍等',
              span: 24,
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                name: 'name',
                url: "link",
              },
              rules: [{
                required: true,
                message: "请上传安全证书",
                trigger: ["blur", "change"]
              }, ],
            },
          ],
        },

        aliPayForm: {},
        aliPayOption: {
          emptyBtn: false,
          height: "auto",
          calcHeight: 180,
          //stripe:true,
          column: [{
              label: "appId",
              labelWidth: labelWidth,
              prop: "appId",
              span: 24,
              rules: [{
                required: true,
                message: "请输入appId",
                trigger: ["blur", "change"]
              }, ],
            },
            {
              label: "privateKey",
              labelWidth: labelWidth,
              prop: "privateKey",
              span: 24,
              rules: [{
                required: true,
                message: "请输入privateKey",
                trigger: ["blur", "change"]
              }, ],
            },
            {
              label: "publicKey",
              labelWidth: labelWidth,
              prop: "publicKey",
              span: 24,
              rules: [{
                required: true,
                message: "请输入publicKey",
                trigger: ["blur", "change"]
              }, ],
            },
          ],
        }

      }
    },
    watch: {},
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.propertyCompany_add, true),
                viewBtn: this.vaildData(this.permission.propertyCompany_view, true),
                delBtn: this.vaildData(this.permission.propertyCompany_delete, true),
                editBtn: this.vaildData(this.permission.propertyCompany_edit, true),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.propertyCompany_add, true),
          viewBtn: this.vaildData(this.permission.propertyCompany_view, true),
          delBtn: this.vaildData(this.permission.propertyCompany_delete, true),
          editBtn: this.vaildData(this.permission.propertyCompany_edit, true),
        }
      },
      ids() {
        let ids = []
        this.selectionList.forEach((ele) => {
          ids.push(ele.id)
        })
        return ids.join(",")
      },
    },
    created () {
    },
    created() {},
    methods: {

        aliSubmit (form, done) {

            console.log("支付宝商户配置", this.aliPayForm)
      addProperty() {
        this.$refs.propertyEdit.init();
      },

            this.aliPayForm.propertyCompanyId = this.currentRow.id
            saveOrUpdateAli(this.aliPayForm).then(res => {
                this.$message({
                    type: "success",
                    message: "操作成功!",
                })
                done()
            })
      aliSubmit(form, done) {

        },
        console.log("支付宝商户配置", this.aliPayForm)

        wxSubmit (form, done) {
            this.wxPayForm.propertyCompanyId = this.currentRow.id
        this.aliPayForm.propertyCompanyId = this.currentRow.id
        saveOrUpdateAli(this.aliPayForm).then(res => {
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        })

            this.wxPayForm.keyPath = func.join(this.wxPayForm.keyPath)
            if (this.wxPayForm.keyPath.length > 0) {
                var urls = []
                var split = this.wxPayForm.keyPath.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                this.wxPayForm.keyPath = urls.join(",")
            }
      },

            console.log("微信商户配置", this.wxPayForm)
            saveOrUpdateWx(this.wxPayForm).then(res => {
                this.$message({
                    type: "success",
                    message: "操作成功!",
                })
                done()
            })
        },
      wxSubmit(form, done) {
        this.wxPayForm.propertyCompanyId = this.currentRow.id

        openPayConfig (row) {
            this.currentRow = row
            //调接口获取商户数据
            getPayConfig(row.id).then(res => {
                let data = res.data.data
                this.wxPayForm = data.wxPayInfo ? data.wxPayInfo : {}
                this.aliPayForm = data.aliPayInfo ? data.aliPayInfo : {}
            })
            this.payInfoVisible = !this.payInfoVisible
        },

        rowSave (row, done, loading) {
            row.userid = this.userInfo.user_id
            add(row).then(
                () => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    done()
                },
                (error) => {
                    window.console.log(error)
                    loading()
                }
            )
        },
        rowUpdate (row, index, done, loading) {
            update(row).then(
                () => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    done()
                },
                (error) => {
                    window.console.log(error)
                    loading()
                }
            )
        },
        rowDel (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    return remove(row.id)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                })
        },
        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()
        },
        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)) {
                getPropertyCompany(this.form.id).then((res) => {
                    this.form = res.data.data
                })
            }
            // con
            done()
        },
        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            const { dateTime } = this.query
            let values = {
                ...params,
            }
            if (dateTime) {
                values = {
                    ...params,
                    startTime: dateTime[0],
                    endTime: dateTime[1],
                    ...this.query,
                }
                values.dateTime = null
            }
            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
                this.loading = false
                this.selectionClear()
            })
        this.wxPayForm.keyPath = func.join(this.wxPayForm.keyPath)
        if (this.wxPayForm.keyPath.length > 0) {
          var urls = []
          var split = this.wxPayForm.keyPath.split(",")
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          this.wxPayForm.keyPath = urls.join(",")
        }

        console.log("微信商户配置", this.wxPayForm)
        saveOrUpdateWx(this.wxPayForm).then(res => {
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        })
      },

      openPayConfig(row) {
        this.currentRow = row
        //调接口获取商户数据
        getPayConfig(row.id).then(res => {
          let data = res.data.data
          this.wxPayForm = data.wxPayInfo ? data.wxPayInfo : {}
          this.aliPayForm = data.aliPayInfo ? data.aliPayInfo : {}
        })
        this.payInfoVisible = !this.payInfoVisible
      },

      rowSave(row, done, loading) {
        row.userid = this.userInfo.user_id
        add(row).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            return remove(row.id)
          })
          .then(() => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
          })
      },
      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()
      },
      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)) {
          getPropertyCompany(this.form.id).then((res) => {
            this.form = res.data.data
          })
        }
        // con
        done()
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },
      onLoad(page, params = {}) {
        const {
          dateTime
        } = this.query
        let values = {
          ...params,
        }
        if (dateTime) {
          values = {
            ...params,
            startTime: dateTime[0],
            endTime: dateTime[1],
            ...this.query,
          }
          values.dateTime = null
        }
        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
          this.loading = false
          this.selectionClear()
        })
      }
    }
}
  }
</script>

<style>
.avue-upload__icon {
  .avue-upload__icon {
    line-height: 6;
}
</style>
  }
</style>

 src/views/propertySupervision/houseHoldSupervision.vue

New file
@@ -0,0 +1,815 @@
<template>
  <el-row>
    <el-col :span="24">



      <basic-container>




        <avue-crud :option="option" :search.sync="search" :table-loading="loading" :data="data" ref="crud"
          v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
          :before-open="beforeOpen" :page.sync="page" @search-change="searchChange" @search-reset="searchReset"
          @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
          @refresh-change="refreshChange" @on-load="onLoad">


          <!--  <template slot-scope="{row, size}" slot="menu">
            <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" v-if="permission.househould_manager"
              @click="handleHouseholdManager(row)">住户管理
            </el-button>
            <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" v-if="permission.househould_manager"
              @click="manageLabel(row)">标签
            </el-button>
          </template> -->



          <template slot-scope="{row, size}" slot="phone">
            <el-button :size="size" type="text" @click="showStringDispose(row, 'phoneflag')">
              {{ textDispose(row, 'phoneflag', 'phone') }}
            </el-button>
          </template>

          <template slot-scope="{row}" slot="userHouseLabelVOList">
            {{ labelDispose(row.userHouseLabelVOList) }}
          </template>
        </avue-crud>


        <el-dialog title="用户角色配置" append-to-body :visible.sync="roleBox" width="345px">

          <el-tree :data="roleGrantList" show-checkbox check-strictly default-expand-all node-key="id" ref="treeRole"
            :default-checked-keys="roleTreeObj" :props="props">
          </el-tree>

          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="roleBox = false">取 消</el-button>
            <el-button size="small" type="primary" @click="submitRole">确 定</el-button>
          </span>
        </el-dialog>

        <el-dialog title="标签管理" append-to-body :visible.sync="labelFlag" center width="600px">
          <div id="" class="grid-container2">
            <div class="grid-item" :style="{ backgroundColor: item.color }" v-for="(item, index) in labelData"
              :key="index" @click="changLabel(item)">
              {{ item.name }}
            </div>
          </div>
          <!--  <span slot="footer" class="dialog-footer">
            <el-button @click="labelFlag = false">取 消</el-button>
            <el-button type="primary" @click="submitRole">确 定</el-button>
          </span> -->
        </el-dialog>

        <el-dialog :title="'编辑标签   ' + currentLabel.name" append-to-body :visible.sync="editLabelFlge" width="655px">
          <avue-form :option="labelOption" v-model="labelForm" :submit="onsubmit">
          </avue-form>
          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="editLabelFlge = false">取 消</el-button>
            <el-button size="small" type="primary" @click="onsubmit">确 定</el-button>
          </span>
        </el-dialog>

        <el-dialog title="用户数据导入" append-to-body :visible.sync="excelBox" width="555px">
          <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
            <template slot="excelTemplate">
              <el-button type="primary" @click="handleTemplate">
                点击下载<i class="el-icon-download el-icon--right"></i>
              </el-button>
            </template>
          </avue-form>
        </el-dialog>

        <el-dialog title="住户管理" append-to-body :visible.sync="householdManagerVisible" width="70%" height="60%">
          <!-- <householdManager ref="householdManager" /> -->
        </el-dialog>


      </basic-container>
    </el-col>
  </el-row>
</template>

<script>
  import {
    getList,
    remove,
    add,
    update,
    getDetatil,
    getDetatils
  } from "@/api/userHouse/list/house.js"
  import {
    removeHouseholdLabel,
    saveOrUpdateHouseholdLabel
  } from "@/api/userHouse/list/userHouseList.js"
  import {
    getLabelList,
  } from '@/api/label/label'
  import {
    exportBlob
  } from "@/api/common"
  import {
    mapGetters
  } from "vuex"
  import website from '@/config/website'
  import {
    getToken
  } from '@/util/auth'
  import {
    downloadXls
  } from "@/util/util"
  import {
    dateNow
  } from "@/util/date"
  import NProgress from 'nprogress'
  import 'nprogress/nprogress.css'
  import func from "@/util/func"
  // import householdManager from "./components/householdManager"
  import Qs from "qs"
  export default {
    components: {
      // householdManager
    },
    data() {

      //手机号格式校验
      let validatorPhone = function(rule, value, callback) {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            callback(new Error('手机号格式有误！'))
          } else {
            callback()
          }
        }
        callback()
      }

      return {
        labelData: [],
        labelForm: {},
        userHouseLabelVOList: [],
        currentLabel: {},
        labelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
            label: '级别',
            prop: 'color',
            type: 'radio',
            button: true,
            row: true,
            dicData: [{
              label: '撤销',
              value: '#EBEDF0'
            }, {
              label: '绿',
              value: '#30D17C'
            }, {
              label: '黄',
              value: '#FFB42B'
            }, {
              label: '红',
              value: '#EA1F1F'
            }],
            rules: [{
              required: true,
              message: "请选择",
              trigger: "blur"
            }]
          }, {
            row: true,
            label: '备注',
            prop: 'remark',
            type: 'input'
          }]
        },
        editLabelFlge: false,
        labelFlag: false,
        householdManagerVisible: false,
        form: {},
        search: {},
        excelBox: false,
        selectionList: [],
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        option: {
          labelWidth: 120,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 350,
          menu: false,
          height: 'auto',
          calcHeight: 80,
          tip: false,
          border: true,
          index: true,
          selection: true,
          addBtn: false,
          viewBtn: true,
          dialogType: 'drawer',
          dialogClickModal: false,
          column: [{
              label: "房屋编号",
              prop: "houseCode",
              width: 180,
              hide: true,
              display: false
            },
            {
              width: 156,
              overHidden: true,
              label: "地址",
              prop: "address",
              display: false,
            },
            {
              // hide: true,
              width: 220,
              overHidden: true,
              label: '地址',
              parent: false,
              prop: "houseName",
              searchSpan: 4,
              display: false,
              search: true,
            },
            {
              hide: true,
              parent: false,
              label: "小区名称",
              prop: "districtCode",
              type: 'tree',
              dicUrl: `/api/blade-district/district/getDistrictTree`,
              props: {
                label: "name",
                value: "id"
              },
              defaultExpandedKeys: ["361102003"],
              span: 12,
              width: 220,
              overHidden: true,
            },

            {
              width: 220,
              overHidden: true,
              label: '小区名称',
              parent: false,
              prop: "districtName",
              searchSpan: 4,
              display: false,
              search: true,
            },

            {
              width: 110,
              label: "所属街道",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "townStreetName",
              search: true,
              searchSpan: 4
            },

            {
              width: 156,
              overHidden: true,
              label: "所属社区",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "neiName",
              search: true,
              searchSpan: 4,
              rules: [{
                required: true,
                message: "请选择所属社区",
                trigger: "blur",
              }],
            },

            {
              hide: true,
              parent: false,
              label: "所属社区",
              prop: "neiCode",
              search: false,
              type: "tree",
              dicUrl: "/api/blade-system/region/tree",
              props: {
                label: "name",
                value: "id",
              },
              cascader: ["gridId"],
              rules: [{
                required: true,
                message: "请选择所属社区",
                trigger: "blur",
              }, ],
            },

            {
              width: 110,
              overHidden: true,
              label: "所属网格",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "gridName",
              rules: [{
                required: true,
                message: "请选择所属网格",
                trigger: "blur",
              }],
            },

            {
              hide: true,
              label: "所属网格",
              prop: "gridId",
              type: "tree",
              cell: true,
              props: {
                label: "gridName",
                value: "id",
              },
              dicUrl: "/api/blade-grid/grid/getGridList?communityCode={{neiCode}}",
              rules: [{
                required: true,
                message: "请选择所属网格",
                trigger: "blur",
              }, ],
            },

            {
              label: "房屋照片",
              prop: "imageUrls",
              width: 110,
              type: "upload",
              listType: "picture-card",
              dataType: "string",
              multiple: true,
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                name: 'name',
                url: "link",
              },
              span: 24,
            },


            {
              width: 120,
              label: "电话",
              prop: "phone",
              slot: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            },

            {
              label: "幢",
              prop: "building",
            },
            {
              label: "单元",
              prop: "unit",
            },
            {
              label: "室",
              prop: "room",
            },
            {
              label: "楼层",
              prop: "floor",
              type: "number",
              rules: [{
                required: true,
                message: "请输入楼层",
                trigger: "blur",
              }, ],
            },
            {
              label: "面积",
              prop: "area",
              type: "number",
            },
            {
              label: "物业费",
              prop: "propertyPrice",
              type: "number",
            },
            {
              label: "服务到期",
              prop: "serviceDue",
              type: "datetime",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
            },
            {
              width: 210,
              overHidden: true,
              label: "标签",
              prop: "userHouseLabelVOList",
              display: false
            },
          ]
        },
        data: [],
        excelForm: {},
        excelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
              label: '模板上传',
              prop: 'excelFile',
              type: 'upload',
              drag: true,
              loadText: '模板上传中，请稍等',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              tip: '请上传 .xls,.xlsx 标准格式文件',
              action: "/api/blade-system/user/import-user"
            },
            {
              label: "数据覆盖",
              prop: "isCovered",
              type: "switch",
              align: "center",
              width: 80,
              dicData: [{
                  label: "否",
                  value: 0
                },
                {
                  label: "是",
                  value: 1
                }
              ],
              value: 0,
              slot: true,
              rules: [{
                required: true,
                message: "请选择是否覆盖",
                trigger: "blur"
              }]
            },
            {
              label: '模板下载',
              prop: 'excelTemplate',
              formslot: true,
              span: 24,
            }
          ]
        }
      }
    },
    watch: {},
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.house_add, true),
          viewBtn: this.vaildData(this.permission.house_view, true),
          delBtn: this.vaildData(this.permission.house_delete, true),
          editBtn: this.vaildData(this.permission.house_edit, true)
        }
      },

      textDispose() {
        return (row, flag, type) => {
          if (row[flag] || row[type] == null) {
            return row[type]
          } else {
            if (type == 'idCard') {
              return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
            } else {
              return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
            }
          }
        }
      },

      labelDispose() {
        return (list) => {
          return list.map(item => item.labelName).join(',')
        }
      }
    },
    mounted() {},
    methods: {

      onsubmit() {
        if (this.labelForm.color === '#EBEDF0') {
          let params = {
            householdId: this.currentRow.id,
            labelId: this.currentLabel.id
          }
          removeHouseholdLabel(params).then(res => {
            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        } else {
          this.labelForm.houseCode = this.currentRow.houseCode
          this.labelForm.householdId = this.currentRow.id
          this.labelForm.labelId = this.currentLabel.id
          this.labelForm.lableType = 2
          saveOrUpdateHouseholdLabel(this.labelForm).then(res => {
            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        }
      },

      changLabel(item) {
        this.editLabelFlge = true
        this.currentLabel = item
        this.labelForm.color = item.color
        this.labelForm.remark = item.remark
      },
      manageLabel(item) {
        this.loading = true
        this.currentRow = item
        this.labelFlag = true
        let params = {
          parentId: 1001
        }
        // 查询标签
        getLabelList(Object.assign(params)).then(res => {
          const data = res.data.data
          // 查询详情
          getDetatils({
            houseCode: item.houseCode
          }).then(res => {
            if (res.data.data) {
              this.userHouseLabelVOList = res.data.data.userHouseLabelVOList
              this.loading = false
              // 将细类放到一起
              data.forEach(f => {
                if (this.userHouseLabelVOList.length > 0) {
                  this.userHouseLabelVOList.forEach(h => {
                    if (Number(f.id) == h.labelId) {
                      f['color'] = h.color
                      f['remark'] = h.remark
                    }
                  })
                }
              })
            }
            this.labelData = data
            this.loading = false
          })
        })
      },
      handleHouseholdManager(row) {
        var that = this
        this.householdManagerVisible = true
        this.$nextTick(() => {
          that.$refs.householdManager.init(row)
        })
      },
      rowSave(row, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",")
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        add(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowUpdate(row, index, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",")
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        update(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(row.id)
          })
          .then(() => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!"
            })
          })
      },
      searchReset() {
        this.query = {}
        this.treeDeptId = ''
        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()
      },
      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()
          })
      },
      handleImport() {
        this.excelBox = true
      },
      uploadAfter(res, done, loading, column) {
        window.console.log(column)
        this.excelBox = false
        this.refreshChange()
        done()
      },
      handleExport() {
        this.$confirm("是否导出房屋数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          NProgress.start()
          var data = {
            ...this.query
          }
          data = Qs.stringify(data)
          exportBlob(
            `/api/blade-house/house/export-house?${this.website.tokenHeader}=${getToken()}&` + data
          ).then(res => {
            downloadXls(res.data, `房屋数据表${dateNow()}.xlsx`)
            NProgress.done()
          })
        })
      },
      handleTemplate() {
        exportBlob(`/api/blade-system/user/export-template?${this.website.tokenHeader}=${getToken()}`).then(res => {
          downloadXls(res.data, "房屋数据模板.xlsx")
        })
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetatil({
            id: this.form.id
          }).then(res => {
            this.form = res.data.data

            if (this.form.imageUrls) {
              if (this.form.imageUrls.length > 0) {
                var urls = []
                var names = this.form.imageUrls.split(",")
                names.forEach(name => {
                  urls.push(website.minioUrl + name)
                })
                this.form.imageUrls = urls.join(",")
              }
            }
          })
        }
        this.initFlag = true
        done()
      },
      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
        this.query.parentId = 1001
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = {
            ...res.data.data,
            records: res.data.data.records.map(item => {
              if (item.imageUrls) {
                if (item.imageUrls.length > 0) {
                  var urls = []
                  var names = item.imageUrls.split(",")
                  names.forEach(name => {
                    urls.push(website.minioUrl + name)
                  })
                  item.imageUrls = urls.join(",")
                }
              }

              return {
                ...item,
                'phoneflag': false,
              }
            })
          }
          this.page.total = data.total
          this.data = data.records
          this.loading = false
          this.selectionClear()
        })
      },
      showStringDispose(row, type) {
        row[type] = !row[type]
      }
    }
  }
</script>

<style>
  .box {
    height: 800px;
  }

  .el-scrollbar {
    height: 100%;
  }

  .box .el-scrollbar__wrap {
    overflow: scroll;
  }
</style>

 src/views/propertySupervision/propertyEvaluation.vue

New file
@@ -0,0 +1,8 @@
<template>
</template>

<script>
</script>

<style>
</style>

 src/views/propertySupervision/residentSupervision.vue

New file
@@ -0,0 +1,1121 @@
<template>
  <el-row>
    <el-col :span="24">
      <basic-container>
        <avue-crud :option="option" :search.sync="search" :table-loading="loading" :data="data" ref="crud"
          v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
          :before-open="beforeOpen" :page.sync="page" @search-change="searchChange" @search-reset="searchReset"
          @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
          @refresh-change="refreshChange" @on-load="onLoad">

          <template slot-scope="{row, size}" slot="menu">
            <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" v-if="permission.househould_manager"
              @click="manageLabel(row)">标签
            </el-button>
          </template>
          <template slot-scope="{row, size}" slot="phoneNumber">
            <el-button :size="size" type="text" @click="showStringDispose(row, 'phoneNumberflag')">
              {{ textDispose(row, 'phoneNumberflag', 'phoneNumber') }}
            </el-button>
          </template>
          <template slot-scope="{row, size}" slot="idCard">
            <el-button :size="size" type="text" @click="showStringDispose(row, 'idCardflag')"
              v-text="textDispose(row, 'idCardflag', 'idCard')"></el-button>
          </template>
          <template slot-scope="{row, size}" slot="householdLabelList">
            {{ labelDispose(row.householdLabelList) }}
          </template>
        </avue-crud>
        <el-dialog title="用户角色配置" append-to-body :visible.sync="roleBox" width="345px" center>

          <el-tree :data="roleGrantList" show-checkbox check-strictly default-expand-all node-key="id" ref="treeRole"
            :default-checked-keys="roleTreeObj" :props="props">
          </el-tree>

          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="roleBox = false">取 消</el-button>
            <el-button size="small" type="primary" @click="submitRole">确 定</el-button>
          </span>
        </el-dialog>

        <el-dialog title="标签管理" append-to-body :visible.sync="labelFlag" center width="600px">
          <div>
            <div class="grid-container2">
              <div class="grid-item" :style="{ backgroundColor: item2.color }" v-for="(item2, index2) in labelData"
                @click="changLabel(item2)" :key="index2">
                {{ item2.name }}
              </div>
            </div>
          </div>

        </el-dialog>

        <el-dialog :title="'编辑标签   ' + currentLabel.name" append-to-body :visible.sync="editLabelFlge" width="655px">
          <avue-form :option="labelOption" v-model="labelForm" :submit="onsubmit">
          </avue-form>
          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="editLabelFlge = false">取 消</el-button>
            <el-button size="small" type="primary" @click="onsubmit">确 定</el-button>
          </span>
        </el-dialog>

        <el-dialog title="用户数据导入" append-to-body :visible.sync="excelBox" width="555px">
          <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
            <template slot="excelTemplate">
              <el-button size="small" type="primary" @click="handleTemplate">
                点击下载<i class="el-icon-download el-icon--right"></i>
              </el-button>
            </template>
          </avue-form>
        </el-dialog>
      </basic-container>
    </el-col>
  </el-row>
</template>

<script>
  import {
    getKeynotePersonnelPage,
    remove,
    add,
    update,
    getDetatil,
    getDetatils
  } from "@/api/userHouse/list/houseHold.js"
  import {
    removeHouseholdLabel,
    saveOrUpdateHouseholdLabel
  } from "@/api/userHouse/list/userHouseList.js"
  import {
    getLabelList,
  } from '@/api/label/label'
  import {
    exportBlob
  } from "@/api/common"
  import {
    mapGetters
  } from "vuex"
  import {
    getToken
  } from '@/util/auth'
  import {
    downloadXls,
    findParentOrCur,
  } from "@/util/util"
  import {
    dateNow
  } from "@/util/date"
  import NProgress from 'nprogress'
  import 'nprogress/nprogress.css'
  import Qs from "qs"


  export default {
    data() {
      let isCardId = function(rule, value, callback) {
        // 15位和18位身份证号码的正则表达式
        var regIdCard =
          /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/

        // 如果通过该验证，说明身份证格式正确，但准确性还需计算
        if (regIdCard.test(value)) {
          if (value.length == 18) {
            var idCardWi = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10,
              5, 8, 4, 2) // 将前17位加权因子保存在数组里
            var idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2) // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
            var idCardWiSum = 0 // 用来保存前17位各自乖以加权因子后的总和
            for (var i = 0; i < 17; i++) {
              idCardWiSum += value.substring(i, i + 1) * idCardWi[i]
            }

            var idCardMod = idCardWiSum % 11 // 计算出校验码所在数组的位置
            var idCardLast = value.substring(17) // 得到最后一位身份证号码

            // 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
            if (idCardMod == 2) {
              if (idCardLast == "X" || idCardLast == "x") {
                callback()
              } else {
                callback(new Error("身份证号格式有误！"))
              }
            } else {
              // 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
              if (idCardLast == idCardY[idCardMod]) {
                callback()
              } else {
                callback(new Error("身份证号格式有误！"))
              }
            }
          } else {
            callback()
          }
        } else {
          //alert("身份证格式不正确!");
          callback(new Error("身份证号格式有误！"))
        }

        callback()
      }

      //手机号格式校验
      let validatorPhone = function(rule, value, callback) {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            callback(new Error('手机号格式有误！'))
          } else {
            callback()
          }
        }
        callback()
      }

      return {
        labelData: [],
        form: {},
        search: {},
        excelBox: false,
        selectionList: [],
        labelFlag: false,
        editLabelFlge: false,
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        option: {
          labelWidth: 144,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,
          menu: false,
          height: 'auto',
          calcHeight: 80,
          tip: false,
          border: true,
          index: true,
          selection: true,
          viewBtn: false,
          addBtn: false,
          delBtn: false,
          editBtn: false,
          dialogType: 'drawer',
          dialogClickModal: false,
          menuFixed: 'right',
          column: [{
              label: "与业主关系",
              prop: "relationship",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleRelation",
              dataType: "number",
              hide: true,
              props: {
                label: "dictValue",
                value: "dictKey",
              },
              rules: [{
                required: true,
                message: "请选择与业主关系",
                trigger: "blur",
              }],
            },

            {
              width: 110,
              label: "姓名",
              prop: "name",
              searchSpan: 3,
              searchLabelWidth: 66,
              search: true,
              rules: [{
                required: true,
                message: "请输入姓名",
                trigger: "blur",
              }],
            },

            {
              hide: true,
              label: "证件类型",
              prop: "cardType",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=cardType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              width: 160,
              display: true,
              label: "身份证号",
              prop: "idCard",
              search: true,
              searchSpan: 4,
              slot: true,
              rules: [{
                validator: isCardId,
                trigger: 'blur'
              }],
            },

            {
              hide: true,
              display: false,
              width: 160,
              label: "证件号码",
              prop: "cardNo",
            },

            {
              label: "出生日期",
              prop: "birthday",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              hide: true,
            },


            {
              width: 60,
              label: "性别",
              prop: "gender",
              type: "select",
              dicData: [{
                  label: "男",
                  value: 1
                },
                {
                  label: "女",
                  value: 0
                },
                {
                  label: "未知",
                  value: "3"
                }
              ],
            },

            {
              width: 120,
              label: "手机号码",
              prop: "phoneNumber",
              search: true,
              searchSpan: 4,
              slot: true,
              rules: [{
                  required: true,
                  message: "请输入手机号码",
                  trigger: "blur",
                },
                {
                  validator: validatorPhone,
                  trigger: 'blur'
                }
              ],
            },

            {
              label: "居住情况",
              prop: "residentialStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentialStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "其他联系方式",
              prop: "otherContact",
              hide: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            },

            {
              label: "是否主要联系人",
              prop: "isPrimaryContact",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=primaryContactType",
              dataType: "number",
              hide: true,
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            // {
            // label: "关系",
            // prop: "roleType",
            // type: "select",
            // dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleType",
            // dataType: "number",
            //     props: {
            //         label: "dictValue",
            //         value: "dictKey",
            //     },
            // },

            {
              width: 220,
              overHidden: true,
              label: '小区名称',
              prop: "aoiName",
              search: true,
              searchSpan: 4,
              display: false
            },

            {
              width: 110,
              label: "所属街道",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "townStreetName",
              search: true,
              searchSpan: 4
            },

            {
              width: 156,
              overHidden: true,
              label: "所属社区",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "neiName",
              search: true,
              searchSpan: 4
            },

            {
              width: 110,
              overHidden: true,
              label: "所属网格",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "gridName",
            },

            {
              width: 156,
              overHidden: true,
              label: "地址",
              prop: "address",
              display: false
            },


            {
              hide: true,
              parent: false,
              width: 160,
              label: "籍贯地区",
              prop: "nativePlaceAdcode",
              type: "tree",
              typeformat(item, label, value) {
                return item.addressDetail
              },
              change: ({
                value,
                column,
                item,
                dic
              }) => {
                item.addressDetail = findParentOrCur(dic, item.id)
              },
              props: {
                label: 'name',
                value: 'id'
              },
              dicUrl: `/api/blade-system/region/getBaseTree`,
            },

            {
              hide: true,
              label: "户籍类型",
              prop: "residentType",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              parent: false,
              width: 160,
              label: "户籍地区",
              prop: "residentAdcode",
              type: "tree",
              typeformat(item, label, value) {
                return item.addressDetail
              },
              change: ({
                value,
                column,
                item,
                dic
              }) => {
                item.addressDetail = findParentOrCur(dic, item.id)
              },
              props: {
                label: 'name',
                value: 'id'
              },
              dicUrl: `/api/blade-system/region/getBaseTree`,
            },

            {
              label: "户籍地址",
              prop: "hukouRegistration",
              hide: true,
            },

            {
              disabled: false,
              label: "居住地区",
              prop: "homeAdcode",
              hide: true,
              type: 'select',
              props: {
                label: 'name',
                value: 'code'
              },
              dicUrl: `/api/blade-system/region/select?code=361102`,
            },

            {
              disabled: false,
              label: "现居住地",
              prop: "currentAddress",
              hide: true,
            },

            {
              width: 210,
              overHidden: true,
              label: "标签",
              prop: "householdLabelList",
              display: false
            },

            {
              label: "民族",
              prop: "ethnicity",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=nationType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "学历",
              prop: "education",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              width: 160,
              label: "职业类别",
              prop: "occupation"
            },

            {
              label: "工作单位",
              prop: "employer",
              hide: true,
            },

            {
              hide: true,
              width: 160,
              label: "工作单位地址",
              prop: "cmpyRegAddr"
            },

            {
              label: "工作状态",
              prop: "workStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=workStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "婚姻状态",
              prop: "maritalStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=marriageStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              width: 160,
              label: "宗教信仰",
              prop: "religiousBelief",
            },

            {
              hide: true,
              label: "健康状态",
              prop: "healthStatus",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=healthStatus",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              disabled: true,
              hide: true,
              width: 160,
              label: "疾病名称",
              prop: "diseaseName"
            },

            {
              hide: true,
              width: 160,
              label: "外出去向",
              prop: "goOutWhere"
            },

            {
              hide: true,
              width: 160,
              label: "外出原因",
              prop: "goOutReason"
            },

            {
              hide: true,
              label: "外出时间",
              prop: "goOutTime",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              width: 160,
            },

            {
              hide: true,
              width: 160,
              label: "外出详址",
              prop: "goOutAddr"
            },

            {
              label: "车牌号",
              prop: "cardNumber",
              hide: true,
            },
          ]
        },
        data: [],

        excelForm: {},
        labelForm: {},
        labelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
            label: '级别',
            prop: 'color',
            type: 'radio',
            button: true,
            row: true,
            dicData: [{
              label: '撤销',
              value: '#EBEDF0'
            }, {
              label: '绿',
              value: '#30D17C'
            }, {
              label: '黄',
              value: '#FFB42B'
            }, {
              label: '红',
              value: '#EA1F1F'
            }],
            rules: [{
              required: true,
              message: "请选择",
              trigger: "blur"
            }]
          }, {
            row: true,
            label: '备注',
            prop: 'remark',
            type: 'input'
          }]
        },
        excelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
              label: '模板上传',
              prop: 'excelFile',
              type: 'upload',
              drag: true,
              loadText: '模板上传中，请稍等',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              tip: '请上传 .xls,.xlsx 标准格式文件',
              action: "/api/blade-system/user/import-user"
            },
            {
              label: "数据覆盖",
              prop: "isCovered",
              type: "switch",
              align: "center",
              width: 80,
              dicData: [{
                  label: "否",
                  value: 0
                },
                {
                  label: "是",
                  value: 1
                }
              ],
              value: 0,
              slot: true,
              rules: [{
                required: true,
                message: "请选择是否覆盖",
                trigger: "blur"
              }]
            },
            {
              label: '模板下载',
              prop: 'excelTemplate',
              formslot: true,
              span: 24,
            }
          ]
        },
        currentLabel: {},
        currentRow: {},
        householdLabelList: [],
      }
    },
    watch: {
      'form.source': {
        handler(newData) {
          let currentAddressColumn = this.findObject(
            this.option.column,
            'currentAddress'
          )

          let homeAdcodeColumn = this.findObject(
            this.option.column,
            'homeAdcode'
          )

          if (newData == 1) {
            currentAddressColumn.disabled = true
            homeAdcodeColumn.disabled = true
          } else {
            currentAddressColumn.disabled = false
            homeAdcodeColumn.disabled = false
          }
        },
      },

      'form.cardType': {
        handler(newData) {
          let idCardColumn = this.findObject(
            this.option.column,
            'idCard'
          )

          let cardNoColumn = this.findObject(
            this.option.column,
            'cardNo'
          )

          if (newData == 111) {
            idCardColumn.display = true
            cardNoColumn.display = false
          } else {
            idCardColumn.display = false
            cardNoColumn.display = true
          }
        },
      },

      'form.healthStatus': {
        handler(newData) {
          let diseaseNameColumn = this.findObject(
            this.option.column,
            'diseaseName'
          )

          if (newData == 3) {
            diseaseNameColumn.disabled = false
          } else {
            diseaseNameColumn.disabled = true
          }
        },
      },
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.household_add, false),
          viewBtn: this.vaildData(this.permission.household_view, true),
          delBtn: this.vaildData(this.permission.household_delete, true),
          editBtn: this.vaildData(this.permission.household_edit, true)
        }
      },

      textDispose() {
        return (row, flag, type) => {
          if (row[flag] || row[type] == null) {
            return row[type]
          } else {
            if (type == 'idCard') {
              return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
            } else {
              return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
            }
          }
        }
      },

      labelDispose() {
        return (list) => {
          return list.map(item => item.labelName).join(',')
        }
      }
    },
    mounted() {},
    methods: {
      init(row) {
        console.log(JSON.stringify(row))
        this.query.regionCode = row.communityCode
        // this.onLoad(this.page, this.query)
      },
      onsubmit() {
        if (this.labelForm.color === '#EBEDF0') {
          let params = {
            householdId: this.currentRow.id,
            labelId: this.currentLabel.id
          }
          removeHouseholdLabel(params).then(res => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        } else {
          this.labelForm.houseCode = this.currentRow.houseCode
          this.labelForm.householdId = this.currentRow.id
          this.labelForm.labelId = this.currentLabel.id
          this.labelForm.lableType = 1

          saveOrUpdateHouseholdLabel(this.labelForm).then(res => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        }
      },

      changLabel(item) {
        this.editLabelFlge = true
        this.currentLabel = item
        this.labelForm.color = item.color
        this.labelForm.remark = item.remark
      },

      manageLabel(item) {
        this.loading = true
        this.currentRow = item
        this.labelFlag = true
        let params = {
          parentId: 103
        }
        // 查询标签
        getLabelList(Object.assign(params)).then(res => {
          const data = res.data.data
          // this.labelData = data;
          // 查询详情
          getDetatils(item.id).then(res => {
            this.householdLabelList = res.data.data.householdLabelList
            // 将细类放到一起
            data.forEach(e => {
              e.children.forEach(f => {
                if (this.householdLabelList.length > 0) {
                  this.householdLabelList.forEach(h => {
                    if (Number(f.id) == h.labelId) {
                      f['color'] = h.color
                      f['remark'] = h.remark
                    }
                  })
                }
              })
            })
            this.labelData = data
            this.loading = false
          })
        })
      },
      rowSave(row, done, loading) {
        add(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(row.id)
          })
          .then(() => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!"
            })
          })
      },
      searchReset() {
        this.query = {}
        this.treeDeptId = ''
        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();
      },
      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()
          })
      },
      handleImport() {
        this.excelBox = true
      },
      uploadAfter(res, done, loading, column) {
        this.excelBox = false
        this.refreshChange()
        done()
      },
      handleExport() {
        this.$confirm("是否导出住户数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          NProgress.start()
          var data = {
            ...this.query
          }
          data = Qs.stringify(data)
          exportBlob(
            `/api/blade-household/household/export-household?${this.website.tokenHeader}=${getToken()}&` + data
          ).then(res => {
            downloadXls(res.data, `住户数据表${dateNow()}.xlsx`)
            NProgress.done()
          })
        })
      },
      handleTemplate() {
        exportBlob(`/api/blade-system/user/export-template?${this.website.tokenHeader}=${getToken()}`).then(res => {
          downloadXls(res.data, "住户数据模板.xlsx")
        })
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetatils(this.form.id).then(res => {
            this.form = res.data.data
            done()
          })
        }
        this.initFlag = true
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },

      onLoad(page, params = {}) {
        this.query.parentId = 100
        this.loading = true
        getKeynotePersonnelPage(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = {
            ...res.data.data,
            records: res.data.data.records.map(item => {
              return {
                ...item,
                'phoneNumberflag': false,
                'idCardflag': false
              }
            })
          }
          this.page.total = data.total
          this.data = data.records
          this.loading = false
          this.selectionClear()
        })
      },

      showStringDispose(row, type) {
        row[type] = !row[type]
      }
    }
  }
</script>

<style>
  .box {
    height: 800px;
  }

  .grid-container2 {
    /* display: grid;
    grid-template-columns: auto auto auto auto;
    grid-gap: 10px; */
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 20px;
  }

  .grid-item {
    padding: 8px 14px;
    border: 1px solid #dcdfe6;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 20px;
  }

  .grid-item:hover {
    background-color: #e8f4ff;
    color: #017BFC;
    cursor: pointer;
  }

  .el-scrollbar {
    height: 100%;
  }

  .box .el-scrollbar__wrap {
    overflow: scroll;
  }
</style>

 src/views/publicSecurity/bailReporting.vue

@@ -28,466 +28,469 @@
</template>

<script>
  import {
    getBailReportingPage,
    removeTask,
    update,
    add,
  } from "@/api/task/task"
import {
  getBailReportingPage,
  removeTask,
  update,
  add,
} from "@/api/task/task"

  import {
    update as bailReportingUpdate,
    getList as bailReportingGetList
  } from "@/api/task/bailReporting"
import {
  update as bailReportingUpdate,
  getList as bailReportingGetList
} from "@/api/task/bailReporting"

  import {
    mapGetters
  } from "vuex"
import {
  mapGetters
} from "vuex"

  import website from '@/config/website'
import website from '@/config/website'

  import bailReportingDetail from './components/bailReportingDetail'
  // import baseAllInfo from './components/baseAllInfo'
import bailReportingDetail from './components/bailReportingDetail'
// import baseAllInfo from './components/baseAllInfo'

  export default {
    data() {
export default {
  data() {

      //手机号格式校验
      let validatorPhone = function(rule, value, callback) {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            callback(new Error('手机号格式有误！'))
          } else {
            callback()
          }
    //手机号格式校验
    let validatorPhone = function (rule, value, callback) {
      if (value) {
        if (!/^1[3456789]\d{9}$/.test(value)) {
          callback(new Error('手机号格式有误！'))
        } else {
          callback()
        }
        callback()
      }
      callback()
    }

      return {
        curRow: {},
        roleBox: false,
    return {
      curRow: {},
      roleBox: false,

        form: {},
        query: {},
        loading: true,
      form: {},
      query: {},
      loading: true,

        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      datetime: "",
      selectionList: [],
      option: {
        labelWidth: 96,
        searchLabelWidth: 96,
        searchShow: true,
        searchMenuSpan: 3,
        menuWidth: 210,

        height: "auto",
        calcHeight: 54,
        dialogWidth: 950,
        tip: false,
        border: true,
        // menu: false,
        //stripe:true,
        index: true,
        // viewBtn: true,
        delBtn: false,
        editBtn: false,
        selection: true,
        dialogClickModal: false,
        column: [{
          span: 12,
          label: "社区",
          prop: "communityName",
          searchSpan: 4,
          searchLabelWidth: 66,
          search: true,
          hide: true,
        },
        datetime: "",
        selectionList: [],
        option: {
          labelWidth: 96,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 210,

          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          border: true,
          // menu: false,
          //stripe:true,
          index: true,
          // viewBtn: true,
          delBtn: false,
          editBtn: false,
          selection: true,
          dialogClickModal: false,
          column: [{
              span: 12,
              label: "社区",
              prop: "communityName",
              searchSpan: 4,
              search: true,
              hide: true,
            },
            {
              span: 12,
              label: "小区",
              prop: "districtName",
              searchSpan: 4,
              search: true,
              hide: true,
            },
            {
              width: 100,
              span: 12,
              label: "名称",
              prop: "name",
              searchSpan: 4,
              searchLabelWidth: 66,
              search: true,
            }, {
              width: 120,
              span: 12,
              label: "联系方式",
              prop: "phone",
              searchSpan: 4,
              search: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            }, {
              span: 12,
              label: "外出事由",
              prop: "applyName",
              searchSpan: 4,
              search: true,
            },
            {
              width: 144,
              label: "创建时间",
              prop: "createTime",
              searchSpan: 4,
            },
            {
              width: 100,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '审核状态',
              prop: 'status',
              type: 'radio',
              slot: true,
              dicData: [{
                label: '待审核',
                value: 1
              }, {
                label: '已审核',
                value: 2
              }, {
                label: '未通过',
                value: 3
              }]
            },
            {
              width: 110,
              label: "所属街道",
              // hide: true,
              searchSpan: 4,
              search: true,
              parent: false,
              prop: "streetCode",
              type: "tree",
              dicUrl: "/api/blade-system/region/getTownTree",
              props: {
                label: "name",
                value: "id"
              },
              rules: [{
                required: true,
                message: "请选择所属街道",
                trigger: "blur",
              }, ],
            }, {
              width: 156,
              // hide: true,
              parent: false,
              searchSpan: 4,
              label: "所属社区",
              prop: "neiCode",
              search: true,
              type: "tree",
              dicUrl: "/api/blade-system/region/tree",
              props: {
                label: "name",
                value: "id",
              },
              cascader: ["gridId"],
              rules: [{
                required: true,
                message: "请选择所属社区",
                trigger: "blur",
              }, ],
            }, {
              width: 220,
              overHidden: true,
              label: "小区",
              prop: "aoiCode",
              searchSpan: 4,
              type: 'tree',
              searchLabelWidth: 66,
              search: true,
              parent: false,
              dicUrl: `/api/blade-district/district/getDistrictTree`,
              props: {
                label: "name",
                value: "aoiCode"
              },
              // defaultExpandedKeys: ["361102003"],
              span: 12,
              rules: [{
                required: true,
                message: "请选择小区",
                trigger: "blur",
              }, ],
              // disabled: true
              display: true,
              // hide: true,
            },

          ],
        {
          span: 12,
          label: "小区",
          prop: "districtName",
          searchSpan: 4,
          searchLabelWidth: 66,
          search: true,
          hide: true,
        },
        data: [],
        {
          width: 100,
          span: 12,
          label: "姓名",
          prop: "realName",
          searchSpan: 3,
          searchLabelWidth: 66,
          search: true,
        }, {
          width: 120,
          span: 12,
          label: "联系方式",
          prop: "phone",
          searchSpan: 4,
          search: true,
          rules: [{
            validator: validatorPhone,
            trigger: 'blur'
          }],
        }, {
          span: 12,
          label: "外出事由",
          prop: "applyName",
          searchSpan: 4,
          search: true,
        },
        {
          width: 110,
          label: "所属街道",
          // hide: true,
          searchSpan: 4,
          // search: true,
          parent: false,
          prop: "streetCode",
          type: "tree",
          dicUrl: "/api/blade-system/region/getTownTree",
          props: {
            label: "name",
            value: "id"
          },
          rules: [{
            required: true,
            message: "请选择所属街道",
            trigger: "blur",
          },],
        }, {
          width: 156,
          // hide: true,
          parent: false,
          searchSpan: 4,
          label: "所属社区",
          prop: "neiCode",
          // search: true,
          type: "tree",
          dicUrl: "/api/blade-system/region/tree",
          props: {
            label: "name",
            value: "id",
          },
          cascader: ["gridId"],
          rules: [{
            required: true,
            message: "请选择所属社区",
            trigger: "blur",
          },],
        }, {
          width: 220,
          overHidden: true,
          label: "小区",
          prop: "aoiCode",
          searchSpan: 4,
          type: 'tree',
          searchLabelWidth: 66,
          // search: true,
          parent: false,
          dicUrl: `/api/blade-district/district/getDistrictTree`,
          props: {
            label: "name",
            value: "aoiCode"
          },
          // defaultExpandedKeys: ["361102003"],
          span: 12,
          rules: [{
            required: true,
            message: "请选择小区",
            trigger: "blur",
          },],
          // disabled: true
          display: true,
          // hide: true,
        },
        // {
        //   width: 144,
        //   label: "创建时间",
        //   prop: "createTime",
        //   searchSpan: 4,
        // },
        {
          width: 100,
          addDisplay: false,
          editDisplay: false,
          viewDisplay: false,
          label: '审核状态',
          prop: 'status',
          type: 'radio',
          slot: true,
          dicData: [{
            label: '待审核',
            value: 1
          }, {
            label: '已审核',
            value: 2
          }, {
            label: '未通过',
            value: 3
          }]
        },

        auditBasePopup: false,
      }
    },

    provide() {
        ],
      },
      data: [],

      auditBasePopup: false,
    }
  },

  provide() {
    return {
      placeElement: this,
    }
  },

  components: {
    bailReportingDetail,
  },

  watch: {},

  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        placeElement: this,
        addBtn: this.vaildData(this.permission.place_add, false),
        viewBtn: this.vaildData(this.permission.place_view, true),
        delBtn: this.vaildData(this.permission.place_delete, true),
        editBtn: this.vaildData(this.permission.place_edit, true),
      }
    },

    components: {
      bailReportingDetail,
    ids() {
      let ids = []
      this.selectionList.forEach((ele) => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },

    watch: {},
    showStatus() {
      return (data) => {
        let tags = {}

    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.place_add, true),
          viewBtn: this.vaildData(this.permission.place_view, true),
          delBtn: this.vaildData(this.permission.place_delete, true),
          editBtn: this.vaildData(this.permission.place_edit, true),
        }
      },
      ids() {
        let ids = []
        this.selectionList.forEach((ele) => {
          ids.push(ele.id)
        })
        return ids.join(",")
      },

      showStatus() {
        return (data) => {
          let tags = {}

          if (data == 1) {
            tags = {
              type: 'warning',
              text: '待审核'
            }
          } else if (data == 2) {
            tags = {
              type: 'success',
              text: '已审核'
            }
          } else if (data == 3) {
            tags = {
              type: 'danger',
              text: '未通过'
            }
        if (data == 1) {
          tags = {
            type: 'warning',
            text: '待审核'
          }

          return tags
        }
      }
    },
    methods: {
      colseDetail() {
        this.auditBasePopup = false
        this.onLoad(this.page)
      },
      lookDetail(row, applyType) {
        this.auditBasePopup = true
        var that = this
        this.$nextTick(() => {
          that.$refs.bailReportingDetail.init(row, applyType)
        })
      },
      auditCur(row) {
        this.curAuditRow = row
        this.auditBasePopup = true
      },

      roleBoxClose() {
        this.curRow = {}
      },

      ManageTenants(item) {
        this.curRow = item
        this.roleBox = true
      },

      rowSave(row, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",").filter(item => item != '')
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        let label = row.label

        if (row.smallLabel != '') {
          label = label + ',' + row.smallLabel
        }

        delete row.smallLabel

        add({
          ...row,
          label
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
        } else if (data == 2) {
          tags = {
            type: 'success',
            text: '已审核'
          }
        )
      },

      rowUpdate(row, index, done, loading) {
        bailReportingUpdate({
          ...row
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
        } else if (data == 3) {
          tags = {
            type: 'danger',
            text: '未通过'
          }
        )
      },

      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            row.isDeleted = 1
            return removeTask(row)
          })
          .then(() => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!",
            })
          })
      },
      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.$nextTick(() => {
          this.$refs.crud && this.$refs.crud.toggleSelection()
        })
      },
      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)) {} else {
          done()
        }
      },

      currentChange(currentPage) {
        this.page.currentPage = currentPage
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },
      onLoad(page, params = {}) {
        const {
          dateTime
        } = this.query
        let values = {
          ...params,
        }
        values.reportType = 1
        this.loading = true
        getBailReportingPage(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data
          this.page.total = data.total
          this.data = data.records
          this.data.forEach(item => {
            if (item.imageUrls && item.imageUrls != '' && item.imageUrls != null && item.imageUrls.length) {
              var urls = []
              var names = item.imageUrls.split(",").filter(item => item != '')
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              item.imageUrls = urls.join(",")
            }
          })
          this.loading = false
          this.selectionClear()
        })
        return tags
      }
    }
  },
  methods: {
    colseDetail() {
      this.auditBasePopup = false
      this.onLoad(this.page)
    },
    lookDetail(row, applyType) {
      this.auditBasePopup = true
      var that = this
      this.$nextTick(() => {
        that.$refs.bailReportingDetail.init(row, applyType)
      })
    },
    auditCur(row) {
      this.curAuditRow = row
      this.auditBasePopup = true
    },

    roleBoxClose() {
      this.curRow = {}
    },

    ManageTenants(item) {
      this.curRow = item
      this.roleBox = true
    },

    rowSave(row, done, loading) {
      if (row.imageUrls.length > 0) {
        var urls = []
        var split = row.imageUrls.split(",").filter(item => item != '')
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.imageUrls = urls.join(",")
      }

      let label = row.label

      if (row.smallLabel != '') {
        label = label + ',' + row.smallLabel
      }

      delete row.smallLabel

      add({
        ...row,
        label
      }).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },

    rowUpdate(row, index, done, loading) {
      bailReportingUpdate({
        ...row
      }).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },

    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          row.isDeleted = 1
          return removeTask(row)
        })
        .then(() => {
          this.onLoad(this.page)

          this.$message({
            type: "success",
            message: "操作成功!",
          })
        })
    },
    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.$nextTick(() => {
        this.$refs.crud && this.$refs.crud.toggleSelection()
      })
    },
    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)) { } else {
        done()
      }
    },

    currentChange(currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize
    },
    refreshChange() {
      this.onLoad(this.page, this.query)
    },
    onLoad(page, params = {}) {
      const {
        dateTime
      } = this.query
      let values = {
        ...params,
      }
      values.reportType = 1
      this.loading = true
      getBailReportingPage(page.currentPage, page.pageSize, values).then((res) => {
        const data = res.data.data
        this.page.total = data.total
        this.data = data.records
        this.data.forEach(item => {
          if (item.imageUrls && item.imageUrls != '' && item.imageUrls != null && item.imageUrls.length) {
            var urls = []
            var names = item.imageUrls.split(",").filter(item => item != '')
            names.forEach(name => {
              urls.push(website.minioUrl + name)
            })
            item.imageUrls = urls.join(",")
          }
        })
        this.loading = false
        this.selectionClear()
      })
    }
  }
}
</script>

<style>
  .avue-upload__icon {
    line-height: 6;
  }
.avue-upload__icon {
  line-height: 6;
}
</style>

 src/views/publicSecurity/components/communityKeyNotePersonnel.vue

New file
@@ -0,0 +1,447 @@
<template>
  <basic-container>
    <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" @row-del="rowDel"
      v-model="form" :permission="permissionList" @row-update="rowUpdate" @row-save="rowSave" :before-open="beforeOpen"
      @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
      @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange">

      <!-- <template slot-scope="scope" slot="menu">
        <el-button type="text" size="small" icon="el-icon-view" plain @click="lookDetail(scope.row)">查 看
        </el-button>
      </template> -->

      <template slot-scope="{row, size}" slot="number1">
        <el-button :size="size" type="text" @click="lookDetail(row, '19')">
          {{ row.number1 }}
        </el-button>
      </template>

      <template slot-scope="{row, size}" slot="number2">
        <el-button :size="size" type="text" @click="lookDetail(row, '20')">
          {{ row.number2}}
        </el-button>
      </template>

      <template slot-scope="{row, size}" slot="number3">
        <el-button :size="size" type="text" @click="lookDetail(row, '22')">
          {{ row.number3}}
        </el-button>
      </template>
      <template slot-scope="{row, size}" slot="number4">
        <el-button :size="size" type="text" @click="lookDetail(row, '23')">
          {{ row.number4}}
        </el-button>
      </template>
      <template slot-scope="{row, size}" slot="number5">
        <el-button :size="size" type="text" @click="lookDetail(row, '1025')">
          {{ row.number5 }}
        </el-button>
      </template>
    </avue-crud>

    <el-dialog title="" append-to-body :visible.sync="auditBasePopup" width="80%">
      <userHouseList ref="userHouseList"></userHouseList>
    </el-dialog>
  </basic-container>
</template>

<script>
  import {
    getCommunityStatisticalLabels
  } from "@/api/userHouse/list/userHouseList"

  import {
    mapGetters
  } from "vuex"

  import website from '@/config/website'

  import userHouseList from '../components/userHouseList.vue'

  export default {
    data() {
      return {
        taskType: 0,
        curRow: {},
        roleBox: false,

        form: {},
        query: {},
        loading: true,

        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,
          menu: false,
          border: true,
          //stripe:true,
          index: true,
          // viewBtn: true,
          editBtn: false,
          delBtn: false,
          addBtn: false,
          // selection: true,
          dialogClickModal: false,
          column: [{
              span: 12,
              label: "所属社区",
              prop: "communityName",
              align: 'center',
              searchSpan: 4,
              // search: true,
              // hide: true,
            },
            {
              span: 12,
              label: "刑释解教人员",
              prop: "number1",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "肇事肇祸精神障碍患者",
              prop: "number2",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "一般精神障碍患者",
              prop: "number3",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "重点对象",
              prop: "number4",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "取保候审",
              prop: "number5",
              align: 'center',
              searchSpan: 4,
            },
          ],
        },
        data: [],
        regionCode: '',

        auditBasePopup: false,
      }
    },

    provide() {
      return {
        placeElement: this,
      }
    },

    components: {
      userHouseList,
    },

    watch: {},

    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.place_add, true),
          viewBtn: this.vaildData(this.permission.place_view, true),
          delBtn: this.vaildData(this.permission.place_delete, true),
          editBtn: this.vaildData(this.permission.place_edit, true),
        }
      },
      ids() {
        let ids = []
        this.selectionList.forEach((ele) => {
          ids.push(ele.id)
        })
        return ids.join(",")
      },

    },
    methods: {
      init(row) {
        this.regionCode = row.regionCode
        this.onLoad(this.page, this.query)
        // console.log(JSON.stringify(row))
      },

      colseDetail() {
        this.auditBasePopup = false
        this.onLoad(this.page)
      },

      lookDetail(row, type) {
        row.labelId = type
        this.auditBasePopup = true
        var that = this
        this.$nextTick(() => {
          that.$refs.userHouseList.init(row)
        })
      },

      auditCur(row) {
        this.curAuditRow = row
        this.auditBasePopup = true
      },

      roleBoxClose() {
        this.curRow = {}
      },

      ManageTenants(item) {
        this.curRow = item
        this.roleBox = true
      },

      rowSave(row, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",").filter(item => item != '')
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        let label = row.label

        if (row.smallLabel != '') {
          label = label + ',' + row.smallLabel
        }

        delete row.smallLabel

        add({
          ...row,
          label
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },

      rowUpdate(row, index, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",").filter(item => item != '')
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        let label = row.label

        if (row.smallLabel != '') {
          label = label + ',' + row.smallLabel
        }

        delete row.smallLabel

        update({
          ...row,
          label
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },

      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            row.isDeleted = 1
            return removeTask(row)
          })
          .then(() => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!",
            })
          })
      },
      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.$nextTick(() => {
          this.$refs.crud && this.$refs.crud.toggleSelection()
        })
      },
      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)) {
          // getPlace(this.form.id).then((res) => {
          //   this.form = res.data.data
          //   if (this.form.imageUrls.length) {
          //     this.form.imageUrls = this.form.imageUrls.split(",").filter(item => item != '').map(item => website
          //       .minioUrl + item).join(',')
          //   }
          //   if (this.form.placePoiLabelVOList.length) {
          //     let lebelTwo = this.form.placePoiLabelVOList.find(item => {
          //       return item.type == 2
          //     })
          //     if (lebelTwo) this.form.label = String(lebelTwo.poiCode)
          //     let lebelThree = this.form.placePoiLabelVOList.find(item => {
          //       return item.type == 3
          //     })
          //     if (lebelThree) this.form.smallLabel = String(lebelThree.poiCode)
          //   }
          //   done()
          // })
        } else {
          done()
        }
      },

      currentChange(currentPage) {
        this.page.currentPage = currentPage
        this.onLoad(this.page, this.query)
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
        this.onLoad(this.page, this.query)
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },
      onLoad(page, params = {}) {
        const {
          dateTime
        } = this.query
        let values = {
          ...params,
        }
        values.regionCode = this.regionCode
        this.loading = true
        getCommunityStatisticalLabels(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data
          this.page.total = data.total
          this.data = data.records
          this.data.forEach(item => {
            if (item.imageUrls && item.imageUrls != '' && item.imageUrls != null && item.imageUrls.length) {
              var urls = []
              var names = item.imageUrls.split(",").filter(item => item != '')
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              item.imageUrls = urls.join(",")
            }
          })
          this.loading = false
          this.selectionClear()
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .avue-upload__icon {
    line-height: 6;
  }

  .cur-container-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;

    .content-box {
      margin: 0 4px;
      padding: 0 16px;
      height: 0;
      flex: 1;
      overflow: hidden;
      overflow-y: auto;
    }

    .footer-btn-box {
      margin-top: 10px;
      display: flex;
      justify-content: center;
    }
  }
</style>

 src/views/publicSecurity/components/userHouseList.vue

@@ -6,18 +6,7 @@
          v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
          :before-open="beforeOpen" :page.sync="page" @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" plain icon="el-icon-delete" v-if="permission.household_delete"
              @click="handleDelete">删 除
            </el-button>
            <el-button type="success" size="small" plain v-if="this.permission.household_import" icon="el-icon-upload2"
              @click="handleImport">导入
            </el-button>
            <el-button type="warning" size="small" plain v-if="this.permission.household_export" icon="el-icon-download"
              @click="handleExport">导出
            </el-button>
          </template> -->
          @refresh-change="refreshChange">

          <template slot-scope="{row, size}" slot="menu">
            <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" v-if="permission.househould_manager"
@@ -50,26 +39,15 @@
        </el-dialog>

        <el-dialog title="标签管理" append-to-body :visible.sync="labelFlag" center width="600px">
          <div v-for="(item, index) in labelData" :key="index">
            <el-row>
              <el-col :span="24">
                <div>
                  <el-divider content-position="left">{{ item.name }}</el-divider>
                </div>
              </el-col>
            </el-row>
            <div class="grid-container2" v-if="item.children">
              <div class="grid-item" :style="{ backgroundColor: item2.color }" v-for="(item2, index2) in item.children"
          <div>
            <div class="grid-container2">
              <div class="grid-item" :style="{ backgroundColor: item2.color }" v-for="(item2, index2) in labelData"
                @click="changLabel(item2)" :key="index2">
                {{ item2.name }}
              </div>
            </div>
          </div>

          <!-- <span slot="footer" class="dialog-footer">
            <el-button @click="labelFlag = false">取 消</el-button>
            <el-button type="primary" @click="submitRole">确 定</el-button>
          </span> -->
        </el-dialog>

        <el-dialog :title="'编辑标签   ' + currentLabel.name" append-to-body :visible.sync="editLabelFlge" width="655px">
@@ -97,7 +75,7 @@

<script>
  import {
    getList,
    getKeynotePersonnelPage,
    remove,
    add,
    update,
@@ -219,8 +197,10 @@
          border: true,
          index: true,
          selection: true,
          viewBtn: true,
          addBtn: true,
          viewBtn: false,
          addBtn: false,
          delBtn: false,
          editBtn: false,
          dialogType: 'drawer',
          dialogClickModal: false,
          menuFixed: 'right',
@@ -859,7 +839,15 @@
    mounted() {},
    methods: {
      init(row) {

        if (row.regionCode) {
          this.query.regionCode = row.regionCode
        }
        if (row.communityCode) {
          this.query.regionCode = row.communityCode
        }
        this.query.labelId = row.labelId
        this.query.parentId = 103
        this.onLoad(this.page, this.query)
      },
      onsubmit() {
        if (this.labelForm.color === '#EBEDF0') {
@@ -882,6 +870,7 @@
          this.labelForm.houseCode = this.currentRow.houseCode
          this.labelForm.householdId = this.currentRow.id
          this.labelForm.labelId = this.currentLabel.id
          this.labelForm.userId = this.currentRow.associatedUserId
          this.labelForm.lableType = 1

          saveOrUpdateHouseholdLabel(this.labelForm).then(res => {
@@ -910,7 +899,7 @@
        this.currentRow = item
        this.labelFlag = true
        let params = {
          parentId: 1000
          parentId: 103
        }
        // 查询标签
        getLabelList(Object.assign(params)).then(res => {
@@ -1076,7 +1065,7 @@
      onLoad(page, params = {}) {
        this.loading = true

        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        getKeynotePersonnelPage(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = {
            ...res.data.data,
            records: res.data.data.records.map(item => {

 src/views/publicSecurity/keynotePersonnelManage.vue

@@ -8,44 +8,69 @@
      <template slot-scope="scope" slot="menu">
        <el-button type="text" size="small" icon="el-icon-view" plain @click="lookDetail(scope.row)">查 看
        </el-button>
        <!-- <el-button type="text" size="small" icon="el-icon-s-check" v-if="scope.row.status == 1" plain
          @click="lookDetail(scope.row,1)">审 核
        </el-button> -->
        <!-- <el-button type="text" size="small" icon="el-icon-delete" plain @click="rowDel(scope.row)">删 除
        </el-button> -->
      </template>

      <template slot-scope="{row, size}" slot="regionName">
        <el-button :size="size" type="text" @click="lookDetail(row)">
          {{ row.regionName }}
        </el-button>
      </template>

      <template slot-scope="{row, size}" slot="number1">
        <el-button :size="size" type="text" @click="showStringDispose(row, '19')">
          {{ row.number1 }}
        </el-button>
      </template>

      <template slot-scope="{row, size}" slot="number2">
        <el-button :size="size" type="text" @click="showStringDispose(row, '20')">
          {{ row.number2}}
        </el-button>
      </template>

      <template slot-scope="{row, size}" slot="number3">
        <el-button :size="size" type="text" @click="showStringDispose(row, '22')">
          {{ row.number3}}
        </el-button>
      </template>
      <template slot-scope="{row, size}" slot="number4">
        <el-button :size="size" type="text" @click="showStringDispose(row, '23')">
          {{ row.number4}}
        </el-button>
      </template>
      <template slot-scope="{row, size}" slot="number5">
        <el-button :size="size" type="text" @click="showStringDispose(row, '1025')">
          {{ row.number5 }}
        </el-button>
      </template>
    </avue-crud>


    <el-dialog title="" append-to-body :visible.sync="auditBasePopup" width="80%">
      <userHouseList ref="userHouseList"></userHouseList>
      <!-- <hotelReporting @colseDetail="colseDetail" v-if="taskType == 2" ref="hotelReporting"></hotelReporting> -->
      <!-- <labelReporting @colseDetail="colseDetail" v-if="taskType == 3" ref="labelReporting"></labelReporting> -->
      <communityKeyNotePersonnel ref="communityKeyNotePersonnel"></communityKeyNotePersonnel>
    </el-dialog>

    <el-dialog title="" append-to-body :visible.sync="userPopup" width="80%">
      <userHouseList ref="userHouseList"></userHouseList>
    </el-dialog>

  </basic-container>
</template>

<script>
  import {
    statisticalLabels
  } from "/src/api/userHouse/list/userHouseList"
  } from "@/api/userHouse/list/userHouseList"

  // import {
  //   getList,
  //   removeTask,
  //   update,
  //   add,
  // } from "@/api/task/task"

  import {
    mapGetters
  } from "vuex"

  import userHouseList from './components/userHouseList.vue'

  import communityKeyNotePersonnel from './components/communityKeyNotePersonnel.vue'

  import website from '@/config/website'
  import userHouseList from './components/userHouseList'
  // import hotelReporting from './components/hotelReporting'
  // import labelReporting from './components/labelReporting'

  export default {
    data() {
@@ -72,8 +97,8 @@
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,
          // menu: false,
          // menuWidth: 280,
          menu: false,
          border: true,
          //stripe:true,
          index: true,
@@ -81,38 +106,58 @@
          editBtn: false,
          delBtn: false,
          addBtn: false,
          selection: true,
          // selection: true,
          dialogClickModal: false,
          column: [
            // {
            //   span: 12,
            //   label: "场所名称",
            //   prop: "name",
            //   searchSpan: 4,
            //   search: true,
            // },
            {
          column: [{
              span: 12,
              label: "所属街道",
              prop: "regionName",
              searchSpan: 4,
              align: 'center',
              search: true,
              // search: true,
              // hide: true,
            },
            // {
            //   span: 12,
            //   label: "所属社区",
            //   prop: "communityName",
            //   align: 'center',
            //   searchSpan: 4,
            //   search: true,
            //   // hide: true,
            // },
            {
              span: 12,
              label: "所属社区",
              prop: "communityName",
              label: "刑释解教人员",
              prop: "number1",
              align: 'center',
              searchSpan: 4,
              search: true,
              // hide: true,
            },
            {
              span: 12,
              label: "总数",
              prop: "numbers",
              label: "肇事肇祸精神障碍患者",
              prop: "number2",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "一般精神障碍患者",
              prop: "number3",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "重点对象",
              prop: "number4",
              align: 'center',
              searchSpan: 4,
            },
            {
              span: 12,
              label: "取保候审",
              prop: "number5",
              align: 'center',
              searchSpan: 4,
            },
@@ -121,6 +166,7 @@
        data: [],

        auditBasePopup: false,
        userPopup: false,
      }
    },

@@ -131,8 +177,8 @@
    },

    components: {
      communityKeyNotePersonnel,
      userHouseList,
      // hotelReporting,
      // labelReporting,
    },

@@ -164,13 +210,24 @@
        this.onLoad(this.page)
      },

      lookDetail(row) {
        this.auditBasePopup = true
      showStringDispose(row, type) {
        row.labelId = type
        this.userPopup = true
        var that = this
        this.$nextTick(() => {
          that.$refs.userHouseList.init(row)
        })
      },

      lookDetail(row) {
        this.auditBasePopup = true
        var that = this
        this.$nextTick(() => {
          that.$refs.communityKeyNotePersonnel.init(row)
        })
      },


      auditCur(row) {
        this.curAuditRow = row
        this.auditBasePopup = true

 src/views/publicSecurity/keynotePlaceManage.vue

@@ -33,581 +33,551 @@
</template>

<script>
  import {
    getList,
    removeTask,
    update,
    add,
  } from "@/api/task/task"
import {
  getList,
  removeTask,
  update,
  add,
} from "@/api/task/task"

  import {
    mapGetters
  } from "vuex"
import {
  mapGetters
} from "vuex"

  import website from '@/config/website'
  import campusReporting from './components/campusReporting'
  import hotelReporting from './components/hotelReporting'
  import labelReporting from './components/labelReporting'
import website from '@/config/website'
import campusReporting from './components/campusReporting'
import hotelReporting from './components/hotelReporting'
import labelReporting from './components/labelReporting'

  export default {
    data() {
export default {
  data() {

      //手机号格式校验
      let validatorPhone = function(rule, value, callback) {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            callback(new Error('手机号格式有误！'))
          } else {
            callback()
          }
        }
        callback()
      }

      return {
        taskType: 0,
        curRow: {},
        roleBox: false,

        form: {},
        query: {},
        loading: true,

        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          labelWidth: 96,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 210,

          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          // menu: false,
          border: true,
          //stripe:true,
          index: true,
          // viewBtn: true,
          editBtn: false,
          delBtn: false,
          selection: true,
          dialogClickModal: false,
          column: [{
              span: 12,
              label: "社区",
              prop: "communityName",
              searchSpan: 4,
              search: true,
              hide: true,
            },
            {
              span: 12,
              label: "小区",
              prop: "districtName",
              searchSpan: 4,
              search: true,
              hide: true,
            },

            {
              width: 110,
              span: 12,
              label: "名称",
              prop: "realName",
              searchSpan: 4,
              searchLabelWidth: 66,
              search: true,
            }, {
              width: 120,
              span: 12,
              label: "联系方式",
              prop: "phone",
              searchSpan: 4,
              search: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            }, {
              overHidee: true,
              span: 12,
              label: "地址",
              prop: "addressName",
              searchSpan: 4,
              // search: true,
              rules: [{
                required: true,
                message: "请输入地址",
                trigger: "blur",
              }, ],
            }, {
              width: 144,
              label: "创建时间",
              prop: "createTime",
              searchSpan: 4,

            },

            {
              width: 100,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '审核状态',
              prop: 'status',
              type: 'radio',
              slot: true,
              dicData: [{
                label: '待审核',
                value: 1
              }, {
                label: '已审核',
                value: 2
              }, {
                label: '未通过',
                value: 3
              }]
            }, {
              width: 110,
              label: "所属街道",
              // hide: true,
              search: true,
              parent: false,
              searchSpan: 4,
              prop: "streetCode",
              type: "tree",
              dicUrl: "/api/blade-system/region/getTownTree",
              props: {
                label: "name",
                value: "id"
              },
              rules: [{
                required: true,
                message: "请选择所属街道",
                trigger: "blur",
              }, ],
            }, {
              width: 156,
              // hide: true,
              search: true,
              parent: false,
              searchSpan: 4,
              label: "所属社区",
              prop: "neiCode",
              // search: false,
              type: "tree",
              dicUrl: "/api/blade-system/region/tree",
              props: {
                label: "name",
                value: "id",
              },
              rules: [{
                required: true,
                message: "请选择所属社区",
                trigger: "blur",
              }, ],
            }, {
              width: 220,
              overHidee: true,
              // hide: true,
              searchLabelWidth: 66,
              search: true,
              parent: false,
              searchSpan: 4,
              label: "小区",
              prop: "aoiCode",
              // search: false,
              type: "tree",
              dicUrl: "/api/blade-district/district/getDistrictTree",
              props: {
                label: "name",
                value: "aoiCode"
              },
              rules: [{
                required: true,
                message: "请选择小区",
                trigger: "blur",
              }, ],
            }, {
              width: 100,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '类型',
              prop: 'reportType',
              type: 'radio',
              slot: true,
              searchSpan: 4,
              searchLabelWidth: 66,
              search: true,
              dicData: [{
                label: '旅馆安全',
                value: 2
              }, {
                label: '打金店',
                value: 3
              }, {
                label: '二手手机维修',
                value: 4
              }, {
                label: '二手车交易',
                value: 5
              }, {
                label: '校园安全',
                value: 6
              }]
            },
          ],
        },
        data: [],

        auditBasePopup: false,
      }
    },

    provide() {
      return {
        placeElement: this,
      }
    },

    components: {
      campusReporting,
      hotelReporting,
      labelReporting,
    },

    watch: {},

    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.place_add, true),
          viewBtn: this.vaildData(this.permission.place_view, true),
          delBtn: this.vaildData(this.permission.place_delete, true),
          editBtn: this.vaildData(this.permission.place_edit, true),
        }
      },
      ids() {
        let ids = []
        this.selectionList.forEach((ele) => {
          ids.push(ele.id)
        })
        return ids.join(",")
      },
      showStatus() {
        return (data) => {
          let tags = {}

          if (data == 1) {
            tags = {
              type: 'warning',
              text: '待审核'
            }
          } else if (data == 2) {
            tags = {
              type: 'success',
              text: '已审核'
            }
          } else if (data == 3) {
            tags = {
              type: 'danger',
              text: '未通过'
            }
          }

          return tags
        }
      }
    },
    methods: {

      colseDetail() {
        this.auditBasePopup = false
        this.onLoad(this.page)
      },

      lookDetail(row, applyType) {
        this.auditBasePopup = true
        var that = this
        if (row.reportType == 6) {
          this.taskType = 6
          this.$nextTick(() => {
            that.$refs.campusReporting.init(row, applyType)
          })
        }
        if (row.reportType == 2) {
          this.taskType = 2
          this.$nextTick(() => {
            that.$refs.hotelReporting.init(row, applyType)
          })
        }
        if (row.reportType == 3 || row.reportType == 4 || row.reportType == 5) {
          this.taskType = 3
          this.$nextTick(() => {
            that.$refs.labelReporting.init(row, applyType)
          })
        }
      },
      auditCur(row) {
        this.curAuditRow = row
        this.auditBasePopup = true
      },

      roleBoxClose() {
        this.curRow = {}
      },

      ManageTenants(item) {
        this.curRow = item
        this.roleBox = true
      },

      rowSave(row, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",").filter(item => item != '')
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        let label = row.label

        if (row.smallLabel != '') {
          label = label + ',' + row.smallLabel
        }

        delete row.smallLabel

        add({
          ...row,
          label
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },

      rowUpdate(row, index, done, loading) {
        if (row.imageUrls.length > 0) {
          var urls = []
          var split = row.imageUrls.split(",").filter(item => item != '')
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.imageUrls = urls.join(",")
        }

        let label = row.label

        if (row.smallLabel != '') {
          label = label + ',' + row.smallLabel
        }

        delete row.smallLabel

        update({
          ...row,
          label
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },

      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            row.isDeleted = 1
            return removeTask(row)
          })
          .then(() => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!",
            })
          })
      },
      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.$nextTick(() => {
          this.$refs.crud && this.$refs.crud.toggleSelection()
        })
      },
      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)) {
          // getPlace(this.form.id).then((res) => {
          //   this.form = res.data.data
          //   if (this.form.imageUrls.length) {
          //     this.form.imageUrls = this.form.imageUrls.split(",").filter(item => item != '').map(item => website
          //       .minioUrl + item).join(',')
          //   }
          //   if (this.form.placePoiLabelVOList.length) {
          //     let lebelTwo = this.form.placePoiLabelVOList.find(item => {
          //       return item.type == 2
          //     })
          //     if (lebelTwo) this.form.label = String(lebelTwo.poiCode)
          //     let lebelThree = this.form.placePoiLabelVOList.find(item => {
          //       return item.type == 3
          //     })
          //     if (lebelThree) this.form.smallLabel = String(lebelThree.poiCode)
          //   }
          //   done()
          // })
    //手机号格式校验
    let validatorPhone = function (rule, value, callback) {
      if (value) {
        if (!/^1[3456789]\d{9}$/.test(value)) {
          callback(new Error('手机号格式有误！'))
        } else {
          done()
          callback()
        }
      },
      }
      callback()
    }

      currentChange(currentPage) {
        this.page.currentPage = currentPage
    return {
      taskType: 0,
      curRow: {},
      roleBox: false,

      form: {},
      query: {},
      loading: true,

      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      datetime: "",
      selectionList: [],
      option: {
        labelWidth: 96,
        searchLabelWidth: 96,
        searchShow: true,
        searchMenuSpan: 3,
        menuWidth: 210,

        height: "auto",
        calcHeight: 54,
        dialogWidth: 950,
        tip: false,
        // menu: false,
        border: true,
        //stripe:true,
        index: true,
        // viewBtn: true,
        editBtn: false,
        delBtn: false,
        selection: true,
        dialogClickModal: false,
        column: [{
          span: 12,
          label: "社区",
          prop: "communityName",
          searchSpan: 4,
          searchLabelWidth: 66,
          search: true,
          hide: true,
        },
        {
          width: 110,
          span: 12,
          label: "场所负责人",
          prop: "realName",
          searchSpan: 4,
          searchLabelWidth: 100,
          search: true,
        }, {
          width: 120,
          span: 12,
          label: "联系方式",
          prop: "phone",
          searchSpan: 4,
          search: true,
          rules: [{
            validator: validatorPhone,
            trigger: 'blur'
          }],
        }, {
          overHidee: true,
          span: 12,
          label: "地址",
          prop: "addressName",
          searchSpan: 4,
          // search: true,
          rules: [{
            required: true,
            message: "请输入地址",
            trigger: "blur",
          },],
        },{
          width: 110,
          label: "所属街道",
          // hide: true,
          // search: true,
          parent: false,
          searchSpan: 4,
          prop: "streetCode",
          type: "tree",
          dicUrl: "/api/blade-system/region/getTownTree",
          props: {
            label: "name",
            value: "id"
          },
          rules: [{
            required: true,
            message: "请选择所属街道",
            trigger: "blur",
          },],
        }, {
          width: 156,
          // hide: true,
          parent: false,
          searchSpan: 4,
          label: "所属社区",
          prop: "neiCode",
          // search: false,
          type: "tree",
          dicUrl: "/api/blade-system/region/tree",
          props: {
            label: "name",
            value: "id",
          },
          rules: [{
            required: true,
            message: "请选择所属社区",
            trigger: "blur",
          },],
        },
        //  {
        //   width: 144,
        //   label: "创建时间",
        //   prop: "createTime",
        //   searchSpan: 4,

        // },

        {
          width: 100,
          addDisplay: false,
          editDisplay: false,
          viewDisplay: false,
          label: '审核状态',
          prop: 'status',
          type: 'radio',
          slot: true,
          dicData: [{
            label: '待审核',
            value: 1
          }, {
            label: '已审核',
            value: 2
          }, {
            label: '未通过',
            value: 3
          }]
        },  {
          width: 100,
          addDisplay: false,
          editDisplay: false,
          viewDisplay: false,
          label: '类型',
          prop: 'reportType',
          type: 'radio',
          slot: true,
          searchSpan: 4,
          searchLabelWidth: 66,
          search: true,
          dicData: [{
            label: '旅馆安全',
            value: 2
          }, {
            label: '打金店',
            value: 3
          }, {
            label: '二手手机维修',
            value: 4
          }, {
            label: '二手车交易',
            value: 5
          }, {
            label: '校园安全',
            value: 6
          }]
        },
        ],
      },
      refreshChange() {
        this.onLoad(this.page, this.query)
      },
      onLoad(page, params = {}) {
        const {
          dateTime
        } = this.query
        let values = {
          ...params,
      data: [],

      auditBasePopup: false,
    }
  },

  provide() {
    return {
      placeElement: this,
    }
  },

  components: {
    campusReporting,
    hotelReporting,
    labelReporting,
  },

  watch: {},

  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.place_add, false),
        viewBtn: this.vaildData(this.permission.place_view, true),
        delBtn: this.vaildData(this.permission.place_delete, true),
        editBtn: this.vaildData(this.permission.place_edit, true),
      }
    },
    ids() {
      let ids = []
      this.selectionList.forEach((ele) => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },
    showStatus() {
      return (data) => {
        let tags = {}

        if (data == 1) {
          tags = {
            type: 'warning',
            text: '待审核'
          }
        } else if (data == 2) {
          tags = {
            type: 'success',
            text: '已审核'
          }
        } else if (data == 3) {
          tags = {
            type: 'danger',
            text: '未通过'
          }
        }
        // if (dateTime) {
        //   values = {
        //     ...params,
        //     startTime: dateTime[0],
        //     endTime: dateTime[1],
        //     ...this.query,
        //   }
        //   values.dateTime = null
        // }
        values.reportType = 2
        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
          this.data.forEach(item => {
            if (item.imageUrls && item.imageUrls != '' && item.imageUrls != null && item.imageUrls.length) {
              var urls = []
              var names = item.imageUrls.split(",").filter(item => item != '')
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              item.imageUrls = urls.join(",")
            }
          })
          this.loading = false
          this.selectionClear()
        })

        return tags
      }
    }
  },
  methods: {

    colseDetail() {
      this.auditBasePopup = false
      this.onLoad(this.page)
    },

    lookDetail(row, applyType) {
      this.auditBasePopup = true
      var that = this
      if (row.reportType == 6) {
        this.taskType = 6
        this.$nextTick(() => {
          that.$refs.campusReporting.init(row, applyType)
        })
      }
      if (row.reportType == 2) {
        this.taskType = 2
        this.$nextTick(() => {
          that.$refs.hotelReporting.init(row, applyType)
        })
      }
      if (row.reportType == 3 || row.reportType == 4 || row.reportType == 5) {
        this.taskType = 3
        this.$nextTick(() => {
          that.$refs.labelReporting.init(row, applyType)
        })
      }
    },
    auditCur(row) {
      this.curAuditRow = row
      this.auditBasePopup = true
    },

    roleBoxClose() {
      this.curRow = {}
    },

    ManageTenants(item) {
      this.curRow = item
      this.roleBox = true
    },

    rowSave(row, done, loading) {
      if (row.imageUrls.length > 0) {
        var urls = []
        var split = row.imageUrls.split(",").filter(item => item != '')
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.imageUrls = urls.join(",")
      }

      let label = row.label

      if (row.smallLabel != '') {
        label = label + ',' + row.smallLabel
      }

      delete row.smallLabel

      add({
        ...row,
        label
      }).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },

    rowUpdate(row, index, done, loading) {
      if (row.imageUrls.length > 0) {
        var urls = []
        var split = row.imageUrls.split(",").filter(item => item != '')
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.imageUrls = urls.join(",")
      }

      let label = row.label

      if (row.smallLabel != '') {
        label = label + ',' + row.smallLabel
      }

      delete row.smallLabel

      update({
        ...row,
        label
      }).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },

    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          row.isDeleted = 1
          return removeTask(row)
        })
        .then(() => {
          this.onLoad(this.page)

          this.$message({
            type: "success",
            message: "操作成功!",
          })
        })
    },
    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.$nextTick(() => {
        this.$refs.crud && this.$refs.crud.toggleSelection()
      })
    },
    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)) {
        // getPlace(this.form.id).then((res) => {
        //   this.form = res.data.data
        //   if (this.form.imageUrls.length) {
        //     this.form.imageUrls = this.form.imageUrls.split(",").filter(item => item != '').map(item => website
        //       .minioUrl + item).join(',')
        //   }
        //   if (this.form.placePoiLabelVOList.length) {
        //     let lebelTwo = this.form.placePoiLabelVOList.find(item => {
        //       return item.type == 2
        //     })
        //     if (lebelTwo) this.form.label = String(lebelTwo.poiCode)
        //     let lebelThree = this.form.placePoiLabelVOList.find(item => {
        //       return item.type == 3
        //     })
        //     if (lebelThree) this.form.smallLabel = String(lebelThree.poiCode)
        //   }
        //   done()
        // })
      } else {
        done()
      }
    },

    currentChange(currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize
    },
    refreshChange() {
      this.onLoad(this.page, this.query)
    },
    onLoad(page, params = {}) {
      const {
        dateTime
      } = this.query
      let values = {
        ...params,
      }
      // if (dateTime) {
      //   values = {
      //     ...params,
      //     startTime: dateTime[0],
      //     endTime: dateTime[1],
      //     ...this.query,
      //   }
      //   values.dateTime = null
      // }
      values.reportType = 2
      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
        this.data.forEach(item => {
          if (item.imageUrls && item.imageUrls != '' && item.imageUrls != null && item.imageUrls.length) {
            var urls = []
            var names = item.imageUrls.split(",").filter(item => item != '')
            names.forEach(name => {
              urls.push(website.minioUrl + name)
            })
            item.imageUrls = urls.join(",")
          }
        })
        this.loading = false
        this.selectionClear()
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .avue-upload__icon {
    line-height: 6;
  }
.avue-upload__icon {
  line-height: 6;
}

  .cur-container-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
.cur-container-box {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;

  .content-box {
    margin: 0 4px;
    padding: 0 16px;
    height: 0;
    flex: 1;
    overflow: hidden;

    .content-box {
      margin: 0 4px;
      padding: 0 16px;
      height: 0;
      flex: 1;
      overflow: hidden;
      overflow-y: auto;
    }

    .footer-btn-box {
      margin-top: 10px;
      display: flex;
      justify-content: center;
    }
    overflow-y: auto;
  }

  .footer-btn-box {
    margin-top: 10px;
    display: flex;
    justify-content: center;
  }
}
</style>

 src/views/resource/distapch.vue

New file
@@ -0,0 +1,530 @@
<template>
    <basic-container  v-if="false">
        <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" :permission="permissionList"
            v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
            :before-open="beforeOpen" @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.oss_delete"
                    @click="handleDelete">删 除
                </el-button>
            </template>

            <template slot-scope="{ row, size, index }" slot="menu">
                <el-button :size="size" type="text" icon="el-icon-video-play" v-if="userInfo.role_name.includes('admin')"
                    @click="handleDebug(row)">执行一次
                </el-button>
                <el-button :size="size" type="text" icon="el-icon-circle-check" v-if="permission.oss_enable"
                    @click.stop="handleEnable(row)">启用
                </el-button>
            </template>

            <template slot-scope="{row, size}" slot="status">
                <el-tag :size="size" :type="row.statusName == '是' ? 'success' : 'info'">{{ row.statusName }}</el-tag>
            </template>
            <template slot-scope="{row, size}" slot="category">
                <el-tag :size="size">{{ row.categoryName }}</el-tag>
            </template>
            <template slot-scope="{row, size}" slot="category">
                <el-tag :size="size">{{ row.categoryName }}</el-tag>
            </template>

            <template slot-scope="{type,disabled}" slot="cronForm">
               <el-input  placeholder="请选择cron">
                    <el-button slot="append" icon="el-icon-s-tools"  @click="cronPopover = true"></el-button>
              </el-input>
            </template>


        </avue-crud>

        <el-dialog title="对象存储上传调试" append-to-body :visible.sync="box" width="550px">
            <avue-form ref="form" :option="debugOption" v-model="debugForm" @submit="handleSubmit" />
        </el-dialog>


        <el-popover v-model="cronPopover">
        <vueCron @change="changeCron" @close="cronPopover=false" i18n="cn"/>
        <!-- <el-input
          slot="reference"
          v-model="ruleForm.execTime"
          placeholder="定时策略"
          @click="cronPopover=true"
        /> -->
      </el-popover>

    </basic-container>
</template>

<script>
import { getList, getDetail, add, update, remove, enable } from "@/api/resource/oss"
import { mapGetters } from "vuex"
import func from "@/util/func"
import vueCron from 'vue-cron'
export default {
    components:{
        vueCron
    },
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            box: false,
            cronPopover:false,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            selectionList: [],
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 350,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                viewBtn: true,
                selection: true,
                dialogWidth: 880,
                dialogClickModal: false,
                dialogDirection: 'rtl',
                dialogType: 'drawer',
                column: [
                    {
                        label: "分类",
                        type: "radio",
                        value: 1,
                        span: 24,
                        width: 120,
                        searchLabelWidth: 50,
                        row: true,
                        dicUrl: "/api/blade-system/dict/dictionary?code=oss",
                        props: {
                            label: "dictValue",
                            value: "dictKey"
                        },
                        dataType: "number",
                        slot: true,
                        prop: "category",
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择分类",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "资源编号",
                        prop: "ossCode",
                        span: 24,
                        width: 120,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入资源编号",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "资源地址",
                        prop: "endpoint",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入资源地址",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "空间名",
                        prop: "bucketName",
                        span: 24,
                        width: 120,
                        rules: [{
                            required: true,
                            message: "请输入空间名",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "accessKey",
                        prop: "accessKey",
                        span: 24,
                        search: true,
                        width: 200,
                        overHidden: true,
                        rules: [{
                            required: true,
                            message: "请输入accessKey",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "secretKey",
                        prop: "secretKey",
                        span: 24,
                        width: 200,
                        overHidden: true,
                        rules: [{
                            required: true,
                            message: "请输入secretKey",
                            trigger: "blur"
                        }],
                        display: false
                    },
                    {
                        label: "appId",
                        prop: "appId",
                        span: 24,
                        hide: true,
                        display: false,
                    },
                    {
                        label: "region",
                        prop: "region",
                        span: 24,
                        hide: true,
                        display: false,
                    },
                    {
                        width: 100,
                        label: "是否启用",
                        prop: "status",
                        span: 24,
                        align: "center",
                        slot: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                    },
                    {
                        label: "备注",
                        prop: "remark",
                        span: 24,
                        hide: true,
                        display: false
                    },
                ],
                group:[
                {
            label: '基础配置',
            prop: 'jbxx',
            column: [
              {
                label: '执行器',
                prop: '',
                type: 'select',
              },
              {
                label: '任务描述',
                prop: ''
              },
              {
                label: '负责人',
                prop: '',
 
              },
              {
                label: '报警邮件',
                prop: ''
              }
            ]
          }, 
          {
            label: '调度配置',
            prop: 'jbxx',
            column: [
              {
                label: '调度类型',
                prop: '',
                type: 'select',
              },
              {
                label: 'Cron',
                prop: 'cron',
                formslot:true,
              }
            ]
          }, 
          {
            label: '任务配置',
            prop: 'jbxx',
            column: [
              {
                label: '运行模式',
                prop: '',
                type: 'select',
              },
              {
                label: 'JobHandler',
                prop: ''
              },
              {
                label: '任务参数',
                prop: '',
                type: 'textarea',
                span:24
              }
            ]
          }, 
          {
            label: '高级配置',
            prop: 'jbxx',
            column: [
              {
                label: '调度类型',
                prop: '',
                type: 'select',
              },
              {
                label: '子任务ID',
                prop: ''
              },
              {
                label: '调度类型',
                prop: '',
                type: 'select',
              },
              {
                label: '任务参数',
                prop: '',
                type: 'select',
              },
              {
                label: '任务超时时间',
                prop: '',
              },
              {
                label: '失败重试次数',
                prop: '',
              }
            ]
          }, 
                ]
            },
            data: [],
            debugForm: {
                code: '',
            },
            debugOption: {
                submitText: "提交",
                column: [
                    {
                        label: "资源编号",
                        prop: "code",
                        disabled: true,
                        span: 24,
                    },
                    {
                        label: "上传背景",
                        prop: "backgroundUrl",
                        type: 'upload',
                        listType: 'picture-img',
                        dataType: 'string',
                        action: '/api/blade-resource/oss/endpoint/put-file',
                        propsHttp: {
                            res: 'data',
                            url: 'link',
                        },
                        span: 24,
                    },
                ]
            }
        }
    },
    watch: {
        'form.category' () {
            const category = func.toInt(this.form.category)
            this.$refs.crud.option.column.filter(item => {
                if (item.prop === "appId") {
                    item.display = category === 4
                }
                if (item.prop === "region") {
                    item.display = category === 4 || category === 5
                }
            })
        },
        'debugForm.code' () {
            const column = this.findObject(this.debugOption.column, "backgroundUrl")
            column.action = `/api/blade-resource/oss/endpoint/put-file?code=${this.debugForm.code}`
        }
    },
    computed: {
        ...mapGetters(["userInfo", "permission"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.oss_add),
                viewBtn: this.vaildData(this.permission.oss_view),
                delBtn: this.vaildData(this.permission.oss_delete),
                editBtn: this.vaildData(this.permission.oss_edit)
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        }
    },
    methods: {

        changeCron(val){
             console.log("===>",val);
        },

        rowSave (row, done, loading) {
            add(row).then(() => {
                this.onLoad(this.page)
                this.$message({
                    type: "success",
                    message: "操作成功!"
                })
                done()
            }, error => {
                window.console.log(error)
                loading()
            })
        },
        rowUpdate (row, index, done, loading) {
            update(row).then(() => {
                this.onLoad(this.page)
                this.$message({
                    type: "success",
                    message: "操作成功!"
                })
                done()
            }, error => {
                window.console.log(error)
                loading()
            })
        },
        rowDel (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return remove(row.id)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                })
        },
        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()
        },
        handleEnable (row) {
            this.$confirm("是否确定启用这条配置?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return enable(row.id)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                })
        },
        handleDebug (row) {
            this.box = true
            this.debugForm.code = row.ossCode
            this.debugForm.backgroundUrl = ''
        },
        handleSubmit (form, done) {
            this.$message({
                type: "success",
                message: `获取到图片地址:[${form.backgroundUrl}]`
            })
            done()
        },
        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()
        },
        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()
            })
        }
    }
}
</script>

 src/views/userHouse/houseHoldList.vue

@@ -1,1137 +1,1144 @@
<template>
    <el-row>
        <el-col :span="24">
            <basic-container>
                <avue-crud :option="option" :search.sync="search" :table-loading="loading" :data="data" ref="crud"
                    v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate"
                    @row-save="rowSave" :before-open="beforeOpen" :page.sync="page" @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" plain icon="el-icon-delete" v-if="permission.household_delete"
                            @click="handleDelete">删 除
                        </el-button>
                        <el-button type="success" size="small" plain v-if="this.permission.household_import"
                            icon="el-icon-upload2" @click="handleImport">导入
                        </el-button>
                        <el-button type="warning" size="small" plain v-if="this.permission.household_export"
                            icon="el-icon-download" @click="handleExport">导出
                        </el-button>
                    </template>
  <el-row>
    <el-col :span="24">
      <basic-container>
        <avue-crud :option="option" :search.sync="search" :table-loading="loading" :data="data" ref="crud"
          v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
          :before-open="beforeOpen" :page.sync="page" @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" plain icon="el-icon-delete" v-if="permission.household_delete"
              @click="handleDelete">删 除
            </el-button>
            <el-button type="success" size="small" plain v-if="this.permission.household_import" icon="el-icon-upload2"
              @click="handleImport">导入
            </el-button>
            <el-button type="warning" size="small" plain v-if="this.permission.household_export" icon="el-icon-download"
              @click="handleExport">导出
            </el-button>
          </template>

                    <template slot-scope="{row, size}" slot="menu">
                        <el-button :size="size" type="text" icon="el-icon-circle-plus-outline"
                            v-if="permission.househould_manager" @click="manageLabel(row)">标签
                        </el-button>
                    </template>
                    <template slot-scope="{row, size}" slot="phoneNumber">
                        <el-button :size="size" type="text" @click="showStringDispose(row, 'phoneNumberflag')">
                            {{ textDispose(row, 'phoneNumberflag', 'phoneNumber') }}
                        </el-button>
                    </template>
                    <template slot-scope="{row, size}" slot="idCard">
                        <el-button :size="size" type="text" @click="showStringDispose(row, 'idCardflag')"
                            v-text="textDispose(row, 'idCardflag', 'idCard')"></el-button>
                    </template>
                    <template slot-scope="{row, size}" slot="householdLabelList">
                        {{ labelDispose(row.householdLabelList) }}
                    </template>
                </avue-crud>
                <el-dialog title="用户角色配置" append-to-body :visible.sync="roleBox" width="345px" center>
          <template slot-scope="{row, size}" slot="menu">
            <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" v-if="permission.househould_manager"
              @click="manageLabel(row)">标签
            </el-button>
          </template>
          <template slot-scope="{row, size}" slot="phoneNumber">
            <el-button :size="size" type="text" @click="showStringDispose(row, 'phoneNumberflag')">
              {{ textDispose(row, 'phoneNumberflag', 'phoneNumber') }}
            </el-button>
          </template>
          <template slot-scope="{row, size}" slot="idCard">
            <el-button :size="size" type="text" @click="showStringDispose(row, 'idCardflag')"
              v-text="textDispose(row, 'idCardflag', 'idCard')"></el-button>
          </template>
          <template slot-scope="{row, size}" slot="householdLabelList">
            {{ labelDispose(row.householdLabelList) }}
          </template>
        </avue-crud>
        <el-dialog title="用户角色配置" append-to-body :visible.sync="roleBox" width="345px" center>

                    <el-tree :data="roleGrantList" show-checkbox check-strictly default-expand-all node-key="id"
                        ref="treeRole" :default-checked-keys="roleTreeObj" :props="props">
                    </el-tree>
          <el-tree :data="roleGrantList" show-checkbox check-strictly default-expand-all node-key="id" ref="treeRole"
            :default-checked-keys="roleTreeObj" :props="props">
          </el-tree>

                    <span slot="footer" class="dialog-footer">
                        <el-button size="small" @click="roleBox = false">取 消</el-button>
                        <el-button size="small" type="primary" @click="submitRole">确 定</el-button>
                    </span>
                </el-dialog>
          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="roleBox = false">取 消</el-button>
            <el-button size="small" type="primary" @click="submitRole">确 定</el-button>
          </span>
        </el-dialog>

                <el-dialog title="标签管理" append-to-body :visible.sync="labelFlag" center width="600px">
                    <div v-for="(item, index) in labelData" :key="index">
                        <el-row>
                            <el-col :span="24">
                                <div>
                                    <el-divider content-position="left">{{ item.name }}</el-divider>
                                </div>
                            </el-col>
                        </el-row>
                        <div class="grid-container2" v-if="item.children">
                            <div class="grid-item" :style="{ backgroundColor: item2.color }"
                                v-for="(item2, index2) in item.children" @click="changLabel(item2)" :key="index2">
                                {{ item2.name }}
                            </div>
                        </div>
                    </div>
        <el-dialog title="标签管理" append-to-body :visible.sync="labelFlag" center width="600px">
          <div v-for="(item, index) in labelData" :key="index">
            <el-row>
              <el-col :span="24">
                <div>
                  <el-divider content-position="left">{{ item.name }}</el-divider>
                </div>
              </el-col>
            </el-row>
            <div class="grid-container2" v-if="item.children">
              <div class="grid-item" :style="{ backgroundColor: item2.color }" v-for="(item2, index2) in item.children"
                @click="changLabel(item2)" :key="index2">
                {{ item2.name }}
              </div>
            </div>
          </div>

                    <!-- <span slot="footer" class="dialog-footer">
          <!-- <span slot="footer" class="dialog-footer">
            <el-button @click="labelFlag = false">取 消</el-button>
            <el-button type="primary" @click="submitRole">确 定</el-button>
          </span> -->
                </el-dialog>
        </el-dialog>

                <el-dialog :title="'编辑标签   ' + currentLabel.name" append-to-body :visible.sync="editLabelFlge"
                    width="655px">
                    <avue-form :option="labelOption" v-model="labelForm" :submit="onsubmit">
                    </avue-form>
                    <span slot="footer" class="dialog-footer">
                        <el-button size="small" @click="editLabelFlge = false">取 消</el-button>
                        <el-button size="small" type="primary" @click="onsubmit">确 定</el-button>
                    </span>
                </el-dialog>
        <el-dialog :title="'编辑标签   ' + currentLabel.name" append-to-body :visible.sync="editLabelFlge" width="655px">
          <avue-form :option="labelOption" v-model="labelForm" :submit="onsubmit">
          </avue-form>
          <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="editLabelFlge = false">取 消</el-button>
            <el-button size="small" type="primary" @click="onsubmit">确 定</el-button>
          </span>
        </el-dialog>

                <el-dialog title="用户数据导入" append-to-body :visible.sync="excelBox" width="555px">
                    <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
                        <template slot="excelTemplate">
                            <el-button size="small" type="primary" @click="handleTemplate">
                                点击下载<i class="el-icon-download el-icon--right"></i>
                            </el-button>
                        </template>
                    </avue-form>
                </el-dialog>
            </basic-container>
        </el-col>
    </el-row>
        <el-dialog title="用户数据导入" append-to-body :visible.sync="excelBox" width="555px">
          <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
            <template slot="excelTemplate">
              <el-button size="small" type="primary" @click="handleTemplate">
                点击下载<i class="el-icon-download el-icon--right"></i>
              </el-button>
            </template>
          </avue-form>
        </el-dialog>
      </basic-container>
    </el-col>
  </el-row>
</template>

<script>
import {
  import {
    getList,
    remove,
    add,
    update,
    getDetatil,
    getDetatils
} from "@/api/userHouse/list/houseHold.js"
import {
  } from "@/api/userHouse/list/houseHold.js"
  import {
    removeHouseholdLabel,
    saveOrUpdateHouseholdLabel
} from "@/api/userHouse/list/userHouseList.js"
import {
  } from "@/api/userHouse/list/userHouseList.js"
  import {
    getLabelList,
} from '@/api/label/label'
import {
  } from '@/api/label/label'
  import {
    exportBlob
} from "@/api/common"
import {
  } from "@/api/common"
  import {
    mapGetters
} from "vuex"
import {
  } from "vuex"
  import {
    getToken
} from '@/util/auth'
import {
  } from '@/util/auth'
  import {
    downloadXls,
    findParentOrCur,
} from "@/util/util"
import {
  } from "@/util/util"
  import {
    dateNow
} from "@/util/date"
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import Qs from "qs"
import { lintOnSave } from "../../../vue.config"
  } from "@/util/date"
  import NProgress from 'nprogress'
  import 'nprogress/nprogress.css'
  import Qs from "qs"
  import {
    lintOnSave
  } from "../../../vue.config"

export default {
    data () {
        let isCardId = function (rule, value, callback) {
            // 15位和18位身份证号码的正则表达式
            var regIdCard = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/
  export default {
    data() {
      let isCardId = function(rule, value, callback) {
        // 15位和18位身份证号码的正则表达式
        var regIdCard =
          /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/

            // 如果通过该验证，说明身份证格式正确，但准确性还需计算
            if (regIdCard.test(value)) {
                if (value.length == 18) {
                    var idCardWi = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10,
                        5, 8, 4, 2) // 将前17位加权因子保存在数组里
                    var idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2) // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
                    var idCardWiSum = 0 // 用来保存前17位各自乖以加权因子后的总和
                    for (var i = 0; i < 17; i++) {
                        idCardWiSum += value.substring(i, i + 1) * idCardWi[i]
                    }
        // 如果通过该验证，说明身份证格式正确，但准确性还需计算
        if (regIdCard.test(value)) {
          if (value.length == 18) {
            var idCardWi = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10,
              5, 8, 4, 2) // 将前17位加权因子保存在数组里
            var idCardY = new Array(1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2) // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
            var idCardWiSum = 0 // 用来保存前17位各自乖以加权因子后的总和
            for (var i = 0; i < 17; i++) {
              idCardWiSum += value.substring(i, i + 1) * idCardWi[i]
            }

                    var idCardMod = idCardWiSum % 11// 计算出校验码所在数组的位置
                    var idCardLast = value.substring(17)// 得到最后一位身份证号码
            var idCardMod = idCardWiSum % 11 // 计算出校验码所在数组的位置
            var idCardLast = value.substring(17) // 得到最后一位身份证号码

                    // 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
                    if (idCardMod == 2) {
                        if (idCardLast == "X" || idCardLast == "x") {
                            callback()
                        } else {
                            callback(new Error("身份证号格式有误！"))
                        }
                    } else {
                        // 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
                        if (idCardLast == idCardY[idCardMod]) {
                            callback()
                        } else {
                            callback(new Error("身份证号格式有误！"))
                        }
                    }
                } else {
                    callback()
                }
            } else {
                //alert("身份证格式不正确!");
            // 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
            if (idCardMod == 2) {
              if (idCardLast == "X" || idCardLast == "x") {
                callback()
              } else {
                callback(new Error("身份证号格式有误！"))
              }
            } else {
              // 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
              if (idCardLast == idCardY[idCardMod]) {
                callback()
              } else {
                callback(new Error("身份证号格式有误！"))
              }
            }

          } else {
            callback()
          }
        } else {
          //alert("身份证格式不正确!");
          callback(new Error("身份证号格式有误！"))
        }

        //手机号格式校验
        let validatorPhone = function (rule, value, callback) {
            if (value) {
                if (!/^1[3456789]\d{9}$/.test(value)) {
                    callback(new Error('手机号格式有误！'))
                } else {
                    callback()
                }
            }
        callback()
      }

      //手机号格式校验
      let validatorPhone = function(rule, value, callback) {
        if (value) {
          if (!/^1[3456789]\d{9}$/.test(value)) {
            callback(new Error('手机号格式有误！'))
          } else {
            callback()
          }
        }
        callback()
      }

        return {
            labelData: [],
            form: {},
            search: {},
            excelBox: false,
            selectionList: [],
            labelFlag: false,
            editLabelFlge: false,
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
      return {
        labelData: [],
        form: {},
        search: {},
        excelBox: false,
        selectionList: [],
        labelFlag: false,
        editLabelFlge: false,
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        option: {
          labelWidth: 144,
          searchLabelWidth: 96,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,

          height: 'auto',
          calcHeight: 80,
          tip: false,
          border: true,
          index: true,
          selection: true,
          viewBtn: true,
          addBtn: true,
          dialogType: 'drawer',
          dialogClickModal: false,
          menuFixed: 'right',
          column: [{
              label: "与业主关系",
              prop: "relationship",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleRelation",
              dataType: "number",
              hide: true,
              props: {
                label: "dictValue",
                value: "dictKey",
              },
              rules: [{
                required: true,
                message: "请选择与业主关系",
                trigger: "blur",
              }],
            },
            option: {
                labelWidth: 144,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

                height: 'auto',
                calcHeight: 80,
                tip: false,
                border: true,
                index: true,
                selection: true,
                viewBtn: true,
                addBtn: true,
                dialogType: 'drawer',
                dialogClickModal: false,
                menuFixed: 'right',
                column: [
                    {
                        label: "与业主关系",
                        prop: "relationship",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleRelation",
                        dataType: "number",
                        hide: true,
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        rules: [
                            {
                                required: true,
                                message: "请选择与业主关系",
                                trigger: "blur",
                            }
                        ],
                    },

                    {
                        width: 110,
                        label: "姓名",
                        prop: "name",
                        searchSpan: 3,
                        searchLabelWidth: 66,
                        search: true,
                        rules: [
                            {
                                required: true,
                                message: "请输入姓名",
                                trigger: "blur",
                            }
                        ],
                    },

                    {
                        hide: true,
                        label: "证件类型",
                        prop: "cardType",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=cardType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        width: 160,
                        display: true,
                        label: "身份证号",
                        prop: "idCard",
                        search: true,
                        searchSpan: 4,
                        slot: true,
                        rules: [
                            {
                                validator: isCardId,
                                trigger: 'blur'
                            }
                        ],
                    },

                    {
                        hide: true,
                        display: false,
                        width: 160,
                        label: "证件号码",
                        prop: "cardNo",
                    },

                    {
                        label: "出生日期",
                        prop: "birthday",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        hide: true,
                    },


                    {
                        width: 60,
                        label: "性别",
                        prop: "gender",
                        type: "select",
                        dicData: [{
                            label: "男",
                            value: 1
                        },
                        {
                            label: "女",
                            value: 0
                        },
                        {
                            label: "未知",
                            value: "3"
                        }
                        ],
                    },

                    {
                        width: 120,
                        label: "手机号码",
                        prop: "phoneNumber",
                        search: true,
                        searchSpan: 4,
                        slot: true,
                        rules: [
                            {
                                required: true,
                                message: "请输入手机号码",
                                trigger: "blur",
                            },
                            {
                                validator: validatorPhone,
                                trigger: 'blur'
                            }
                        ],
                    },

                    {
                        label: "居住情况",
                        prop: "residentialStatus",
                        type: "select",
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentialStatusType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        label: "其他联系方式",
                        prop: "otherContact",
                        hide: true,
                        rules: [
                            {
                                validator: validatorPhone,
                                trigger: 'blur'
                            }
                        ],
                    },

                    {
                        label: "是否主要联系人",
                        prop: "isPrimaryContact",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=primaryContactType",
                        dataType: "number",
                        hide: true,
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    // {
                    // label: "关系",
                    // prop: "roleType",
                    // type: "select",
                    // dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleType",
                    // dataType: "number",
                    //     props: {
                    //         label: "dictValue",
                    //         value: "dictKey",
                    //     },
                    // },

                    {
                        width: 220,
                        overHidden: true,
                        label: '小区名称',
                        prop: "aoiName",
                        search: true,
                        searchSpan: 4,
                        display: false
                    },

                    {
                        width: 110,
                        label: "所属街道",
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        prop: "townStreetName",
                        search: true,
                        searchSpan: 4
                    },

                    {
                        width: 156,
                        overHidden: true,
                        label: "所属社区",
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        prop: "neiName",
                        search: true,
                        searchSpan: 4
                    },

                    {
                        width: 110,
                        overHidden: true,
                        label: "所属网格",
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        prop: "gridName",
                    },

                    {
                        width: 156,
                        overHidden: true,
                        label: "地址",
                        prop: "address",
                        display: false
                    },


                    {
                        hide: true,
                        parent: false,
                        width: 160,
                        label: "籍贯地区",
                        prop: "nativePlaceAdcode",
                        type: "tree",
                        typeformat (item, label, value) {
                            return item.addressDetail
                        },
                        change: ({ value, column, item, dic }) => {
                            item.addressDetail = findParentOrCur(dic, item.id)
                        },
                        props: {
                            label: 'name',
                            value: 'id'
                        },
                        dicUrl: `/api/blade-system/region/getBaseTree`,
                    },

                    {
                        hide: true,
                        label: "户籍类型",
                        prop: "residentType",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        hide: true,
                        parent: false,
                        width: 160,
                        label: "户籍地区",
                        prop: "residentAdcode",
                        type: "tree",
                        typeformat (item, label, value) {
                            return item.addressDetail
                        },
                        change: ({ value, column, item, dic }) => {
                            item.addressDetail = findParentOrCur(dic, item.id)
                        },
                        props: {
                            label: 'name',
                            value: 'id'
                        },
                        dicUrl: `/api/blade-system/region/getBaseTree`,
                    },

                    {
                        label: "户籍地址",
                        prop: "hukouRegistration",
                        hide: true,
                    },

                    {
                        disabled: false,
                        label: "居住地区",
                        prop: "homeAdcode",
                        hide: true,
                        type: 'select',
                        props: {
                            label: 'name',
                            value: 'code'
                        },
                        dicUrl: `/api/blade-system/region/select?code=361102`,
                    },

                    {
                        disabled: false,
                        label: "现居住地",
                        prop: "currentAddress",
                        hide: true,
                    },

                    {
                        width: 210,
                        overHidden: true,
                        label: "标签",
                        prop: "householdLabelList",
                        display: false
                    },

                    {
                        label: "民族",
                        prop: "ethnicity",
                        type: "select",
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=nationType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        label: "学历",
                        prop: "education",
                        type: "select",
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "职业类别",
                        prop: "occupation"
                    },

                    {
                        label: "工作单位",
                        prop: "employer",
                        hide: true,
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "工作单位地址",
                        prop: "cmpyRegAddr"
                    },

                    {
                        label: "工作状态",
                        prop: "workStatus",
                        type: "select",
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workStatusType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        label: "婚姻状态",
                        prop: "maritalStatus",
                        type: "select",
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=marriageStatusType",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "宗教信仰",
                        prop: "religiousBelief",
                    },

                    {
                        hide: true,
                        label: "健康状态",
                        prop: "healthStatus",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=healthStatus",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },

                    {
                        disabled: true,
                        hide: true,
                        width: 160,
                        label: "疾病名称",
                        prop: "diseaseName"
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "外出去向",
                        prop: "goOutWhere"
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "外出原因",
                        prop: "goOutReason"
                    },

                    {
                        hide: true,
                        label: "外出时间",
                        prop: "goOutTime",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        width: 160,
                    },

                    {
                        hide: true,
                        width: 160,
                        label: "外出详址",
                        prop: "goOutAddr"
                    },

                    {
                        label: "车牌号",
                        prop: "cardNumber",
                        hide: true,
                    },
                ]
            {
              width: 110,
              label: "姓名",
              prop: "name",
              searchSpan: 3,
              searchLabelWidth: 66,
              search: true,
              rules: [{
                required: true,
                message: "请输入姓名",
                trigger: "blur",
              }],
            },
            data: [],

            excelForm: {},
            labelForm: {},
            labelOption: {
                submitBtn: false,
                emptyBtn: false,
                column: [{
                    label: '级别',
                    prop: 'color',
                    type: 'radio',
                    button: true,
                    row: true,
                    dicData: [{
                        label: '撤销',
                        value: '#EBEDF0'
                    }, {
                        label: '绿',
                        value: '#30D17C'
                    }, {
                        label: '黄',
                        value: '#FFB42B'
                    }, {
                        label: '红',
                        value: '#EA1F1F'
                    }],
                    rules: [{
                        required: true,
                        message: "请选择",
                        trigger: "blur"
                    }]
                }, {
                    row: true,
                    label: '备注',
                    prop: 'remark',
                    type: 'input'
                }]
            {
              hide: true,
              label: "证件类型",
              prop: "cardType",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=cardType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },
            excelOption: {
                submitBtn: false,
                emptyBtn: false,
                column: [{
                    label: '模板上传',
                    prop: 'excelFile',
                    type: 'upload',
                    drag: true,
                    loadText: '模板上传中，请稍等',
                    span: 24,
                    propsHttp: {
                        res: 'data'
                    },
                    tip: '请上传 .xls,.xlsx 标准格式文件',
                    action: "/api/blade-system/user/import-user"

            {
              width: 160,
              display: true,
              label: "身份证号",
              prop: "idCard",
              search: true,
              searchSpan: 4,
              slot: true,
              rules: [{
                validator: isCardId,
                trigger: 'blur'
              }],
            },

            {
              hide: true,
              display: false,
              width: 160,
              label: "证件号码",
              prop: "cardNo",
            },

            {
              label: "出生日期",
              prop: "birthday",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              hide: true,
            },


            {
              width: 60,
              label: "性别",
              prop: "gender",
              type: "select",
              dicData: [{
                  label: "男",
                  value: 1
                },
                {
                    label: "数据覆盖",
                    prop: "isCovered",
                    type: "switch",
                    align: "center",
                    width: 80,
                    dicData: [{
                        label: "否",
                        value: 0
                    },
                    {
                        label: "是",
                        value: 1
                    }
                    ],
                    value: 0,
                    slot: true,
                    rules: [{
                        required: true,
                        message: "请选择是否覆盖",
                        trigger: "blur"
                    }]
                  label: "女",
                  value: 0
                },
                {
                    label: '模板下载',
                    prop: 'excelTemplate',
                    formslot: true,
                    span: 24,
                  label: "未知",
                  value: "3"
                }
                ]
              ],
            },
            currentLabel: {},
            currentRow: {},
            householdLabelList: [],
        }

            {
              width: 120,
              label: "手机号码",
              prop: "phoneNumber",
              search: true,
              searchSpan: 4,
              slot: true,
              rules: [{
                  required: true,
                  message: "请输入手机号码",
                  trigger: "blur",
                },
                {
                  validator: validatorPhone,
                  trigger: 'blur'
                }
              ],
            },

            {
              label: "居住情况",
              prop: "residentialStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentialStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "其他联系方式",
              prop: "otherContact",
              hide: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            },

            {
              label: "是否主要联系人",
              prop: "isPrimaryContact",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=primaryContactType",
              dataType: "number",
              hide: true,
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            // {
            // label: "关系",
            // prop: "roleType",
            // type: "select",
            // dicUrl: "/api/blade-system/dict-biz/dictionary?code=roleType",
            // dataType: "number",
            //     props: {
            //         label: "dictValue",
            //         value: "dictKey",
            //     },
            // },

            {
              width: 220,
              overHidden: true,
              label: '小区名称',
              prop: "aoiName",
              search: true,
              searchSpan: 4,
              display: false
            },

            {
              width: 110,
              label: "所属街道",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "townStreetName",
              search: true,
              searchSpan: 4
            },

            {
              width: 156,
              overHidden: true,
              label: "所属社区",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "neiName",
              search: true,
              searchSpan: 4
            },

            {
              width: 110,
              overHidden: true,
              label: "所属网格",
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              prop: "gridName",
            },

            {
              width: 156,
              overHidden: true,
              label: "地址",
              prop: "address",
              display: false
            },


            {
              hide: true,
              parent: false,
              width: 160,
              label: "籍贯地区",
              prop: "nativePlaceAdcode",
              type: "tree",
              typeformat(item, label, value) {
                return item.addressDetail
              },
              change: ({
                value,
                column,
                item,
                dic
              }) => {
                item.addressDetail = findParentOrCur(dic, item.id)
              },
              props: {
                label: 'name',
                value: 'id'
              },
              dicUrl: `/api/blade-system/region/getBaseTree`,
            },

            {
              hide: true,
              label: "户籍类型",
              prop: "residentType",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=residentType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              parent: false,
              width: 160,
              label: "户籍地区",
              prop: "residentAdcode",
              type: "tree",
              typeformat(item, label, value) {
                return item.addressDetail
              },
              change: ({
                value,
                column,
                item,
                dic
              }) => {
                item.addressDetail = findParentOrCur(dic, item.id)
              },
              props: {
                label: 'name',
                value: 'id'
              },
              dicUrl: `/api/blade-system/region/getBaseTree`,
            },

            {
              label: "户籍地址",
              prop: "hukouRegistration",
              hide: true,
            },

            {
              disabled: false,
              label: "居住地区",
              prop: "homeAdcode",
              hide: true,
              type: 'select',
              props: {
                label: 'name',
                value: 'code'
              },
              dicUrl: `/api/blade-system/region/select?code=361102`,
            },

            {
              disabled: false,
              label: "现居住地",
              prop: "currentAddress",
              hide: true,
            },

            {
              width: 210,
              overHidden: true,
              label: "标签",
              prop: "householdLabelList",
              display: false
            },

            {
              label: "民族",
              prop: "ethnicity",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=nationType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "学历",
              prop: "education",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              width: 160,
              label: "职业类别",
              prop: "occupation"
            },

            {
              label: "工作单位",
              prop: "employer",
              hide: true,
            },

            {
              hide: true,
              width: 160,
              label: "工作单位地址",
              prop: "cmpyRegAddr"
            },

            {
              label: "工作状态",
              prop: "workStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=workStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              label: "婚姻状态",
              prop: "maritalStatus",
              type: "select",
              hide: true,
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=marriageStatusType",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              hide: true,
              width: 160,
              label: "宗教信仰",
              prop: "religiousBelief",
            },

            {
              hide: true,
              label: "健康状态",
              prop: "healthStatus",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=healthStatus",
              dataType: "number",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
            },

            {
              disabled: true,
              hide: true,
              width: 160,
              label: "疾病名称",
              prop: "diseaseName"
            },

            {
              hide: true,
              width: 160,
              label: "外出去向",
              prop: "goOutWhere"
            },

            {
              hide: true,
              width: 160,
              label: "外出原因",
              prop: "goOutReason"
            },

            {
              hide: true,
              label: "外出时间",
              prop: "goOutTime",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              width: 160,
            },

            {
              hide: true,
              width: 160,
              label: "外出详址",
              prop: "goOutAddr"
            },

            {
              label: "车牌号",
              prop: "cardNumber",
              hide: true,
            },
          ]
        },
        data: [],

        excelForm: {},
        labelForm: {},
        labelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
            label: '级别',
            prop: 'color',
            type: 'radio',
            button: true,
            row: true,
            dicData: [{
              label: '撤销',
              value: '#EBEDF0'
            }, {
              label: '绿',
              // value: '#30D17C'
              value:'green'
            }, {
              label: '黄',
              // value: '#FFB42B'
              value:'yellow'
            }, {
              label: '红',
              // value: '#EA1F1F'
              value:'red'
            }],
            rules: [{
              required: true,
              message: "请选择",
              trigger: "blur"
            }]
          }, {
            row: true,
            label: '备注',
            prop: 'remark',
            type: 'input'
          }]
        },
        excelOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
              label: '模板上传',
              prop: 'excelFile',
              type: 'upload',
              drag: true,
              loadText: '模板上传中，请稍等',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              tip: '请上传 .xls,.xlsx 标准格式文件',
              action: "/api/blade-system/user/import-user"
            },
            {
              label: "数据覆盖",
              prop: "isCovered",
              type: "switch",
              align: "center",
              width: 80,
              dicData: [{
                  label: "否",
                  value: 0
                },
                {
                  label: "是",
                  value: 1
                }
              ],
              value: 0,
              slot: true,
              rules: [{
                required: true,
                message: "请选择是否覆盖",
                trigger: "blur"
              }]
            },
            {
              label: '模板下载',
              prop: 'excelTemplate',
              formslot: true,
              span: 24,
            }
          ]
        },
        currentLabel: {},
        currentRow: {},
        householdLabelList: [],
      }
    },
    watch: {
        'form.source': {
            handler (newData) {
                let currentAddressColumn = this.findObject(
                    this.option.column,
                    'currentAddress'
                )
      'form.source': {
        handler(newData) {
          let currentAddressColumn = this.findObject(
            this.option.column,
            'currentAddress'
          )

                let homeAdcodeColumn = this.findObject(
                    this.option.column,
                    'homeAdcode'
                )
          let homeAdcodeColumn = this.findObject(
            this.option.column,
            'homeAdcode'
          )

                if (newData == 1) {
                    currentAddressColumn.disabled = true
                    homeAdcodeColumn.disabled = true
                } else {
                    currentAddressColumn.disabled = false
                    homeAdcodeColumn.disabled = false
                }
            },
          if (newData == 1) {
            currentAddressColumn.disabled = true
            homeAdcodeColumn.disabled = true
          } else {
            currentAddressColumn.disabled = false
            homeAdcodeColumn.disabled = false
          }
        },
      },

        'form.cardType': {
            handler (newData) {
                let idCardColumn = this.findObject(
                    this.option.column,
                    'idCard'
                )
      'form.cardType': {
        handler(newData) {
          let idCardColumn = this.findObject(
            this.option.column,
            'idCard'
          )

                let cardNoColumn = this.findObject(
                    this.option.column,
                    'cardNo'
                )
          let cardNoColumn = this.findObject(
            this.option.column,
            'cardNo'
          )

                if (newData == 111) {
                    idCardColumn.display = true
                    cardNoColumn.display = false
                } else {
                    idCardColumn.display = false
                    cardNoColumn.display = true
                }
            },
          if (newData == 111) {
            idCardColumn.display = true
            cardNoColumn.display = false
          } else {
            idCardColumn.display = false
            cardNoColumn.display = true
          }
        },
      },

        'form.healthStatus': {
            handler (newData) {
                let diseaseNameColumn = this.findObject(
                    this.option.column,
                    'diseaseName'
                )
      'form.healthStatus': {
        handler(newData) {
          let diseaseNameColumn = this.findObject(
            this.option.column,
            'diseaseName'
          )

                if (newData == 3) {
                    diseaseNameColumn.disabled = false
                } else {
                    diseaseNameColumn.disabled = true
                }
            },
          if (newData == 3) {
            diseaseNameColumn.disabled = false
          } else {
            diseaseNameColumn.disabled = true
          }
        },
      },
    },
    computed: {
        ...mapGetters(["userInfo", "permission"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.household_add, false),
                viewBtn: this.vaildData(this.permission.household_view, true),
                delBtn: this.vaildData(this.permission.household_delete, true),
                editBtn: this.vaildData(this.permission.household_edit, true)
            }
        },

        textDispose () {
            return (row, flag, type) => {
                if (row[flag] || row[type] == null) {
                    return row[type]
                } else {
                    if (type == 'idCard') {
                        return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
                    } else {
                        return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
                    }
                }
            }
        },

        labelDispose () {
            return (list) => {
                return list.map(item => item.labelName).join(',')
            }
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.household_add, false),
          viewBtn: this.vaildData(this.permission.household_view, true),
          delBtn: this.vaildData(this.permission.household_delete, true),
          editBtn: this.vaildData(this.permission.household_edit, true)
        }
    },
    mounted () { },
    methods: {
        onsubmit () {
            if (this.labelForm.color === '#EBEDF0') {
                let params = {
                    householdId: this.currentRow.id,
                    labelId: this.currentLabel.id
                }
                removeHouseholdLabel(params).then(res => {
                    this.onLoad(this.page)
      },

                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.editLabelFlge = false
                    this.manageLabel(this.currentRow)
                    this.loading = false
                })
      textDispose() {
        return (row, flag, type) => {
          if (row[flag] || row[type] == null) {
            return row[type]
          } else {
            if (type == 'idCard') {
              return row[type].replace(/^(.{6})(?:\d+)(.{4})$/, "$1******$2")
            } else {
                this.labelForm.houseCode = this.currentRow.houseCode
                this.labelForm.householdId = this.currentRow.id
                this.labelForm.labelId = this.currentLabel.id
                this.labelForm.lableType = 1

                saveOrUpdateHouseholdLabel(this.labelForm).then(res => {
                    this.onLoad(this.page)

                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.editLabelFlge = false
                    this.manageLabel(this.currentRow)
                    this.loading = false
                })
              return row[type].replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2")
            }
        },

        changLabel (item) {
            this.editLabelFlge = true
            this.currentLabel = item
            this.labelForm.color = item.color
            this.labelForm.remark = item.remark
        },

        manageLabel (item) {
            this.loading = true
            this.currentRow = item
            this.labelFlag = true
            let params = {
                parentId: 1000
            }
            // 查询标签
            getLabelList(Object.assign(params)).then(res => {
                const data = res.data.data
                // this.labelData = data;
                // 查询详情
                getDetatils(item.id).then(res => {
                    this.householdLabelList = res.data.data.householdLabelList
                    // 将细类放到一起
                    data.forEach(e => {
                        e.children.forEach(f => {
                            if (this.householdLabelList.length > 0) {
                                this.householdLabelList.forEach(h => {
                                    if (Number(f.id) == h.labelId) {
                                        f['color'] = h.color
                                        f['remark'] = h.remark
                                    }
                                })
                            }
                        })
                    })
                    this.labelData = data
                    this.loading = false
                })
            })
        },
        rowSave (row, done, loading) {
            add(row).then(() => {
                this.initFlag = false
                this.onLoad(this.page)
                this.$message({
                    type: "success",
                    message: "操作成功!"
                })
                done()
            }, error => {
                window.console.log(error)
                loading()
            })
        },
        rowUpdate (row, index, done, loading) {
            update(row).then(() => {
                this.initFlag = false
                this.onLoad(this.page)
                this.$message({
                    type: "success",
                    message: "操作成功!"
                })
                done()
            }, error => {
                window.console.log(error)
                loading()
            })
        },
        rowDel (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return remove(row.id)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                })
        },
        searchReset () {
            this.query = {}
            this.treeDeptId = ''
            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();
        },
        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()
                })
        },
        handleImport () {
            this.excelBox = true
        },
        uploadAfter (res, done, loading, column) {
            this.excelBox = false
            this.refreshChange()
            done()
        },
        handleExport () {
            this.$confirm("是否导出住户数据?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                NProgress.start()
                var data = {
                    ...this.query
                }
                data = Qs.stringify(data)
                exportBlob(
                    `/api/blade-household/household/export-household?${this.website.tokenHeader}=${getToken()}&` + data
                ).then(res => {
                    downloadXls(res.data, `住户数据表${dateNow()}.xlsx`)
                    NProgress.done()
                })
            })
        },
        handleTemplate () {
            exportBlob(`/api/blade-system/user/export-template?${this.website.tokenHeader}=${getToken()}`).then(res => {
                downloadXls(res.data, "住户数据模板.xlsx")
            })
        },
        beforeOpen (done, type) {
            if (["edit", "view"].includes(type)) {
                getDetatils(this.form.id).then(res => {
                    this.form = res.data.data
                    done()
                })
            }
            this.initFlag = true
        },
        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,
                    records: res.data.data.records.map(item => {
                        return {
                            ...item,
                            'phoneNumberflag': false,
                            'idCardflag': false
                        }
                    })
                }

                this.page.total = data.total
                this.data = data.records
                this.loading = false
                this.selectionClear()
            })
        },

        showStringDispose (row, type) {
            row[type] = !row[type]
          }
        }
      },

      labelDispose() {
        return (list) => {
          return list.map(item => item.labelName).join(',')
        }
      }
    },
    mounted() {},
    methods: {
      onsubmit() {
        if (this.labelForm.color === '#EBEDF0') {
          let params = {
            householdId: this.currentRow.id,
            labelId: this.currentLabel.id,
            // userId: this.currentLabel.id
          }
          removeHouseholdLabel(params).then(res => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        } else {
          this.labelForm.houseCode = this.currentRow.houseCode
          this.labelForm.householdId = this.currentRow.id
          this.labelForm.labelId = this.currentLabel.id
          this.labelForm.userId = this.currentRow.associatedUserId
          this.labelForm.lableType = 1

          saveOrUpdateHouseholdLabel(this.labelForm).then(res => {
            this.onLoad(this.page)

            this.$message({
              type: "success",
              message: "操作成功!"
            })
            this.editLabelFlge = false
            this.manageLabel(this.currentRow)
            this.loading = false
          })
        }
      },

      changLabel(item) {
        this.editLabelFlge = true
        this.currentLabel = item
        this.labelForm.color = item.color
        this.labelForm.remark = item.remark
      },

      manageLabel(item) {
        this.loading = true
        this.currentRow = item
        this.labelFlag = true
        let params = {
          parentId: 1000
        }
        // 查询标签
        getLabelList(Object.assign(params)).then(res => {
          const data = res.data.data
          // this.labelData = data;
          // 查询详情
          getDetatils(item.id).then(res => {
            this.householdLabelList = res.data.data.householdLabelList
            // 将细类放到一起
            data.forEach(e => {
              e.children.forEach(f => {
                if (this.householdLabelList.length > 0) {
                  this.householdLabelList.forEach(h => {
                    if (Number(f.id) == h.labelId) {
                      f['color'] = h.color
                      f['remark'] = h.remark
                    }
                  })
                }
              })
            })
            this.labelData = data
            this.loading = false
          })
        })
      },
      rowSave(row, done, loading) {
        add(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
          this.initFlag = false
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!"
          })
          done()
        }, error => {
          window.console.log(error)
          loading()
        })
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(row.id)
          })
          .then(() => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!"
            })
          })
      },
      searchReset() {
        this.query = {}
        this.treeDeptId = ''
        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();
      },
      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()
          })
      },
      handleImport() {
        this.excelBox = true
      },
      uploadAfter(res, done, loading, column) {
        this.excelBox = false
        this.refreshChange()
        done()
      },
      handleExport() {
        this.$confirm("是否导出住户数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          NProgress.start()
          var data = {
            ...this.query
          }
          data = Qs.stringify(data)
          exportBlob(
            `/api/blade-household/household/export-household?${this.website.tokenHeader}=${getToken()}&` + data
          ).then(res => {
            downloadXls(res.data, `住户数据表${dateNow()}.xlsx`)
            NProgress.done()
          })
        })
      },
      handleTemplate() {
        exportBlob(`/api/blade-system/user/export-template?${this.website.tokenHeader}=${getToken()}`).then(res => {
          downloadXls(res.data, "住户数据模板.xlsx")
        })
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetatils(this.form.id).then(res => {
            this.form = res.data.data
            done()
          })
        }
        this.initFlag = true
      },
      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,
            records: res.data.data.records.map(item => {
              return {
                ...item,
                'phoneNumberflag': false,
                'idCardflag': false
              }
            })
          }

          this.page.total = data.total
          this.data = data.records
          this.loading = false
          this.selectionClear()
        })
      },

      showStringDispose(row, type) {
        row[type] = !row[type]
      }
    }
}
  }
</script>

<style>
.box {
  .box {
    height: 800px;
}
  }

.grid-container2 {
  .grid-container2 {
    /* display: grid;
    grid-template-columns: auto auto auto auto;
    grid-gap: 10px; */
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 20px;
}
  }

.grid-item {
  .grid-item {
    padding: 8px 14px;
    border: 1px solid #dcdfe6;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 20px;
}
  }

.grid-item:hover {
  .grid-item:hover {
    background-color: #e8f4ff;
    color: #017BFC;
    cursor: pointer;
}
  }

.el-scrollbar {
  .el-scrollbar {
    height: 100%;
}
  }

.box .el-scrollbar__wrap {
  .box .el-scrollbar__wrap {
    overflow: scroll;
}
  }
</style>

 src/views/userHouse/houseList.vue

@@ -162,16 +162,19 @@
                    row: true,
                    dicData: [{
                        label: '撤销',
                        value: '#EBEDF0'
                        // value: '#EBEDF0'
                    }, {
                        label: '绿',
                        value: '#30D17C'
                        // value: '#30D17C'
                        value:'green'
                    }, {
                        label: '黄',
                        value: '#FFB42B'
                        // value: '#FFB42B'
                        value:'yellow'
                    }, {
                        label: '红',
                        value: '#EA1F1F'
                        // value: '#EA1F1F'
                        value:'red'
                    }],
                    rules: [{
                        required: true,
@@ -228,9 +231,19 @@
                        overHidden: true,
                        label: "地址",
                        prop: "address",
                        display: false
                        display: false,
                    },

                    {
                        // hide: true, 
                        width: 220,
                        overHidden: true,
                        label: '地址',
                        parent: false,
                        prop: "houseName",
                        searchSpan: 4,
                        display: false,
                        search: true,
                    },
                    {
                        hide: true,
                        parent: false,

 vue.config.js

@@ -26,9 +26,10 @@
    proxy: {
      "/api": {
        //本地服务接口地址
        // target: "https://srgdjczzxtpt.com:2080/api",
        target: "https://srgdjczzxtpt.com:2080/api",
        // target: "http://z4042833u6.wicp.vip",
        target: "http://localhost:9528",
        // target: "http://localhost:9528",
        // target:"http://192.168.0.109:9528",
        //远程演示服务地址,可用于直接启动项目
        //target: 'https://saber.bladex.cn/api',
        changeOrigin: true,