Merge remote-tracking branch 'origin/master'

linwei

2024-01-10 ca788e3a4122fbeb46947be76ec21625306fa0a7

Merge remote-tracking branch 'origin/master'

# Conflicts:
#	src/views/publicSecurity/bailReporting.vue
#	src/views/publicSecurity/keynotePlaceManage.vue

 src/views/article/article.vue

@@ -221,6 +221,25 @@
                        },],
                    },
                    {
                        label: "发布时间",
                        prop: "dateTime",
                        type: "daterange",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        searchSpan: 6,
                        searchRange: true,
                        hide: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择发布时间",
                            trigger: "blur",
                        },],
                    },
                    {
                        width: 100,
                        label: "发布时间",
                        prop: "createTime",

 src/views/article/components/discussionManageChild.vue

@@ -254,7 +254,7 @@
    },
    methods: {
        getUserList () {
            let dicUrl = `/blade-household/household/selectHouseholdList?searchKey={{key}}&limit=20`
            let dicUrl = `/api/blade-household/household/selectHouseholdList?searchKey={{key}}&limit=20`
            const column = this.findObject(this.option.column, "userIds")
            column.dicUrl = dicUrl
        },

 src/views/article/discussionManage.vue

@@ -210,6 +210,25 @@
                        },],
                    },
                    {
                        label: "发布时间",
                        prop: "dateTime",
                        type: "daterange",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        searchSpan: 6,
                        searchRange: true,
                        hide: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择发布时间",
                            trigger: "blur",
                        },],
                    },
                    {
                        width: 100,
                        label: "发布时间",
                        prop: "createTime",

 src/views/article/publicSignUp.vue

@@ -202,6 +202,25 @@
                        }],
                    },
                    {
                        label: "发布时间",
                        prop: "dateTime",
                        type: "daterange",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        searchSpan: 6,
                        searchRange: true,
                        hide: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择发布时间",
                            trigger: "blur",
                        },],
                    },
                    {
                        width: 100,
                        label: "发布时间",
                        prop: "createTime",

 src/views/cGovernance/gridPatrolRecord.vue

@@ -46,13 +46,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 350,
                border: false,
                //stripe:true,
                index: true,
@@ -102,6 +105,7 @@
                    },

                    {
                        width: 96,
                        slot: true,
                        addDisplay: false,
                        editDisplay: false,
@@ -111,6 +115,7 @@
                    },

                    {
                        width: 96,
                        slot: true,
                        addDisplay: false,
                        editDisplay: false,
@@ -134,9 +139,9 @@
                        span: 24,
                    },
                    {
                        width: 144,
                        label: "巡查时间",
                        prop: "patrolTime",
                        width: 160,
                        type: "date",
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",

 src/views/cGovernance/gridWorkLog.vue

@@ -43,13 +43,14 @@
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,
                border: false,
                //stripe:true,
                index: true,
@@ -59,6 +60,7 @@
                dialogClickModal: false,
                column: [
                    {
                        width: 120,
                        label: "走访类型",
                        prop: "type",
                        span: 12,
@@ -231,6 +233,7 @@
                    },

                    {
                        dispaly: false,
                        width: 144,
                        label: "上报时间",
                        prop: "createTime",
@@ -341,7 +344,7 @@

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

 src/views/cGovernance/punchCard.vue

@@ -28,6 +28,12 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

                menu: false,
                addBtn: false,
                border: true,
@@ -37,15 +43,13 @@
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        width: 96,
                        width: 110,
                        label: "打卡人员",
                        prop: "name",
                        search: true,
@@ -66,11 +70,12 @@
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择发布时间",
                            message: "请选择打卡时间",
                            trigger: "blur",
                        },],
                    },
                    {
                        width: 144,
                        label: "打卡时间",
                        prop: "createTime",
                        type: "date",
@@ -89,14 +94,17 @@
                        prop: "workContent",
                    },
                    {
                        width: 96,
                        label: "经度",
                        prop: "lng",
                    },
                    {
                        width: 96,
                        label: "纬度",
                        prop: "lat",
                    },
                    {
                        overHidden: true,
                        label: "打卡地址",
                        prop: "address",
                    },

 src/views/cGovernance/taskECall.vue

@@ -34,6 +34,19 @@
//   import AvueMap from "avue-plugin-map";
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 {
            form: {},
            query: {},
@@ -46,13 +59,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,
                border: true,
                //stripe:true,
                index: true,
@@ -74,13 +90,13 @@
                    },],
                },
                {
                    width: 100,
                    label: "事件类型",
                    prop: "type",
                    span: 12,
                    searchSpan: 4,
                    dataType: "number",
                    type: "select",
                    width: 100,
                    dicUrl: "/api/blade-system/dict-biz/dictionary?code=eCallEventType",
                    props: {
                        label: "dictValue",
@@ -142,11 +158,12 @@
                    // search: true,
                },
                {
                    width: 110,
                    label: "姓名",
                    prop: "realName",
                    span: 12,
                    searchSpan: 4,
                    width: 100,
                    searchLabelWidth: 66,
                    search: true,
                    rules: [{
                        required: false,
@@ -155,17 +172,21 @@
                    },],
                },
                {
                    width: 120,
                    label: "联系方式",
                    prop: "phone",
                    span: 12,
                    width: 100,
                    searchSpan: 4,
                    search: true,
                    rules: [{
                        required: false,
                        message: "请输入联系方式",
                        trigger: "blur",
                    },],
                    },
                    {
                        validator: validatorPhone,
                        trigger: 'blur'
                    }],
                },
                {
                    label: "事发地点",
@@ -178,9 +199,9 @@
                    },],
                },
                {
                    width: 100,
                    label: "事发时间",
                    prop: "occurrenceTime",
                    width: 100,
                    type: "date",
                    format: "yyyy-MM-dd",
                    valueFormat: "yyyy-MM-dd",

 src/views/community/index.vue

@@ -32,7 +32,7 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,

 src/views/district/index.vue

@@ -32,7 +32,7 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,

 src/views/flow/deploy.vue

@@ -1,154 +1,154 @@
<template>
  <basic-container>
    <avue-form ref="form" :option="option" v-model="form" :upload-before="uploadBefore" :upload-after="uploadAfter"/>
  </basic-container>
    <basic-container>
        <avue-form ref="form" :option="option" v-model="form" :upload-before="uploadBefore" :upload-after="uploadAfter" />
    </basic-container>
</template>

<script>
  import {deployUpload} from "@/api/flow/flow";
  import {flowCategory} from "@/util/flow";
import { deployUpload } from "@/api/flow/flow"
import { flowCategory } from "@/util/flow"

  export default {
    data() {
      return {
        form: {
          flowCategory: '',
          tenantId: '',
          flowFile: [],
          file: {},
        },
        option: {
          labelWidth: 120,
          menuBtn: false,
          column: [
            {
              label: '流程类型',
              prop: 'flowCategory',
              type: 'select',
              dicUrl: `/api/blade-system/dict/dictionary?code=flow`,
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              row: true,
              span: 12,
              dataType: "number",
              rules: [
                {
                  required: true,
                  message: '请选择流程类型',
                  trigger: 'blur'
                }
              ]
export default {
    data () {
        return {
            form: {
                flowCategory: '',
                tenantId: '',
                flowFile: [],
                file: {},
            },
            {
              label: "流程模式",
              prop: "flowMode",
              type: "radio",
              dicData: [
                {
                  label: "通用流程",
                  value: 1
                },
                {
                  label: "定制流程",
                  value: 2
                }
              ],
              value: 1,
              row: true,
              span: 12,
              rules: [
                {
                  required: true,
                  message: '请选择流程模式',
                  trigger: 'blur'
                }
              ],
            },
            {
              label: "所属租户",
              prop: "tenantId",
              type: "tree",
              multiple: true,
              dicUrl: "/api/blade-system/tenant/select",
              props: {
                label: "tenantName",
                value: "tenantId"
              },
              display: false,
              row: true,
              span: 12,
              rules: [
                {
                  required: true,
                  message: '请选择所属租户',
                  trigger: 'blur'
                }
              ],
            },
            {
              label: '附件上传',
              prop: 'flowFile',
              type: 'upload',
              loadText: '附件上传中，请稍等',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              tip: '请上传 bpmn20.xml 标准格式文件',
              action: '/api/blade-flow/manager/check-upload'
            },
          ]
            option: {
                labelWidth: 96,
                menuBtn: false,
                column: [
                    {
                        label: '流程类型',
                        prop: 'flowCategory',
                        type: 'select',
                        dicUrl: `/api/blade-system/dict/dictionary?code=flow`,
                        props: {
                            label: "dictValue",
                            value: "dictKey"
                        },
                        row: true,
                        span: 12,
                        dataType: "number",
                        rules: [
                            {
                                required: true,
                                message: '请选择流程类型',
                                trigger: 'blur'
                            }
                        ]
                    },
                    {
                        label: "流程模式",
                        prop: "flowMode",
                        type: "radio",
                        dicData: [
                            {
                                label: "通用流程",
                                value: 1
                            },
                            {
                                label: "定制流程",
                                value: 2
                            }
                        ],
                        value: 1,
                        row: true,
                        span: 12,
                        rules: [
                            {
                                required: true,
                                message: '请选择流程模式',
                                trigger: 'blur'
                            }
                        ],
                    },
                    {
                        label: "所属租户",
                        prop: "tenantId",
                        type: "tree",
                        multiple: true,
                        dicUrl: "/api/blade-system/tenant/select",
                        props: {
                            label: "tenantName",
                            value: "tenantId"
                        },
                        display: false,
                        row: true,
                        span: 12,
                        rules: [
                            {
                                required: true,
                                message: '请选择所属租户',
                                trigger: 'blur'
                            }
                        ],
                    },
                    {
                        label: '附件上传',
                        prop: 'flowFile',
                        type: 'upload',
                        loadText: '附件上传中，请稍等',
                        span: 24,
                        propsHttp: {
                            res: 'data'
                        },
                        tip: '请上传 bpmn20.xml 标准格式文件',
                        action: '/api/blade-flow/manager/check-upload'
                    },
                ]
            }
        }
      }
    },
    watch: {
      'form.flowMode'() {
        this.$refs.form.option.column.filter(item => {
          if (item.prop === "tenantId") {
            item.display = this.form.flowMode === 2;
          }
        });
      }
        'form.flowMode' () {
            this.$refs.form.option.column.filter(item => {
                if (item.prop === "tenantId") {
                    item.display = this.form.flowMode === 2
                }
            })
        }
    },
    methods: {
      uploadBefore(file, done) {
        this.$message.success('部署开始');
        this.file = file;
        done()
      },
      uploadAfter(res, done, loading) {
        if (!this.form.flowCategory) {
          this.$message.warning('清先选择流程类型');
          loading()
          return false;
        }
        if (this.form.flowMode === 2 && !this.form.tenantId) {
          this.$message.warning('清先选择对应租户');
          loading();
          return false;
        }
        if (res.success) {
          deployUpload(
            flowCategory(this.form.flowCategory),
            (this.form.tenantId) ? this.form.tenantId.join(",") : "",
            [this.file]
          ).then(res => {
            const data = res.data;
            if (data.success) {
              done()
            } else {
              this.$message.error(data.msg);
              loading()
        uploadBefore (file, done) {
            this.$message.success('部署开始')
            this.file = file
            done()
        },
        uploadAfter (res, done, loading) {
            if (!this.form.flowCategory) {
                this.$message.warning('清先选择流程类型')
                loading()
                return false
            }
          })
        } else {
          this.$message.warning('请上传 bpmn20.xml 标准格式文件');
          loading()
          return false;
        }
      },
            if (this.form.flowMode === 2 && !this.form.tenantId) {
                this.$message.warning('清先选择对应租户')
                loading()
                return false
            }
            if (res.success) {
                deployUpload(
                    flowCategory(this.form.flowCategory),
                    (this.form.tenantId) ? this.form.tenantId.join(",") : "",
                    [this.file]
                ).then(res => {
                    const data = res.data
                    if (data.success) {
                        done()
                    } else {
                        this.$message.error(data.msg)
                        loading()
                    }
                })
            } else {
                this.$message.warning('请上传 bpmn20.xml 标准格式文件')
                loading()
                return false
            }
        },
    }
  }
}
</script>

 src/views/flow/follow.vue

@@ -1,203 +1,209 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               v-model="form"
               :page.sync="page"
               :permission="permissionList"
               @row-del="rowDel"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot-scope="{row}"
                slot="suspensionState">
        <el-tag>{{row.suspensionState===1?'激活':'挂起'}}</el-tag>
      </template>
    </avue-crud>
    <el-dialog title="流程删除"
               append-to-body
               :visible.sync="followBox"
               width="20%">
      <el-form :model="form"
               ref="form"
               label-width="80px">
        <el-form-item label="删除理由">
          <el-input v-model="deleteReason"
                    placeholder="请输入删除理由" />
        </el-form-item>
      </el-form>
      <span slot="footer"
            class="dialog-footer">
        <el-button @click="followBox = false">关 闭</el-button>
        <el-button type="primary"
                   @click="handleDelete">确 定</el-button>
      </span>
    </el-dialog>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page"
            :permission="permissionList" @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset"
            @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
            @refresh-change="refreshChange" @on-load="onLoad">

            <template slot-scope="{ row, size }" slot="suspensionState">
                <el-tag :size="size" :type="showStatus(row.suspensionState).type"
                    v-text="showStatus(row.suspensionState).text">
                </el-tag>
            </template>

        </avue-crud>

        <el-dialog title="流程删除" append-to-body :visible.sync="followBox" width="20%">
            <el-form :model="form" ref="form" label-width="80px">
                <el-form-item label="删除理由">
                    <el-input v-model="deleteReason" placeholder="请输入删除理由" />
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="followBox = false">关 闭</el-button>
                <el-button type="primary" @click="handleDelete">确 定</el-button>
            </span>
        </el-dialog>
    </basic-container>
</template>

<script>
  import {mapGetters} from "vuex";
  import {followList, deleteProcessInstance} from "@/api/flow/flow";
import { mapGetters } from "vuex"
import { followList, deleteProcessInstance } from "@/api/flow/flow"

  export default {
    data() {
      return {
        form: {},
        selectionId: '',
        processInstanceId: '',
        selectionList: [],
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        followBox: false,
        deleteReason: '',
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          selection: true,
          editBtn: false,
          addBtn: false,
          viewBtn: false,
          dialogWidth: 900,
          menuWidth: 100,
          dialogClickModal: false,
          column: [
            {
              label: "执行id",
              prop: "executionId",
              search: true,
              width: 320,
export default {
    data () {
        return {
            form: {},
            selectionId: '',
            processInstanceId: '',
            selectionList: [],
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            {
              label: "流程key",
              prop: "processDefinitionKey",
              search: true,
            followBox: false,
            deleteReason: '',
            option: {
                labelWidth: 84,
                searchLabelWidth: 84,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 80,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                selection: true,
                editBtn: false,
                addBtn: false,
                viewBtn: false,
                dialogWidth: 900,
                dialogClickModal: false,
                column: [
                    {
                        label: "执行id",
                        prop: "executionId",
                        searchSpan: 4,
                        search: true,
                        width: 320,
                    },
                    {
                        label: "流程key",
                        prop: "processDefinitionKey",
                        searchSpan: 4,
                        search: true,
                    },
                    {
                        label: "实例id",
                        prop: "processInstanceId",
                        searchSpan: 4,
                        search: true,
                        width: 320,
                    },
                    {
                        width: 100,
                        label: "状态",
                        prop: "suspensionState",
                        slot: true,
                    },
                    {
                        width: 110,
                        label: "发起人",
                        prop: "startUser",
                    },
                    {
                        width: 144,
                        label: '开始时间',
                        prop: 'startTime',
                    },
                ]
            },
            {
              label: "实例id",
              prop: "processInstanceId",
              search: true,
              width: 320,
            },
            {
              label: "状态",
              prop: "suspensionState",
              slot: true,
              width: 80,
            },
            {
              label: "发起人",
              prop: "startUser",
              width: 100,
            },
            {
              label: '开始时间',
              prop: 'startTime',
              width: 165,
            },
          ]
        },
        data: []
      };
            data: []
        }
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          delBtn: this.vaildData(this.permission.flow_follow_delete, false),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
        ...mapGetters(["permission"]),
        permissionList () {
            return {
                delBtn: this.vaildData(this.permission.flow_follow_delete, false),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
        showStatus () {
            return (data) => {
                if (data == 1) {
                    return {
                        text: '激活',
                        type: 'success'
                    }
                } else {
                    return {
                        text: '挂起',
                        type: 'info'
                    }
                }
            }
        }
    },
    methods: {
      rowDel(row) {
        this.followBox = true;
        this.selectionId = row.id;
        this.processInstanceId = row.processInstanceId;
      },
      handleDelete() {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return deleteProcessInstance({deleteReason: this.deleteReason, processInstanceId: this.processInstanceId});
          })
          .then(() => {
            this.onLoad(this.page);
            this.followBox = false;
            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();
      },
      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;
        followList(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();
        });
      }
        rowDel (row) {
            this.followBox = true
            this.selectionId = row.id
            this.processInstanceId = row.processInstanceId
        },
        handleDelete () {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return deleteProcessInstance({ deleteReason: this.deleteReason, processInstanceId: this.processInstanceId })
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.followBox = false
                    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()
        },
        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
            followList(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>

<style>
  .none-border {
.none-border {
    border: 0;
    background-color: transparent !important;
  }
}
</style>

 src/views/flow/manager.vue

@@ -1,315 +1,340 @@
<template>
  <basic-container>
    <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page"
      :permission="permissionList" @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-radio-group v-model="mode" size="small">
          <el-radio-button label="1">通用流程</el-radio-button>
          <el-radio-button label="2">定制流程</el-radio-button>
        </el-radio-group>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button type="text" size="small" icon="el-icon-refresh" v-if="permission.flow_manager_state"
          @click.stop="handleState(scope.row,scope.index)">变更状态
        </el-button>
        <el-button type="text" size="small" icon="el-icon-search" v-if="permission.flow_manager_image"
          @click.stop="handleImage(scope.row,scope.index)">流程图
        </el-button>
        <el-button type="text" size="small" icon="el-icon-delete" v-if="permission.flow_manager_remove"
          @click.stop="handleSlotDelete(scope.row,scope.index)">删除
        </el-button>
      </template>
      <template slot-scope="{row}" slot="tenantId">
        <el-tag>{{row.tenantId===''?'通用':row.tenantId}}</el-tag>
      </template>
      <template slot-scope="{row}" slot="version">
        <el-tag>v{{row.version}}</el-tag>
      </template>
      <template slot-scope="{row}" slot="suspensionState">
        <el-tag>{{row.suspensionState===1?'激活':'挂起'}}</el-tag>
      </template>
      <template slot-scope="{row}" slot="category">
        <el-tag>{{row.categoryName}}</el-tag>
      </template>
    </avue-crud>
    <flow-design is-dialog :is-display.sync="flowBox" :process-definition-id="processDefinitionId"></flow-design>
    <el-dialog title="流程变更" append-to-body :visible.sync="stateBox" width="20%">
      <el-form :model="form" ref="form" label-width="80px">
        <el-form-item label="流程状态">
          <el-select v-model="flowState" placeholder="请选择" value="">
            <el-option v-for="item in stateOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="stateBox = false">关 闭</el-button>
        <el-button type="primary" @click="handleDoState">确 定</el-button>
      </span>
    </el-dialog>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page"
            :permission="permissionList" @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-radio-group v-model="mode" size="small">
                    <el-radio-button label="1">通用流程</el-radio-button>
                    <el-radio-button label="2">定制流程</el-radio-button>
                </el-radio-group>
            </template>
            <template slot-scope="{ row, size, index }" slot="menu">
                <el-button type="text" :size="size" icon="el-icon-refresh" v-if="permission.flow_manager_state"
                    @click.stop="handleState(row, index)">变更状态
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-search" v-if="permission.flow_manager_image"
                    @click.stop="handleImage(row, index)">流程图
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-delete" v-if="permission.flow_manager_remove"
                    @click.stop="handleSlotDelete(row, index)">删除
                </el-button>
            </template>
            <template slot-scope="{ row, size }" slot="tenantId">
                <el-tag :size="size">{{ row.tenantId === '' ? '通用' : row.tenantId }}</el-tag>
            </template>
            <template slot-scope="{ row, size }" slot="version">
                <el-tag :size="size">v{{ row.version }}</el-tag>
            </template>
            <template slot-scope="{ row, size }" slot="suspensionState">
                <el-tag :size="size" :type="showStatus(row.suspensionState).type"
                    v-text="showStatus(row.suspensionState).text">
                </el-tag>
            </template>
            <template slot-scope="{ row, size }" slot="category">
                <el-tag :size="size">{{ row.categoryName }}</el-tag>
            </template>
        </avue-crud>
        <flow-design is-dialog :is-display.sync="flowBox" :process-definition-id="processDefinitionId"></flow-design>
        <el-dialog title="流程变更" append-to-body :visible.sync="stateBox" width="20%">
            <el-form :model="form" ref="form" label-width="80px">
                <el-form-item label="流程状态">
                    <el-select v-model="flowState" placeholder="请选择" value="">
                        <el-option v-for="item in stateOptions" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="stateBox = false">关 闭</el-button>
                <el-button type="primary" @click="handleDoState">确 定</el-button>
            </span>
        </el-dialog>
    </basic-container>
</template>

<script>
  import {
import {
    mapGetters
  } from "vuex";
  import {
} from "vuex"
import {
    managerList,
    changeState,
    deleteDeployment
  } from "@/api/flow/flow";
  import {
} from "@/api/flow/flow"
import {
    flowCategory
  } from "@/util/flow";
} from "@/util/flow"

  export default {
    data() {
      return {
        form: {},
        mode: '1',
        selectionId: '',
        selectionList: [],
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        processDefinitionId: '',
        flowBox: false,
        stateBox: false,
        flowState: '',
        stateOptions: [{
          value: 'active',
          label: '激活'
        }, {
          value: 'suspend',
          label: '挂起'
        }],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          selection: true,
          editBtn: false,
          addBtn: false,
          viewBtn: false,
          delBtn: false,
          dialogWidth: 900,
          menuWidth: 250,
          dialogClickModal: false,
          column: [{
              label: '租户编号',
              prop: 'tenantId',
              slot: true,
              width: 120,
export default {
    data () {
        return {
            form: {},
            mode: '1',
            selectionId: '',
            selectionList: [],
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            {
              label: '流程主键',
              prop: 'id',
            processDefinitionId: '',
            flowBox: false,
            stateBox: false,
            flowState: '',
            stateOptions: [{
                value: 'active',
                label: '激活'
            }, {
                value: 'suspend',
                label: '挂起'
            }],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 240,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                selection: true,
                editBtn: false,
                addBtn: false,
                viewBtn: false,
                delBtn: false,
                dialogWidth: 900,
                dialogClickModal: false,
                column: [{
                    label: '租户编号',
                    prop: 'tenantId',
                    slot: true,
                    width: 120,
                },
                {
                    overHidden: true,
                    label: '流程主键',
                    prop: 'id',
                },
                {
                    width: 150,
                    overHidden: true,
                    label: '流程标识',
                    prop: 'key',
                    searchSpan: 4,
                    search: true,
                },
                {
                    width: 150,
                    overHidden: true,
                    label: '流程名称',
                    prop: 'name',
                    searchSpan: 4,
                    search: true,
                },
                {
                    width: 120,
                    label: "流程分类",
                    type: "select",
                    row: true,
                    dicUrl: "/api/blade-system/dict/dictionary?code=flow",
                    props: {
                        label: "dictValue",
                        value: "dictKey"
                    },
                    dataType: "number",
                    slot: true,
                    prop: "category",
                    // search: true,
                },
                {
                    width: 100,
                    label: '流程版本',
                    prop: 'version',
                    slot: true,
                },
                {
                    width: 100,
                    label: '状态',
                    prop: 'suspensionState',
                    slot: true,
                },
                {
                    width: 144,
                    label: '部署时间',
                    prop: 'deploymentTime',
                },
                ]
            },
            {
              label: '流程标识',
              prop: 'key',
              search: true,
              width: 150,
            },
            {
              label: '流程名称',
              prop: 'name',
              search: true,
              width: 150,
            },
            {
              label: "流程分类",
              type: "select",
              row: true,
              dicUrl: "/api/blade-system/dict/dictionary?code=flow",
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              dataType: "number",
              slot: true,
              prop: "category",
              // search: true,
              width: 100,
            },
            {
              label: '流程版本',
              prop: 'version',
              slot: true,
              width: 80,
            },
            {
              label: '状态',
              prop: 'suspensionState',
              slot: true,
              width: 80,
            },
            {
              label: '部署时间',
              prop: 'deploymentTime',
              width: 165,
            },
          ]
        },
        data: []
      };
            data: []
        }
    },
    watch: {
      'mode'() {
        this.onLoad(this.page);
      }
        'mode' () {
            this.onLoad(this.page)
        }
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          delBtn: this.vaildData(this.permission.flow_manager_remove, false),
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      },
      deploymentIds() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.deploymentId);
        });
        return ids.join(",");
      }
        ...mapGetters(["permission"]),
        permissionList () {
            return {
                delBtn: this.vaildData(this.permission.flow_manager_remove, false),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
        deploymentIds () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.deploymentId)
            })
            return ids.join(",")
        },
        showStatus () {
            return (data) => {
                if (data == 1) {
                    return {
                        text: '激活',
                        type: 'success'
                    }
                } else {
                    return {
                        text: '挂起',
                        type: 'info'
                    }
                }
            }
        }
    },
    methods: {
      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;
        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 deleteDeployment(this.deploymentIds)
                })
                .then(() => {
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                    this.onLoad(this.page)
                })
        },
        handleSlotDelete (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return deleteDeployment(row.deploymentId)
                })
                .then(() => {
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                    this.onLoad(this.page)
                })
        },
        handleState (row) {
            this.stateBox = true
            this.selectionId = row.id
        },
        handleDoState () {
            if (!this.flowState) {
                this.$message({
                    type: "warn",
                    message: "请先选择流程状态!"
                })
                return
            }
            changeState({
                processId: this.selectionId,
                state: this.flowState
            }).then(res => {
                const data = res.data
                if (data.success) {
                    this.$message({
                        type: "success",
                        message: data.msg
                    })
                    this.stateBox = false
                    this.onLoad(this.page)
                } else {
                    this.$message({
                        type: "warn",
                        message: data.msg
                    })
                }
            })
        },
        handleImage (row) {
            this.processDefinitionId = row.id
            this.flowBox = true
        },
        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            const values = {
                ...params,
                category: (params.category) ? flowCategory(params.category) : null,
                mode: this.mode
            }
            this.loading = true
            managerList(page.currentPage, page.pageSize, Object.assign(values, this.query)).then(res => {
                const data = res.data.data
                this.page.total = data.total
                this.data = data.records
                this.loading = false
                this.selectionClear()
            })
        }
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return deleteDeployment(this.deploymentIds);
          })
          .then(() => {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
            this.onLoad(this.page);
          });
      },
      handleSlotDelete(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return deleteDeployment(row.deploymentId);
          })
          .then(() => {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
            this.onLoad(this.page);
          });
      },
      handleState(row) {
        this.stateBox = true;
        this.selectionId = row.id;
      },
      handleDoState() {
        if (!this.flowState) {
          this.$message({
            type: "warn",
            message: "请先选择流程状态!"
          });
          return;
        }
        changeState({
          processId: this.selectionId,
          state: this.flowState
        }).then(res => {
          const data = res.data;
          if (data.success) {
            this.$message({
              type: "success",
              message: data.msg
            });
            this.stateBox = false;
            this.onLoad(this.page);
          } else {
            this.$message({
              type: "warn",
              message: data.msg
            });
          }
        })
      },
      handleImage(row) {
        this.processDefinitionId = row.id;
        this.flowBox = true;
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        const values = {
          ...params,
          category: (params.category) ? flowCategory(params.category) : null,
          mode: this.mode
        };
        this.loading = true;
        managerList(page.currentPage, page.pageSize, Object.assign(values, 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/flow/model.vue

@@ -1,482 +1,427 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               v-model="form"
               :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="primary"
                   size="mini"
                   icon="el-icon-circle-plus"
                   v-if="permission.flow_model_create"
                   plain
                   @click="handleCreate">创 建
        </el-button>
        <el-button type="danger"
                   size="mini"
                   icon="el-icon-delete"
                   v-if="permission.flow_model_delete"
                   plain
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="scope"
                slot="menu">
        <el-button type="text"
                   size="mini"
                   icon="el-icon-setting"
                   v-if="permission.flow_model_update"
                   @click.stop="handleUpdate(scope.row,scope.index)">配置
        </el-button>
        <el-button type="text"
                   size="mini"
                   icon="el-icon-upload2"
                   v-if="permission.flow_model_deploy"
                   @click.stop="handleDeploy(scope.row,scope.index)">部署
        </el-button>
        <el-button type="text"
                   size="mini"
                   icon="el-icon-delete"
                   v-if="permission.flow_model_delete"
                   @click.stop="handleSlotDelete(scope.row,scope.index)">删除
        </el-button>
      </template>
      <template slot-scope="{row}"
                slot="version">
        <el-tag>v{{ row.version }}</el-tag>
      </template>
    </avue-crud>
    <el-dialog title="流程配置"
               append-to-body
               destroy-on-close
               :visible.sync="flowBox"
               :close-on-press-escape="false"
               :fullscreen="true"
               :before-close="handleNutflowClose"
               custom-class="wf-dialog">
      <wf-design-base v-if="nutflowOption.step === 1"
                      class="animated fadeIn"
                      style="height: calc(100vh - 108px);"
                      ref="wf-design"
                      :options="nutflowOption.step1"></wf-design-base>
      <wf-design-base v-if="nutflowOption.step === 2"
                      class="animated fadeIn"
                      style="height: calc(100vh - 108px);"
                      ref="wf-design-view"
                      :options="nutflowOption.step2"></wf-design-base>
      <span slot="footer"
            class="avue-dialog__footer">
        <el-button size="small"
                   @click="handleNutflowClose(() => {}, true)">取 消</el-button>
        <el-button v-if="nutflowOption.step === 1"
                   size="small"
                   type="success"
                   @click="handleStep(1)">下 一 步</el-button>
        <el-button v-if="nutflowOption.step === 2"
                   size="small"
                   type="success"
                   @click="handleStep(-1)">上 一 步</el-button>
        <el-button v-if="nutflowOption.step === 2"
                   size="small"
                   type="primary"
                   @click="handleSubmitModel">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="流程部署"
               append-to-body
               :visible.sync="deployBox"
               width="20%">
      <avue-form ref="form"
                 :option="optionDeploy"
                 v-model="form"
                 @submit="handleSubmit"/>
      <span slot="footer"
            class="dialog-footer">
        <el-button @click="deployBox = false">取 消</el-button>
        <el-button type="primary"
                   @click="handleDoDeploy"
                   :loading="deployLoading">确 定</el-button>
      </span>
    </el-dialog>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :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="primary" size="mini" icon="el-icon-circle-plus" v-if="permission.flow_model_create" plain
                    @click="handleCreate">创 建
                </el-button>
                <el-button type="danger" size="mini" icon="el-icon-delete" v-if="permission.flow_model_delete" plain
                    @click="handleDelete">删 除
                </el-button>
            </template>

            <template slot-scope="{ row, size, index }" slot="menu">
                <el-button type="text" :size="size" icon="el-icon-setting" v-if="permission.flow_model_update"
                    @click.stop="handleUpdate(row, index)">配置
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-upload2" v-if="permission.flow_model_deploy"
                    @click.stop="handleDeploy(row, index)">部署
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-delete" v-if="permission.flow_model_delete"
                    @click.stop="handleSlotDelete(row, index)">删除
                </el-button>
            </template>
            <template slot-scope="{row, size}" slot="version">
                <el-tag :size="size">v{{ row.version }}</el-tag>
            </template>
        </avue-crud>
        <el-dialog title="流程配置" append-to-body destroy-on-close :visible.sync="flowBox" :close-on-press-escape="false"
            :fullscreen="true" :before-close="handleNutflowClose" custom-class="wf-dialog">
            <wf-design-base v-if="nutflowOption.step === 1" class="animated fadeIn" style="height: calc(100vh - 108px);"
                ref="wf-design" :options="nutflowOption.step1"></wf-design-base>
            <wf-design-base v-if="nutflowOption.step === 2" class="animated fadeIn" style="height: calc(100vh - 108px);"
                ref="wf-design-view" :options="nutflowOption.step2"></wf-design-base>
            <span slot="footer" class="avue-dialog__footer">
                <el-button size="small" @click="handleNutflowClose(() => { }, true)">取 消</el-button>
                <el-button v-if="nutflowOption.step === 1" size="small" type="success" @click="handleStep(1)">下 一
                    步</el-button>
                <el-button v-if="nutflowOption.step === 2" size="small" type="success" @click="handleStep(-1)">上 一
                    步</el-button>
                <el-button v-if="nutflowOption.step === 2" size="small" type="primary" @click="handleSubmitModel">确
                    定</el-button>
            </span>
        </el-dialog>
        <el-dialog title="流程部署" append-to-body :visible.sync="deployBox" width="20%">
            <avue-form ref="form" :option="optionDeploy" v-model="form" @submit="handleSubmit" />
            <span slot="footer" class="dialog-footer">
                <el-button @click="deployBox = false">取 消</el-button>
                <el-button type="primary" @click="handleDoDeploy" :loading="deployLoading">确 定</el-button>
            </span>
        </el-dialog>
    </basic-container>
</template>

<script>
import {mapGetters} from "vuex";
import {modelList, removeModel, deployModel, submitModel, detail} from "@/api/flow/flow";
import {flowCategory} from "@/util/flow";
import { mapGetters } from "vuex"
import { modelList, removeModel, deployModel, submitModel, detail } from "@/api/flow/flow"
import { flowCategory } from "@/util/flow"

export default {
  data() {
    return {
      form: {},
      optionDeploy: {
        menuBtn: false,
        column: [
          {
            label: "流程类型",
            type: "select",
            dicUrl: "/api/blade-system/dict/dictionary?code=flow",
            props: {
              label: "dictValue",
              value: "dictKey"
    data () {
        return {
            form: {},
            optionDeploy: {
                menuBtn: false,
                column: [
                    {
                        label: "流程类型",
                        type: "select",
                        dicUrl: "/api/blade-system/dict/dictionary?code=flow",
                        props: {
                            label: "dictValue",
                            value: "dictKey"
                        },
                        dataType: "number",
                        slot: true,
                        prop: "categoryValue",
                        search: true,
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请选择流程类型",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "流程模式",
                        prop: "flowMode",
                        type: "radio",
                        dicData: [
                            {
                                label: "通用流程",
                                value: 1
                            },
                            {
                                label: "定制流程",
                                value: 2
                            }
                        ],
                        value: 1,
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: '请选择流程模式',
                                trigger: 'blur'
                            }
                        ],
                    },
                    {
                        label: "所属租户",
                        prop: "tenantId",
                        type: "tree",
                        multiple: true,
                        dicUrl: "/api/blade-system/tenant/select",
                        props: {
                            label: "tenantName",
                            value: "tenantId"
                        },
                        display: false,
                        span: 24,
                        rules: [
                            {
                                required: true,
                                message: '请选择所属租户',
                                trigger: 'blur'
                            }
                        ],
                    },
                ],
            },
            dataType: "number",
            slot: true,
            prop: "categoryValue",
            search: true,
            span: 24,
            rules: [{
              required: true,
              message: "请选择流程类型",
              trigger: "blur"
            }]
          },
          {
            label: "流程模式",
            prop: "flowMode",
            type: "radio",
            dicData: [
              {
                label: "通用流程",
                value: 1
              },
              {
                label: "定制流程",
                value: 2
              }
            ],
            value: 1,
            span: 24,
            rules: [
              {
                required: true,
                message: '请选择流程模式',
                trigger: 'blur'
              }
            ],
          },
          {
            label: "所属租户",
            prop: "tenantId",
            type: "tree",
            multiple: true,
            dicUrl: "/api/blade-system/tenant/select",
            props: {
              label: "tenantName",
              value: "tenantId"
            selectionId: '',
            selectionList: [],
            query: {},
            loading: true,
            deployLoading: false,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            display: false,
            span: 24,
            rules: [
              {
                required: true,
                message: '请选择所属租户',
                trigger: 'blur'
              }
            ],
          },
        ],
      },
      selectionId: '',
      selectionList: [],
      query: {},
      loading: true,
      deployLoading: false,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      deployBox: false,
      flowBox: false,
      option: {
        height: 'auto',
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        selection: true,
        editBtn: false,
        addBtn: false,
        viewBtn: false,
        delBtn: false,
        dialogWidth: 900,
        menuWidth: 200,
        dialogClickModal: false,
        size: 'mini',
        searchSize: 'mini',
        column: [
          {
            label: '模型主键',
            prop: 'id',
          },
          {
            label: '模型标识',
            prop: 'modelKey',
            search: true,
            overHidden: true
          },
          {
            label: '模型名称',
            prop: 'name',
            search: true,
            overHidden: true
          },
          {
            label: '流程版本',
            prop: 'version',
            slot: true,
            overHidden: true
          },
          {
            label: '创建时间',
            prop: 'created',
            overHidden: true
          },
          {
            label: '更新时间',
            prop: 'lastUpdated',
            overHidden: true
          },
        ]
      },
      data: [],
      nutflowOption: {
        process: {},
        step: 1,
        step1: {
          toolbar: ['open', 'create', 'fit', 'zoom-in', 'zoom-out', 'undo', 'redo', 'import', 'preview'],
            deployBox: false,
            flowBox: false,
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                selection: true,
                editBtn: false,
                addBtn: false,
                viewBtn: false,
                delBtn: false,
                dialogWidth: 900,
                dialogClickModal: false,
                column: [
                    {
                        label: '模型主键',
                        prop: 'id',
                    },
                    {
                        label: '模型标识',
                        prop: 'modelKey',
                        searchSpan: 4,
                        search: true,
                        overHidden: true
                    },
                    {
                        label: '模型名称',
                        prop: 'name',
                        searchSpan: 4,
                        search: true,
                        overHidden: true
                    },
                    {
                        label: '流程版本',
                        prop: 'version',
                        slot: true,
                        overHidden: true
                    },
                    {
                        width: 144,
                        label: '创建时间',
                        prop: 'created',
                    },
                    {
                        width: 144,
                        label: '更新时间',
                        prop: 'lastUpdated',
                    },
                ]
            },
            data: [],
            nutflowOption: {
                process: {},
                step: 1,
                step1: {
                    toolbar: ['open', 'create', 'fit', 'zoom-in', 'zoom-out', 'undo', 'redo', 'import', 'preview'],
                },
                step2: {
                    mode: 'view',
                    simulation: true,
                    minimap: true,
                }
            }
        }
    },
    watch: {
        'form.flowMode' () {
            this.$refs.form.option.column.filter(item => {
                if (item.prop === "tenantId") {
                    item.display = this.form.flowMode === 2
                }
            })
        }
    },
    computed: {
        ...mapGetters(["permission"]),
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        }
    },
    methods: {
        handleSubmitModel () {
            const registry = this.$refs['wf-design-view'].getElementRegistry().getAll()
            const { businessObject } = registry[0]
            const { id, name, documentation } = businessObject
            const description = (documentation && documentation.length > 0) ? documentation[0].text : null
            const params = {
                ...this.nutflowOption.process,
                modelKey: id,
                name,
                description,
                modelEditorXml: this.nutflowOption.process.xml
            }
            submitModel(params).then(() => {
                this.$message.success("操作成功")
                this.handleNutflowClose()
                this.onLoad(this.page, this.query)
            })
        },
        step2: {
          mode: 'view',
          simulation: true,
          minimap: true,
        }
      }
    };
  },
  watch: {
    'form.flowMode'() {
      this.$refs.form.option.column.filter(item => {
        if (item.prop === "tenantId") {
          item.display = this.form.flowMode === 2;
        }
      });
    }
  },
  computed: {
    ...mapGetters(["permission"]),
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
  },
  methods: {
    handleSubmitModel() {
      const registry = this.$refs['wf-design-view'].getElementRegistry().getAll()
      const {businessObject} = registry[0]
      const {id, name, documentation} = businessObject
      const description = (documentation && documentation.length > 0) ? documentation[0].text : null
      const params = {
        ...this.nutflowOption.process,
        modelKey: id,
        name,
        description,
        modelEditorXml: this.nutflowOption.process.xml
      }
      submitModel(params).then(() => {
        this.$message.success("操作成功")
        this.handleNutflowClose()
        this.onLoad(this.page, this.query)
      })
    },
    handleStep(step) {
      if (step === 1) { // 下一步
        this.$refs['wf-design'].getData('xml').then(data => {
          this.$set(this.nutflowOption.step1, 'xml', data)
          this.$set(this.nutflowOption.step2, 'xml', data)
          this.$set(this.nutflowOption.process, 'xml', data)
          this.$set(this.nutflowOption, 'step', 2)
        })
      } else this.$set(this.nutflowOption, 'step', 1)
    },
    handleNutflowClose(done, flag) {
      const initOption = {
        process: {},
        step: 1,
        step1: {
          toolbar: ['open', 'create', 'fit', 'zoom-in', 'zoom-out', 'undo', 'redo', 'import', 'preview'],
        handleStep (step) {
            if (step === 1) { // 下一步
                this.$refs['wf-design'].getData('xml').then(data => {
                    this.$set(this.nutflowOption.step1, 'xml', data)
                    this.$set(this.nutflowOption.step2, 'xml', data)
                    this.$set(this.nutflowOption.process, 'xml', data)
                    this.$set(this.nutflowOption, 'step', 2)
                })
            } else this.$set(this.nutflowOption, 'step', 1)
        },
        step2: {
          mode: 'view',
          simulation: true,
          minimap: true,
        handleNutflowClose (done, flag) {
            const initOption = {
                process: {},
                step: 1,
                step1: {
                    toolbar: ['open', 'create', 'fit', 'zoom-in', 'zoom-out', 'undo', 'redo', 'import', 'preview'],
                },
                step2: {
                    mode: 'view',
                    simulation: true,
                    minimap: true,
                }
            }
            if (done || flag) {
                this.$confirm('确定要关闭吗？关闭未保存的修改都会丢失。', '警告', {
                    type: 'warning'
                }).then(() => {
                    this.$set(this, 'nutflowOption', initOption)
                    if (typeof done == 'function') done()
                    this.flowBox = false
                }).catch(() => {
                })
            } else {
                this.$set(this, 'nutflowOption', initOption)
                this.flowBox = false
            }
        },
        handleSubmit (form, done) {
            this.deployLoading = true
            deployModel({
                modelId: this.selectionId,
                category: flowCategory(form.categoryValue),
                tenantIds: form.tenantId ? form.tenantId.join(",") : ""
            }).then(res => {
                const data = res.data
                if (data.success) {
                    this.$message({
                        type: "success",
                        message: data.msg
                    })
                    done()
                    this.$refs.form.resetForm()
                    this.deployBox = false
                    this.deployLoading = false
                } else {
                    done()
                    this.deployLoading = false
                    this.$message({
                        type: "warn",
                        message: data.msg
                    })
                }
            })
        },
        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 removeModel(this.ids)
                })
                .then(() => {
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                    this.onLoad(this.page)
                })
        },
        handleCreate () {
            this.flowBox = true
        },
        handleUpdate (row) {
            detail({ id: row.id }).then(res => {
                const data = res.data.data
                const { modelEditorXml } = data
                this.$set(this.nutflowOption.step1, 'xml', modelEditorXml)
                this.$set(this.nutflowOption, 'process', data)
                this.flowBox = true
            })
        },
        handleDeploy (row) {
            this.deployBox = true
            this.selectionId = row.id
        },
        handleDoDeploy () {
            this.$refs.form.submit()
        },
        handleSlotDelete (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return removeModel(row.id)
                })
                .then(() => {
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                    this.onLoad(this.page)
                })
        },
        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
            modelList(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()
            })
        }
      }
      if (done || flag) {
        this.$confirm('确定要关闭吗？关闭未保存的修改都会丢失。', '警告', {
          type: 'warning'
        }).then(() => {
          this.$set(this, 'nutflowOption', initOption)
          if (typeof done == 'function') done()
          this.flowBox = false
        }).catch(() => {
        })
      } else {
        this.$set(this, 'nutflowOption', initOption)
        this.flowBox = false
      }
    },
    handleSubmit(form, done) {
      this.deployLoading = true;
      deployModel({
        modelId: this.selectionId,
        category: flowCategory(form.categoryValue),
        tenantIds: form.tenantId ? form.tenantId.join(",") : ""
      }).then(res => {
        const data = res.data;
        if (data.success) {
          this.$message({
            type: "success",
            message: data.msg
          });
          done();
          this.$refs.form.resetForm();
          this.deployBox = false;
          this.deployLoading = false;
        } else {
          done();
          this.deployLoading = false;
          this.$message({
            type: "warn",
            message: data.msg
          });
        }
      })
    },
    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 removeModel(this.ids);
        })
        .then(() => {
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crud.toggleSelection();
          this.onLoad(this.page);
        });
    },
    handleCreate() {
      this.flowBox = true;
    },
    handleUpdate(row) {
      detail({id: row.id}).then(res => {
        const data = res.data.data
        const {modelEditorXml} = data
        this.$set(this.nutflowOption.step1, 'xml', modelEditorXml)
        this.$set(this.nutflowOption, 'process', data)
        this.flowBox = true;
      })
    },
    handleDeploy(row) {
      this.deployBox = true;
      this.selectionId = row.id;
    },
    handleDoDeploy() {
      this.$refs.form.submit();
    },
    handleSlotDelete(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return removeModel(row.id);
        })
        .then(() => {
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crud.toggleSelection();
          this.onLoad(this.page);
        });
    },
    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;
      modelList(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>

<style lang="scss">

.wf-dialog {
  .el-dialog__body {
    padding: 5px;
  }
    .el-dialog__body {
        padding: 5px;
    }

  .avue-dialog__footer {
    text-align: center;
  }
    .avue-dialog__footer {
        text-align: center;
    }
}
</style>

 src/views/grid/gridman.vue

@@ -32,13 +32,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 350,
                border: true,
                //stripe:true,
                index: true,
@@ -105,6 +108,7 @@
                    },

                    {
                        width: 120,
                        label: "联系电话",
                        prop: "mobile",
                        searchSpan: 4,
@@ -119,7 +123,6 @@
                    },

                    {
                        width: 156,
                        overHidden: true,
                        label: "所属社区",
                        addDisplay: false,
@@ -136,7 +139,6 @@
                    },

                    {
                        width: 110,
                        overHidden: true,
                        label: "所属网格",
                        addDisplay: false,
@@ -151,9 +153,9 @@
                    },

                    {
                        width: 110,
                        label: "形象照",
                        prop: "picUrl",
                        width: 80,
                        type: "upload",
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file-attach",

 src/views/gzll/owners.vue

@@ -10,6 +10,11 @@
                    @click="manageMember(scope.row)">业委会成员
                </el-button>
            </template>

            <template slot-scope="{ row, size }" slot="status">
                <el-tag :size="size" :type="showStatus(row.status).type" v-text="showStatus(row.status).text">
                </el-tag>
            </template>
        </avue-crud>

        <el-drawer title="业委会成员" size="40%" append-to-body :visible.sync="memberFlag" :direction="'rtl'">
@@ -51,6 +56,12 @@
            selectionList: [],
            memberFlag: false,
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 300,

                // menu: false,
                // addBtn: false,
                border: true,
@@ -60,8 +71,6 @@
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
@@ -80,8 +89,6 @@
                        },
                        defaultExpandedKeys: ["361102003"],
                        cascader: ['principalId'],
                        span: 10,
                        labelWidth: 120,
                        overHidden: true,
                        rules: [{
                            required: true,
@@ -91,13 +98,12 @@
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        offset: 2,
                        overHidden: true,
                        width: 120,
                        label: "业委会名称",
                        prop: "name",
                        search: true,
                        searchLabelWidth: 136,
                        searchLabelWidth: 124,
                        rules: [{
                            required: true,
                            message: "请输入业委会名称",
@@ -106,8 +112,8 @@
                    },

                    {
                        width: 220,
                        overHidden: true,
                        width: 220,
                        label: '小区名称',
                        addDisplay: false,
                        editDisplay: false,
@@ -121,8 +127,6 @@
                        display: false,
                    },
                    {
                        span: 10,
                        labelWidth: 120,
                        label: "业委会负责人",
                        prop: "principalId",
                        type: "tree",
@@ -141,10 +145,8 @@
                        },],
                    },
                    {
                        span: 10,
                        labelWidth: 120,
                        width: 120,
                        label: "负责人名称",
                        offset: 2,
                        prop: "principalName",
                        rules: [{
                            required: true,
@@ -153,8 +155,7 @@
                        },],
                    },
                    {
                        span: 10,
                        labelWidth: 120,
                        width: 120,
                        label: "负责人手机号",
                        prop: "mobile",
                        rules: [{
@@ -165,10 +166,8 @@
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        width: 120,
                        label: "业委会届别",
                        offset: 2,
                        prop: "session",
                        type: "number",
                        rules: [{
@@ -179,8 +178,7 @@
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        width: 100,
                        label: "成立时间",
                        prop: "establishTime",
                        type: "date",
@@ -190,14 +188,12 @@

                    {
                        span: 20,
                        labelWidth: 120,
                        label: "所在地址",
                        prop: "location",
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        width: 124,
                        label: "任期开始时间",
                        prop: "startTime",
                        type: "date",
@@ -211,10 +207,8 @@
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        width: 124,
                        label: "任期结束时间",
                        offset: 2,
                        prop: "endTime",
                        type: "date",
                        format: "yyyy-MM-dd",
@@ -231,7 +225,6 @@
                        label: "图片",
                        prop: "imageUrl",
                        type: "upload",
                        labelWidth: 120,
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        propsHttp: {
@@ -240,12 +233,11 @@
                            url: "link",
                        },
                        viewDisplay: false,
                        span: 20,
                        span: 24,
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        span: 12,
                        label: "排序",
                        prop: "sort",
                        type: 'number',
@@ -257,10 +249,10 @@
                    },

                    {
                        span: 10,
                        labelWidth: 120,
                        width: 100,
                        span: 12,
                        label: "状态",
                        offset: 2,
                        slot: true,
                        prop: "status",
                        type: 'switch',
                        activeColor: "#13ce66",
@@ -284,7 +276,6 @@

                    {
                        span: 20,
                        labelWidth: 120,
                        label: "简介",
                        prop: "profile",
                        component: "AvueUeditor",
@@ -302,7 +293,6 @@
                    // {
                    //   label: "简介",
                    //   prop: "profile",
                    //   // labelWidth: 140,
                    //   viewDisplay: false,
                    //   type: "textarea"
                    // },
@@ -330,6 +320,21 @@
            })
            return ids.join(",")
        },
        showStatus () {
            return (data) => {
                if (data == 0) {
                    return {
                        text: '正常',
                        type: 'success'
                    }
                } else {
                    return {
                        text: '关闭',
                        type: 'info'
                    }
                }
            }
        }
    },
    methods: {
        manageMember (row) {

 src/views/property/components/partyOrganizationMember.vue

@@ -1,574 +1,572 @@
<template>
  <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">
      <template slot="menuLeft">
        <el-button type="danger" size="small" plain icon="el-icon-delete" v-if="permission.household_delete"
                   @click="handleDelete">删 除
        </el-button>
      </template>
    <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">
            <template slot="menuLeft">
                <el-button type="danger" size="small" plain icon="el-icon-delete" v-if="permission.household_delete"
                    @click="handleDelete">删 除
                </el-button>
            </template>

      <template slot="householdIdType" slot-scope="{item,value,label}">
        <span>{{ item.name }}({{item.phoneNumber}})</span>
      </template>
            <template slot="householdIdType" slot-scope="{item,value,label}">
                <span>{{ item.name }}({{ item.phoneNumber }})</span>
            </template>

      <template slot-scope="{row}" slot="phoneNumber">
        <el-button type="text" @click="showStringDispose(row, 'phoneNumberflag')">
          {{ textDispose(row, 'phoneNumberflag', 'phoneNumber') }}
        </el-button>
      </template>
      <template slot-scope="{row}" slot="idCard">
        <el-button type="text" @click="showStringDispose(row, 'idCardflag')"
                   v-text="textDispose(row, 'idCardflag', 'idCard')"></el-button>
      </template>
            <template slot-scope="{row}" slot="phoneNumber">
                <el-button type="text" @click="showStringDispose(row, 'phoneNumberflag')">
                    {{ textDispose(row, 'phoneNumberflag', 'phoneNumber') }}
                </el-button>
            </template>
            <template slot-scope="{row}" slot="idCard">
                <el-button type="text" @click="showStringDispose(row, 'idCardflag')"
                    v-text="textDispose(row, 'idCardflag', 'idCard')"></el-button>
            </template>


    </avue-crud>
  </basic-container>
        </avue-crud>
    </basic-container>
</template>

<script>
import {mapGetters} from "vuex";
import {add, getDetail, getList, remove, update} from "@/api/partyOrganization/partyOrganizationMember";
import {validatePhone} from "@/util/validate";
import {getAllHouseHold,getDetatils as householdDetail} from "@/api/userHouse/list/houseHold";
import func from "@/util/func";
import website from "@/config/website";
const labelWidth = 100;
const searchSpan = 5;
import { mapGetters } from "vuex"
import { add, getDetail, getList, remove, update } from "@/api/partyOrganization/partyOrganizationMember"
import { validatePhone } from "@/util/validate"
import { getAllHouseHold, getDetatils as householdDetail } from "@/api/userHouse/list/houseHold"
import func from "@/util/func"
import website from "@/config/website"
const labelWidth = 100
const searchSpan = 5
export default {
  name: "partyOrganizationMember",
  data () {
    return {
      row: {},
      userList: [],
      form: {},
      search: {},
      excelBox: false,
      selectionList: [],
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      option: {
        height: 680,
        calcHeight: 54,
        tip: false,
        searchShow: true,
        border: true,
        index: true,
        selection: true,
        dialogClickModal: false,
        searchMenuSpan: 6,
        menuWidth: 280,
        column: [
          {
            label:"姓名",
            labelWidth: labelWidth,
            prop: "houseHoldName",
            display:false,
            searchSpan: searchSpan,
            search:true,
          },
          {
            label: "姓名",
            labelWidth:labelWidth,
            prop: "householdId",
            type: 'select',
            remote: true,
            hide:true,
            dicUrl:"",
            props: {
              label: 'name',
              value: 'id',
    name: "partyOrganizationMember",
    data () {
        return {
            row: {},
            userList: [],
            form: {},
            search: {},
            excelBox: false,
            selectionList: [],
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            dicData:[],
            rules: [
              {
                required: true,
                message: '请输入姓名',
                trigger: 'blur'
              }
            ],
          },
          {
            label: "手机号",
            labelWidth:labelWidth,
            prop: "phoneNumber",
            search:true,
            searchSpan: searchSpan,
            rules: [{
              required: false,
              message: "请输入手机号",
              validator: validatePhone,
              trigger: ["blur","change"],
            }],
            disabled:true,
          },
          {
            label: "性别",
            labelWidth:labelWidth,
            prop: "gender",
            type: "select",
            hide: true,
            disabled:true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=sex",
            dataType: "number",
            props: {
              label: "dictValue",
              value: "dictKey",
            option: {
                height: 680,
                calcHeight: 54,
                tip: false,
                searchShow: true,
                border: true,
                index: true,
                selection: true,
                dialogClickModal: false,
                searchMenuSpan: 6,
                menuWidth: 280,
                column: [
                    {
                        label: "姓名",
                        labelWidth: labelWidth,
                        prop: "houseHoldName",
                        display: false,
                        searchSpan: searchSpan,
                        search: true,
                    },
                    {
                        label: "姓名",
                        labelWidth: labelWidth,
                        prop: "householdId",
                        type: 'select',
                        remote: true,
                        hide: true,
                        dicUrl: "",
                        props: {
                            label: 'name',
                            value: 'id',
                        },
                        dicData: [],
                        rules: [
                            {
                                required: true,
                                message: '请输入姓名',
                                trigger: 'blur'
                            }
                        ],
                    },
                    {
                        label: "手机号",
                        labelWidth: labelWidth,
                        prop: "phoneNumber",
                        search: true,
                        searchSpan: searchSpan,
                        rules: [{
                            required: false,
                            message: "请输入手机号",
                            validator: validatePhone,
                            trigger: ["blur", "change"],
                        }],
                        disabled: true,
                    },
                    {
                        label: "性别",
                        labelWidth: labelWidth,
                        prop: "gender",
                        type: "select",
                        hide: true,
                        disabled: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=sex",
                        dataType: "number",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },
                    {
                        label: "生日",
                        labelWidth: labelWidth,
                        prop: "birthday",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        hide: true,
                        disabled: true,
                    },
                    {
                        label: "证件类型",
                        labelWidth: labelWidth,
                        prop: "cardType",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=cardType",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        disabled: true
                    },
                    {
                        label: "证件号码",
                        labelWidth: labelWidth,
                        prop: "idCard",
                        disabled: true
                    },
                    {
                        label: "党员类型",
                        labelWidth: labelWidth,
                        prop: "partyMemberType",
                        type: "select",
                        dicUrl: "/api/blade-label/label/getLabelList?parentId=104",
                        props: {
                            label: "name",
                            value: "id",
                        },
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择党员类型",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "党员职务",
                        labelWidth: labelWidth,
                        prop: "partyMemberPost",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=partyMemberPost",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择党员职务",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "入党日期",
                        labelWidth: labelWidth,
                        prop: "joinDate",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择入党日期",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "转入日期",
                        labelWidth: labelWidth,
                        prop: "transferDate",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择转入日期",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "签入社区日",
                        labelWidth: labelWidth,
                        prop: "signInDate",
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择签入社区日",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "是否先锋岗",
                        labelWidth: labelWidth,
                        prop: 'isPioneer',
                        type: 'radio',
                        button: true,
                        value: 2,
                        dicData: [
                            {
                                label: "是",
                                value: 1
                            },
                            {
                                label: "否",
                                value: 2
                            },
                        ],
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请选择是否先锋岗",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "家庭住址",
                        labelWidth: labelWidth,
                        prop: 'address',
                        hide: true,
                        span: 24,
                    },
                    {
                        label: "图片",
                        labelWidth: labelWidth,
                        prop: "urls",
                        hide: true,
                        type: "upload",
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        propsHttp: {
                            res: "data",
                            name: 'name',
                            url: "link",
                        },
                        row: true
                    },
                    {
                        label: "排序",
                        labelWidth: labelWidth,
                        prop: "sort",
                        hide: true,
                        type: 'number',
                        value: 999,
                        rules: [{
                            required: true,
                            message: "请输入排序",
                            trigger: ["blur", "change"],
                        },],
                    },
                    {
                        label: "状态",
                        labelWidth: labelWidth,
                        hide: true,
                        prop: "status",
                        type: 'radio',
                        dicData: [
                            {
                                label: "正常",
                                value: 1
                            },
                            {
                                label: "关闭",
                                value: 2
                            },
                        ],
                        button: true,
                        value: 1,
                        rules: [{
                            required: true,
                            message: "请输入排序",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "简介",
                        labelWidth: labelWidth,
                        prop: "profile",
                        span: 24,
                        component: "AvueUeditor",
                        options: {
                            action: "/api/blade-resource/oss/endpoint/put-file",
                            props: {
                                res: "data",
                                url: "link",
                            },
                        },
                        hide: true,
                        minRows: 6,
                    },
                ]
            },
          },
          {
            label: "生日",
            labelWidth:labelWidth,
            prop: "birthday",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            hide: true,
            disabled: true,
          },
          {
            label: "证件类型",
            labelWidth:labelWidth,
            prop: "cardType",
            type: "select",
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=cardType",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            disabled:true
          },
          {
            label: "证件号码",
            labelWidth:labelWidth,
            prop: "idCard",
            disabled: true
          },
          {
            label: "党员类型",
            labelWidth:labelWidth,
            prop: "partyMemberType",
            type: "select",
            dicUrl: "/api/blade-label/label/getLabelList?parentId=104",
            props: {
              label: "name",
              value: "id",
            },
            hide:true,
            rules: [{
              required: true,
              message: "请选择党员类型",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "党员职务",
            labelWidth:labelWidth,
            prop: "partyMemberPost",
            type: "select",
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=partyMemberPost",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            hide:true,
            rules: [{
              required: true,
              message: "请选择党员职务",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "入党日期",
            labelWidth:labelWidth,
            prop: "joinDate",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            hide: true,
            rules: [{
              required: true,
              message: "请选择入党日期",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "转入日期",
            labelWidth:labelWidth,
            prop: "transferDate",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            hide: true,
            rules: [{
              required: true,
              message: "请选择转入日期",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "签入社区日",
            labelWidth:labelWidth,
            prop: "signInDate",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            hide: true,
            rules: [{
              required: true,
              message: "请选择签入社区日",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "是否先锋岗",
            labelWidth:labelWidth,
            prop: 'isPioneer',
            type: 'radio',
            button:true,
            value:2,
            dicData: [
              {
                label: "是",
                value: 1
              },
              {
                label: "否",
                value:2
              },
            ],
            hide:true,
            rules: [{
              required: true,
              message: "请选择是否先锋岗",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "家庭住址",
            labelWidth:labelWidth,
            prop: 'address',
            hide:true,
            span:24,
          },
          {
            label: "图片",
            labelWidth:labelWidth,
            prop: "urls",
            hide:true,
            type: "upload",
            listType: "picture-img",
            action: "/api/blade-resource/oss/endpoint/put-file",
            propsHttp: {
              res: "data",
              name: 'name',
              url: "link",
            },
            row:true
          },
          {
            label: "排序",
            labelWidth:labelWidth,
            prop: "sort",
            hide:true,
            type: 'number',
            value:999,
            rules: [{
              required: true,
              message: "请输入排序",
              trigger: ["blur","change"],
            },],
          },
          {
            label: "状态",
            labelWidth:labelWidth,
            hide:true,
            prop: "status",
            type: 'radio',
            dicData: [
              {
                label: "正常",
                value: 1
              },
              {
                label: "关闭",
                value:2
              },
            ],
            button:true,
            value:1,
            rules: [{
              required: true,
              message: "请输入排序",
              trigger: ["blur","change"]
            },],
          },
          {
            label: "简介",
            labelWidth:labelWidth,
            prop: "profile",
            span:24,
            component: "AvueUeditor",
            options: {
              action: "/api/blade-resource/oss/endpoint/put-file",
              props: {
                res: "data",
                url: "link",
              },
            },
            hide: true,
            minRows: 6,
          },
        ]
      },
      data: [],
    }
  },
  watch: {
    "form.householdId":{
      handler(val){
        if(val){
          householdDetail(val).then(res=>{
            let data = res.data.data

            this.form.phoneNumber = data.phoneNumber
            this.form.gender = data.gender
            this.form.birthday = data.birthday
            this.form.cardType = data.cardType
            this.form.idCard = data.idCard
            this.form.houseCode = data.houseCode
          })
            data: [],
        }
      }
    }
  },
  computed: {
    ...mapGetters(["userInfo", "permission"]),
    permissionList () {
      return {
        addBtn: this.vaildData(this.permission.household_add, true),
        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")
          }
        }
      }
    },
    ids () {
      let ids = []
      this.selectionList.forEach(ele => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },
  },
  mounted () { },
  methods: {
    showStringDispose (row, type) {
      row[type] = !row[type]
    },
    watch: {
        "form.householdId": {
            handler (val) {
                if (val) {
                    householdDetail(val).then(res => {
                        let data = res.data.data

     init (data) {
      this.row = data
       this.getUserList()
      this.onLoad(this.page)
    },

    getUserList(param){
      let dicUrl =  `/api/blade-household/household/getAllHouseHold?name={{key}}&regionCode=${this.row.areaId}`
      const column = this.findObject(this.option.column, "householdId");
      column.dicUrl = dicUrl
    },

    rowSave (row, done, loading) {
      row['organizationId'] = this.row.id

      row.urls = func.join(row.urls)
      if (row.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = 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.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = 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) {
      this.excelBox = false
      this.refreshChange()
      done()
    },
    beforeOpen (done, type) {
      const column = this.findObject(this.option.column, "householdId");
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then(res => {
          this.form = res.data.data
          this.form.urls = website.minioUrl + this.form.urls

          let params = {
            id:this.form.householdId
          }
          getAllHouseHold(params).then(res=>{
            column.dicData = res.data.data
          })

        })
      }else{
        column.dicData = []
      }
      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
      params.organizationId = this.row.id
      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.form.phoneNumber = data.phoneNumber
                        this.form.gender = data.gender
                        this.form.birthday = data.birthday
                        this.form.cardType = data.cardType
                        this.form.idCard = data.idCard
                        this.form.houseCode = data.houseCode
                    })
                }
            }
          })
        }
    },
    computed: {
        ...mapGetters(["userInfo", "permission"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.household_add, true),
                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")
                    }
                }
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
    },
    mounted () { },
    methods: {
        showStringDispose (row, type) {
            row[type] = !row[type]
        },

        this.page.total = data.total
        this.data = data.records
        this.loading = false
        this.selectionClear()
      })
        init (data) {
            this.row = data
            this.getUserList()
            this.onLoad(this.page)
        },

        getUserList (param) {
            let dicUrl = `/api/blade-household/household/getAllHouseHold?name={{key}}&regionCode=${this.row.areaId}`
            const column = this.findObject(this.option.column, "householdId")
            column.dicUrl = dicUrl
        },

        rowSave (row, done, loading) {
            row['organizationId'] = this.row.id

            row.urls = func.join(row.urls)
            if (row.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = 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.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = 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) {
            this.excelBox = false
            this.refreshChange()
            done()
        },
        beforeOpen (done, type) {
            const column = this.findObject(this.option.column, "householdId")
            if (["edit", "view"].includes(type)) {
                getDetail(this.form.id).then(res => {
                    this.form = res.data.data
                    this.form.urls = website.minioUrl + this.form.urls

                    let params = {
                        id: this.form.householdId
                    }
                    getAllHouseHold(params).then(res => {
                        column.dicData = res.data.data
                    })

                })
            } else {
                column.dicData = []
            }
            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
            params.organizationId = this.row.id
            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()
            })
        }
    }
  }
}
</script>

<style scoped>

</style>
<style scoped></style>

 src/views/property/convenienceHotline.vue

@@ -1,280 +1,302 @@
<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.district_delete" @click="handleDelete">删 除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
    <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.district_delete"
                    @click="handleDelete">删 除
                </el-button>
            </template>
        </avue-crud>
    </basic-container>
</template>

<script>
  import {
import {
    getList,
    remove,
    update,
    add,
    getDetail
  } from "@/api/convenienceHotline/convenienceHotline"
  import {
} from "@/api/convenienceHotline/convenienceHotline"
import {
    mapGetters
  } from "vuex"
  import website from '@/config/website'
  export default {
    data() {
      return {
        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,
          border: true,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [{
              label: "名称",
              prop: "name",
              searchSpan: 4,
              search: true,
              width: 260,
              rules: [{
                required: true,
                message: "请输入名称",
                trigger: "blur",
              }, ],
} from "vuex"
import website from '@/config/website'
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 {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            {
              label: "电话",
              prop: "telephone",
              span: 24,
              rules: [{
                required: true,
                message: "请输入电话",
                trigger: "blur",
              }, ],
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 66,
                searchLabelWidth: 66,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                border: true,
                //stripe:true,
                index: true,
                viewBtn: true,
                selection: true,
                dialogClickModal: false,
                column: [{
                    label: "名称",
                    prop: "name",
                    searchSpan: 4,
                    search: true,
                    width: 260,
                    rules: [{
                        required: true,
                        message: "请输入名称",
                        trigger: "blur",
                    },],
                },
                {
                    width: 120,
                    label: "联系方式",
                    prop: "telephone",
                    span: 24,
                    rules: [{
                        required: true,
                        message: "请输入联系方式",
                        trigger: "blur",
                    },
                    {
                        validator: validatorPhone,
                        trigger: 'blur'
                    }],
                },
                {
                    label: "备注",
                    prop: "remark",
                    span: 24,
                    rules: [{
                        required: true,
                        message: "请输入备注",
                        trigger: "blur",
                    },],
                },
                ],
            },
            {
              label: "备注",
              prop: "remark",
              span: 24,
              rules: [{
                required: true,
                message: "请输入备注",
                trigger: "blur",
              }, ],
            },
          ],
        },
        data: [],
      }
            data: [],
        }
    },
    watch: {},
    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.district_add, true),
          viewBtn: this.vaildData(this.permission.district_view, true),
          delBtn: this.vaildData(this.permission.district_delete, true),
          editBtn: this.vaildData(this.permission.district_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.district_add, true),
                viewBtn: this.vaildData(this.permission.district_view, true),
                delBtn: this.vaildData(this.permission.district_delete, true),
                editBtn: this.vaildData(this.permission.district_edit, true),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
    },
    methods: {
      rowSave(row, done, loading) {
        if (row.picUrl.length > 0) {
          var urls = []
          var split = row.picUrl.split(",")
          split.forEach(url => {
            var names = url.split("jczz/")
            urls.push(names[1])
          })
          row.picUrl = urls.join(",")
        }
        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)) {
          getDetail(this.form.id).then((res) => {
            this.form = res.data.data
            if (this.form.picUrl.length > 0) {
              var urls = []
              var names = this.form.picUrl.split(",")
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              this.form.picUrl = urls.join(",")
            }
          })
        }
        // 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.data.forEach(item => {
            if (item.picUrl) {
              if (item.picUrl.length > 0) {
        rowSave (row, done, loading) {
            if (row.picUrl.length > 0) {
                var urls = []
                var names = item.picUrl.split(",")
                names.forEach(name => {
                  urls.push(website.minioUrl + name)
                var split = row.picUrl.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                item.picUrl = urls.join(",")
              }
                row.picUrl = urls.join(",")
            }
          })
          this.loading = false
          this.selectionClear()
        })
      }
            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)) {
                getDetail(this.form.id).then((res) => {
                    this.form = res.data.data
                    if (this.form.picUrl.length > 0) {
                        var urls = []
                        var names = this.form.picUrl.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        this.form.picUrl = urls.join(",")
                    }
                })
            }
            // 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.data.forEach(item => {
                    if (item.picUrl) {
                        if (item.picUrl.length > 0) {
                            var urls = []
                            var names = item.picUrl.split(",")
                            names.forEach(name => {
                                urls.push(website.minioUrl + name)
                            })
                            item.picUrl = urls.join(",")
                        }
                    }
                })
                this.loading = false
                this.selectionClear()
            })
        }
    }
  }
}
</script>

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

 src/views/property/inviteTenders.vue

@@ -1,768 +1,780 @@
<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.article_delete" @click="handleDelete">删 除
        </el-button>
        <!--  <el-button size="small" icon="el-icon-s-order" plain @click="kqcomment">开启评论
    <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.article_delete" @click="handleDelete">删
                    除
                </el-button>
                <!--  <el-button size="small" icon="el-icon-s-order" plain @click="kqcomment">开启评论
        </el-button>
        <el-button size="small" icon="el-icon-s-release" plain @click="gbcomment">关闭评论
        </el-button> -->
      </template>
            </template>

      <template slot-scope="{type,size,row }" slot="menu">
        <el-button icon="el-icon-circle-plus-outline" :size="size" :type="type" @click.stop="openDilog(row,0)">
          公益报名
        </el-button>
        <el-button icon="el-icon-circle-plus-outline" :size="size" :type="type" @click.stop="openDilog(row,1)">
          创建议题
        </el-button>
        <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>
      </template>
            <template slot-scope="{type,size,row }" slot="menu">
                <el-button icon="el-icon-circle-plus-outline" :size="size" :type="type" @click.stop="openDilog(row, 0)">
                    公益报名
                </el-button>
                <el-button icon="el-icon-circle-plus-outline" :size="size" :type="type" @click.stop="openDilog(row, 1)">
                    创建议题
                </el-button>
                <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>
            </template>

      <template slot-scope="{ row }" slot="publish">
        <el-tag>{{
          row.publish == "1" ? "已发布" : row.publish == "0" ? "未发布" : "未发布"
          }}
        </el-tag>
      </template>
            <template slot-scope="{ row, size }" slot="publish">
                <el-tag :size="size" :type="showStatus(row.publish, 1).type" v-text="showStatus(row.publish, 1).text">
                </el-tag>
            </template>

      <template slot-scope="{ row }" slot="iscomment">
        <el-tag>{{
          row.iscomment == "1" ? "开启" : row.iscomment == "0" ? "关闭" : "关闭"
          }}
        </el-tag>
      </template>
    </avue-crud>
            <template slot-scope="{ row, size }" slot="iscomment">
                <el-tag :size="size" :type="showStatus(row.iscomment, 2).type" v-text="showStatus(row.iscomment, 2).text">
                </el-tag>
            </template>
        </avue-crud>

        <el-dialog title="" append-to-body :visible.sync="dialogVisibles" width="50%" :before-close="handleClose">
            <span slot="title" class="dialog-footer">
                {{ discussForm.ontitle }}
            </span>
            <div id="" v-if="discussForm.eventType == 1">
                <avue-form @submit="handleSubmit" :option="optionDiscuss" v-model="discussForm"></avue-form>
            </div>

            <div id="" v-else>
                <avue-form @submit="handleSubmit" :option="optionEnroll" v-model="discussForm">
                </avue-form>
            </div>
        </el-dialog>

    <el-dialog title="" append-to-body :visible.sync="dialogVisibles" width="50%" :before-close="handleClose">
      <span slot="title" class="dialog-footer">
        {{discussForm.ontitle}}
      </span>
      <div id="" v-if="discussForm.eventType == 1">
        <avue-form @submit="handleSubmit" :option="optionDiscuss" v-model="discussForm"></avue-form>
      </div>

      <div id="" v-else>
        <avue-form @submit="handleSubmit" :option="optionEnroll" v-model="discussForm">
        </avue-form>
      </div>
    </el-dialog>




  </basic-container>
    </basic-container>
</template>

<script>
  import {
import {
    getList,
    remove,
    update,
    add,
    getNotice,
    upcomment
  } from "@/api/article/article";
} from "@/api/article/article"

  import {
import {
    getListPd,
    removePd,
    updatePd,
    addPd,
    getNoticePd,
    upcommentPd
  } from "@/api/discuss/publicDiscuss";
} from "@/api/discuss/publicDiscuss"

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


  import {
import {
    getDistrictTree
  } from "@/api/district/index";
} from "@/api/district/index"

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

  export default {
    data() {
      return {
        discussForm: {
          ontitle: '',
          title: '',
          openFlag: 0,
          numberRestrictions: 0,
          voteRestrictions: 0,
          userRestrictions: 0,
          endTime: '',
          articleId: '',
          createTime: '',
          updateTime: '',
          deleteFlag: '',
          repeatVote: 0,
          voteNumberPublic: 0,
          appointUser: '',
          userIds: '',
          eventType: 1,
        },
        dialogVisibles: 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: 450,
          border: false,
          //stripe:true,
          index: true,
          viewBtn: true,
          selection: true,
          excelBtn: true,
          dialogClickModal: false,
          column: [{
              label: "招标标题",
              prop: "title",
              span: 24,
              row: true,
              searchSpan: 4,
              search: true,
              rules: [{
                required: true,
                message: "请输入招标标题",
                trigger: "blur",
              }, ],
export default {
    data () {
        return {
            discussForm: {
                ontitle: '',
                title: '',
                openFlag: 0,
                numberRestrictions: 0,
                voteRestrictions: 0,
                userRestrictions: 0,
                endTime: '',
                articleId: '',
                createTime: '',
                updateTime: '',
                deleteFlag: '',
                repeatVote: 0,
                voteNumberPublic: 0,
                appointUser: '',
                userIds: '',
                eventType: 1,
            },
            {
              label: "招标封面",
              prop: "url",
              // align:'center',
              width: 80,
              type: "upload",
              listType: "picture-img",
              action: "/api/blade-resource/oss/endpoint/put-file",
              propsHttp: {
                res: "data",
                url: "link",
              },
              // hide: true,
              span: 24,
            dialogVisibles: false,
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            // {
            //   label: "招标来源",
            //   prop: "sourceName",
            //   search: true,
            //   searchSpan: 4,
            //   span: 24,
            //   rules: [{
            //     required: true,
            //     message: "请输入招标类型",
            //     trigger: "blur",
            //   }, ],
            // },
            {
              label: "招标范围",
              prop: "articleList",
              span: 12,
              minRows: 2,
              type: "cascader",
              multiple: true,
              tags: true,
              dicData: [],
              rules: [{
                required: true,
                message: "请选择招标范围",
                trigger: "blur",
              }, ],
              props: {
                label: "name",
                value: 'id'
              },
              hide: true,
            },
            {
              label: "招标类型",
              prop: "type",
              searchSpan: 3,
              width: 80,
              value: 2,
              slot: true,
              search: true,
              type: "select",
              rules: [{
                required: true,
                message: "请选择招标类型",
                trigger: "blur",
              }, ],
              dicData: [{
                label: "物业招标",
                value: 2,
              }],
            },
            {
              label: "发布时间",
              prop: "dateTime",
              type: "datetime",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              searchSpan: 5,
              searchRange: true,
              hide: true,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              search: true,
              rules: [{
                required: true,
                message: "请选择发布时间",
                trigger: "blur",
              }, ],
            },
            {
              label: "发布时间",
              prop: "createTime",
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
            },
            {
              label: "发布状态",
              prop: "publish",
              searchSpan: 3,
              width: 80,
              value: "0",
              slot: true,
              search: true,
              type: "select",
              rules: [{
                required: true,
                message: "请选择发布状态",
                trigger: "blur",
              }, ],
              dicData: [{
                  label: "未发布",
                  value: "0",
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 450,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                border: false,
                //stripe:true,
                index: true,
                viewBtn: true,
                selection: true,
                excelBtn: true,
                dialogClickModal: false,
                column: [{
                    label: "招标标题",
                    prop: "title",
                    span: 24,
                    row: true,
                    searchSpan: 4,
                    search: true,
                    rules: [{
                        required: true,
                        message: "请输入招标标题",
                        trigger: "blur",
                    },],
                },
                {
                  label: "已发布",
                  value: "1",
                }
              ],
            },
            {
              label: "评论区",
              prop: "iscomment",
              width: 80,
              slot: true,
              type: "select",
              dicData: [{
                  label: "关闭",
                  value: "0",
                    width: 110,
                    label: "招标封面",
                    prop: "url",
                    // align:'center',
                    type: "upload",
                    listType: "picture-img",
                    action: "/api/blade-resource/oss/endpoint/put-file",
                    propsHttp: {
                        res: "data",
                        url: "link",
                    },
                    // hide: true,
                    span: 24,
                },
                // {
                //   label: "招标来源",
                //   prop: "sourceName",
                //   search: true,
                //   searchSpan: 4,
                //   span: 24,
                //   rules: [{
                //     required: true,
                //     message: "请输入招标类型",
                //     trigger: "blur",
                //   }, ],
                // },
                {
                    label: "招标范围",
                    prop: "articleList",
                    span: 12,
                    minRows: 2,
                    type: "cascader",
                    multiple: true,
                    tags: true,
                    dicData: [],
                    rules: [{
                        required: true,
                        message: "请选择招标范围",
                        trigger: "blur",
                    },],
                    props: {
                        label: "name",
                        value: 'id'
                    },
                    hide: true,
                },
                {
                  label: "开启",
                  value: "1",
                }
              ],
            },
            {
              label: "视频",
              prop: "videoUrl",
              type: "upload",
              accept: "video/mp4",
              display: false,
              hide: true,
              span: 24,
              listType: "picture-img",
              action: "/api/depl/put-depl",
              propsHttp: {
                url: "data",
              },
            },
            {
              label: "招标内容",
              prop: "content",
              component: "AvueUeditor",
              options: {
                action: "/api/blade-resource/oss/endpoint/put-file",
                // customConfig: {
                //   lineHeights: ['1', '1.15', '1.6', '2', '2.5', '3']
                // },//wangEditor编辑的配置
                props: {
                  res: "data",
                  url: "link",
                    width: 100,
                    label: "招标类型",
                    prop: "type",
                    value: 2,
                    slot: true,
                    searchSpan: 4,
                    search: true,
                    type: "select",
                    rules: [{
                        required: true,
                        message: "请选择招标类型",
                        trigger: "blur",
                    },],
                    dicData: [{
                        label: "物业招标",
                        value: 2,
                    }],
                },
              },
              hide: true,
              minRows: 6,
              span: 24,
            },
          ],
        },
        data: [],
        optionEnroll: {
          column: [{
              label: "",
              type: 'title',
              prop: "title",
              span: 24,
              row: true,
              offset: 2,
              styles: {
                fontSize: '24px'
              }
            }, {
              labelWidth: 100,
              label: '开启',
              prop: 'openFlag',
              type: 'radio',
              button: true,
              row: true,
              offset: 6,
              dicData: [{
                label: '开启',
                value: 0
              }, {
                label: '不开启',
                value: 1
              }]
            },
                {
                    label: "发布时间",
                    prop: "dateTime",
                    type: "daterange",
                    format: "yyyy-MM-dd",
                    valueFormat: "yyyy-MM-dd",
                    searchSpan: 6,
                    searchRange: true,
                    hide: true,
                    addDisplay: false,
                    editDisplay: false,
                    viewDisplay: false,
                    search: true,
                    rules: [{
                        required: true,
                        message: "请选择发布时间",
                        trigger: "blur",
                    },],
                },
                {
                    width: 144,
                    label: "发布时间",
                    prop: "createTime",
                    type: "date",
                    format: "yyyy-MM-dd",
                    valueFormat: "yyyy-MM-dd HH:mm:ss",
                },

            {
              label: "截止时间",
              row: true,
              offset: 6,
              prop: "endTime",
              type: "datetime",
              format: "yyyy-MM-dd hh:mm:ss",
              valueFormat: "timestamp",
                {
                    width: 100,
                    label: "发布状态",
                    prop: "publish",
                    value: "0",
                    slot: true,
                    searchSpan: 4,
                    search: true,
                    type: "select",
                    rules: [{
                        required: true,
                        message: "请选择发布状态",
                        trigger: "blur",
                    },],
                    dicData: [{
                        label: "未发布",
                        value: "0",
                    },
                    {
                        label: "已发布",
                        value: "1",
                    }
                    ],
                },
                {
                    width: 100,
                    label: "评论区",
                    prop: "iscomment",
                    slot: true,
                    type: "select",
                    dicData: [{
                        label: "关闭",
                        value: "0",
                    },
                    {
                        label: "开启",
                        value: "1",
                    }
                    ],
                },
                {
                    label: "视频",
                    prop: "videoUrl",
                    type: "upload",
                    accept: "video/mp4",
                    display: false,
                    hide: true,
                    span: 24,
                    listType: "picture-img",
                    action: "/api/depl/put-depl",
                    propsHttp: {
                        url: "data",
                    },
                },
                {
                    label: "招标内容",
                    prop: "content",
                    component: "AvueUeditor",
                    options: {
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        // customConfig: {
                        //   lineHeights: ['1', '1.15', '1.6', '2', '2.5', '3']
                        // },//wangEditor编辑的配置
                        props: {
                            res: "data",
                            url: "link",
                        },
                    },
                    hide: true,
                    minRows: 6,
                    span: 24,
                },
                ],
            },
          ]
        },
        optionDiscuss: {
          column: [{
              label: "",
              type: 'title',
              prop: "title",
              span: 24,
              row: true,
              offset: 2,
              styles: {
                fontSize: '24px'
              }
            }, {
              labelWidth: 100,
              label: '开启投票',
              prop: 'openFlag',
              type: 'radio',
              button: true,
              row: true,
              offset: 6,
              dicData: [{
                label: '开启',
                value: 0
              }, {
                label: '不开启',
                value: 1
              }]
            }, {
              labelWidth: 100,
              label: '开启签名',
              prop: 'signatureFlag',
              type: 'radio',
              button: true,
              row: true,
              offset: 6,
              dicData: [{
                label: '开启',
                value: 0
              }, {
                label: '不开启',
                value: 1
              }]
            data: [],
            optionEnroll: {
                column: [{
                    label: "",
                    type: 'title',
                    prop: "title",
                    span: 24,
                    row: true,
                    offset: 2,
                    styles: {
                        fontSize: '24px'
                    }
                }, {
                    label: '开启',
                    prop: 'openFlag',
                    type: 'radio',
                    button: true,
                    row: true,
                    offset: 6,
                    dicData: [{
                        label: '开启',
                        value: 0
                    }, {
                        label: '不开启',
                        value: 1
                    }]
                },

                {
                    label: "截止时间",
                    row: true,
                    offset: 6,
                    prop: "endTime",
                    type: "datetime",
                    format: "yyyy-MM-dd hh:mm:ss",
                    valueFormat: "timestamp",
                },
                ]
            },
            {
              label: "截止时间",
              row: true,
              offset: 6,
              prop: "endTime",
              type: "datetime",
              format: "yyyy-MM-dd hh:mm:ss",
              valueFormat: "timestamp",
            optionDiscuss: {
                column: [{
                    label: "",
                    type: 'title',
                    prop: "title",
                    span: 24,
                    row: true,
                    offset: 2,
                    styles: {
                        fontSize: '24px'
                    }
                }, {
                    label: '开启投票',
                    prop: 'openFlag',
                    type: 'radio',
                    button: true,
                    row: true,
                    offset: 6,
                    dicData: [{
                        label: '开启',
                        value: 0
                    }, {
                        label: '不开启',
                        value: 1
                    }]
                }, {
                    label: '开启签名',
                    prop: 'signatureFlag',
                    type: 'radio',
                    button: true,
                    row: true,
                    offset: 6,
                    dicData: [{
                        label: '开启',
                        value: 0
                    }, {
                        label: '不开启',
                        value: 1
                    }]
                },
                {
                    label: "截止时间",
                    row: true,
                    offset: 6,
                    prop: "endTime",
                    type: "datetime",
                    format: "yyyy-MM-dd hh:mm:ss",
                    valueFormat: "timestamp",
                },
                ]
            },
          ]
        },
        districtTree: [],
      };
            districtTree: [],
        }
    },
    watch: {
      "form.articleType": {
        handler(val) {
          if (val) {
            var videoUrl = this.findObject(this.option.column, "videoUrl");
            var content = this.findObject(this.option.column, "content");
            if (val.indexOf('ksp') != -1) {
              videoUrl.display = true;
              content.display = false;
              videoUrl.rules = [{
                required: false,
                message: "请选择视频",
                trigger: "blur",
              }, ];
            } else {
              videoUrl.display = false;
              content.display = true;
              videoUrl.rules = "";
            }
          }
        },
        immediate: true,
      }
        "form.articleType": {
            handler (val) {
                if (val) {
                    var videoUrl = this.findObject(this.option.column, "videoUrl")
                    var content = this.findObject(this.option.column, "content")
                    if (val.indexOf('ksp') != -1) {
                        videoUrl.display = true
                        content.display = false
                        videoUrl.rules = [{
                            required: false,
                            message: "请选择视频",
                            trigger: "blur",
                        },]
                    } else {
                        videoUrl.display = false
                        content.display = true
                        videoUrl.rules = ""
                    }
                }
            },
            immediate: true,
        }
    },
    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.article_add, true),
          viewBtn: this.vaildData(this.permission.article_view, true),
          delBtn: this.vaildData(this.permission.article_delete, true),
          editBtn: this.vaildData(this.permission.article_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.article_add, true),
                viewBtn: this.vaildData(this.permission.article_view, true),
                delBtn: this.vaildData(this.permission.article_delete, true),
                editBtn: this.vaildData(this.permission.article_edit, true),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
        showStatus () {
            return (data, type) => {
                if (data == 0) {
                    return {
                        text: type == 1 ? '未发布' : '关闭',
                        type: 'info'
                    }
                } else if (data == 1) {
                    return {
                        text: type == 1 ? '已发布' : '开启',
                        type: 'success'
                    }
                }
            }
        }
    },
    methods: {

      openDilog(row, type) {
        this.dialogVisibles = true
        this.discussForm.eventType = type
        this.discussForm.articleId = row.id
        this.discussForm.title = row.title
        if (type == 0) {
          this.discussForm.ontitle = '公益报名'
        } else {
          this.discussForm.ontitle = '创建议题'
        }
      },

      handleSubmit(form, done) {
        done();
        addPd(form).then(
          () => {
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.dialogVisibles = false
            done();
          },
          (error) => {
            window.console.log(error);
            // loading();
          }
        );
      },

      handleClose(done) {
        done();
        // this.$confirm('确认关闭？')
        //   .then(_ => {
        //     done();
        //   })
        //   .catch(_ => {});
      },
      rowSave(row, done, loading) {
        if (row.videoUrl.length == 0) {
          row.videoUrl = "";
        }
        row.userid = this.userInfo.user_id;
        row.articleRange = JSON.stringify(row.articleList)
        if (row.url.length > 0) {
          var urls = []
          var split = row.url.split(",");
          split.forEach(url => {
            var names = url.split("jczz/");
            urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        add(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      rowUpdate(row, index, done, loading) {
        row.articleRange = JSON.stringify(row.articleList)
        if (row.url.length > 0) {
          var urls = []
          var split = row.url.split(",");
          split.forEach(url => {
            var names = url.split("jczz/");
            urls.push(names[1])
          })
          row.url = urls.join(",")
        }

        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)) {
          getNotice(this.form.id).then((res) => {
            let data = res.data.data
            // data.forEach(item=>{
            if (data.url.length > 0) {
              var urls = []
              var names = data.url.split(",");
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              data.url = urls.join(",")
        openDilog (row, type) {
            this.dialogVisibles = true
            this.discussForm.eventType = type
            this.discussForm.articleId = row.id
            this.discussForm.title = row.title
            if (type == 0) {
                this.discussForm.ontitle = '公益报名'
            } else {
                this.discussForm.ontitle = '创建议题'
            }
            data.articleList = JSON.parse(data.articleRange)
            this.form = 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;
        }
        values.type = 2
        this.loading = true;
        console.log(values)
        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.url.length > 0) {
              var urls = []
              var names = item.url.split(",");
              names.forEach(name => {
                urls.push(website.minioUrl + name)
              })
              item.url = urls.join(",")
        },

        handleSubmit (form, done) {
            done()
            addPd(form).then(
                () => {
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    this.dialogVisibles = false
                    done()
                },
                (error) => {
                    window.console.log(error)
                    // loading();
                }
            )
        },

        handleClose (done) {
            done()
            // this.$confirm('确认关闭？')
            //   .then(_ => {
            //     done();
            //   })
            //   .catch(_ => {});
        },
        rowSave (row, done, loading) {
            if (row.videoUrl.length == 0) {
                row.videoUrl = ""
            }
          })
          this.loading = false;
          this.selectionClear();
        });
        getDistrictTree(params = {}).then((res) => {
          const data = res.data.data;
          this.districtTree = data;
          const column = this.findObject(this.option.column, "articleList");
          column.dicData = res.data.data;
          this.loading = false;
        });
      },
      updateFb(row) {
        if (row.publish == "0") {
          row.publish = "1";
        } else {
          row.publish = "0";
            row.userid = this.userInfo.user_id
            row.articleRange = JSON.stringify(row.articleList)
            if (row.url.length > 0) {
                var urls = []
                var split = row.url.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.url = urls.join(",")
            }
            add(row).then(
                () => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    done()
                },
                (error) => {
                    window.console.log(error)
                    loading()
                }
            )
        },
        rowUpdate (row, index, done, loading) {
            row.articleRange = JSON.stringify(row.articleList)
            if (row.url.length > 0) {
                var urls = []
                var split = row.url.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.url = urls.join(",")
            }

            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)) {
                getNotice(this.form.id).then((res) => {
                    let data = res.data.data
                    // data.forEach(item=>{
                    if (data.url.length > 0) {
                        var urls = []
                        var names = data.url.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        data.url = urls.join(",")
                    }
                    data.articleList = JSON.parse(data.articleRange)
                    this.form = 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
            }
            values.type = 2
            this.loading = true
            console.log(values)
            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.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
                this.selectionClear()
            })
            getDistrictTree(params = {}).then((res) => {
                const data = res.data.data
                this.districtTree = data
                const column = this.findObject(this.option.column, "articleList")
                column.dicData = res.data.data
                this.loading = false
            })
        },
        updateFb (row) {
            if (row.publish == "0") {
                row.publish = "1"
            } else {
                row.publish = "0"
            }
            if (row.url.length > 0) {
                var urls = []
                var split = row.url.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.url = urls.join(",")
            }
            update(row).then(
                () => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    done()
                },
                (error) => {
                    window.console.log(error)
                    loading()
                }
            )
        },
        kqcomment () {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
            }
            this.$confirm("确定将选择数据开启评论?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(() => {
                return upcomment(this.ids, "1")
            })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    this.$refs.crud.toggleSelection()
                })
        },
        gbcomment () {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
            }
            this.$confirm("确定将选择数据开启评论?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(() => {
                return upcomment(this.ids, "0")
            })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    this.$refs.crud.toggleSelection()
                })
        }
        if (row.url.length > 0) {
          var urls = []
          var split = row.url.split(",");
          split.forEach(url => {
            var names = url.split("jczz/");
            urls.push(names[1])
          })
          row.url = urls.join(",")
        }
        update(row).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      kqcomment() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据开启评论?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            return upcomment(this.ids, "1");
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$refs.crud.toggleSelection();
          });
      },
      gbcomment() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据开启评论?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            return upcomment(this.ids, "0");
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$refs.crud.toggleSelection();
          });
      }
    },
  };
}
</script>

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

 src/views/property/oiae.vue

@@ -32,22 +32,16 @@
                </el-button>
            </template>

            <template slot-scope="{ row }" slot="publish">
                <el-tag>{{
                    row.publish == "1" ? "已发布" : row.publish == "0" ? "未发布" : "未发布"
                }}
            <template slot-scope="{ row, size }" slot="publish">
                <el-tag :size="size" :type="showStatus(row.publish, 1).type" v-text="showStatus(row.publish, 1).text">
                </el-tag>
            </template>

            <template slot-scope="{ row }" slot="iscomment">
                <el-tag>{{
                    row.iscomment == "1" ? "开启" : row.iscomment == "0" ? "关闭" : "关闭"
                }}
            <template slot-scope="{ row, size }" slot="iscomment">
                <el-tag :size="size" :type="showStatus(row.iscomment, 2).type" v-text="showStatus(row.iscomment, 2).text">
                </el-tag>
            </template>
        </avue-crud>



        <el-dialog title="" append-to-body :visible.sync="dialogVisibles" width="50%" :before-close="handleClose">
            <span slot="title" class="dialog-footer">
@@ -62,9 +56,6 @@
                </avue-form>
            </div>
        </el-dialog>




    </basic-container>
</template>
@@ -132,13 +123,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 450,
                border: false,
                //stripe:true,
                index: true,
@@ -162,10 +156,10 @@
                    },

                    {
                        width: 110,
                        label: "缩略图",
                        prop: "url",
                        // align:'center',
                        width: 80,
                        type: "upload",
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file",
@@ -176,7 +170,7 @@
                        // hide: true,
                        span: 24,
                    },
                    

                    // {
                    //   label: "收支来源",
                    //   prop: "sourceName",
@@ -212,10 +206,10 @@
                    {
                        label: "收支类型",
                        prop: "type",
                        searchSpan: 3,
                        width: 80,
                        value: 1,
                        slot: true,
                        searchSpan: 4,
                        search: true,
                        type: "select",
                        rules: [{
@@ -228,13 +222,14 @@
                            value: 1,
                        }],
                    },

                    {
                        label: "发布时间",
                        prop: "dateTime",
                        type: "datetime",
                        type: "daterange",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        searchSpan: 5,
                        searchSpan: 6,
                        searchRange: true,
                        hide: true,
                        addDisplay: false,
@@ -247,7 +242,9 @@
                            trigger: "blur",
                        },],
                    },

                    {
                        width: 100,
                        label: "发布时间",
                        prop: "createTime",
                        type: "date",
@@ -255,12 +252,12 @@
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                    },
                    {
                        width: 100,
                        label: "发布状态",
                        prop: "publish",
                        searchSpan: 3,
                        width: 80,
                        value: "0",
                        slot: true,
                        searchSpan: 4,
                        search: true,
                        type: "select",
                        rules: [{
@@ -279,9 +276,9 @@
                        ],
                    },
                    {
                        width: 100,
                        label: "评论区",
                        prop: "iscomment",
                        width: 80,
                        slot: true,
                        type: "select",
                        dicData: [{
@@ -341,7 +338,6 @@
                        fontSize: '24px'
                    }
                }, {
                    labelWidth: 100,
                    label: '开启',
                    prop: 'openFlag',
                    type: 'radio',
@@ -380,7 +376,6 @@
                        fontSize: '24px'
                    }
                }, {
                    labelWidth: 100,
                    label: '开启投票',
                    prop: 'openFlag',
                    type: 'radio',
@@ -395,7 +390,6 @@
                        value: 1
                    }]
                }, {
                    labelWidth: 100,
                    label: '开启签名',
                    prop: 'signatureFlag',
                    type: 'radio',
@@ -465,6 +459,21 @@
            })
            return ids.join(",")
        },
        showStatus () {
            return (data, type) => {
                if (data == 0) {
                    return {
                        text: type == 1 ? '未发布' : '关闭',
                        type: 'info'
                    }
                } else if (data == 1) {
                    return {
                        text: type == 1 ? '已发布' : '开启',
                        type: 'success'
                    }
                }
            }
        }
    },
    methods: {


 src/views/property/partyOrganization.vue

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

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

      <template slot-scope="scope" slot="menu">
        <el-button type="text" icon="el-icon-circle-plus-outline" size="small"
                   @click="manageMember(scope.row)">党成员
        </el-button>
      </template>
    </avue-crud>
            <template slot-scope="{row, size, index}" slot="menu">
                <el-button :size="size" type="text" icon="el-icon-circle-plus-outline" @click="manageMember(row)">党成员
                </el-button>
            </template>
        </avue-crud>

    <el-drawer title="党成员" size="60%" append-to-body :visible.sync="memberFlag" :direction="'rtl'">
      <PartyOrganizationMember ref="partyOrganizationMember" />
    </el-drawer>

  </basic-container>
        <el-drawer title="党成员" size="60%" append-to-body :visible.sync="memberFlag" :direction="'rtl'">
            <PartyOrganizationMember ref="partyOrganizationMember" />
        </el-drawer>
    </basic-container>
</template>

<script>
import {mapGetters} from "vuex";
import {getDetail,getList,add,update,remove} from "@/api/partyOrganization/partyOrganization";
import website from "@/config/website";
import func from "@/util/func";
import {validatePhone} from "@/util/validate";
import PartyOrganizationMember from "@/views/property/components/partyOrganizationMember.vue";
import { mapGetters } from "vuex"
import { getDetail, getList, add, update, remove } from "@/api/partyOrganization/partyOrganization"
import website from "@/config/website"
import func from "@/util/func"
import { validatePhone } from "@/util/validate"
import PartyOrganizationMember from "@/views/property/components/partyOrganizationMember.vue"
const searchSpan = 4
export default {
  name: "partyOrganization",
  components: {PartyOrganizationMember},
  data () {
    return {
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      datetime: "",
      selectionList: [],
      memberFlag: false,
      option: {
        // menu: false,
        // addBtn: false,
        border: true,
        index: true,
        selection: false,
        height: "auto",
        calcHeight: 54,
        dialogWidth: 950,
        tip: false,
        searchShow: true,
        searchMenuSpan: 3,
        //stripe:true,
        viewBtn: true,
        excelBtn: true,
        dialogClickModal: false,
        column: [
          {
            parent: false,
            label: "所属社区",
            prop: "areaId",
            search: true,
            searchSpan: searchSpan,
            width: 150,
            type: "tree",
            dicUrl: "/api/blade-system/region/tree",
            props: {
              label: "name",
              value: "id"
    name: "partyOrganization",
    components: { PartyOrganizationMember },
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            rules: [
              {
                required: true,
                message: "请选择所属社区",
                trigger: ["blur","change"]
              },
            ],
          },
            datetime: "",
            selectionList: [],
            memberFlag: false,
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

          {
            label: "组织名称",
            prop: "organizationName",
            searchSpan: searchSpan,
            search: true,
            rules: [{
              required: true,
              message: "请输入组织名称",
              trigger: ["blur","change"]
            },],
          },
                // menu: false,
                // addBtn: false,
                border: true,
                index: true,
                selection: false,
                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        parent: false,
                        label: "所属社区",
                        prop: "areaId",
                        search: true,
                        searchSpan: searchSpan,
                        width: 150,
                        type: "tree",
                        dicUrl: "/api/blade-system/region/tree",
                        props: {
                            label: "name",
                            value: "id"
                        },
                        rules: [
                            {
                                required: true,
                                message: "请选择所属社区",
                                trigger: ["blur", "change"]
                            },
                        ],
                    },

          {
            label: "组织类型",
            prop: "organizationType",
            checkStrictly: true,
            hide:true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=organizationType",
            props: {
              label: "dictValue",
              value: "dictKey",
                    {
                        label: "组织名称",
                        prop: "organizationName",
                        searchSpan: searchSpan,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入组织名称",
                            trigger: ["blur", "change"]
                        },],
                    },

                    {
                        label: "组织类型",
                        prop: "organizationType",
                        checkStrictly: true,
                        hide: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=organizationType",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择组织类型",
                            trigger: ["blur", "change"]
                        },],
                    },

                    {
                        label: "支部类型",
                        prop: "branchType",
                        checkStrictly: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=branchType",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择支部类型",
                            trigger: ["blur", "change"]
                        },],
                    },

                    {
                        width: 110,
                        label: "负责人",
                        prop: "chargePerson",
                        rules: [{
                            required: true,
                            message: "请输入负责人",
                            trigger: ["blur", "change"]
                        }]
                    },
                    {
                        width: 110,
                        label: "姓名",
                        prop: "name",
                        searchSpan: searchSpan,
                        searchLabelWidth: 66,
                        searchPlaceholder: "请输入负责人或党成员",
                        hide: true,
                        display: false,
                        search: true
                    },
                    {
                        width: 120,
                        label: "手机号",
                        prop: "phone",
                        slot: true,
                        rules: [{
                            required: true,
                            message: "请输入手机号",
                            validator: validatePhone,
                            trigger: ["blur", "change"],
                        }]
                    },

                    {
                        label: "成立时间",
                        prop: "establishmentDate",
                        hide: true,
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
                        row: true,
                        rules: [{
                            required: true,
                            message: "请选择成立时间",
                            trigger: ["blur", "change"]
                        }]
                    },

                    {
                        label: "图片",
                        prop: "urls",
                        hide: true,
                        type: "upload",
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        propsHttp: {
                            res: "data",
                            name: 'name',
                            url: "link",
                        },
                        row: true
                    },
                    {
                        label: "排序",
                        prop: "sort",
                        hide: true,
                        type: 'number',
                        value: 999,
                        rules: [{
                            required: true,
                            message: "请输入排序",
                            trigger: ["blur", "change"],
                        },],
                    },

                    {
                        label: "状态",
                        hide: true,
                        prop: "status",
                        type: 'radio',
                        button: true,
                        activeColor: "#13ce66",
                        inactiveColor: "#ccc",
                        dicData: [
                            {
                                label: "正常",
                                value: 1
                            },
                            {
                                label: "关闭",
                                value: 2
                            },

                        ],
                        value: 1,
                        rules: [{
                            required: true,
                            message: "请输入排序",
                            trigger: ["blur", "change"]
                        },],
                    },

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

                    {
                        label: "党成员数",
                        prop: "memberCount",
                        display: false,
                    },
                ],
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择组织类型",
              trigger: ["blur","change"]
            }, ],
          },

          {
            label: "支部类型",
            prop: "branchType",
            checkStrictly: true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=branchType",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择支部类型",
              trigger: ["blur","change"]
            }, ],
          },

          {
            label: "负责人",
            prop: "chargePerson",
            rules: [{
              required: true,
              message: "请输入负责人",
              trigger: ["blur","change"]
            }]
          },
          {
            label: "姓名",
            prop: "name",
            searchSpan: searchSpan,
            searchPlaceholder:"请输入负责人或党成员",
            hide:true,
            display: false,
            search: true
          },
          {
            label: "手机号",
            prop: "phone",
            slot: true,
            rules: [{
              required: true,
              message: "请输入手机号",
              validator: validatePhone,
              trigger: ["blur","change"],
            }]
          },

          {
            label: "成立时间",
            prop: "establishmentDate",
            hide:true,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            row:true,
            rules: [{
              required: true,
              message: "请选择成立时间",
              trigger: ["blur","change"]
            }]
          },

          {
            label: "图片",
            prop: "urls",
            hide:true,
            type: "upload",
            listType: "picture-img",
            action: "/api/blade-resource/oss/endpoint/put-file",
            propsHttp: {
              res: "data",
              name: 'name',
              url: "link",
            },
            row:true
          },
          {
            label: "排序",
            prop: "sort",
            hide:true,
            type: 'number',
            value:999,
            rules: [{
              required: true,
              message: "请输入排序",
              trigger: ["blur","change"],
            },],
          },

          {
            label: "状态",
            hide:true,
            prop: "status",
            type: 'radio',
            button:true,
            activeColor: "#13ce66",
            inactiveColor: "#ccc",
            dicData: [
              {
                label: "正常",
                value: 1
              },
              {
                label: "关闭",
                value:2
              },

            ],
            value:1,
            rules: [{
              required: true,
              message: "请输入排序",
              trigger: ["blur","change"]
            },],
          },

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

          {
            label: "党成员数",
            prop: "memberCount",
            display:false,
          },
        ],
      },
      data: [],
    }
  },
  watch: {},
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList () {
      return {
        addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
        viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
        delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
        editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
      }
    },
    ids () {
      let ids = []
      this.selectionList.forEach((ele) => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },
    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")
          }
            data: [],
        }
      }
    },
  },
  methods: {
    showStringDispose (row, type) {
      row[type] = !row[type]
    },
    manageMember (row) {
      this.memberFlag = true
      var that = this
      this.$nextTick(() => {
        that.$refs.partyOrganizationMember.init(row)
      })
    },
    rowSave (row, done, loading) {
      row.urls = func.join(row.urls)
      if (row.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = urls.join(",")
      }
      add(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },
    rowUpdate (row, index, done, loading) {
      if (row.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = urls.join(",")
      }
      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: "操作成功!",
          })
        })
    },
    // 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
            const column = this.findObject(this.option.column, "principalId")
            let arr = []
            this.form.urls = website.minioUrl + this.form.urls
            arr.push(this.form.areaId)
            column.defaultExpandedKeys = arr
        })
      }
      // con
      done()
    },
    searchReset () {
      this.query = {}
      this.onLoad(this.page)
    },
    searchChange (params, done) {
      this.query = params
      this.page.currentPage = 1
      this.onLoad(this.page, params)
      done()
    },
    selectionChange (list) {
      this.selectionList = list
    },
    selectionClear () {
      this.selectionList = []
      this.$refs.crud.toggleSelection()
    },

    currentChange (currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize
    },
    refreshChange () {
      this.onLoad(this.page, this.query)
    },
    onLoad (page, params = {}) {
      this.loading = true

      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        const data = {
          ...res.data.data,
          records: res.data.data.records.map(item => {
    watch: {},
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
              ...item,
              'phoneNumberflag': false,
              'idCardflag': false
                addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
                viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
                delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
                editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
            }
          })
        }

        this.page.total = data.total
        this.data = data.records.map(item => {
          if (item.imageUrl && item.imageUrl.length > 0) {
            var urls = []
            var names = item.imageUrl.split(",")
            names.forEach(name => {
              urls.push(website.minioUrl + name)
        },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            item.imageUrl = urls.join(",")
          }
            return ids.join(",")
        },
        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")
                    }
                }
            }
        },
    },
    methods: {
        showStringDispose (row, type) {
            row[type] = !row[type]
        },
        manageMember (row) {
            this.memberFlag = true
            var that = this
            this.$nextTick(() => {
                that.$refs.partyOrganizationMember.init(row)
            })
        },
        rowSave (row, done, loading) {
            row.urls = func.join(row.urls)
            if (row.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = urls.join(",")
            }
            add(row).then(
                () => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    done()
                },
                (error) => {
                    window.console.log(error)
                    loading()
                }
            )
        },
        rowUpdate (row, index, done, loading) {
            if (row.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = urls.join(",")
            }
            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: "操作成功!",
                    })
                })
        },
        // 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
                    const column = this.findObject(this.option.column, "principalId")
                    let arr = []
                    this.form.urls = website.minioUrl + this.form.urls
                    arr.push(this.form.areaId)
                    column.defaultExpandedKeys = arr
                })
            }
            // con
            done()
        },
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },

          return item
        })
        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.loading = false
        this.selectionClear()
      })
    }
  },
            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.map(item => {
                    if (item.imageUrl && item.imageUrl.length > 0) {
                        var urls = []
                        var names = item.imageUrl.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        item.imageUrl = urls.join(",")
                    }

                    return item
                })

                this.loading = false
                this.selectionClear()
            })
        }
    },
}
</script>

<style scoped>

</style>
<style scoped></style>

 src/views/property/propertyCapitalApply.vue

@@ -7,12 +7,12 @@
            @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
            @refresh-change="refreshChange" @on-load="onLoad">

            <template slot-scope="scope" slot="menu">
                <el-button type="text" size="small" v-if="scope.row.applyStatus === 4" @click="handleWork(scope.row)">调整申请
            <template slot-scope="{ row, size, index }" slot="menu">
                <el-button :size="size" type="text" v-if="scope.row.applyStatus === 4" @click="handleWork(scope.row)">调整申请
                </el-button>
                <el-button type="text" size="small" @click="goDetail(scope.row)">查看申请
                <el-button :size="size" type="text" @click="goDetail(scope.row)">查看申请
                </el-button>
                <el-button type="text" size="small" @click="goDetail(scope.row)">删 除
                <el-button :size="size" type="text" @click="goDetail(scope.row)">删 除
                </el-button>
            </template>
            <!-- <template slot="menuLeft">
@@ -56,13 +56,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 154,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 140,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 1150,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 350,
                border: true,
                //stripe:true,
                index: true,
@@ -103,7 +106,6 @@
                        },
                        defaultExpandedKeys: ["361102003"],
                        span: 12,
                        labelWidth: 120,
                        width: 260,
                        rules: [{
                            required: true,
@@ -115,11 +117,10 @@
                    {
                        label: '维修项目名称',
                        prop: 'name',
                        searchLabelWidth: 120,
                        searchSpan: 5,
                        searchLabelWidth: 124,
                        search: true,
                        span: 12,
                        labelWidth: 140,
                        rules: [{
                            required: true,
                            message: "请输入维修项目名称",
@@ -127,10 +128,10 @@
                        },],
                    },
                    {
                        width: 100,
                        label: "预计开工时间",
                        prop: "runTime",
                        span: 12,
                        labelWidth: 140,
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
@@ -141,9 +142,9 @@
                        },],
                    },
                    {
                        width: 100,
                        label: "预计竣工时间",
                        prop: "completedTime",
                        labelWidth: 140,
                        span: 12,
                        type: "date",
                        format: "yyyy-MM-dd",
@@ -157,18 +158,18 @@
                    {
                        label: "项目分摊方式",
                        prop: "allocationWay",
                        labelWidth: 140,
                        value: '按建筑面积分摊',
                        span: 14,
                        row: true,
                    },
                    {
                        width: 110,
                        label: '联系人',
                        prop: 'linkman',
                        span: 12,
                        labelWidth: 120,
                        search: true,
                        searchSpan: 4,
                        searchLabelWidth: 80,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入联系人",
@@ -176,10 +177,10 @@
                        },],
                    },
                    {
                        width: 120,
                        label: '联系方式',
                        prop: 'linkPhone',
                        span: 12,
                        labelWidth: 140,
                        rules: [{
                            required: true,
                            message: "请输入联系方式",
@@ -187,16 +188,15 @@
                        },],
                    },
                    {
                        width: 100,
                        label: '申请时间',
                        prop: 'applyTime',
                        span: 12,
                        labelWidth: 160,
                        display: false,
                    }, {
                        label: '审核进度',
                        prop: 'applyStatus',
                        span: 12,
                        labelWidth: 140,
                        display: false,
                        dicData: [{
                            label: "待审核",
@@ -226,7 +226,6 @@
                        prop: "budgetAmount",
                        span: 12,
                        hide: true,
                        labelWidth: 140,
                        type: 'number',
                        precision: 2,
                        value: '0.00'
@@ -236,7 +235,6 @@
                        prop: "actualAmount",
                        span: 12,
                        hide: true,
                        labelWidth: 140,
                        type: 'number',
                        precision: 2,
                        value: '0.00'
@@ -246,7 +244,6 @@
                        prop: "selfAmount",
                        span: 12,
                        hide: true,
                        labelWidth: 140,
                        type: 'number',
                        precision: 2,
                        value: '0.00'
@@ -256,7 +253,6 @@
                        prop: "budgetAppropriateAmount",
                        span: 12,
                        hide: true,
                        labelWidth: 140,
                        type: 'number',
                        precision: 2,
                        value: '0.00'
@@ -267,7 +263,6 @@
                        hide: true,
                        prop: "projectDigest",
                        placeholder: "例如:“XX小区XX栋XX设施设备维修，总的预算金额是X，是否含有审价，本次维修涉及范围共XX户，总面积的建筑面积为XX平方米”",
                        labelWidth: 140,
                        type: "textarea"
                    },
                    {
@@ -275,7 +270,6 @@
                        span: 24,
                        hide: true,
                        prop: "projectDescribe",
                        labelWidth: 140,
                        type: "textarea"
                    },
                    {
@@ -284,7 +278,6 @@
                        type: 'upload',
                        span: 24,
                        hide: true,
                        labelWidth: 140,
                        multiple: true,
                        // showFileList: true,
                        propsHttp: {

 src/views/property/propertyCharge.vue

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



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

<script>
import {mapGetters} from "vuex";
import {getDetail,getList,add,update,remove} from "@/api/property/propertyCharge";
import website from "@/config/website";
import func from "@/util/func";
import {validatePhone} from "@/util/validate";
import { mapGetters } from "vuex"
import { getDetail, getList, add, update, remove } from "@/api/property/propertyCharge"
import website from "@/config/website"
import func from "@/util/func"
import { validatePhone } from "@/util/validate"
const searchSpan = 4
const labelWidth=110
const labelWidth = 110
export default {
  name: "propertyCharge",
  data () {
    return {
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      datetime: "",
      selectionList: [],
      memberFlag: false,
      option: {
        // menu: false,
        // addBtn: false,
        border: true,
        index: true,
        selection: false,
        height: "auto",
        calcHeight: 54,
        dialogWidth: 950,
        tip: false,
        searchShow: true,
        searchMenuSpan: 3,
        //stripe:true,
        viewBtn: true,
        excelBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "物业公司",
            labelWidth:labelWidth,
            prop: "propertyId",
            checkStrictly: true,
            dicUrl: "/api/blade-propertyCompany/propertyCompany/getPropertyCompanyList",
            props: {
              label: "name",
              value: "deptId",
    name: "propertyCharge",
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            search:true,
            disabled:false,
            type: "select",
            rules: [{
              required: true,
              message: "请选择物业公司",
              trigger: ["blur","change"]
            }, ],
          },
          {
            label: "类型",
            labelWidth:labelWidth,
            prop: "payType",
            checkStrictly: true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=payType",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择类型",
              trigger: ["blur","change"]
            }, ],
          },
            datetime: "",
            selectionList: [],
            memberFlag: false,
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

          {
            label: "收费项名称",
            labelWidth:labelWidth,
            prop: "name",
            searchSpan: searchSpan,
            searchLabelWidth: labelWidth,
            search: true,
            rules: [{
              required: true,
              message: "请输入收费项名称",
              trigger: ["blur","change"]
            },],
          },
          {
            label: "计算方式",
            labelWidth:labelWidth,
            prop: "calculationFormula",
            checkStrictly: true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=payCalculationFormula",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择计算方式",
              trigger: ["blur","change"]
            }, ],
          },
          {
            label: "单价(元)",
            labelWidth:labelWidth,
            prop: "unitPrice",
            type:'number',
            precision:2,
            rules: [{
              required: true,
              message: "请输入单价",
              trigger: ["blur","change"]
            }]
          },
          {
            label: "缴费周期",
            labelWidth:labelWidth,
            placeholder:"几个月收费一次",
            prop: "payPeriod",
            checkStrictly: true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=payPeriod",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择缴费周期",
              trigger: ["blur","change"]
            }, ],
          },
                // menu: false,
                // addBtn: false,
                border: true,
                index: true,
                selection: false,
                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        label: "物业公司",
                        labelWidth: labelWidth,
                        prop: "propertyId",
                        checkStrictly: true,
                        dicUrl: "/api/blade-propertyCompany/propertyCompany/getPropertyCompanyList",
                        props: {
                            label: "name",
                            value: "deptId",
                        },
                        searchSpan: 4,
                        search: true,
                        disabled: false,
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择物业公司",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "类型",
                        labelWidth: labelWidth,
                        prop: "payType",
                        checkStrictly: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=payType",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择类型",
                            trigger: ["blur", "change"]
                        },],
                    },

        ],
      },
      data: [],
    }
  },
  watch: {},
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList () {
      return {
        addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
        viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
        delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
        editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
      }
    },
    ids () {
      let ids = []
      this.selectionList.forEach((ele) => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },
    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")
          }
                    {
                        label: "收费项名称",
                        labelWidth: labelWidth,
                        prop: "name",
                        searchSpan: searchSpan,
                        searchLabelWidth: labelWidth,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入收费项名称",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "计算方式",
                        labelWidth: labelWidth,
                        prop: "calculationFormula",
                        checkStrictly: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=payCalculationFormula",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择计算方式",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "单价(元)",
                        labelWidth: labelWidth,
                        prop: "unitPrice",
                        type: 'number',
                        precision: 2,
                        rules: [{
                            required: true,
                            message: "请输入单价",
                            trigger: ["blur", "change"]
                        }]
                    },
                    {
                        label: "缴费周期",
                        labelWidth: labelWidth,
                        placeholder: "几个月收费一次",
                        prop: "payPeriod",
                        checkStrictly: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=payPeriod",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择缴费周期",
                            trigger: ["blur", "change"]
                        },],
                    },

                ],
            },
            data: [],
        }
      }
    },
  },
  methods: {
    showStringDispose (row, type) {
      row[type] = !row[type]
    },
    manageMember (row) {
      this.memberFlag = true
      var that = this
      this.$nextTick(() => {
        that.$refs.partyOrganizationMember.init(row)
      })
    },
    rowSave (row, done, loading) {
      add(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
    watch: {},
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
                viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
                delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
                editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
            }
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },
    rowUpdate (row, index, done, loading) {
      if (row.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = urls.join(",")
      }
      update(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
        (error) => {
          window.console.log(error)
          loading()
        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")
                    }
                }
            }
        },
    },
    methods: {
        showStringDispose (row, type) {
            row[type] = !row[type]
        },
        manageMember (row) {
            this.memberFlag = true
            var that = this
            this.$nextTick(() => {
                that.$refs.partyOrganizationMember.init(row)
            })
        },
        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) {
            if (row.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = urls.join(",")
            }
            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: "操作成功!",
                    })
                })
        },
        // 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
                    const column = this.findObject(this.option.column, "principalId")
                    let arr = []
                    arr.push(this.form.areaId)
                    column.defaultExpandedKeys = arr
                })
            }

            // //如果当前角色为物业管理员，则默认物业公司为该用户的物业公司
            // if (this.userInfo.role_name.indexOf("wygly")>-1){
            //   let column = this.findObject(this.option.column, "propertyId")
            //   column.disabled = true
            //   column.search = false
            //   this.form.propertyId = this.userInfo.dept_id
            // }

            done()
        },
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },

        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            this.loading = true

            //如果当前角色为物业管理员，则默认筛选该物业公司
            if (this.userInfo.role_name.indexOf("wygly") > -1) {
                let column = this.findObject(this.option.column, "propertyId")
                column.disabled = true
                column.search = false
                this.form.propertyId = this.userInfo.dept_id

                params.propertyId = this.userInfo.dept_id
            }



            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()
            })
        }
      )
    },
    rowDel (row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id)
        })
        .then(() => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
        })
    },
    // handleDelete() {
    //   if (this.selectionList.length === 0) {
    //     this.$message.warning("请选择至少一条数据");
    //     return;
    //   }
    //   this.$confirm("确定将选择数据删除?", {
    //       confirmButtonText: "确定",
    //       cancelButtonText: "取消",
    //       type: "warning",
    //     })
    //     .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
          const column = this.findObject(this.option.column, "principalId")
          let arr = []
          arr.push(this.form.areaId)
          column.defaultExpandedKeys = arr
        })
      }

      // //如果当前角色为物业管理员，则默认物业公司为该用户的物业公司
      // if (this.userInfo.role_name.indexOf("wygly")>-1){
      //   let column = this.findObject(this.option.column, "propertyId")
      //   column.disabled = true
      //   column.search = false
      //   this.form.propertyId = this.userInfo.dept_id
      // }

      done()
    },
    searchReset () {
      this.query = {}
      this.onLoad(this.page)
    },
    searchChange (params, done) {
      this.query = params
      this.page.currentPage = 1
      this.onLoad(this.page, params)
      done()
    },
    selectionChange (list) {
      this.selectionList = list
    },
    selectionClear () {
      this.selectionList = []
      this.$refs.crud.toggleSelection()
    },

    currentChange (currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize
    },
    refreshChange () {
      this.onLoad(this.page, this.query)
    },
    onLoad (page, params = {}) {
      this.loading = true

      //如果当前角色为物业管理员，则默认筛选该物业公司
      if (this.userInfo.role_name.indexOf("wygly")>-1){
        let column = this.findObject(this.option.column, "propertyId")
        column.disabled = true
        column.search = false
        this.form.propertyId = this.userInfo.dept_id

        params.propertyId = this.userInfo.dept_id
      }



      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>

<style scoped>

</style>
<style scoped></style>

 src/views/property/propertyChargeRecord.vue

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



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

<script>
import {mapGetters} from "vuex";
import {getDetail,getList,add,update,remove} from "@/api/property/propertyChargeRecord";
import website from "@/config/website";
import func from "@/util/func";
import {validatePhone} from "@/util/validate";
import { mapGetters } from "vuex"
import { getDetail, getList, add, update, remove } from "@/api/property/propertyChargeRecord"
import website from "@/config/website"
import func from "@/util/func"
import { validatePhone } from "@/util/validate"
const searchSpan = 4
const labelWidth=110
export default {
  name: "propertyChargeRecord",
  data () {
    return {
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      datetime: "",
      selectionList: [],
      memberFlag: false,
      option: {
        // menu: false,
        // addBtn: false,
        border: true,
        index: true,
        selection: false,
        height: "auto",
        calcHeight: 54,
        dialogWidth: 950,
        tip: false,
        searchShow: true,
        searchMenuSpan: 3,
        //stripe:true,
        viewBtn: true,
        excelBtn: true,
        dialogClickModal: false,
        addBtn:false,
        editBtn:false,
        column: [
          {
            label: "物业公司",
            labelWidth:labelWidth,
            prop: "propertyId",
            checkStrictly: true,
            dicUrl: "/api/blade-propertyCompany/propertyCompany/getPropertyCompanyList",
            props: {
              label: "name",
              value: "deptId",
    name: "propertyChargeRecord",
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            search:true,
            disabled:false,
            type: "select",
            rules: [{
              required: true,
              message: "请选择物业公司",
              trigger: ["blur","change"]
            }, ],
          },
            datetime: "",
            selectionList: [],
            memberFlag: false,
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

          {
            label: "付款人",
            labelWidth:labelWidth,
            prop: "payUser",
            searchSpan: searchSpan,
            searchLabelWidth: labelWidth,
            search: true,
            rules: [{
              required: true,
              message: "请输入收费项名称",
              trigger: ["blur","change"]
            },],
          },
          {
            label: "付款时间",
            labelWidth:labelWidth,
            prop: "payTime",
            rules: [{
              required: true,
              message: "请选择计算方式",
              trigger: ["blur","change"]
            }, ],
          },
          {
            label: "付款金额(元)",
            labelWidth:labelWidth,
            prop: "payPrice",
            type:'number',
            precision:2,
            rules: [{
              required: true,
              message: "请输入单价",
              trigger: ["blur","change"]
            }]
          },
          {
            label: "付款方式",
            labelWidth:labelWidth,
            prop: "payFunc",
            checkStrictly: true,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=payPeriod",
            props: {
              label: "dictValue",
              value: "dictKey",
                // menu: false,
                // addBtn: false,
                border: true,
                index: true,
                selection: false,
                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
                dialogClickModal: false,
                addBtn: false,
                editBtn: false,
                column: [
                    {
                        label: "物业公司",
                        prop: "propertyId",
                        checkStrictly: true,
                        dicUrl: "/api/blade-propertyCompany/propertyCompany/getPropertyCompanyList",
                        props: {
                            label: "name",
                            value: "deptId",
                        },
                        searchSpan,
                        search: true,
                        disabled: false,
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择物业公司",
                            trigger: ["blur", "change"]
                        },],
                    },

                    {

                        label: "付款人",
                        prop: "payUser",
                        searchSpan: searchSpan,
                        searchLabelWidth: 80,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入收费项名称",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "付款时间",
                        prop: "payTime",
                        rules: [{
                            required: true,
                            message: "请选择计算方式",
                            trigger: ["blur", "change"]
                        },],
                    },
                    {
                        label: "付款金额(元)",
                        prop: "payPrice",
                        type: 'number',
                        precision: 2,
                        rules: [{
                            required: true,
                            message: "请输入单价",
                            trigger: ["blur", "change"]
                        }]
                    },
                    {
                        label: "付款方式",
                        prop: "payFunc",
                        checkStrictly: true,
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=payPeriod",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                        type: "select",
                        rules: [{
                            required: true,
                            message: "请选择缴费周期",
                            trigger: ["blur", "change"]
                        },],
                    },

                ],
            },
            type: "select",
            rules: [{
              required: true,
              message: "请选择缴费周期",
              trigger: ["blur","change"]
            }, ],
          },

        ],
      },
      data: [],
    }
  },
  watch: {},
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList () {
      return {
        addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
        viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
        delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
        editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
      }
    },
    ids () {
      let ids = []
      this.selectionList.forEach((ele) => {
        ids.push(ele.id)
      })
      return ids.join(",")
    },
    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")
          }
            data: [],
        }
      }
    },
  },
  methods: {
    showStringDispose (row, type) {
      row[type] = !row[type]
    },
    manageMember (row) {
      this.memberFlag = true
      var that = this
      this.$nextTick(() => {
        that.$refs.partyOrganizationMember.init(row)
      })
    },
    rowSave (row, done, loading) {
      add(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
    watch: {},
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
                viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
                delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
                editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
            }
        },
        (error) => {
          window.console.log(error)
          loading()
        }
      )
    },
    rowUpdate (row, index, done, loading) {
      if (row.urls.length > 0) {
        var urls = []
        var split = row.urls.split(",")
        split.forEach(url => {
          var names = url.split("jczz/")
          urls.push(names[1])
        })
        row.urls = urls.join(",")
      }
      update(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
          done()
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
        (error) => {
          window.console.log(error)
          loading()
        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")
                    }
                }
            }
        },
    },
    methods: {
        showStringDispose (row, type) {
            row[type] = !row[type]
        },
        manageMember (row) {
            this.memberFlag = true
            var that = this
            this.$nextTick(() => {
                that.$refs.partyOrganizationMember.init(row)
            })
        },
        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) {
            if (row.urls.length > 0) {
                var urls = []
                var split = row.urls.split(",")
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                row.urls = urls.join(",")
            }
            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: "操作成功!",
                    })
                })
        },
        // 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
                    const column = this.findObject(this.option.column, "principalId")
                    let arr = []
                    arr.push(this.form.areaId)
                    column.defaultExpandedKeys = arr
                })
            }

            // //如果当前角色为物业管理员，则默认物业公司为该用户的物业公司
            // if (this.userInfo.role_name.indexOf("wygly")>-1){
            //   let column = this.findObject(this.option.column, "propertyId")
            //   column.disabled = true
            //   column.search = false
            //   this.form.propertyId = this.userInfo.dept_id
            // }

            done()
        },
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },

        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            this.loading = true

            //如果当前角色为物业管理员，则默认筛选该物业公司
            if (this.userInfo.role_name.indexOf("wygly") > -1) {
                let column = this.findObject(this.option.column, "propertyId")
                column.disabled = true
                column.search = false
                this.form.propertyId = this.userInfo.dept_id

                params.propertyId = this.userInfo.dept_id
            }



            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()
            })
        }
      )
    },
    rowDel (row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id)
        })
        .then(() => {
          this.onLoad(this.page)
          this.$message({
            type: "success",
            message: "操作成功!",
          })
        })
    },
    // handleDelete() {
    //   if (this.selectionList.length === 0) {
    //     this.$message.warning("请选择至少一条数据");
    //     return;
    //   }
    //   this.$confirm("确定将选择数据删除?", {
    //       confirmButtonText: "确定",
    //       cancelButtonText: "取消",
    //       type: "warning",
    //     })
    //     .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
          const column = this.findObject(this.option.column, "principalId")
          let arr = []
          arr.push(this.form.areaId)
          column.defaultExpandedKeys = arr
        })
      }

      // //如果当前角色为物业管理员，则默认物业公司为该用户的物业公司
      // if (this.userInfo.role_name.indexOf("wygly")>-1){
      //   let column = this.findObject(this.option.column, "propertyId")
      //   column.disabled = true
      //   column.search = false
      //   this.form.propertyId = this.userInfo.dept_id
      // }

      done()
    },
    searchReset () {
      this.query = {}
      this.onLoad(this.page)
    },
    searchChange (params, done) {
      this.query = params
      this.page.currentPage = 1
      this.onLoad(this.page, params)
      done()
    },
    selectionChange (list) {
      this.selectionList = list
    },
    selectionClear () {
      this.selectionList = []
      this.$refs.crud.toggleSelection()
    },

    currentChange (currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize
    },
    refreshChange () {
      this.onLoad(this.page, this.query)
    },
    onLoad (page, params = {}) {
      this.loading = true

      //如果当前角色为物业管理员，则默认筛选该物业公司
      if (this.userInfo.role_name.indexOf("wygly")>-1){
        let column = this.findObject(this.option.column, "propertyId")
        column.disabled = true
        column.search = false
        this.form.propertyId = this.userInfo.dept_id

        params.propertyId = this.userInfo.dept_id
      }



      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>

<style scoped>

</style>
<style scoped></style>

 src/views/property/propertyCompany.vue

@@ -1,541 +1,535 @@
<!-- 物业公司管理 -->
<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>

      <template slot-scope="scope" slot="menu">
        <el-button v-if="permission.payInfo" type="text" icon="el-icon-circle-plus-outline" size="small"
                   @click="openPayConfig(scope.row)">商户配置
        </el-button>
      </template>
            <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>

    </avue-crud>
            </el-tabs>

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

      </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>


  </basic-container>
        </el-dialog>
    </basic-container>
</template>

<script>
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";
    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"

const labelWidth = 120
export default {
  data() {
    return {
    data () {
        return {
            currentTab: "wxInfo",
            payInfoVisible: false,
            currentRow: {},

      currentTab: "wxInfo",
      payInfoVisible: false,
      currentRow: {},

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      datetime: "",
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 54,
        dialogWidth: 1150,
        tip: false,
        searchShow: true,
        searchMenuSpan: 3,
        menuWidth: 350,
        border: true,
        //stripe:true,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "物业公司名称",
            prop: "name",
            searchSpan: 6,
            search: true,
            searchLabelWidth: 120,
            span: 18,
            row: true,
            labelWidth: 120,
            width: 260,
            rules: [
              {
                required: true,
                message: "请输入物业公司名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: '省份',
            prop: 'province',
            type: 'select',
            props: {
              label: 'name',
              value: 'code'
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            hide: true,
            span: 6,
            labelWidth: 120,
            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'
            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,
                    },
                ],
            },
            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'
            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"]
                        },],
                    },
                ],
            },
            hide: true,
            dicUrl: `/api/blade-system/region/select?code={{key}}`,
            rules: [
              {
                required: true,
                message: '请选择地区',
                trigger: 'blur'
              }
            ]
          },
          {
            label: "地址",
            prop: "address",
            span: 18,
            labelWidth: 120,
            row: true,
          },
          {
            label: "社会信用代码",
            prop: "socialCreditCode",
            labelWidth: 120,
          },

          {
            label: "简介",
            prop: "remark",
            component: "AvueUeditor",
            labelWidth: 120,
            options: {
              action: "/api/blade-resource/oss/endpoint/put-file-attach",
              props: {
                res: "data",
                url: "link",
              },
            },
            hide: true,
            minRows: 6,
            span: 24,
          },
        ],
      },
      data: [],
            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"]
                        },],
                    },
                ],
            }

      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(",");
    },
  },
  created() {
  },
  methods: {

    aliSubmit(form, done) {

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

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

    },

    wxSubmit(form, done) {
      this.wxPayForm.propertyCompanyId = this.currentRow.id

      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();
    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),
            }
        },
        (error) => {
          window.console.log(error);
          loading();
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
    },
    created () {
    },
    methods: {

        aliSubmit (form, done) {

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

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

        },

        wxSubmit (form, done) {
            this.wxPayForm.propertyCompanyId = this.currentRow.id

            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()
            })
        }
      );
    },
    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 {
  line-height: 6;
    line-height: 6;
}
</style>

 src/views/property/propertyCompanyDistrict.vue

@@ -30,6 +30,18 @@
import func from "@/util/func"
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 {
            form: {},
            query: {},
@@ -42,13 +54,16 @@
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 120,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

                height: "auto",
                calcHeight: 54,
                dialogWidth: 1150,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 350,
                border: true,
                //stripe:true,
                index: true,
@@ -57,7 +72,6 @@
                dialogClickModal: false,
                column: [
                    {
                        width: 220,
                        overHidden: true,
                        label: '小区名称',
                        addDisplay: false,
@@ -87,7 +101,6 @@
                        },
                        defaultExpandedKeys: ["361102003"],
                        span: 12,
                        labelWidth: 120,
                        width: 260,
                        rules: [{
                            required: true,
@@ -97,11 +110,11 @@
                    },

                    {
                        overHidden: true,
                        label: "物业公司",
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        width: 160,
                        label: "物业公司",
                        prop: "propertyCompanyName",
                        search: true,
                        searchSpan: 4,
@@ -118,7 +131,6 @@
                        prop: 'propertyCompanyId',
                        type: 'tree',
                        span: 12,
                        labelWidth: 120,
                        dicUrl: `/api/blade-propertyCompany/propertyCompany/getPropertyCompanyList`,
                        cascader: ['userId'],
                        props: {
@@ -132,10 +144,10 @@
                        }]
                    },
                    {
                        width: 110,
                        label: '项目经理',
                        prop: 'principal',
                        span: 12,
                        labelWidth: 120,
                        search: true,
                        searchSpan: 4,
                        rules: [{
@@ -145,21 +157,24 @@
                        },],
                    },
                    {
                        width: 120,
                        label: '联系方式',
                        prop: 'principalPhone',
                        span: 12,
                        labelWidth: 120,
                        rules: [{
                            required: true,
                            message: "请输入联系方式",
                            trigger: "blur",
                        },],
                        },
                        {
                            validator: validatorPhone,
                            trigger: 'blur'
                        }],
                    },
                    {
                        label: "物业成员",
                        prop: "userId",
                        span: 12,
                        labelWidth: 120,
                        type: "tree",
                        multiple: true,
                        remote: true,
@@ -171,10 +186,10 @@
                        dicUrl: `/api/blade-propertyCompany/propertyCompany/getUserByPropertyCompany?id={{propertyCompanyId}}`,
                    },
                    {
                        width: 100,
                        label: "物业阶段",
                        span: 12,
                        prop: "propertyStage",
                        labelWidth: 120,
                        type: "select",
                        search: true,
                        searchSpan: 4,
@@ -186,10 +201,10 @@
                        },
                    },
                    {
                        width: 100,
                        label: "合同开始时间",
                        prop: "startTime",
                        span: 12,
                        labelWidth: 120,
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd",
@@ -200,9 +215,9 @@
                        },],
                    },
                    {
                        width: 100,
                        label: "合同结束时间",
                        prop: "endTime",
                        labelWidth: 120,
                        span: 12,
                        type: "date",
                        format: "yyyy-MM-dd",

 src/views/publicSecurity/bailReporting.vue

@@ -1,411 +1,453 @@
<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-scope="scope" slot="menu">
        <el-button type="text" size="small" icon="el-icon-view" plain @click="lookDetail(scope.row,0)">查 看
        </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>
    <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-scope="{row, size, index}" slot="menu">
                <el-button :size="size" type="text" icon="el-icon-view" plain @click="lookDetail(row, 0)">查 看
                </el-button>
                <el-button :size="size" type="text" icon="el-icon-s-check" v-if="row.status == 1" plain
                    @click="lookDetail(row, 1)">审 核
                </el-button>
                <el-button :size="size" type="text" icon="el-icon-delete" plain @click="rowDel(row)">删 除
                </el-button>
            </template>

    </avue-crud>
            <template slot="status" slot-scope="{row, size}">
                <el-tag :size="size" :type="showStatus(row.status).type">
                    {{ showStatus(row.status).text }}
                </el-tag>
            </template>
        </avue-crud>

    <el-dialog class="place-info-box audit-info-box" title="" append-to-body :visible.sync="auditBasePopup" width="60%">
      <bailReportingDetail @colseDetail="colseDetail" ref="bailReportingDetail"></bailReportingDetail>
    </el-dialog>
  </basic-container>
        <el-dialog class="place-info-box audit-info-box" title="" append-to-body :visible.sync="auditBasePopup" width="60%">
            <bailReportingDetail @colseDetail="colseDetail" ref="bailReportingDetail"></bailReportingDetail>
        </el-dialog>
    </basic-container>
</template>

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

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

  import {
import {
    mapGetters
  } from "vuex"
} 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() {
      return {
        curRow: {},
        roleBox: false,
export default {
    data () {

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

        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 280,
          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,
        return {
            curRow: {},
            roleBox: false,

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

            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            {
              span: 12,
              label: "小区",
              prop: "districtName",
              searchSpan: 4,
              search: true,
              hide: true,
            }, {
              span: 12,
              label: "名称",
              prop: "realName",
              searchSpan: 4,
              search: true,
            }, {
              span: 12,
              label: "电话",
              prop: "phone",
              searchSpan: 4,
              search: true,
            }, {
              span: 12,
              label: "外出事由",
              prop: "applyName",
              searchSpan: 4,
              search: true,
            },
            {
              label: "创建时间",
              prop: "createTime",
              searchSpan: 4,
            },
            {
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '审核状态',
              prop: 'status',
              type: 'radio',
              slot: true,
              dicData: [{
                label: '待审核',
                value: 1
              }, {
                label: '已审核',
                value: 2
              }, {
                label: '未通过',
                value: 3
              }]
            },
            {
              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",
              }, ],
            }, {
              // 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",
              }, ],
            }, {
              label: "小区",
              prop: "aoiCode",
              searchSpan: 4,
              type: 'tree',
              // search: true,
              parent: false,
              dicUrl: `/api/blade-district/district/getDistrictTree`,
              props: {
                label: "name",
                value: "aoiCode"
              },
              // defaultExpandedKeys: ["361102003"],
              span: 12,
              labelWidth: 120,
              // width: 220,
              // overHidden: true,
              rules: [{
                required: true,
                message: "请选择小区",
                trigger: "blur",
              }, ],
              // disabled: true
              display: true,
              // hide: true,
            },
            // {
            //   addDisplay: false,
            //   editDisplay: false,
            //   viewDisplay: false,
            //   label: '类型',
            //   prop: 'reportType',
            //   type: 'radio',
            //   slot: true,
            //   // search: true,
            //   dicData: [{
            //     label: '取保候审',
            //     value: 1
            //   }, ]
            // },
            // {
            //   span: 12,
            //   label: "地址",
            //   prop: "addressName",
            //   searchSpan: 4,
            // },
          ],
        },
        data: [],
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

        auditBasePopup: false,
      }
                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,
                                  },

                ],
            },
            data: [],

            auditBasePopup: false,
        }
    },

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

    components: {
      bailReportingDetail,
        bailReportingDetail,
    },

    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),
        ...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
            }
        }
      },
      ids() {
        let ids = []
        this.selectionList.forEach((ele) => {
          ids.push(ele.id)
        })
        return ids.join(",")
      },
    },
    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(
          () => {
        colseDetail () {
            this.auditBasePopup = false
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
        },
        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()
          },
          (error) => {
            window.console.log(error)
            loading()
          }
        )
      },

      rowUpdate(row, index, done, loading) {
        bailReportingUpdate({
          ...row
        }).then(
          () => {
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$nextTick(() => {
                this.$refs.crud && this.$refs.crud.toggleSelection()
            })
            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: "操作成功!",
        },
        handleDelete () {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
          })
      },
      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()
          })
      },
                .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()
        }
      },
        beforeOpen (done, type) {
            if (["edit", "view"].includes(type)) { } else {
                done()
            }
        },

      currentChange(currentPage) {
        this.page.currentPage = currentPage
@@ -444,11 +486,11 @@
        })
      }
    }
  }
}
</script>

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

 src/views/publicSecurity/keynotePlaceManage.vue

@@ -1,538 +1,597 @@
<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">
    <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-scope="scope" slot="menu">
        <el-button type="text" size="small" icon="el-icon-view" plain @click="lookDetail(scope.row,0)">查 看
        </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="menu">
                <el-button type="text" :size="size" icon="el-icon-view" plain @click="lookDetail(row, 0)">查 看
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-s-check" v-if="row.status == 1" plain
                    @click="lookDetail(row, 1)">审 核
                </el-button>
                <el-button type="text" :size="size" icon="el-icon-delete" plain @click="rowDel(row)">删 除
                </el-button>
            </template>

    </avue-crud>
            <template slot="status" slot-scope="{row, size}">
                <el-tag :size="size" :type="showStatus(row.status).type">
                    {{ showStatus(row.status).text }}
                </el-tag>
            </template>

        </avue-crud>


    <el-dialog title="" append-to-body :visible.sync="auditBasePopup" width="60%">
      <campusReporting @colseDetail="colseDetail" v-if="taskType == 6" ref="campusReporting"></campusReporting>
      <hotelReporting @colseDetail="colseDetail" v-if="taskType == 2" ref="hotelReporting"></hotelReporting>
      <labelReporting @colseDetail="colseDetail" v-if="taskType == 3" ref="labelReporting"></labelReporting>
    </el-dialog>
  </basic-container>
        <el-dialog title="" append-to-body :visible.sync="auditBasePopup" width="60%">
            <campusReporting @colseDetail="colseDetail" v-if="taskType == 6" ref="campusReporting"></campusReporting>
            <hotelReporting @colseDetail="colseDetail" v-if="taskType == 2" ref="hotelReporting"></hotelReporting>
            <labelReporting @colseDetail="colseDetail" v-if="taskType == 3" ref="labelReporting"></labelReporting>
        </el-dialog>
    </basic-container>
</template>

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

  import {
import {
    mapGetters
  } from "vuex"
} 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() {
      return {
        taskType: 0,
        curRow: {},
        roleBox: false,
export default {
    data () {

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

        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,
          selection: true,
          dialogClickModal: false,
          column: [
            // {
            //   span: 12,
            //   label: "场所名称",
            //   prop: "name",
            //   searchSpan: 4,
            //   search: true,
            // },
            {
              span: 12,
              label: "社区",
              prop: "communityName",
              searchSpan: 4,
              search: true,
              hide: true,
        return {
            taskType: 0,
            curRow: {},
            roleBox: false,

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

            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            {
              span: 12,
              label: "小区",
              prop: "districtName",
              searchSpan: 4,
              search: true,
              hide: true,
            },
            {
              span: 12,
              label: "名称",
              prop: "realName",
              searchSpan: 4,
              search: true,
            }, {
              span: 12,
              label: "电话",
              prop: "phone",
              searchSpan: 4,
              search: true,
            }, {
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '类型',
              prop: 'reportType',
              type: 'radio',
              slot: true,
              search: true,
              searchSpan: 3,
              dicData: [{
                label: '旅馆安全',
                value: 2
              }, {
                label: '打金店',
                value: 3
              }, {
                label: '二手手机维修',
                value: 4
              }, {
                label: '二手车交易',
                value: 5
              }, {
                label: '校园安全',
                value: 6
              }]
            },
            {
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
              label: '审核状态',
              prop: 'status',
              type: 'radio',
              slot: true,
              dicData: [{
                label: '待审核',
                value: 1
              }, {
                label: '已审核',
                value: 2
              }, {
                label: '未通过',
                value: 3
              }]
            }, {
              label: "创建时间",
              prop: "createTime",
              searchSpan: 4,
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 210,

            }, {
              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",
              }, ],
            }, {
              // 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",
              }, ],
            }, {
              // hide: true,
              // 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",
              }, ],
            }, {
              span: 12,
              label: "地址",
              prop: "addressName",
              searchSpan: 4,
              // search: true,
              rules: [{
                required: true,
                message: "请输入场所名称",
                trigger: "blur",
              }, ],
            },
          ],
        },
        data: [],
                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,
                                     },

        auditBasePopup: false,
      }
                {
                    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,
      }
    provide () {
        return {
            placeElement: this,
        }
    },

    components: {
      campusReporting,
      hotelReporting,
      labelReporting,
        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(",")
      },
        ...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(
          () => {
        colseDetail () {
            this.auditBasePopup = 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(",").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(",")
        lookDetail (row, applyType) {
            this.auditBasePopup = true
            var that = this
            if (row.reportType == 6) {
                this.taskType = 6
                this.$nextTick(() => {
                    that.$refs.campusReporting.init(row, applyType)
                })
            }
          })
          this.loading = false
          this.selectionClear()
        })
      }
            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 {
.avue-upload__icon {
    line-height: 6;
  }
}

  .cur-container-box {
.cur-container-box {
    display: flex;
    flex-direction: column;
    width: 100%;
@@ -540,18 +599,18 @@
    overflow: hidden;

    .content-box {
      margin: 0 4px;
      padding: 0 16px;
      height: 0;
      flex: 1;
      overflow: hidden;
      overflow-y: auto;
        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;
        margin-top: 10px;
        display: flex;
        justify-content: center;
    }
  }
</style>
}
</style>

 src/views/report/reportlist.vue

@@ -1,203 +1,183 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               v-model="form"
               :page.sync="page"
               :permission="permissionList"
               @row-del="rowDel"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          icon="el-icon-edit-outline"
          size="small"
          @click.stop="handleDesign(scope.row.name)"
          v-if="userInfo.role_name.includes('admin')"
        >设计
        </el-button>
        <el-button
          type="text"
          icon="el-icon-view"
          size="small"
          @click.stop="handlePreview(scope.row.name)"
          v-if="userInfo.role_name.includes('admin')"
        >预览
        </el-button>
      </template>
      <template slot-scope="{row}" slot="name">
        <el-tag style="cursor:pointer" @click="handlePreview(row.name)">{{ row.name }}</el-tag>
      </template>
    </avue-crud>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page"
            :permission="permissionList" @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset"
            @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
            @refresh-change="refreshChange" @on-load="onLoad">
            <template slot="menuLeft">
                <el-button type="danger" size="small" icon="el-icon-delete" plain @click="handleDelete">删 除
                </el-button>
            </template>
            <template slot-scope="{ row, size, index }" slot="menu">
                <el-button :size="size" type="text" icon="el-icon-edit-outline" @click.stop="handleDesign(row.name)"
                    v-if="userInfo.role_name.includes('admin')">设计
                </el-button>
                <el-button :size="size" type="text" icon="el-icon-view" @click.stop="handlePreview(row.name)"
                    v-if="userInfo.role_name.includes('admin')">预览
                </el-button>
            </template>

            <template slot-scope="{row, size}" slot="name">
                <el-tag :size="size" style="cursor:pointer" @click="handlePreview(row.name)">{{ row.name }}</el-tag>
            </template>
        </avue-crud>
    </basic-container>
</template>

<script>
import {getList, remove} from "@/api/report/report";
import {mapGetters} from "vuex";
import { getList, remove } from "@/api/report/report"
import { mapGetters } from "vuex"

export default {
  data() {
    return {
      form: {},
      selectionList: [],
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      option: {
        height: 'auto',
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        selection: true,
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "文件名",
            prop: "name",
            search: true,
            slot: true,
          },
          {
            label: "创建时间",
            prop: "createTime",
          },
          {
            label: "更新时间",
            prop: "updateTime",
          }
        ]
      },
      data: []
    };
  },
  computed: {
    ...mapGetters(["userInfo", "permission"]),
    permissionList() {
      return {
        addBtn: false,
        viewBtn: false,
        delBtn: true,
        editBtn: false
      };
    data () {
        return {
            form: {},
            selectionList: [],
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 240,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                selection: true,
                viewBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        label: "文件名",
                        prop: "name",
                        searchSpan: 4,
                        search: true,
                        slot: true,
                    },
                    {
                        label: "创建时间",
                        prop: "createTime",
                    },
                    {
                        label: "更新时间",
                        prop: "updateTime",
                    }
                ]
            },
            data: []
        }
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    computed: {
        ...mapGetters(["userInfo", "permission"]),
        permissionList () {
            return {
                addBtn: false,
                viewBtn: false,
                delBtn: true,
                editBtn: false
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        }
    },
    methods: {
        handlePreview (name) {
            this.$router.push({ path: `/myiframe/urlPath?name=preview-${name}&src=${this.website.reportUrl}/preview?_u=blade-${name}` })
        },
        handleDesign (name) {
            this.$router.push({ path: `/myiframe/urlPath?name=designer-${name}&src=${this.website.reportUrl}/designer?_u=blade-${name}` })
        },
        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()
                })
        },
        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()
            })
        }
    }
  },
  methods: {
    handlePreview(name) {
      this.$router.push({path: `/myiframe/urlPath?name=preview-${name}&src=${this.website.reportUrl}/preview?_u=blade-${name}`});
    },
    handleDesign(name) {
      this.$router.push({path: `/myiframe/urlPath?name=designer-${name}&src=${this.website.reportUrl}/designer?_u=blade-${name}`});
    },
    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();
        });
    },
    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>

<style>
</style>
<style></style>

 src/views/resource/attach.vue

@@ -1,288 +1,269 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               :page.sync="page"
               :permission="permissionList"
               :before-open="beforeOpen"
               v-model="form"
               ref="crud"
               @row-del="rowDel"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="primary"
                   size="small"
                   plain
                   v-if="permission.attach_upload"
                   icon="el-icon-upload2"
                   @click="handleUpload">上 传
        </el-button>
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="permission.attach_delete"
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button type="text"
                   icon="el-icon-download"
                   size="small"
                   v-if="permission.attach_download"
                   @click="handleDownload(scope.row)">下载
        </el-button>
      </template>
      <template slot-scope="{row}"
                slot="attachSize">
        <el-tag>{{`${row.attachSize} KB`}}</el-tag>
      </template>
    </avue-crud>
    <el-dialog title="附件管理"
               append-to-body
               :visible.sync="attachBox"
               width="555px">
      <avue-form ref="form" :option="attachOption" v-model="attachForm" :upload-after="uploadAfter">
      </avue-form>
    </el-dialog>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" :permission="permissionList"
            :before-open="beforeOpen" v-model="form" ref="crud" @row-del="rowDel" @search-change="searchChange"
            @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
            @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
            <template slot="menuLeft">
                <el-button type="primary" size="small" plain v-if="permission.attach_upload" icon="el-icon-upload2"
                    @click="handleUpload">上 传
                </el-button>
                <el-button type="danger" size="small" icon="el-icon-delete" plain v-if="permission.attach_delete"
                    @click="handleDelete">删 除
                </el-button>
            </template>
            <template slot-scope="{row, size}" slot="menu">
                <el-button :size="size" type="text" icon="el-icon-download" v-if="permission.attach_download"
                    @click="handleDownload(row)">下载
                </el-button>
            </template>
            <template slot-scope="{row, size}" slot="attachSize">
                <el-tag :size="size">{{ `${row.attachSize} KB` }}</el-tag>
            </template>
        </avue-crud>
        <el-dialog title="附件管理" append-to-body :visible.sync="attachBox" width="555px">
            <avue-form ref="form" :option="attachOption" v-model="attachForm" :upload-after="uploadAfter">
            </avue-form>
        </el-dialog>
    </basic-container>
</template>

<script>
  import {getList, getDetail, remove} from "@/api/resource/attach";
  import {mapGetters} from "vuex";
import { getList, getDetail, remove } from "@/api/resource/attach"
import { mapGetters } from "vuex"

  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        attachBox: false,
        selectionList: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [
            {
              label: "附件地址",
              prop: "link",
              rules: [{
                required: true,
                message: "请输入附件地址",
                trigger: "blur"
              }]
export default {
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            {
              label: "附件域名",
              prop: "domainUrl",
              search: true,
              rules: [{
                required: true,
                message: "请输入附件域名",
                trigger: "blur"
              }]
            attachBox: false,
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 140,

                height: 'auto',
                calcHeight: 30,
                tip: false,
                border: true,
                index: true,
                viewBtn: true,
                selection: true,
                dialogClickModal: false,
                column: [
                    {
                        label: "附件地址",
                        prop: "link",
                        rules: [{
                            required: true,
                            message: "请输入附件地址",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "附件域名",
                        prop: "domainUrl",
                        searchSpan: 4,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入附件域名",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "附件名称",
                        prop: "name",
                        searchSpan: 4,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入附件名称",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "附件原名",
                        prop: "originalName",
                        searchSpan: 4,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入附件原名",
                            trigger: "blur"
                        }]
                    },
                    {
                        width: 100,
                        label: "附件拓展名",
                        prop: "extension",
                        rules: [{
                            required: true,
                            message: "请输入附件拓展名",
                            trigger: "blur"
                        }]
                    },
                    {
                        width: 100,
                        label: "附件大小",
                        prop: "attachSize",
                        slot: true,
                        rules: [{
                            required: true,
                            message: "请输入附件大小",
                            trigger: "blur"
                        }]
                    },
                ]
            },
            {
              label: "附件名称",
              prop: "name",
              search: true,
              rules: [{
                required: true,
                message: "请输入附件名称",
                trigger: "blur"
              }]
            },
            {
              label: "附件原名",
              prop: "originalName",
              search: true,
              rules: [{
                required: true,
                message: "请输入附件原名",
                trigger: "blur"
              }]
            },
            {
              label: "附件拓展名",
              prop: "extension",
              rules: [{
                required: true,
                message: "请输入附件拓展名",
                trigger: "blur"
              }]
            },
            {
              label: "附件大小",
              prop: "attachSize",
              slot: true,
              rules: [{
                required: true,
                message: "请输入附件大小",
                trigger: "blur"
              }]
            },
          ]
        },
        data: [],
        attachForm: {},
        attachOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [
            {
              label: '附件上传',
              prop: 'attachFile',
              type: 'upload',
              drag: true,
              loadText: '模板上传中，请稍等',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              action: "/api/blade-resource/oss/endpoint/put-file-attach"
            data: [],
            attachForm: {},
            attachOption: {
                submitBtn: false,
                emptyBtn: false,
                column: [
                    {
                        label: '附件上传',
                        prop: 'attachFile',
                        type: 'upload',
                        drag: true,
                        loadText: '模板上传中，请稍等',
                        span: 24,
                        propsHttp: {
                            res: 'data'
                        },
                        action: "/api/blade-resource/oss/endpoint/put-file-attach"
                    }
                ]
            }
          ]
        }
      };
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          addBtn: false,
          editBtn: false,
          viewBtn: false,
          delBtn: this.vaildData(this.permission.attach_delete, false)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
        ...mapGetters(["permission"]),
        permissionList () {
            return {
                addBtn: false,
                editBtn: false,
                viewBtn: false,
                delBtn: this.vaildData(this.permission.attach_delete, false)
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        }
    },
    methods: {
      handleUpload() {
        this.attachBox = true;
      },
      uploadAfter(res, done, loading, column) {
        window.console.log(column);
        this.attachBox = false;
        this.refreshChange();
        done();
      },
      handleDownload(row) {
        window.open(`${row.link}`);
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        handleUpload () {
            this.attachBox = true
        },
        uploadAfter (res, done, loading, column) {
            window.console.log(column)
            this.attachBox = false
            this.refreshChange()
            done()
        },
        handleDownload (row) {
            window.open(`${row.link}`)
        },
        rowDel (row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return remove(row.id)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                })
        },
        handleDelete () {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return remove(this.ids)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                })
        },
        beforeOpen (done, type) {
            if (["edit", "view"].includes(type)) {
                getDetail(this.form.id).then(res => {
                    this.form = res.data.data
                })
            }
            done()
        },
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },
        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            this.loading = true
            getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                const data = res.data.data
                this.page.total = data.total
                this.data = data.records
                this.loading = false
                this.selectionClear()
            })
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        this.loading = true;
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
        });
      }
    }
  };
}
</script>

<style>
</style>
<style></style>

 src/views/resource/oss.vue

@@ -1,416 +1,393 @@
<template>
  <basic-container>
    <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="scope" slot="menu">
        <el-button type="text"
                   icon="el-icon-video-play"
                   size="small"
                   v-if="userInfo.role_name.includes('admin')"
                   @click="handleDebug(scope.row)">调试
        </el-button>
        <el-button type="text"
                   icon="el-icon-circle-check"
                   size="small"
                   v-if="permission.oss_enable"
                   @click.stop="handleEnable(scope.row)">启用
        </el-button>
      </template>
      <template slot-scope="{row}"
                slot="status">
        <el-tag>{{row.statusName}}</el-tag>
      </template>
      <template slot-scope="{row}"
                slot="category">
        <el-tag>{{row.categoryName}}</el-tag>
      </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>
  </basic-container>
    <basic-container>
        <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>
        </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>
    </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 { getList, getDetail, add, update, remove, enable } from "@/api/resource/oss"
import { mapGetters } from "vuex"
import func from "@/util/func"

  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        box: false,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
          menuWidth: 350,
          labelWidth: 100,
          dialogWidth: 880,
          dialogClickModal: false,
          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"
              }]
export default {
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            box: false,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            {
              label: "资源编号",
              prop: "ossCode",
              span: 24,
              width: 120,
              search: true,
              rules: [{
                required: true,
                message: "请输入资源编号",
                trigger: "blur"
              }]
            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,
                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"
                        }]
                    },
                    {
                        label: "资源编号",
                        prop: "ossCode",
                        span: 24,
                        width: 120,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入资源编号",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "资源地址",
                        prop: "endpoint",
                        span: 24,
                        rules: [{
                            required: true,
                            message: "请输入资源地址",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "空间名",
                        prop: "bucketName",
                        span: 24,
                        width: 120,
                        rules: [{
                            required: true,
                            message: "请输入空间名",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "accessKey",
                        prop: "accessKey",
                        span: 24,
                        search: true,
                        width: 200,
                        overHidden: true,
                        rules: [{
                            required: true,
                            message: "请输入accessKey",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "secretKey",
                        prop: "secretKey",
                        span: 24,
                        width: 200,
                        overHidden: true,
                        rules: [{
                            required: true,
                            message: "请输入secretKey",
                            trigger: "blur"
                        }]
                    },
                    {
                        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,
                    },
                ]
            },
            {
              label: "资源地址",
              prop: "endpoint",
              span: 24,
              rules: [{
                required: true,
                message: "请输入资源地址",
                trigger: "blur"
              }]
            data: [],
            debugForm: {
                code: '',
            },
            {
              label: "空间名",
              prop: "bucketName",
              span: 24,
              width: 120,
              rules: [{
                required: true,
                message: "请输入空间名",
                trigger: "blur"
              }]
            },
            {
              label: "accessKey",
              prop: "accessKey",
              span: 24,
              search: true,
              width: 200,
              overHidden: true,
              rules: [{
                required: true,
                message: "请输入accessKey",
                trigger: "blur"
              }]
            },
            {
              label: "secretKey",
              prop: "secretKey",
              span: 24,
              width: 200,
              overHidden: true,
              rules: [{
                required: true,
                message: "请输入secretKey",
                trigger: "blur"
              }]
            },
            {
              label: "appId",
              prop: "appId",
              span: 24,
              hide: true,
              display: false,
            },
            {
              label: "region",
              prop: "region",
              span: 24,
              hide: true,
              display: false,
            },
            {
              label: "是否启用",
              prop: "status",
              span: 24,
              width: 80,
              align: "center",
              slot: true,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
            },
            {
              label: "备注",
              prop: "remark",
              span: 24,
              hide: true,
            },
          ]
        },
        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,
            },
          ]
            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}`;
      }
        '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(",");
      }
        ...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: {
      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);
        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: "操作成功!"
            });
          });
      },
      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;
                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()
            })
        }
        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/resource/sms.vue

@@ -1,438 +1,417 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               :page.sync="page"
               :permission="permissionList"
               :before-open="beforeOpen"
               v-model="form"
               ref="crud"
               @row-update="rowUpdate"
               @row-save="rowSave"
               @row-del="rowDel"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="permission.sms_delete"
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button type="text"
                   icon="el-icon-video-play"
                   size="small"
                   v-if="userInfo.role_name.includes('admin')"
                   @click="handleDebug(scope.row)">调试
        </el-button>
        <el-button type="text"
                   icon="el-icon-circle-check"
                   size="small"
                   v-if="permission.sms_enable"
                   @click.stop="handleEnable(scope.row)">启用
        </el-button>
      </template>
      <template slot-scope="{row}"
                slot="status">
        <el-tag>{{row.statusName}}</el-tag>
      </template>
      <template slot-scope="{row}"
                slot="category">
        <el-tag>{{row.categoryName}}</el-tag>
      </template>
    </avue-crud>
    <el-dialog title="手机短信发送调试"
               append-to-body
               :visible.sync="box"
               width="550px">
      <avue-form :option="debugOption" v-model="debugForm" @submit="handleSend"/>
    </el-dialog>
  </basic-container>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" :permission="permissionList"
            :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave"
            @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
            @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
            <template slot="menuLeft">
                <el-button type="danger" size="small" icon="el-icon-delete" plain v-if="permission.sms_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.sms_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>
        </avue-crud>
        <el-dialog title="手机短信发送调试" append-to-body :visible.sync="box" width="550px">
            <avue-form :option="debugOption" v-model="debugForm" @submit="handleSend" />
        </el-dialog>
    </basic-container>
</template>

<script>
  import {getList, getDetail, add, update, remove, enable, send} from "@/api/resource/sms";
  import {mapGetters} from "vuex";
  import func from "@/util/func";
import { getList, getDetail, add, update, remove, enable, send } from "@/api/resource/sms"
import { mapGetters } from "vuex"
import func from "@/util/func"

  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        box: false,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
          menuWidth: 350,
          labelWidth: 100,
          dialogWidth: 880,
          dialogClickModal: false,
          column: [
            {
              label: "分类",
              type: "radio",
              value: 1,
              span: 24,
              width: 100,
              searchLabelWidth: 50,
              row: true,
              dicUrl: "/api/blade-system/dict/dictionary?code=sms",
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              dataType: "number",
              slot: true,
              prop: "category",
              search: true,
              rules: [{
                required: true,
                message: "请选择分类",
                trigger: "blur"
              }]
export default {
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            box: false,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0
            },
            {
              label: "资源编号",
              prop: "smsCode",
              span: 24,
              width: 200,
              search: true,
              rules: [{
                required: true,
                message: "请输入资源编号",
                trigger: "blur"
              }]
            selectionList: [],
            option: {
                labelWidth: 96,
                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,
                column: [
                    {
                        label: "分类",
                        type: "radio",
                        value: 1,
                        span: 24,
                        width: 100,
                        searchLabelWidth: 66,
                        row: true,
                        dicUrl: "/api/blade-system/dict/dictionary?code=sms",
                        props: {
                            label: "dictValue",
                            value: "dictKey"
                        },
                        dataType: "number",
                        slot: true,
                        prop: "category",
                        searchSpan: 4,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请选择分类",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "资源编号",
                        prop: "smsCode",
                        span: 24,
                        width: 200,
                        searchSpan: 4,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入资源编号",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "模版ID",
                        prop: "templateId",
                        span: 24,
                        width: 200,
                        searchSpan: 4,
                        searchLabelWidth: 80,
                        search: true,
                        rules: [{
                            required: true,
                            message: "请输入模版ID",
                            trigger: "blur"
                        }]
                    },
                    {
                        label: "accessKey",
                        prop: "accessKey",
                        span: 24,
                        overHidden: true,
                        rules: [{
                            required: true,
                            message: "请输入accessKey",
                            trigger: "blur"
                        }],
                    },
                    {
                        label: "secretKey",
                        prop: "secretKey",
                        span: 24,
                        overHidden: true,
                        display: true,
                        hide: true,
                        rules: [{
                            required: true,
                            message: "请输入secretKey",
                            trigger: "blur"
                        }],
                    },
                    {
                        label: "regionId",
                        prop: "regionId",
                        span: 24,
                        value: "cn-hangzhou",
                        hide: true,
                        display: false
                    },
                    {
                        label: "短信签名",
                        prop: "signName",
                        span: 24,
                        width: 200,
                        rules: [{
                            required: true,
                            message: "请输入短信签名",
                            trigger: "blur"
                        }],
                    },
                    {
                        width: 100,
                        label: "是否启用",
                        prop: "status",
                        span: 24,
                        align: "center",
                        slot: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                    },
                    {
                        label: "备注",
                        prop: "remark",
                        span: 24,
                        hide: true
                    },
                ]
            },
            {
              label: "模版ID",
              prop: "templateId",
              span: 24,
              width: 200,
              search: true,
              rules: [{
                required: true,
                message: "请输入模版ID",
                trigger: "blur"
              }]
            data: [],
            debugForm: {
                code: '',
            },
            {
              label: "accessKey",
              prop: "accessKey",
              span: 24,
              overHidden: true,
              rules: [{
                required: true,
                message: "请输入accessKey",
                trigger: "blur"
              }],
            },
            {
              label: "secretKey",
              prop: "secretKey",
              span: 24,
              overHidden: true,
              display: true,
              hide: true,
              rules: [{
                required: true,
                message: "请输入secretKey",
                trigger: "blur"
              }],
            },
            {
              label: "regionId",
              prop: "regionId",
              span: 24,
              value: "cn-hangzhou",
              hide: true,
              display: false
            },
            {
              label: "短信签名",
              prop: "signName",
              span: 24,
              width: 200,
              rules: [{
                required: true,
                message: "请输入短信签名",
                trigger: "blur"
              }],
            },
            {
              label: "是否启用",
              prop: "status",
              span: 24,
              width: 80,
              align: "center",
              slot: true,
              addDisplay: false,
              editDisplay: false,
              viewDisplay: false,
            },
            {
              label: "备注",
              prop: "remark",
              span: 24,
              hide: true
            },
          ]
        },
        data: [],
        debugForm: {
          code: '',
        },
        debugOption: {
          submitText: "发送",
          column: [
            {
              label: "资源编号",
              prop: "code",
              disabled: true,
              span: 24,
            },
            {
              label: "发送手机",
              prop: "phones",
              span: 24,
            },
            {
              label: "发送参数",
              prop: "params",
              span: 24,
              placeholder: "例: {'code':2333,'title':'通知标题'}",
            },
          ]
            debugOption: {
                submitText: "发送",
                column: [
                    {
                        label: "资源编号",
                        prop: "code",
                        disabled: true,
                        span: 24,
                    },
                    {
                        label: "发送手机",
                        prop: "phones",
                        span: 24,
                    },
                    {
                        label: "发送参数",
                        prop: "params",
                        span: 24,
                        placeholder: "例: {'code':2333,'title':'通知标题'}",
                    },
                ]
            }
        }
      };
    },
    watch: {
      'form.category'() {
        const category = func.toInt(this.form.category);
        this.$refs.crud.option.column.filter(item => {
          if (item.prop === "templateId") {
            if (category === 1) {
              item.label = "模版内容";
            } else {
              item.label = "模版ID";
            }
          }
          if (item.prop === "accessKey") {
            if (category === 1) {
              item.label = "apiKey";
            } else if (category === 4) {
              item.label = "appId";
            } else {
              item.label = "accessKey";
            }
          }
          if (item.prop === "secretKey") {
            item.display = category !== 1;
            if (category === 4) {
              item.label = "appKey";
            } else {
              item.label = "secretKey";
            }
          }
          if (item.prop === "regionId") {
            if (category === 3) {
              item.display = true;
              item.value = "cn-hangzhou";
            } else {
              item.display = false;
            }
          }
        });
      }
        'form.category' () {
            const category = func.toInt(this.form.category)
            this.$refs.crud.option.column.filter(item => {
                if (item.prop === "templateId") {
                    if (category === 1) {
                        item.label = "模版内容"
                    } else {
                        item.label = "模版ID"
                    }
                }
                if (item.prop === "accessKey") {
                    if (category === 1) {
                        item.label = "apiKey"
                    } else if (category === 4) {
                        item.label = "appId"
                    } else {
                        item.label = "accessKey"
                    }
                }
                if (item.prop === "secretKey") {
                    item.display = category !== 1
                    if (category === 4) {
                        item.label = "appKey"
                    } else {
                        item.label = "secretKey"
                    }
                }
                if (item.prop === "regionId") {
                    if (category === 3) {
                        item.display = true
                        item.value = "cn-hangzhou"
                    } else {
                        item.display = false
                    }
                }
            })
        }
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.sms_add, false),
          viewBtn: this.vaildData(this.permission.sms_view, false),
          delBtn: this.vaildData(this.permission.sms_delete, false),
          editBtn: this.vaildData(this.permission.sms_edit, false)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
        ...mapGetters(["userInfo", "permission"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.sms_add, false),
                viewBtn: this.vaildData(this.permission.sms_view, false),
                delBtn: this.vaildData(this.permission.sms_delete, false),
                editBtn: this.vaildData(this.permission.sms_edit, false)
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach(ele => {
                ids.push(ele.id)
            })
            return ids.join(",")
        }
    },
    methods: {
      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: "操作成功!"
            });
          });
      },
      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.smsCode;
      },
      handleSend(form, done, loading) {
        send(form.code, form.phones, form.params).then((res) => {
          this.$message({
            type: "success",
            message: "发送成功!"
          });
          done();
          window.console.log(res);
          this.box = false;
        }, error => {
          window.console.log(error);
          loading();
        });
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        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: "操作成功!"
                    })
                })
        },
        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.smsCode
        },
        handleSend (form, done, loading) {
            send(form.code, form.phones, form.params).then((res) => {
                this.$message({
                    type: "success",
                    message: "发送成功!"
                })
                done()
                window.console.log(res)
                this.box = false
            }, error => {
                window.console.log(error)
                loading()
            })
        },
        handleDelete () {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据")
                return
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    return remove(this.ids)
                })
                .then(() => {
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!"
                    })
                    this.$refs.crud.toggleSelection()
                })
        },
        beforeOpen (done, type) {
            if (["edit", "view"].includes(type)) {
                getDetail(this.form.id).then(res => {
                    this.form = res.data.data
                })
            }
            done()
        },
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },
        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            this.loading = true
            getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                const data = res.data.data
                this.page.total = data.total
                this.data = data.records
                this.loading = false
                this.selectionClear()
            })
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        this.loading = true;
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
        });
      }
    }
  };
}
</script>


 src/views/task/reportForRepairs.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-12-14 17:10:00
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-01-06 15:01:25
 * @LastEditTime: 2024-01-09 18:59:37
 * @FilePath: \jczz_web\src\views\task\reportForRepairs.vue
 * @Description:
 *
@@ -10,882 +10,890 @@
-->
<!-- 走访日志 -->
<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="confirmFlag" slot-scope="{row}">
        <el-tag size="small" :type="showConfirmFlag(row.confirmFlag).type">
          {{ showConfirmFlag(row.confirmFlag).text }}
        </el-tag>
      </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="confirmFlag" slot-scope="{row, size}">
                <el-tag :size="size" :type="showConfirmFlag(row.confirmFlag).type">
                    {{ showConfirmFlag(row.confirmFlag).text }}
                </el-tag>
            </template>

      <template slot="expand" slot-scope="{row}">
        <el-timeline>
          <el-timeline-item v-for="(item, index) in timeLineData(row)" :key="index" :timestamp="item.createTime"
            :icon="item.icon" :color="item.color" :hide-timestamp="item.contentType == 3" placement="top">
            <el-card v-show="item.contentType == 1" :body-style="{ padding: '10px', background: '#f8f8f8' }">
              <div>
                评价：{{ item.content }}
              </div>
              <el-rate v-model="item.point" disabled :colors="colors">
              </el-rate>
            </el-card>
            <template slot="expand" slot-scope="{row, size}">
                <el-timeline>
                    <el-timeline-item v-for="(item, index) in timeLineData(row)" :key="index" :timestamp="item.createTime"
                        :icon="item.icon" :color="item.color" :hide-timestamp="item.contentType == 3" placement="top">
                        <el-card v-show="item.contentType == 1" :body-style="{ padding: '10px', background: '#f8f8f8' }">
                            <div>
                                评价：{{ item.content }}
                            </div>
                            <el-rate v-model="item.point" disabled :colors="colors">
                            </el-rate>
                        </el-card>

            <el-card v-show="item.peopleType != 1 && item.contentType == 0"
              :body-style="{ padding: '10px', background: '#f8f8f8' }">
              <div>
                {{ item.name }} {{ item.mobile }}
              </div>
              <div>
                {{ item.content }}
              </div>
              <div v-show="item.imageList != '' && item.imageList != null">
                <el-image style="width: 100px; height: 100px" :src="showCurImage(item.imageList)"
                  :preview-src-list="showImageListData(item.imageList)">
                </el-image>
              </div>
            </el-card>
                        <el-card v-show="item.peopleType != 1 && item.contentType == 0"
                            :body-style="{ padding: '10px', background: '#f8f8f8' }">
                            <div>
                                {{ item.name }} {{ item.mobile }}
                            </div>
                            <div>
                                {{ item.content }}
                            </div>
                            <div v-show="item.imageList != '' && item.imageList != null">
                                <el-image style="width: 100px; height: 100px" :src="showCurImage(item.imageList)"
                                    :preview-src-list="showImageListData(item.imageList)">
                                </el-image>
                            </div>
                        </el-card>

            <el-card v-show="item.peopleType == 1 && item.contentType == 0"
              :body-style="{ padding: '10px', background: '#f8f8f8' }">
              <span style="color: rgb(204, 204, 204);">系统:{{ item.content || '959999' }}</span>
            </el-card>
                        <el-card v-show="item.peopleType == 1 && item.contentType == 0"
                            :body-style="{ padding: '10px', background: '#f8f8f8' }">
                            <span style="color: rgb(204, 204, 204);">系统:{{ item.content || '959999' }}</span>
                        </el-card>

            <span v-show="item.contentType == 3">结束</span>
          </el-timeline-item>
                        <span v-show="item.contentType == 3">结束</span>
                    </el-timeline-item>


          <!-- <el-timeline-item timestamp="2018/4/12" placement="top">
                    <!-- <el-timeline-item timestamp="2018/4/12" placement="top">
                        <el-card>
                            <h4>更新 Github 模板</h4>
                            <p>王小虎 提交于 2018/4/12 20:46</p>
                        </el-card>
                    </el-timeline-item> -->
        </el-timeline>
      </template>
                </el-timeline>
            </template>

      <template slot-scope="scope" slot="menu">
        <el-button v-if="permission.report_for_repairs_details" size="small" type="text" icon="el-icon-document-remove"
          @click="rowExpansion(scope.row)">
          详情
        </el-button>
            <template slot-scope="{row, size, index}" slot="menu">
                <el-button :size="size" v-if="permission.report_for_repairs_details" type="text"
                    icon="el-icon-document-remove" @click="rowExpansion(row)">
                    详情
                </el-button>

        <el-button v-if="permission.report_for_repairs_reply" size="small" type="text" icon="el-icon-chat-dot-square"
          :disabled="scope.row.confirmFlag === 3" @click="replyBtnClick(scope.row)">
          回复
        </el-button>
                <el-button :size="size" v-if="permission.report_for_repairs_reply" type="text"
                    icon="el-icon-chat-dot-square" :disabled="row.confirmFlag === 3" @click="replyBtnClick(row)">
                    回复
                </el-button>

        <el-button v-if="permission.report_for_repairs_turn_over" size="small" type="text" icon="el-icon-document-copy"
          :disabled="scope.row.confirmFlag === 3" @click="turnOverBtnClick(scope.row)">
          移交
        </el-button>
                <el-button :size="size" v-if="permission.report_for_repairs_turn_over" type="text"
                    icon="el-icon-document-copy" :disabled="row.confirmFlag === 3" @click="turnOverBtnClick(row)">
                    移交
                </el-button>

        <el-button v-if="permission.report_for_repairs_del" size="small" type="text" icon="el-icon-delete"
          @click="rowDel(scope.row)">
          删除
        </el-button>
      </template>
                <el-button :size="size" v-if="permission.report_for_repairs_del" type="text" icon="el-icon-delete"
                    @click="rowDel(row)">
                    删除
                </el-button>
            </template>

      <template slot="menuLeft">
        <el-button size="small" icon="el-icon-delete" plain v-if="permission.article_delete" @click="handleDelete">删
          除
        </el-button>
      </template>
    </avue-crud>
            <template slot="menuLeft">
                <el-button size="small" icon="el-icon-delete" plain v-if="permission.article_delete" @click="handleDelete">删
                    除
                </el-button>
            </template>
        </avue-crud>

    <el-dialog title="回复" append-to-body :visible.sync="replyPopup" center @close="popupClose">
      <avue-form ref="replyForm" :option="replyOption" v-model="replyForm" @submit="handleSubmit"
        @reset-change="handleReset">
        <template slot-scope="{row}" slot="videoList">
          <el-upload class="video-uploader" action="/api/blade-resource/oss/endpoint/put-file" :file-list="fileList"
            :headers="updateHeader" :show-file-list="true" :limit="1" :on-change="getFile" :on-exceed="handleExceed"
            :on-success="uploadVideoProcess" :before-upload="beforeUploadVideo" :before-remove="beforeRemove">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">上传视频只能是 mp4 格式，且大小不能超过 50MB</div>
          </el-upload>
        </template>
      </avue-form>
    </el-dialog>
        <el-dialog title="回复" append-to-body :visible.sync="replyPopup" center @close="popupClose">
            <avue-form ref="replyForm" :option="replyOption" v-model="replyForm" @submit="handleSubmit"
                @reset-change="handleReset">
                <template slot-scope="{row}" slot="videoList">
                    <el-upload class="video-uploader" action="/api/blade-resource/oss/endpoint/put-file"
                        :file-list="fileList" :headers="updateHeader" :show-file-list="true" :limit="1" :on-change="getFile"
                        :on-exceed="handleExceed" :on-success="uploadVideoProcess" :before-upload="beforeUploadVideo"
                        :before-remove="beforeRemove">
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">上传视频只能是 mp4 格式，且大小不能超过 50MB</div>
                    </el-upload>
                </template>
            </avue-form>
        </el-dialog>

    <el-dialog title="转交" class="turn-over-popup" append-to-body :visible.sync="turnOverPopup" center
      @close="popupClose">
      <avue-form ref="turnOverForm" :option="turnOverOption" v-model="turnOverForm" @submit="turnOverHandleSubmit"
        @reset-change="turnOverHandleReset"></avue-form>
    </el-dialog>
  </basic-container>
        <el-dialog title="转交" class="turn-over-popup" append-to-body :visible.sync="turnOverPopup" center
            @close="popupClose">
            <avue-form ref="turnOverForm" :option="turnOverOption" v-model="turnOverForm" @submit="turnOverHandleSubmit"
                @reset-change="turnOverHandleReset"></avue-form>
        </el-dialog>
    </basic-container>
</template>

<script>
  import {
import {
    getList,
    remove,
    update,
    add,
    getReportForRepairs,
    saveReply
  } from "@/api/task/reportForRepairs"
  import {
} from "@/api/task/reportForRepairs"
import {
    mapGetters
  } from "vuex"
  import website from '@/config/website'
  import {
} from "vuex"
import website from '@/config/website'
import {
    Base64
  } from 'js-base64'
  import {
} from 'js-base64'
import {
    getToken
  } from '@/util/auth'
} from '@/util/auth'

  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 {
        colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        datetime: "",
        selectionList: [],
        option: {
          viewBtn: false,
          editBtn: false,
          delBtn: false,
          index: false,
          selection: false,
          expand: true,
          height: "auto",
          calcHeight: 54,
          dialogWidth: 950,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 272,
          border: true,
          //stripe:true,
          // excelBtn: true,
          dialogClickModal: false,
          column: [{
              width: 96,
              label: "类型",
              prop: "type",
              span: 12,
              searchSpan: 4,
              dataType: "number",
              type: "select",
              dicUrl: "/api/blade-system/dict-biz/dictionary?code=reportForRepairsType",
              props: {
                label: "dictValue",
                value: "dictKey",
              },
              search: true,
            },
            {
              width: 96,
              label: "姓名",
              prop: "realName",
              span: 12,
              searchSpan: 4,
              search: true,
            },

            {
              width: 96,
              label: "手机号码",
              prop: "phone",
              search: true,
              searchSpan: 3,
              slot: true,
              rules: [{
                validator: validatorPhone,
                trigger: 'blur'
              }],
            },

            {
              width: 110,
              label: "图片",
              prop: "imageUrls",
              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,
            },
            {
              label: "地点",
              prop: "addressName",
              overHidden: true
            },
            {
              width: 100,
              addDisplay: false,
              editDisplay: false,
              slot: true,
              label: "状态",
              prop: "confirmFlag",
              overHidden: true
            },
            {
              label: "上报时间",
              prop: "createTime",
              width: 160,
              addDisplay: false,
              editDisplay: false,
              type: "date",
              format: "yyyy-MM-dd HH:mm:ss",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
            },
            {
              label: "处理时间",
              prop: "confirmTime",
              width: 160,
              addDisplay: false,
              editDisplay: false,
              type: "date",
              format: "yyyy-MM-dd HH:mm:ss",
              valueFormat: "yyyy-MM-dd HH:mm:ss",
            },
            {
              label: "描述",
              prop: "remark",
              type: "textarea",
              hide: true,
              span: 24,
            }
          ],
        },
        data: [],

        replyPopup: false,
        replyForm: {},
        replyOption: {
          submitBtn: true,
          submitText: '确定',
          emptyBtn: true,
          emptyText: '取消',

          column: [{
              span: 24,
              label: "说明",
              prop: "content",
              type: 'textarea',
              minRows: 3,
              maxRows: 5,
              rules: [{
                required: true,
                message: "请输入说明",
                trigger: "blur",
              }],
            },

            {
              label: '处理状态',
              prop: 'confirmFlag',
              type: 'select',
              dicData: [{
                label: '待处理',
                value: 1
              }, {
                label: '处理中',
                value: 2
              }, {
                label: '已处理',
                value: 3
              }],
              rules: [{
                required: true,
                message: "请选择处理状态",
                trigger: "blur",
              }],
            },

            {
              width: 110,
              fileType: 'img',
              label: "图片",
              prop: "imageList",
              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,
            },

            {
              slot: true,
              label: "视频",
              prop: "videoList",
              span: 24,
            }
          ]
        },

        turnOverPopup: false,
        turnOverForm: {},
        turnOverOption: {
          submitBtn: true,
          submitText: '确定',
          emptyBtn: true,
          emptyText: '取消',

          column: [
            // {
            //     hide: true,
            //     span: 14,
            //     label: "地址",
            //     prop: "addressCode",
            // },

            {
              span: 24,
              label: "人员类型",
              prop: "peopleType",
              type: 'select',
              dicData: [{
                label: '网格员',
                value: 0
              }, {
                label: '物业公司人员',
                value: 2
              }],
              cascader: ["transferUserId"],
              rules: [{
                required: true,
                message: "请选择人员类型",
                trigger: "blur",
              }],
            },

            {
              span: 24,
              label: "指定人员",
              prop: "transferUserId",
              type: 'select',
              dicUrl: `/api/blade-system/user/getUserInfoByCode?houseCode={{addressCode}}&type={{peopleType}}`,
              props: {
                label: "name",
                value: "id",
              },
              change: ({
                value,
                column,
                item,
                dic
              }) => {
                this.curPeopleDetails = {}

                if (value) {
                  this.curPeopleDetails = item
export default {
    data () {
        let validatorPhone = function (rule, value, callback) {
            if (value) {
                if (!/^1[3456789]\d{9}$/.test(value)) {
                    callback(new Error('手机号格式有误！'))
                } else {
                    callback()
                }
              },
              rules: [{
                required: true,
                message: "请选择指定人员",
                trigger: "blur",
              }],
            }
            callback()
        }

        return {
            colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
          ]
        },
            datetime: "",
            selectionList: [],
            option: {
                labelWidth: 96,
                searchLabelWidth: 96,
                searchShow: true,
                searchMenuSpan: 3,
                menuWidth: 280,

        curRow: {},
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                index: false,
                selection: false,
                expand: true,
                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                border: true,
                //stripe:true,
                // excelBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        width: 100,
                        label: "类型",
                        prop: "type",
                        span: 12,
                        searchLabelWidth: 66,
                        searchSpan: 4,
                        search: true,
                        dataType: "number",
                        type: "select",
                        dicUrl: "/api/blade-system/dict-biz/dictionary?code=reportForRepairsType",
                        props: {
                            label: "dictValue",
                            value: "dictKey",
                        },
                    },
                    {
                        width: 110,
                        label: "姓名",
                        prop: "realName",
                        span: 12,
                        searchSpan: 4,
                        searchLabelWidth: 66,
                        search: true,
                    },

        fileList: [],
        updateHeader: {
          Authorization: `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
          'Blade-Auth': getToken()
        },
                    {
                        width: 120,
                        label: "手机号码",
                        prop: "phone",
                        search: true,
                        searchSpan: 4,
                        slot: true,
                        rules: [{
                            validator: validatorPhone,
                            trigger: 'blur'
                        }],
                    },

        curPeopleDetails: {},
                    {
                        width: 110,
                        label: "图片",
                        prop: "imageUrls",
                        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,
                    },
                    {
                        overHidden: true,
                        label: "地点",
                        prop: "addressName",
                    },
                    {
                        width: 100,
                        label: "状态",
                        addDisplay: false,
                        editDisplay: false,
                        slot: true,
                        prop: "confirmFlag",
                        overHidden: true
                    },
                    {
                        width: 144,
                        label: "上报时间",
                        prop: "createTime",
                        addDisplay: false,
                        editDisplay: false,
                        type: "date",
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                    },
                    {
                        width: 144,
                        label: "处理时间",
                        prop: "confirmTime",
                        addDisplay: false,
                        editDisplay: false,
                        type: "date",
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                    },
                    {
                        label: "描述",
                        prop: "remark",
                        type: "textarea",
                        hide: true,
                        span: 24,
                    }
                ],
            },
            data: [],

        videoFlag: false,
        videoUploadPercent: ''
      }
            replyPopup: false,
            replyForm: {},
            replyOption: {
                submitBtn: true,
                submitText: '确定',
                emptyBtn: true,
                emptyText: '取消',

                column: [{
                    span: 24,
                    label: "说明",
                    prop: "content",
                    type: 'textarea',
                    minRows: 3,
                    maxRows: 5,
                    rules: [{
                        required: true,
                        message: "请输入说明",
                        trigger: "blur",
                    }],
                },

                {
                    label: '处理状态',
                    prop: 'confirmFlag',
                    type: 'select',
                    dicData: [{
                        label: '待处理',
                        value: 1
                    }, {
                        label: '处理中',
                        value: 2
                    }, {
                        label: '已处理',
                        value: 3
                    }],
                    rules: [{
                        required: true,
                        message: "请选择处理状态",
                        trigger: "blur",
                    }],
                },

                {
                    width: 110,
                    fileType: 'img',
                    label: "图片",
                    prop: "imageList",
                    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,
                },

                {
                    slot: true,
                    label: "视频",
                    prop: "videoList",
                    span: 24,
                }
                ]
            },

            turnOverPopup: false,
            turnOverForm: {},
            turnOverOption: {
                submitBtn: true,
                submitText: '确定',
                emptyBtn: true,
                emptyText: '取消',

                column: [
                    // {
                    //     hide: true,
                    //     span: 14,
                    //     label: "地址",
                    //     prop: "addressCode",
                    // },

                    {
                        span: 24,
                        label: "人员类型",
                        prop: "peopleType",
                        type: 'select',
                        dicData: [{
                            label: '网格员',
                            value: 0
                        }, {
                            label: '物业公司人员',
                            value: 2
                        }],
                        cascader: ["transferUserId"],
                        rules: [{
                            required: true,
                            message: "请选择人员类型",
                            trigger: "blur",
                        }],
                    },

                    {
                        span: 24,
                        label: "指定人员",
                        prop: "transferUserId",
                        type: 'select',
                        dicUrl: `/api/blade-system/user/getUserInfoByCode?houseCode={{addressCode}}&type={{peopleType}}`,
                        props: {
                            label: "name",
                            value: "id",
                        },
                        change: ({
                            value,
                            column,
                            item,
                            dic
                        }) => {
                            this.curPeopleDetails = {}

                            if (value) {
                                this.curPeopleDetails = item
                            }
                        },
                        rules: [{
                            required: true,
                            message: "请选择指定人员",
                            trigger: "blur",
                        }],
                    },
                ]
            },

            curRow: {},

            fileList: [],
            updateHeader: {
                Authorization: `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`,
                'Blade-Auth': getToken()
            },

            curPeopleDetails: {},

            videoFlag: false,
            videoUploadPercent: ''
        }
    },
    watch: {},
    computed: {
      ...mapGetters(["permission", "userInfo"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.reportForRepairs_add, true),
          viewBtn: this.vaildData(this.permission.reportForRepairs_view, true),
          delBtn: this.vaildData(this.permission.reportForRepairs_delete, true),
          editBtn: this.vaildData(this.permission.reportForRepairs_edit, true),
        }
      },

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

      timeLineData() {
        return (row) => {
          let imageList = row.imageUrls

          if (row.taskRepairAppraiseList.length) {
            return [{
                createTime: row.createTime,
                mobile: row.phone,
                name: row.realName,
                imageList,
                content: row.remark,
                color: '#1890ff',
                contentType: 0,
              },
              ...row.taskRepairStepList.map((item, index) => {
                if (index == 0) {
                  return {
                    ...item,
                    contentType: 0,
                  }
                }
                return {
                  ...item,
                  contentType: 0
                }
              }),
              ...row.taskRepairAppraiseList.map(item => {
                return {
                  ...item,
                  contentType: 1
                }
              }),
              {
                contentType: 3,
                createTime: '',
                icon: 'el-icon-check',
                color: '#0bbd87'
              }
            ]
          } else {
            return [{
                createTime: row.createTime,
                mobile: row.phone,
                name: row.realName,
                imageList,
                content: row.remark,
                color: '#1890ff',
                contentType: 0,
              },
              ...row.taskRepairStepList.map((item, index) => {
                if (index == 0) {
                  return {
                    ...item,
                    contentType: 0,
                  }
                }
                return {
                  ...item,
                  contentType: 0
                }
              })
            ]
          }
        }
      },

      showCurImage() {
        return (data) => {
          if (data != null && data.length > 0) {
            return data.split(',').filter(item => item != '')[0]
          }
          return ''
        }
      },

      showImageListData() {
        return (data) => {
          if (data != null && data.length > 0) {
            return data.split(',').filter(item => item != '')
          }
          return []
        }
      },

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

          if (data == 1) {
            tags = {
              type: 'warning',
              text: '待处理'
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.reportForRepairs_add, true),
                viewBtn: this.vaildData(this.permission.reportForRepairs_view, true),
                delBtn: this.vaildData(this.permission.reportForRepairs_delete, true),
                editBtn: this.vaildData(this.permission.reportForRepairs_edit, true),
            }
          } else if (data == 2) {
            tags = {
              type: '',
              text: '处理中'
            }
          } else if (data == 3) {
            tags = {
              type: 'success',
              text: '已处理'
            }
          } else if (data == 4) {
            tags = {
              type: 'success',
              text: '已评价'
            }
          }
        },

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

        timeLineData () {
            return (row) => {
                let imageList = row.imageUrls

                if (row.taskRepairAppraiseList.length) {
                    return [{
                        createTime: row.createTime,
                        mobile: row.phone,
                        name: row.realName,
                        imageList,
                        content: row.remark,
                        color: '#1890ff',
                        contentType: 0,
                    },
                    ...row.taskRepairStepList.map((item, index) => {
                        if (index == 0) {
                            return {
                                ...item,
                                contentType: 0,
                            }
                        }
                        return {
                            ...item,
                            contentType: 0
                        }
                    }),
                    ...row.taskRepairAppraiseList.map(item => {
                        return {
                            ...item,
                            contentType: 1
                        }
                    }),
                    {
                        contentType: 3,
                        createTime: '',
                        icon: 'el-icon-check',
                        color: '#0bbd87'
                    }
                    ]
                } else {
                    return [{
                        createTime: row.createTime,
                        mobile: row.phone,
                        name: row.realName,
                        imageList,
                        content: row.remark,
                        color: '#1890ff',
                        contentType: 0,
                    },
                    ...row.taskRepairStepList.map((item, index) => {
                        if (index == 0) {
                            return {
                                ...item,
                                contentType: 0,
                            }
                        }
                        return {
                            ...item,
                            contentType: 0
                        }
                    })
                    ]
                }
            }
        },

        showCurImage () {
            return (data) => {
                if (data != null && data.length > 0) {
                    return data.split(',').filter(item => item != '')[0]
                }
                return ''
            }
        },

        showImageListData () {
            return (data) => {
                if (data != null && data.length > 0) {
                    return data.split(',').filter(item => item != '')
                }
                return []
            }
        },

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

                if (data == 1) {
                    tags = {
                        type: 'warning',
                        text: '待处理'
                    }
                } else if (data == 2) {
                    tags = {
                        type: '',
                        text: '处理中'
                    }
                } else if (data == 3) {
                    tags = {
                        type: 'success',
                        text: '已处理'
                    }
                } else if (data == 4) {
                    tags = {
                        type: 'success',
                        text: '已评价'
                    }
                }

                return tags
            }
        }
      }
    },
    methods: {
      rowExpansion(row) {
        this.$refs.crud.toggleRowExpansion(row)
      },
        rowExpansion (row) {
            this.$refs.crud.toggleRowExpansion(row)
        },

      popupClose() {
        this.$refs.replyForm && this.$refs.replyForm.resetForm()
        this.$refs.turnOverForm && this.$refs.turnOverForm.resetForm()
      },
        popupClose () {
            this.$refs.replyForm && this.$refs.replyForm.resetForm()
            this.$refs.turnOverForm && this.$refs.turnOverForm.resetForm()
        },

      saveReply(data, done) {
        saveReply(data).then(
          () => {
            this.replyPopup = false
            this.turnOverPopup = false
            this.onLoad(this.page)
            this.$message({
              type: "success",
              message: "操作成功!",
            })
            done()
          },
          (error) => {
            window.console.log(error)
          }
        )
      },

      handleSubmit(form, done) {

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

        this.saveReply({
          ...form,
          videoList: this.fileList.map(item => item.response.data.link).join(','),
          repairId: this.curRow.id,
          peopleType: 0,
          mobile: this.userInfo.phone
        }, done)
      },

      handleReset() {
        this.fileList = []
        this.replyPopup = false
      },

      turnOverHandleSubmit(form, done) {
        let content = ''

        if (form.peopleType == 0) {
          content = `事件已移交至 网格员 ${this.curPeopleDetails.name}`
        } else if (form.peopleType == 2) {
          content = `事件已移交至 物业公司人员 ${this.curPeopleDetails.distictName || ''}${this.curPeopleDetails.name}`
        }

        this.saveReply({
          ...form,
          confirmFlag: 1,
          content,
          peopleType: 1,
          repairId: this.curRow.id,
        }, done)
      },

      turnOverHandleReset() {
        this.turnOverPopup = false
      },

      //移除
      beforeRemove(file, fileList) {
        return this.$confirm(`确定移除 ${file.name}？`).then(() => {
          this.fileList = fileList
        })
      },

      //上传
      getFile(file, fileList) {
        this.fileList = fileList
      },

      beforeUploadVideo(file) {
        const isLt50M = file.size / 1024 / 1024 < 50
        if (['video/mp4'].indexOf(file.type) == -1) {
          this.$message.error('上传视频只能是 mp4 格式!')
          return false
        }
        if (!isLt50M) {
          this.$message.error('上传视频大小不能超过 50MB!')
          return false
        }
        return true
      },

      handleExceed(files, fileList) {
        this.$message.warning("目前只能上传一个视频文件")
      },

      uploadVideoProcess(event, file, fileList) {
        console.log(event, file, fileList, this.fileList)
      },

      replyBtnClick(row) {
        this.curRow = row
        this.replyForm = {}
        this.replyPopup = true
      },

      turnOverBtnClick(row) {
        this.curRow = row
        this.turnOverForm = {
          addressCode: row.addressCode
        }
        this.turnOverPopup = true
      },

      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.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.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)) {
          getReportForRepairs(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(",")
              }
            }
          })
        }

        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.data.forEach(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(",")
              }
            }
            if (item.taskRepairStepList.length > 0) {
              item.taskRepairStepList.forEach(ee => {
                if (ee.imageList) {
                  if (ee.imageList.length > 0) {
                    var urls = []
                    var names = ee.imageList.split(",")
                    names.forEach(name => {
                      urls.push(website.minioUrl + name)
        saveReply (data, done) {
            saveReply(data).then(
                () => {
                    this.replyPopup = false
                    this.turnOverPopup = false
                    this.onLoad(this.page)
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    })
                    ee.imageList = urls.join(",")
                  }
                    done()
                },
                (error) => {
                    window.console.log(error)
                }
              })
            )
        },

        handleSubmit (form, done) {

            if (form.imageList.length > 0) {
                var urls = []
                var split = form.imageList.split(",").filter(item => item != '')
                split.forEach(url => {
                    var names = url.split("jczz/")
                    urls.push(names[1])
                })
                form.imageList = urls.join(",")
            }
          })
          this.loading = false
          this.selectionClear()
        })
      }
            // if (form.imageList.length > 0) {
            //   var urls = []
            //   var split = form.imageList.split(",").filter(item => item != '')
            //   split.forEach(url => {
            //     var names = url.split("jczz/")
            //     urls.push(names[1])
            //   })
            //   form.imageList = urls.join(",")
            // }

            this.saveReply({
                ...form,
                videoList: this.fileList.map(item => item.response.data.link).join(','),
                repairId: this.curRow.id,
                peopleType: 0,
                mobile: this.userInfo.phone
            }, done)
        },

        handleReset () {
            this.fileList = []
            this.replyPopup = false
        },

        turnOverHandleSubmit (form, done) {
            let content = ''

            if (form.peopleType == 0) {
                content = `事件已移交至 网格员 ${this.curPeopleDetails.name}`
            } else if (form.peopleType == 2) {
                content = `事件已移交至 物业公司人员 ${this.curPeopleDetails.distictName || ''}${this.curPeopleDetails.name}`
            }

            this.saveReply({
                ...form,
                confirmFlag: 1,
                content,
                peopleType: 1,
                repairId: this.curRow.id,
            }, done)
        },

        turnOverHandleReset () {
            this.turnOverPopup = false
        },

        //移除
        beforeRemove (file, fileList) {
            return this.$confirm(`确定移除 ${file.name}？`).then(() => {
                this.fileList = fileList
            })
        },

        //上传
        getFile (file, fileList) {
            this.fileList = fileList
        },

        beforeUploadVideo (file) {
            const isLt50M = file.size / 1024 / 1024 < 50
            if (['video/mp4'].indexOf(file.type) == -1) {
                this.$message.error('上传视频只能是 mp4 格式!')
                return false
            }
            if (!isLt50M) {
                this.$message.error('上传视频大小不能超过 50MB!')
                return false
            }
            return true
        },

        handleExceed (files, fileList) {
            this.$message.warning("目前只能上传一个视频文件")
        },

        uploadVideoProcess (event, file, fileList) {
            console.log(event, file, fileList, this.fileList)
        },

        replyBtnClick (row) {
            this.curRow = row
            this.replyForm = {}
            this.replyPopup = true
        },

        turnOverBtnClick (row) {
            this.curRow = row
            this.turnOverForm = {
                addressCode: row.addressCode
            }
            this.turnOverPopup = true
        },

        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.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.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)) {
                getReportForRepairs(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(",")
                        }
                    }
                })
            }

            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.data.forEach(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(",")
                        }
                    }
                    if (item.taskRepairStepList.length > 0) {
                        item.taskRepairStepList.forEach(ee => {
                            if (ee.imageList) {
                                if (ee.imageList.length > 0) {
                                    var urls = []
                                    var names = ee.imageList.split(",")
                                    names.forEach(name => {
                                        urls.push(website.minioUrl + name)
                                    })
                                    ee.imageList = urls.join(",")
                                }
                            }
                        })
                    }
                })
                this.loading = false
                this.selectionClear()
            })
        }
    },
  }
}
</script>

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