表格样式 主题默认蓝色

liuyg

2021-07-27 3f1a0f246e1de207b6764f7003af4715103a7d93

表格样式  主题默认蓝色

 src/store/modules/common.js

@@ -8,13 +8,13 @@
const common = {

  state: {
    language: getStore({name: 'language'}) || 'zh',
    language: getStore({ name: 'language' }) || 'zh',
    isCollapse: false,
    isFullScren: false,
    isMenu: true,
    isShade: false,
    screen: -1,
    isLock: getStore({name: 'isLock'}) || false,
    isLock: getStore({ name: 'isLock' }) || false,
    showTag: true,
    showDebug: true,
    showCollapse: true,
@@ -24,9 +24,9 @@
    showTheme: true,
    showMenu: true,
    showColor: true,
    colorName: getStore({name: 'colorName'}) || '#409EFF',
    themeName: getStore({name: 'themeName'}) || 'theme-default',
    lockPasswd: getStore({name: 'lockPasswd'}) || '',
    colorName: getStore({ name: 'colorName' }) || '#409EFF',
    themeName: getStore({ name: 'themeName' }) || 'theme-bule',
    lockPasswd: getStore({ name: 'lockPasswd' }) || '',
    website: website,
  },
  mutations: {

 src/styles/element-ui.scss

@@ -25,7 +25,6 @@
  display: none;
}


.el-message__icon,
.el-message__content {
  display: inline-block;
@@ -49,12 +48,19 @@
  padding: 0 !important;
}

.el-dropdown-menu__item--divided:before, .el-menu, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-submenu .el-submenu__title:hover {
.el-dropdown-menu__item--divided:before,
.el-menu,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):focus,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
.el-menu--horizontal > .el-submenu .el-submenu__title:hover {
  background-color: transparent;
}


.el-dropdown-menu__item--divided:before, .el-menu, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-submenu .el-submenu__title:hover {
.el-dropdown-menu__item--divided:before,
.el-menu,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):focus,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
.el-menu--horizontal > .el-submenu .el-submenu__title:hover {
  background-color: transparent !important;
}

@@ -69,3 +75,83 @@
.el-divider--horizontal {
  margin: 12px 0 !important;
}

//表格斑马纹
.el-table tr:nth-child(2n -1) {
  // background-color: rgba($color: #000000, $alpha: 0.1) !important;
}

//顶部搜索栏
.el-card.is-never-shadow.avue-crud__search {
  position: absolute !important;
  width: calc(100% - 220px) !important;
  z-index: 500 !important;
  border: none !important;
  box-shadow: none !important;
  height: 40px;
}

.desk .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 360px) !important;
}
.securityGuard .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 300px) !important;
  left: 120px;
}
.securityUnit .el-card.is-never-shadow.avue-crud__search {
  left: 200px;
  width: calc(100% - 380px) !important;
}
.equipments .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px;
}
.dispatch .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px;
}
.dispatchChildoperable .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 280px) !important;
  left: 90px;
}
.workreply .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px !important;
}
.recruitmentManagement .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px !important;
}

.hasButOne .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 300px) !important;
  left: 120px !important;
}
.hasButTwo .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px !important;
}
.topmenu .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 390px) !important;
  left: 220px !important;
}
.hasButThree .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 510px) !important;
  left: 310px !important;
}
.avue-form {
  position: relative;
  top: -10px;
}
//顶部按钮栏
.avue-crud__menu {
  height: 60px;
}
//顶部按钮
.avue-crud .avue-crud__left .el-button,
.avue-crud .avue-crud__right .el-button,
.avue-form .avue-crud__left .el-button,
.avue-form .avue-crud__right .el-button {
  position: relative;
  top: 5px;
}

 src/views/authority/role.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="hasButThree">
    <avue-crud
      :option="option"
      :table-loading="loading"

 src/views/desk/notice.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="desk">
    <avue-crud
      :option="option"
      :table-loading="loading"

 src/views/dispatch/dispatch.vue

@@ -112,6 +112,7 @@
      option: {
        tip: false,
        // card: true,
        index: true,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 623,

 src/views/dispatch/dispatchChildoperable.vue

@@ -158,7 +158,7 @@
        // addBtn: false,
        // menuWidth: 160,
        align: "center",
        // selection: true,
        selection: true,
        column: [
          // 派遣服务公司登记
          // {
@@ -231,6 +231,11 @@
            labelWidth: 120,
            searchLabelWidth: 120,
            // overHidden: true
            dicUrl: "/api/blade-user/page-security",
            props: {
              label: "name",
              value: "id",
            },
            rules: [
              {
                required: true,

 src/views/recruitmentManagement/index.vue

@@ -56,7 +56,7 @@
        viewBtn: true,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 627,
        height: 693,
        menuWidth: 210,
        align: "center",
        selection: true,

 src/views/resource/attach.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="hasButTwo">
    <avue-crud
      :option="option"
      :table-loading="loading"

 src/views/resource/oss.vue

@@ -1,415 +1,457 @@
<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">
  <basic-container class="hasButOne">
    <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
          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
          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
          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 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 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
      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: 300,
          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=oss",
              props: {
                label: "dictValue",
                value: "dictKey"
              },
              dataType: "number",
              slot: true,
              prop: "category",
              search: true,
              rules: [{
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: 300,
        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=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: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "资源编号",
            prop: "ossCode",
            span: 24,
            width: 120,
            search: true,
            rules: [
              {
                required: true,
                message: "请输入资源编号",
                trigger: "blur"
              }]
            },
            {
              label: "资源地址",
              prop: "endpoint",
              span: 24,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "资源地址",
            prop: "endpoint",
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入资源地址",
                trigger: "blur"
              }]
            },
            {
              label: "空间名",
              prop: "bucketName",
              span: 24,
              width: 120,
              rules: [{
                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: [{
                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: [{
                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',
              action: '/api/blade-resource/oss/endpoint/put-file',
              propsHttp: {
                res: 'data',
                url: 'link',
                trigger: "blur",
              },
              span: 24,
            ],
          },
          {
            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",
            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;
        }
      });
    },
    "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),
      };
    },
    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;
          }
        });
      },
      'debugForm.code'() {
        const column = this.findObject(this.debugOption.column, "backgroundUrl");
        column.action = `/api/blade-resource/oss/endpoint/put-file?code=${this.debugForm.code}`;
      }
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.oss_add),
          viewBtn: this.vaildData(this.permission.oss_view),
          delBtn: this.vaildData(this.permission.oss_delete),
          editBtn: this.vaildData(this.permission.oss_edit)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    },
    methods: {
      rowSave(row, done, loading) {
        add(row).then(() => {
  },
  methods: {
    rowSave(row, done, loading) {
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
        }
      );
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      handleEnable(row) {
        this.$confirm("是否确定启用这条配置?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return enable(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      handleDebug(row) {
        this.box = true;
        this.debugForm.code = row.ossCode;
        this.debugForm.backgroundUrl = '';
      },
      handleSubmit(form, done) {
        this.$message({
          type: "success",
          message: `获取到图片地址:[${form.backgroundUrl}]`
        });
        done();
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
      );
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
        });
    },
    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: "操作成功!",
          });
        }
        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.$refs.crud.toggleSelection();
        });
    },
    handleDebug(row) {
      this.box = true;
      this.debugForm.code = row.ossCode;
      this.debugForm.backgroundUrl = "";
    },
    handleSubmit(form, done) {
      this.$message({
        type: "success",
        message: `获取到图片地址:[${form.backgroundUrl}]`,
      });
      done();
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
    }
  };
      done();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
  },
};
</script>

 src/views/securityEquipment/car.vue

@@ -48,9 +48,10 @@
      option: {
        // card: true,
        tip: false,
        index: true,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 627,
        height: 693,
        menuWidth: 160,
        align: "center",
        selection: true,

 src/views/securityEquipment/equipments.vue

@@ -50,7 +50,8 @@
        tip: false,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 627,
        height: 693,
        index: true,
        menuWidth: 160,
        align: "center",
        selection: true,

 src/views/securityEquipment/gun.js

@@ -14,11 +14,13 @@
        prop: "id",
        hide: true,
        editDisplay: false,
        addDisplay: false
        addDisplay: false,
        labelWidth: 160,
    },
    {
        label: "公务用枪证编号",
        prop: "gunCardNumber",
        labelWidth: 160,
        searchLabelWidth: 130,
        search: true,
        rules: [{
@@ -30,6 +32,7 @@
    {
        label: "发证单位名称",
        searchLabelWidth: 110,
        labelWidth: 160,
        prop: "issueUnit",
        rules: [{
            required: true,
@@ -41,6 +44,7 @@
    {
        label: "公务用枪编号",
        prop: "cardNumber",
        labelWidth: 160,
        searchLabelWidth: 110,
        rules: [{
            required: true,
@@ -53,6 +57,7 @@
        label: "枪型",
        prop: "gunMode",
        width: 70,
        labelWidth: 160,
        rules: [{
            required: true,
            message: "请输入枪型",
@@ -63,6 +68,7 @@
    {
        label: "保安公司",
        prop: "tenantName",
        labelWidth: 160,
        rules: [{
            required: true,
            message: "请输入组织机构",
@@ -89,6 +95,7 @@
    {
        label: "责任人",
        prop: "personInCharge",
        labelWidth: 160,
        rules: [{
            required: true,
            message: "请输入责任人",
@@ -97,6 +104,7 @@
    },
    {
        label: "发证日期",
        labelWidth: 160,
        prop: "issueTime",
        // search: true,
        type: "date",
@@ -114,6 +122,7 @@
    {
        label: "有效日期",
        prop: "validTime",
        labelWidth: 160,
        // search: true,
        type: "date",
        format: "yyyy-MM-dd",

 src/views/securityEquipment/gun.vue

@@ -50,7 +50,8 @@
        tip: false,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 627,
        height: 693,
        index: true,
        menuWidth: 160,
        align: "center",
        selection: true,

 src/views/securityGuard/data.js

@@ -1,314 +1,314 @@
//保安员基本信息
export var securityBaseInfoColumn = [{
        label: "",
        labelWidth: "20",
        type: 'title',
        prop: "title",
        span: 24,
        styles: {
            fontSize: '24px'
        }
    },
    {
        label: "所属保安公司",
        prop: "deptId",
        type: "tree",
        dicUrl: "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
        // dicUrl: "/api/blade-system/dept/lazy-tree?parentId=0",
        props: {
            label: "title",
            value: "id",
        },
        disabled: true,
        span: 24,
    },
    {
        label: "登录账号",
        prop: "account",
        disabled: true
    },
    {
        label: "用户姓名",
        prop: "realName",
        disabled: true,
    },
    {
        label: "用户昵称",
        prop: "name",
        disabled: true
    },
    {
        label: "手机号码",
        prop: "phone",
        disabled: true
    },
    {
        label: "电子邮箱",
        prop: "email",
        disabled: true
    },
    {
        label: "身份证号",
        prop: "cardid",
        disabled: true
    },
    {
        label: "籍贯",
        prop: "nativeplace",
        disabled: true
    },
    {
        label: "民族",
        prop: "nation",
        disabled: true
    },
    {
        label: "是否持证",
        prop: "hold",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
        props: {
            label: "dictValue",
            value: "dictKey",
        },
        type: "select",
        disabled: true
    },
    {
        label: "保安员证编号",
        prop: "securitynumber",
        disabled: true
    },
    {
        label: "所属辖区",
        prop: "jurisdiction",
        // multiple: true,
        type: "tree",
        dicUrl: "/api/jurisdiction/lazy-tree?parentId=0",
        props: {
            label: "title",
            value: "id",
        },
        disabled: true
    },
    {
        label: "最高学历",
        prop: "education",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        slot: true,
        disabled: true
    },
    {
        label: "政治面貌",
        prop: "politicaloutlook",
        disabled: true
    },
    {
        label: "身高",
        prop: "height",
        disabled: true
    },
    {
        label: "联系地址",
        prop: "address",
        disabled: true
    },
    {
        label: "户口所在地",
        prop: "registered",
        disabled: true
    },
    {
        label: "入职时间",
        prop: "rtime",
        type: 'date',
        format: "yyyy-MM-dd",
        valueFormat: "yyyy-MM-dd",
        disabled: true
    },
    {
        label: "用户性别",
        prop: "sex",
        type: "select",
        dicData: [{
                label: "男",
                value: 1
            },
            {
                label: "女",
                value: 2
            },
            {
                label: "未知",
                value: 3
            }
        ],
        disabled: true
    },
    {
        label: "用户生日",
        type: "date",
        prop: "birthday",
        disabled: true
    label: "",
    labelWidth: "20",
    type: 'title',
    prop: "title",
    span: 24,
    styles: {
        fontSize: '24px'
    }
},
{
    label: "所属保安公司",
    prop: "deptId",
    type: "tree",
    dicUrl: "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
    // dicUrl: "/api/blade-system/dept/lazy-tree?parentId=0",
    props: {
        label: "title",
        value: "id",
    },
    disabled: true,
    span: 24,
},
{
    label: "登录账号",
    prop: "account",
    disabled: true
},
{
    label: "用户姓名",
    prop: "realName",
    disabled: true,
},
{
    label: "用户昵称",
    prop: "name",
    disabled: true
},
{
    label: "手机号码",
    prop: "phone",
    disabled: true
},
{
    label: "电子邮箱",
    prop: "email",
    disabled: true
},
{
    label: "身份证号",
    prop: "cardid",
    disabled: true
},
{
    label: "籍贯",
    prop: "nativeplace",
    disabled: true
},
{
    label: "民族",
    prop: "nation",
    disabled: true
},
{
    label: "是否持证",
    prop: "hold",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
    props: {
        label: "dictValue",
        value: "dictKey",
    },
    type: "select",
    disabled: true
},
{
    label: "保安员证编号",
    prop: "securitynumber",
    disabled: true
},
{
    label: "所属辖区",
    prop: "jurisdiction",
    // multiple: true,
    type: "tree",
    dicUrl: "/api/jurisdiction/lazy-tree?parentId=0",
    props: {
        label: "title",
        value: "id",
    },
    disabled: true
},
{
    label: "最高学历",
    prop: "education",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    dataType: "number",
    slot: true,
    disabled: true
},
{
    label: "政治面貌",
    prop: "politicaloutlook",
    disabled: true
},
{
    label: "身高",
    prop: "height",
    disabled: true
},
{
    label: "联系地址",
    prop: "address",
    disabled: true
},
{
    label: "户口所在地",
    prop: "registered",
    disabled: true
},
{
    label: "入职时间",
    prop: "rtime",
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    disabled: true
},
{
    label: "用户性别",
    prop: "sex",
    type: "select",
    dicData: [{
        label: "男",
        value: 1
    },
    {
        label: "女",
        value: 2
    },
    {
        label: "未知",
        value: 3
    }
    ],
    disabled: true
},
{
    label: "用户生日",
    type: "date",
    prop: "birthday",
    disabled: true
}


]


export var securityBaseInfoColumns = [{
        label: "所属保安单位",
        prop: "tenantId",
        type: "tree",
        dicUrl: "/api/blade-system/tenant/select",
        props: {
            label: "tenantName",
            value: "tenantId"
        },
        disabled: true,
        span: 24,
    label: "所属保安单位",
    prop: "tenantId",
    type: "tree",
    dicUrl: "/api/blade-system/tenant/select",
    props: {
        label: "tenantName",
        value: "tenantId"
    },
    disabled: true,
    span: 24,
},
{
    label: "登录账号",
    prop: "account",
    disabled: true
},
{
    label: "用户姓名",
    prop: "realName",
    rules: [{
        required: true,
        message: "请输入用户姓名",
        trigger: "blur"
    }, {
        min: 2,
        max: 5,
        message: '姓名长度在2到5个字符'
    }]
},
{
    label: "用户昵称",
    prop: "name"
},
{
    label: "手机号码",
    prop: "phone",
    overHidden: true,
    rules: [{
        required: true,
        message: "请输入手机号",
        trigger: "blur"
    }]
},
{
    label: "电子邮箱",
    prop: "email",
    hide: true,
    overHidden: true
},
{
    label: "身份证号",
    prop: "cardid",
    hide: true,
    overHidden: true,
    rules: [{
        required: true,
        message: "请输入身份证号",
        trigger: "blur"
    }]
},
{
    label: "籍贯",
    prop: "nativeplace",
    hide: true,
    overHidden: true
},
{
    label: "民族",
    prop: "nation",
    hide: true,
    overHidden: true
},
{
    label: "最高学历",
    prop: "education",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    dataType: "number",
    slot: true,
    rules: [{
        required: true,
        message: "请选择学历",
        trigger: "blur"
    }]
},
{
    label: "政治面貌",
    prop: "politicaloutlook",
    hide: true,
    overHidden: true
},
{
    label: "身高",
    prop: "height",
    hide: true,
    overHidden: true
},
{
    label: "联系地址",
    prop: "address",
    hide: true,
    overHidden: true
},
{
    label: "户口所在地",
    prop: "registered",
    hide: true,
    overHidden: true
},
{
    label: "入职时间",
    prop: "rtime",
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    hide: true,
    overHidden: true
},
{
    label: "用户性别",
    prop: "sex",
    type: "select",
    dicData: [{
        label: "男",
        value: 1
    },
    {
        label: "登录账号",
        prop: "account",
        disabled: true
        label: "女",
        value: 2
    },
    {
        label: "用户姓名",
        prop: "realName",
        rules: [{
            required: true,
            message: "请输入用户姓名",
            trigger: "blur"
        }, {
            min: 2,
            max: 5,
            message: '姓名长度在2到5个字符'
        }]
    },
    {
        label: "用户昵称",
        prop: "name"
    },
    {
        label: "手机号码",
        prop: "phone",
        overHidden: true,
        rules: [{
            required: true,
            message: "请输入手机号",
            trigger: "blur"
        }]
    },
    {
        label: "电子邮箱",
        prop: "email",
        hide: true,
        overHidden: true
    },
    {
        label: "身份证号",
        prop: "cardid",
        hide: true,
        overHidden: true,
        rules: [{
            required: true,
            message: "请输入身份证号",
            trigger: "blur"
        }]
    },
    {
        label: "籍贯",
        prop: "nativeplace",
        hide: true,
        overHidden: true
    },
    {
        label: "民族",
        prop: "nation",
        hide: true,
        overHidden: true
    },
    {
        label: "最高学历",
        prop: "education",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        slot: true,
        rules: [{
            required: true,
            message: "请选择学历",
            trigger: "blur"
        }]
    },
    {
        label: "政治面貌",
        prop: "politicaloutlook",
        hide: true,
        overHidden: true
    },
    {
        label: "身高",
        prop: "height",
        hide: true,
        overHidden: true
    },
    {
        label: "联系地址",
        prop: "address",
        hide: true,
        overHidden: true
    },
    {
        label: "户口所在地",
        prop: "registered",
        hide: true,
        overHidden: true
    },
    {
        label: "入职时间",
        prop: "rtime",
        type: 'date',
        format: "yyyy-MM-dd",
        valueFormat: "yyyy-MM-dd",
        hide: true,
        overHidden: true
    },
    {
        label: "用户性别",
        prop: "sex",
        type: "select",
        dicData: [{
                label: "男",
                value: 1
            },
            {
                label: "女",
                value: 2
            },
            {
                label: "未知",
                value: 3
            }
        ],
        hide: true
    },
    {
        label: "用户生日",
        type: "date",
        prop: "birthday",
        hide: true
        label: "未知",
        value: 3
    }
    ],
    hide: true
},
{
    label: "用户生日",
    type: "date",
    prop: "birthday",
    hide: true
}
]


@@ -443,153 +443,153 @@


export var securityFormPageColumn = [{
        label: "姓名",
        prop: "realName",
        search: true,
        searchSpan: 4,
        display: false
    label: "姓名",
    prop: "realName",
    search: true,
    searchSpan: 4,
    display: false
},
{
    label: "性别",
    prop: "sex",
    type: "select",
    dicData: [{
        label: "男",
        value: 1,
    },
    {
        label: "性别",
        prop: "sex",
        type: "select",
        dicData: [{
                label: "男",
                value: 1,
            },
            {
                label: "女",
                value: 2,
            },
            {
                label: "未知",
                value: 3,
            },
        ],
        display: false
        label: "女",
        value: 2,
    },
    {
        label: "未知",
        value: 3,
    },
    ],
    display: false
},

    {
        label: "籍贯",
        prop: "nativeplace",
        display: false
{
    label: "籍贯",
    prop: "nativeplace",
    display: false
},
{
    label: "民族",
    prop: "nation",
    display: false
},
{
    label: "出生日期",
    prop: "birthday",
    type: "date",
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    display: false
},
{
    label: "学历",
    prop: "education",
    display: false,
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "民族",
        prop: "nation",
        display: false
    type: "select",
    hide: true,
    rules: [{
        required: true,
        message: "请选择学历",
        trigger: "blur"
    }],
},
{
    label: "联系电话",
    prop: "phone",
    display: false
},
{
    label: "邮箱",
    prop: "email",
    display: false,
    width: 150
},
{
    label: "入职时间",
    prop: "rtime",
    display: false
},
{
    label: "保安公司名称",
    searchLabelWidth: "110",
    // prop: "deptName",
    prop: "deptId",
    type: "tree",
    dicUrl: "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
    props: {
        label: "title",
        value: "id",
    },
    {
        label: "出生日期",
        prop: "birthday",
        type: "date",
        format: "yyyy-MM-dd",
        valueFormat: "yyyy-MM-dd",
        display: false
    slot: true,
    searchSpan: 6,
    display: false,
    search: true,
    width: 260
},
{
    label: "是否持证",
    prop: "hold",
    slot: true,
    display: false,
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "学历",
        prop: "education",
        display: false,
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        type: "select",
        hide: true,
        rules: [{
            required: true,
            message: "请选择学历",
            trigger: "blur"
        }],
    type: "select",
    rules: [{
        required: true,
        message: "请选择",
        trigger: "blur"
    }],
},
// {
//     label: "入职时间",
//     prop: "rtime",
//     type: "datetime",
//     format: "yyyy-MM-dd",
//     valueFormat: "yyyy-MM-dd",
//     searchRange: true,
//     searchSpan: 6,
//     hide: true,
//     addDisplay: false,
//     editDisplay: false,
//     viewDisplay: false,
//     search: true,
//     rules: [{
//         required: true,
//         message: "请输入时间",
//         trigger: "blur"
//     }]
// },
{
    label: "在职状态",
    prop: "status",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workerState",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "联系电话",
        prop: "phone",
        display: false
    },
    {
        label: "邮箱",
        prop: "email",
        display: false,
        width: 150
    },
    {
        label: "入职时间",
        prop: "rtime",
        display: false
    },
    {
        label: "保安公司名称",
        searchLabelWidth: "110",
        // prop: "deptName",
        prop: "deptId",
        type: "tree",
        dicUrl: "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
        props: {
            label: "title",
            value: "id",
        },
        slot: true,
        searchSpan: 5,
        display: false,
        search: true,
        width: 260
    },
    {
        label: "是否持证",
        prop: "hold",
        slot: true,
        display: false,
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        type: "select",
        rules: [{
            required: true,
            message: "请选择",
            trigger: "blur"
        }],
    },
    // {
    //     label: "入职时间",
    //     prop: "rtime",
    //     type: "datetime",
    //     format: "yyyy-MM-dd",
    //     valueFormat: "yyyy-MM-dd",
    //     searchRange: true,
    //     searchSpan: 6,
    //     hide: true,
    //     addDisplay: false,
    //     editDisplay: false,
    //     viewDisplay: false,
    //     search: true,
    //     rules: [{
    //         required: true,
    //         message: "请输入时间",
    //         trigger: "blur"
    //     }]
    // },
    {
        label: "在职状态",
        prop: "status",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workerState",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        display: false,
        searchSpan: 3,
        search: true,
        rules: [{
            required: true,
            message: "请选择在职状态",
            trigger: "blur"
        }]
    },
    dataType: "number",
    display: false,
    searchSpan: 4,
    search: true,
    rules: [{
        required: true,
        message: "请选择在职状态",
        trigger: "blur"
    }]
},
]

 src/views/securityGuard/securityGuard.vue

@@ -1,5 +1,5 @@
<template>
  <el-row>
  <el-row class="securityGuard">
    <el-col :span="0" style="display: none">
      <div class="box">
        <el-scrollbar>
@@ -322,11 +322,12 @@
        searchMenuSpan: 6,
        border: false,
        stripe: true,
        align: "center",
        index: true,
        delBtnText: "注销",
        selection: true,
        viewBtn: true,
        defaultExpandAll:true,
        defaultExpandAll: true,
        //dialogType: 'drawer',
        dialogClickModal: false,
        column: securityFormPageColumn,

 src/views/securityUnit/data.js

@@ -21,6 +21,8 @@
        prop: "creditcode",
        width: 140,
        hide: true,

        labelWidth: 160,
        // hide: true,
        // editDisplay: false,
        // addDisplay: false
@@ -55,12 +57,15 @@
        label: "企业名称",
        prop: "enterprisename",
        search: true,
        searchSpan: 6,
        labelWidth: 160,
        // width: 130,
    },
    {
        label: "企业类型",
        prop: "stats",
        type: "tree",
        labelWidth: 160,
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=stats",
        props: {
            label: "dictValue",
@@ -77,10 +82,11 @@
    },
    {
        label: "法定代表人",
        labelWidth: 160,
        prop: "representative",
        width: 80,
        search: true,
        searchSpan: 5,
        searchSpan: 6,
        searchLabelWidth: 100
    },
    // {
@@ -106,6 +112,7 @@
    {
        label: "成立日期",
        prop: "establishtime",
        labelWidth: 160,
        width: 130,
        overHidden: true,
        type: "date",
@@ -131,6 +138,7 @@
    {
        label: "注册资本(万元人民币)",
        prop: "registeredcapital",
        labelWidth: 160,
        // search: true,
        width: 140,
        // overHidden: true
@@ -138,6 +146,7 @@
    {
        label: "实缴资本(万元人民币)",
        prop: "capital",
        labelWidth: 160,
        // width: 85,
        hide: true,
        // search: true,
@@ -146,6 +155,7 @@
    },
    {
        label: "组织机构代码",
        labelWidth: 160,
        prop: "organizationcode",
        // width: 110,
        // search: true,
@@ -154,6 +164,7 @@
    {
        label: "工商注册号",
        prop: "registrationnumber",
        labelWidth: 160,
        width: 120,
        // search: true,
        // searchSpan: 4,
@@ -161,6 +172,7 @@
    {
        label: "纳税人识别号",
        prop: "identificationnumber",
        labelWidth: 160,
        width: 140,
        // addDisplay: true,
        // editDisplay: true,
@@ -203,6 +215,7 @@
    {
        label: "注册地址",
        prop: "address",
        labelWidth: 160,
        // search: true,
        hide: true,
    },
@@ -210,6 +223,7 @@
        label: "经营范围",
        prop: "business",
        // search: true,
        labelWidth: 160,
        hide: true,
        // width: 110,
        overHidden: true
@@ -217,6 +231,7 @@
    {
        label: "所属地区",
        prop: "region",
        labelWidth: 160,
        // width: 110,
        // search: true,
        overHidden: true
@@ -225,6 +240,7 @@
        label: "登记机关",
        prop: "registration",
        // search: true,
        labelWidth: 160,
        // width: 88,
        overHidden: true,
        hide: true,
@@ -233,6 +249,7 @@
    {
        label: "所属行业",
        prop: "industry",
        labelWidth: 160,
        hide: true,
        // search: true,
        // width: 88,
@@ -280,7 +297,7 @@
    },
    {
        label: "辖区",
        prop: "departmentid",
        prop: "jurisdiction",
        // type: "tree",
        // disabled: true,
        type: "tree",

 src/views/securityUnit/index.vue

@@ -212,12 +212,13 @@
      query: {},
      data: [],
      option: {
        index: true,
        addBtn: false,
        // card: true,
        tip: false,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 623,
        height: 693,
        menuWidth: 160,
        align: "center",
        selection: true,
@@ -421,7 +422,7 @@
          }
        }
      }
      // console.log(d);
      console.log(d);
      for (var k in d) {
        if (d[k] == "" || d[k] == undefined) {
          console.log(k);

 src/views/system/client.vue

@@ -1,30 +1,34 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               :page.sync="page"
               @row-del="rowDel"
               v-model="form"
               ref="crud"
               :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 class="hasButOne">
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      @row-del="rowDel"
      v-model="form"
      ref="crud"
      :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 type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="permission.client_delete"
                   @click="handleDelete">删 除
        <el-button
          type="danger"
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.client_delete"
          @click="handleDelete"
          >删 除
        </el-button>
      </template>
    </avue-crud>
@@ -32,301 +36,333 @@
</template>

<script>
  import {getList, getDetail, add, update, remove} from "@/api/system/client";
  import {mapGetters} from "vuex";
import { getList, getDetail, add, update, remove } from "@/api/system/client";
import { mapGetters } from "vuex";

  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [
            {
              label: "应用id",
              prop: "clientId",
              search: true,
              rules: [{
export default {
  data() {
    return {
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "应用id",
            prop: "clientId",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入客户端id",
                trigger: "blur"
              }]
            },
            {
              label: "应用密钥",
              prop: "clientSecret",
              search: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "应用密钥",
            prop: "clientSecret",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入客户端密钥",
                trigger: "blur"
              }]
            },
            {
              label: "授权类型",
              prop: "authorizedGrantTypes",
              type: "checkbox",
              value: "refresh_token,password,authorization_code",
              dicData: [
                {
                  label: "refresh_token",
                  value: "refresh_token"
                },
                {
                  label: "password",
                  value: "password"
                },
                {
                  label: "authorization_code",
                  value: "authorization_code"
                },
                {
                  label: "captcha",
                  value: "captcha"
                },
                {
                  label: "social",
                  value: "social"
                }
              ],
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "授权类型",
            prop: "authorizedGrantTypes",
            type: "checkbox",
            value: "refresh_token,password,authorization_code",
            dicData: [
              {
                label: "refresh_token",
                value: "refresh_token",
              },
              {
                label: "password",
                value: "password",
              },
              {
                label: "authorization_code",
                value: "authorization_code",
              },
              {
                label: "captcha",
                value: "captcha",
              },
              {
                label: "social",
                value: "social",
              },
            ],
            rules: [
              {
                required: true,
                message: "请输入授权类型",
                trigger: "blur"
              }]
            },
            {
              label: "授权范围",
              prop: "scope",
              value: "all",
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "授权范围",
            prop: "scope",
            value: "all",
            rules: [
              {
                required: true,
                message: "请输入授权范围",
                trigger: "blur"
              }]
            },
            {
              label: "令牌秒数",
              prop: "accessTokenValidity",
              type: "number",
              value: 3600,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "令牌秒数",
            prop: "accessTokenValidity",
            type: "number",
            value: 3600,
            rules: [
              {
                required: true,
                message: "请输入令牌过期秒数",
                trigger: "blur"
              }]
            },
            {
              label: "刷新秒数",
              prop: "refreshTokenValidity",
              type: "number",
              value: 604800,
              hide: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "刷新秒数",
            prop: "refreshTokenValidity",
            type: "number",
            value: 604800,
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入刷新令牌过期秒数",
                trigger: "blur"
              }]
            },
            {
              label: "回调地址",
              prop: "webServerRedirectUri",
              hide: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "回调地址",
            prop: "webServerRedirectUri",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入回调地址",
                trigger: "blur"
              }]
            },
            {
              label: "资源集合",
              prop: "resourceIds",
              hide: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "资源集合",
            prop: "resourceIds",
            hide: true,
            rules: [
              {
                message: "请输入资源集合",
                trigger: "blur"
              }]
            },
            {
              label: "权限",
              prop: "authorities",
              hide: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "权限",
            prop: "authorities",
            hide: true,
            rules: [
              {
                message: "请输入权限",
                trigger: "blur"
              }]
            },
            {
              label: "自动授权",
              prop: "autoapprove",
              hide: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "自动授权",
            prop: "autoapprove",
            hide: true,
            rules: [
              {
                message: "请输入自动授权",
                trigger: "blur"
              }]
            },
            {
              label: "附加说明",
              hide: true,
              prop: "additionalInformation",
              span: 24,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "附加说明",
            hide: true,
            prop: "additionalInformation",
            span: 24,
            rules: [
              {
                message: "请输入附加说明",
                trigger: "blur"
              }]
            },
          ]
        },
        data: []
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.client_add),
        viewBtn: this.vaildData(this.permission.client_view),
        delBtn: this.vaildData(this.permission.client_delete),
        editBtn: this.vaildData(this.permission.client_edit),
      };
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.client_add),
          viewBtn: this.vaildData(this.permission.client_view),
          delBtn: this.vaildData(this.permission.client_delete),
          editBtn: this.vaildData(this.permission.client_edit)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    methods: {
      rowSave(row, done, loading) {
        add(row).then(() => {
  },
  methods: {
    rowSave(row, done, loading) {
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
        }
      );
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
        },
        (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: "操作成功!",
          });
        });
      },
      rowDel(row) {
        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.$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(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
        .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;
          });
        }
        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.$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>

<style>

 src/views/system/dept.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="hasButTwo">
    <avue-crud
      :option="option"
      :table-loading="loading"

 src/views/system/dict.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="hasButTwo">
    <avue-crud
      :option="optionParent"
      :table-loading="loading"
@@ -29,7 +29,7 @@
          v-if="permission.dict_delete"
          plain
          @click="handleDelete"
        >删 除
          >删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
@@ -39,20 +39,24 @@
          size="small"
          @click.stop="handleRowClick(scope.row)"
          v-if="userInfo.role_name.includes('admin')"
        >字典配置
          >字典配置
        </el-button>
      </template>
      <template slot-scope="{row}" slot="code">
        <el-tag @click="handleRowClick(row)" style="cursor:pointer">{{ row.code }}</el-tag>
      <template slot-scope="{ row }" slot="code">
        <el-tag @click="handleRowClick(row)" style="cursor: pointer">{{
          row.code
        }}</el-tag>
      </template>
      <template slot-scope="{row}" slot="isSealed">
        <el-tag>{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
      <template slot-scope="{ row }" slot="isSealed">
        <el-tag>{{ row.isSealed === 0 ? "否" : "是" }}</el-tag>
      </template>
    </avue-crud>
    <el-dialog :title="`[${dictValue}]字典配置`"
               append-to-body
               :visible.sync="box"
               width="1000px">
    <el-dialog
      :title="`[${dictValue}]字典配置`"
      append-to-body
      :visible.sync="box"
      width="1000px"
    >
      <avue-crud
        :option="optionChild"
        :table-loading="loadingChild"
@@ -81,7 +85,7 @@
            v-if="permission.dict_delete"
            plain
            @click="handleDelete"
          >删 除
            >删 除
          </el-button>
        </template>
        <template slot-scope="scope" slot="menu">
@@ -89,13 +93,13 @@
            type="text"
            icon="el-icon-circle-plus-outline"
            size="small"
            @click.stop="handleAdd(scope.row,scope.index)"
            @click.stop="handleAdd(scope.row, scope.index)"
            v-if="userInfo.role_name.includes('admin')"
          >新增子项
            >新增子项
          </el-button>
        </template>
        <template slot-scope="{row}" slot="isSealed">
          <el-tag>{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
        <template slot-scope="{ row }" slot="isSealed">
          <el-tag>{{ row.isSealed === 0 ? "否" : "是" }}</el-tag>
        </template>
      </avue-crud>
    </el-dialog>
@@ -110,15 +114,15 @@
  update,
  add,
  getDict,
  getDictTree
  getDictTree,
} from "@/api/system/dict";
import {optionParent, optionChild} from "@/option/system/dict";
import {mapGetters} from "vuex";
import { optionParent, optionChild } from "@/option/system/dict";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      dictValue: '暂无',
      dictValue: "暂无",
      parentId: -1,
      formParent: {},
      formChild: {},
@@ -131,13 +135,13 @@
        pageSize: 10,
        pageSizes: [10, 30, 50, 100, 200],
        currentPage: 1,
        total: 0
        total: 0,
      },
      pageChild: {
        pageSize: 10,
        pageSizes: [10, 30, 50, 100, 200],
        currentPage: 1,
        total: 0
        total: 0,
      },
      dataParent: [],
      dataChild: [],
@@ -157,18 +161,18 @@
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
    },
  },
  mounted() {
    this.initData();
  },
  methods: {
    initData() {
      getDictTree().then(res => {
      getDictTree().then((res) => {
        const column = this.findObject(this.optionChild.column, "parentId");
        column.dicData = res.data.data;
      });
@@ -187,37 +191,43 @@
        ...row,
        dictKey: -1,
      };
      add(form).then(() => {
        this.onLoadParent(this.pageParent);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        window.console.log(error);
        loading();
      });
      add(form).then(
        () => {
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(() => {
        this.onLoadParent(this.pageParent);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        this.onLoadChild(this.pageChild);
        done();
      }, error => {
        window.console.log(error);
        loading();
      });
      update(row).then(
        () => {
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.onLoadChild(this.pageChild);
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
@@ -226,7 +236,7 @@
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
        });
    },
@@ -268,7 +278,7 @@
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
@@ -277,14 +287,14 @@
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDict(this.formParent.id).then(res => {
        getDict(this.formParent.id).then((res) => {
          this.formParent = res.data.data;
        });
      }
@@ -300,36 +310,42 @@
      this.onLoadParent(this.pageParent, this.query);
    },
    rowSaveChild(row, done, loading) {
      add(row).then(() => {
        this.onLoadChild(this.pageChild);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        window.console.log(error);
        loading();
      });
      add(row).then(
        () => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowUpdateChild(row, index, done, loading) {
      update(row).then(() => {
        this.onLoadChild(this.pageChild);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        window.console.log(error);
        loading();
      });
      update(row).then(
        () => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowDelChild(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
@@ -338,7 +354,7 @@
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
        });
    },
@@ -367,7 +383,7 @@
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
@@ -376,7 +392,7 @@
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          this.$refs.crudChild.toggleSelection();
        });
@@ -386,7 +402,7 @@
        this.initData();
      }
      if (["edit", "view"].includes(type)) {
        getDict(this.formChild.id).then(res => {
        getDict(this.formChild.id).then((res) => {
          this.formChild = res.data.data;
        });
      }
@@ -394,7 +410,7 @@
    },
    beforeCloseChild(done) {
      this.$refs.crudChild.value.parentId = this.parentId;
      this.$refs.crudChild.option.column.filter(item => {
      this.$refs.crudChild.option.column.filter((item) => {
        if (item.prop === "parentId") {
          item.value = this.parentId;
        }
@@ -416,7 +432,7 @@
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then(res => {
      ).then((res) => {
        const data = res.data.data;
        this.pageParent.total = data.total;
        this.dataParent = data.records;
@@ -431,13 +447,13 @@
        page.pageSize,
        this.parentId,
        Object.assign(params, this.query)
      ).then(res => {
      ).then((res) => {
        this.dataChild = res.data.data;
        this.loadingChild = false;
        this.selectionClear();
      });
    }
  }
    },
  },
};
</script>


 src/views/system/dictbiz.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="hasButTwo">
    <avue-crud
      :option="optionParent"
      :table-loading="loading"
@@ -29,7 +29,7 @@
          v-if="permission.dictbiz_delete"
          plain
          @click="handleDelete"
        >删 除
          >删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
@@ -39,20 +39,24 @@
          size="small"
          @click.stop="handleRowClick(scope.row)"
          v-if="userInfo.role_name.includes('admin')"
        >字典配置
          >字典配置
        </el-button>
      </template>
      <template slot-scope="{row}" slot="code">
        <el-tag @click="handleRowClick(row)" style="cursor:pointer">{{ row.code }}</el-tag>
      <template slot-scope="{ row }" slot="code">
        <el-tag @click="handleRowClick(row)" style="cursor: pointer">{{
          row.code
        }}</el-tag>
      </template>
      <template slot-scope="{row}" slot="isSealed">
        <el-tag>{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
      <template slot-scope="{ row }" slot="isSealed">
        <el-tag>{{ row.isSealed === 0 ? "否" : "是" }}</el-tag>
      </template>
    </avue-crud>
    <el-dialog :title="`[${dictValue}]字典配置`"
               append-to-body
               :visible.sync="box"
               width="1000px">
    <el-dialog
      :title="`[${dictValue}]字典配置`"
      append-to-body
      :visible.sync="box"
      width="1000px"
    >
      <avue-crud
        :option="optionChild"
        :table-loading="loadingChild"
@@ -81,7 +85,7 @@
            v-if="permission.dict_delete"
            plain
            @click="handleDelete"
          >删 除
            >删 除
          </el-button>
        </template>
        <template slot-scope="scope" slot="menu">
@@ -89,13 +93,13 @@
            type="text"
            icon="el-icon-circle-plus-outline"
            size="small"
            @click.stop="handleAdd(scope.row,scope.index)"
            @click.stop="handleAdd(scope.row, scope.index)"
            v-if="userInfo.role_name.includes('admin')"
          >新增子项
            >新增子项
          </el-button>
        </template>
        <template slot-scope="{row}" slot="isSealed">
          <el-tag>{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
        <template slot-scope="{ row }" slot="isSealed">
          <el-tag>{{ row.isSealed === 0 ? "否" : "是" }}</el-tag>
        </template>
      </avue-crud>
    </el-dialog>
@@ -103,340 +107,352 @@
</template>

<script>
  import {
    getParentList,
    getChildList,
    remove,
    update,
    add,
    getDict,
    getDictTree
  } from "@/api/system/dictbiz";
  import {optionParent, optionChild} from "@/option/system/dictbiz";
  import {mapGetters} from "vuex";
import {
  getParentList,
  getChildList,
  remove,
  update,
  add,
  getDict,
  getDictTree,
} from "@/api/system/dictbiz";
import { optionParent, optionChild } from "@/option/system/dictbiz";
import { mapGetters } from "vuex";

  export default {
    data() {
export default {
  data() {
    return {
      dictValue: "暂无",
      parentId: -1,
      formParent: {},
      formChild: {},
      selectionList: [],
      query: {},
      box: false,
      loading: true,
      loadingChild: true,
      pageParent: {
        pageSize: 10,
        pageSizes: [10, 30, 50, 100, 200],
        currentPage: 1,
        total: 0,
      },
      pageChild: {
        pageSize: 10,
        pageSizes: [10, 30, 50, 100, 200],
        currentPage: 1,
        total: 0,
      },
      dataParent: [],
      dataChild: [],
      optionParent: optionParent,
      optionChild: optionChild,
    };
  },
  computed: {
    ...mapGetters(["userInfo", "permission"]),
    permissionList() {
      return {
        dictValue: '暂无',
        parentId: -1,
        formParent: {},
        formChild: {},
        selectionList: [],
        query: {},
        box: false,
        loading: true,
        loadingChild: true,
        pageParent: {
          pageSize: 10,
          pageSizes: [10, 30, 50, 100, 200],
          currentPage: 1,
          total: 0
        },
        pageChild: {
          pageSize: 10,
          pageSizes: [10, 30, 50, 100, 200],
          currentPage: 1,
          total: 0
        },
        dataParent: [],
        dataChild: [],
        optionParent: optionParent,
        optionChild: optionChild,
        addBtn: this.vaildData(this.permission.dictbiz_add, false),
        delBtn: this.vaildData(this.permission.dictbiz_delete, false),
        editBtn: this.vaildData(this.permission.dictbiz_edit, false),
        viewBtn: false,
      };
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.dictbiz_add, false),
          delBtn: this.vaildData(this.permission.dictbiz_delete, false),
          editBtn: this.vaildData(this.permission.dictbiz_edit, false),
          viewBtn: false,
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    mounted() {
      this.initData();
  },
  mounted() {
    this.initData();
  },
  methods: {
    initData() {
      getDictTree().then((res) => {
        const column = this.findObject(this.optionChild.column, "parentId");
        column.dicData = res.data.data;
      });
    },
    methods: {
      initData() {
        getDictTree().then(res => {
          const column = this.findObject(this.optionChild.column, "parentId");
          column.dicData = res.data.data;
        });
      },
      handleAdd(row) {
        this.formChild.dictValue = "";
        this.formChild.dictKey = "";
        this.formChild.sort = 0;
        this.formChild.isSealed = 0;
        this.formChild.remark = "";
        this.formChild.parentId = row.id;
        this.$refs.crudChild.rowAdd();
      },
      rowSave(row, done, loading) {
        const form = {
          ...row,
          dictKey: -1,
        };
        add(form).then(() => {
    handleAdd(row) {
      this.formChild.dictValue = "";
      this.formChild.dictKey = "";
      this.formChild.sort = 0;
      this.formChild.isSealed = 0;
      this.formChild.remark = "";
      this.formChild.parentId = row.id;
      this.$refs.crudChild.rowAdd();
    },
    rowSave(row, done, loading) {
      const form = {
        ...row,
        dictKey: -1,
      };
      add(form).then(
        () => {
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
        }
      );
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(
        () => {
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          this.onLoadChild(this.pageChild);
          done();
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoadParent(this.pageParent);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      handleRowClick(row) {
        this.query = {};
        this.parentId = row.id;
        this.dictValue = row.dictValue;

        const code = this.findObject(this.optionChild.column, "code");
        code.value = row.code;
        const parentId = this.findObject(this.optionChild.column, "parentId");
        parentId.value = row.id;

        this.box = true;
        this.onLoadChild(this.pageChild);
      },
      searchReset() {
        this.query = {};
        this.onLoadParent(this.pageParent);
      },
      searchChange(params, done) {
        this.query = params;
        this.pageParent.currentPage = 1;
        this.onLoadParent(this.pageParent, 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"
      );
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoadParent(this.pageParent);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDict(this.formParent.id).then(res => {
            this.formParent = res.data.data;
          });
        }
        done();
      },
      currentChange(currentPage) {
        this.pageParent.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.pageParent.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoadParent(this.pageParent, this.query);
      },
      rowSaveChild(row, done, loading) {
        add(row).then(() => {
          this.onLoadChild(this.pageChild);
        .then(() => {
          this.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
          window.console.log(error);
          loading();
        });
      },
      rowUpdateChild(row, index, done, loading) {
        update(row).then(() => {
          this.onLoadChild(this.pageChild);
    },
    handleRowClick(row) {
      this.query = {};
      this.parentId = row.id;
      this.dictValue = row.dictValue;

      const code = this.findObject(this.optionChild.column, "code");
      code.value = row.code;
      const parentId = this.findObject(this.optionChild.column, "parentId");
      parentId.value = row.id;

      this.box = true;
      this.onLoadChild(this.pageChild);
    },
    searchReset() {
      this.query = {};
      this.onLoadParent(this.pageParent);
    },
    searchChange(params, done) {
      this.query = params;
      this.pageParent.currentPage = 1;
      this.onLoadParent(this.pageParent, 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.onLoadParent(this.pageParent);
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          done();
        }, error => {
          window.console.log(error);
          loading();
          this.$refs.crud.toggleSelection();
        });
      },
      rowDelChild(row) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoadChild(this.pageChild);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      searchResetChild() {
        this.query = {};
        this.onLoadChild(this.pageChild);
      },
      searchChangeChild(params, done) {
        this.query = params;
        this.pageChild.currentPage = 1;
        this.onLoadChild(this.pageChild, params);
        done();
      },
      selectionChangeChild(list) {
        this.selectionList = list;
      },
      selectionClearChild() {
        this.selectionList = [];
        this.$refs.crudChild.toggleSelection();
      },
      handleDeleteChild() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoadChild(this.pageChild);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crudChild.toggleSelection();
          });
      },
      beforeOpenChild(done, type) {
        if (["add", "edit"].includes(type)) {
          this.initData();
        }
        if (["edit", "view"].includes(type)) {
          getDict(this.formChild.id).then(res => {
            this.formChild = res.data.data;
          });
        }
        done();
      },
      beforeCloseChild(done) {
        this.$refs.crudChild.value.parentId = this.parentId;
        this.$refs.crudChild.option.column.filter(item => {
          if (item.prop === "parentId") {
            item.value = this.parentId;
          }
        });
        done();
      },
      currentChangeChild(currentPage) {
        this.pageChild.currentPage = currentPage;
      },
      sizeChangeChild(pageSize) {
        this.pageChild.pageSize = pageSize;
      },
      refreshChangeChild() {
        this.onLoadChild(this.pageChild, this.query);
      },
      onLoadParent(page, params = {}) {
        this.loading = true;
        getParentList(
          page.currentPage,
          page.pageSize,
          Object.assign(params, this.query)
        ).then(res => {
          const data = res.data.data;
          this.pageParent.total = data.total;
          this.dataParent = data.records;
          this.loading = false;
          this.selectionClear();
        });
      },
      onLoadChild(page, params = {}) {
        this.loadingChild = true;
        getChildList(
          page.currentPage,
          page.pageSize,
          this.parentId,
          Object.assign(params, this.query)
        ).then(res => {
          this.dataChild = res.data.data;
          this.loadingChild = false;
          this.selectionClear();
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDict(this.formParent.id).then((res) => {
          this.formParent = res.data.data;
        });
      }
    }
  };
      done();
    },
    currentChange(currentPage) {
      this.pageParent.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.pageParent.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoadParent(this.pageParent, this.query);
    },
    rowSaveChild(row, done, loading) {
      add(row).then(
        () => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowUpdateChild(row, index, done, loading) {
      update(row).then(
        () => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowDelChild(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
        });
    },
    searchResetChild() {
      this.query = {};
      this.onLoadChild(this.pageChild);
    },
    searchChangeChild(params, done) {
      this.query = params;
      this.pageChild.currentPage = 1;
      this.onLoadChild(this.pageChild, params);
      done();
    },
    selectionChangeChild(list) {
      this.selectionList = list;
    },
    selectionClearChild() {
      this.selectionList = [];
      this.$refs.crudChild.toggleSelection();
    },
    handleDeleteChild() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoadChild(this.pageChild);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crudChild.toggleSelection();
        });
    },
    beforeOpenChild(done, type) {
      if (["add", "edit"].includes(type)) {
        this.initData();
      }
      if (["edit", "view"].includes(type)) {
        getDict(this.formChild.id).then((res) => {
          this.formChild = res.data.data;
        });
      }
      done();
    },
    beforeCloseChild(done) {
      this.$refs.crudChild.value.parentId = this.parentId;
      this.$refs.crudChild.option.column.filter((item) => {
        if (item.prop === "parentId") {
          item.value = this.parentId;
        }
      });
      done();
    },
    currentChangeChild(currentPage) {
      this.pageChild.currentPage = currentPage;
    },
    sizeChangeChild(pageSize) {
      this.pageChild.pageSize = pageSize;
    },
    refreshChangeChild() {
      this.onLoadChild(this.pageChild, this.query);
    },
    onLoadParent(page, params = {}) {
      this.loading = true;
      getParentList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.pageParent.total = data.total;
        this.dataParent = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    onLoadChild(page, params = {}) {
      this.loadingChild = true;
      getChildList(
        page.currentPage,
        page.pageSize,
        this.parentId,
        Object.assign(params, this.query)
      ).then((res) => {
        this.dataChild = res.data.data;
        this.loadingChild = false;
        this.selectionClear();
      });
    },
  },
};
</script>

 src/views/system/menu.vue

@@ -1,31 +1,35 @@
<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               v-model="form"
               :permission="permissionList"
               :before-open="beforeOpen"
               :before-close="beforeClose"
               @row-del="rowDel"
               @row-update="rowUpdate"
               @row-save="rowSave"
               @search-change="searchChange"
               @search-reset="searchReset"
               @selection-change="selectionChange"
               @current-change="currentChange"
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad"
               @tree-load="treeLoad">
  <basic-container class="hasButTwo">
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      ref="crud"
      v-model="form"
      :permission="permissionList"
      :before-open="beforeOpen"
      :before-close="beforeClose"
      @row-del="rowDel"
      @row-update="rowUpdate"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
      @tree-load="treeLoad"
    >
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   v-if="permission.menu_delete"
                   plain
                   @click="handleDelete">删 除
        <el-button
          type="danger"
          size="small"
          icon="el-icon-delete"
          v-if="permission.menu_delete"
          plain
          @click="handleDelete"
          >删 除
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
@@ -33,15 +37,16 @@
          type="text"
          icon="el-icon-circle-plus-outline"
          size="small"
          @click.stop="handleAdd(scope.row,scope.index)"
          v-if="userInfo.role_name.includes('admin') && scope.row.category === 1"
        >新增子项
          @click.stop="handleAdd(scope.row, scope.index)"
          v-if="
            userInfo.role_name.includes('admin') && scope.row.category === 1
          "
          >新增子项
        </el-button>
      </template>
      <template slot-scope="{row}"
                slot="source">
        <div style="text-align:center">
          <i :class="row.source"/>
      <template slot-scope="{ row }" slot="source">
        <div style="text-align: center">
          <i :class="row.source" />
        </div>
      </template>
    </avue-crud>
@@ -49,374 +54,382 @@
</template>

<script>
  import {getLazyList, remove, update, add, getMenu} from "@/api/system/menu";
  import {mapGetters} from "vuex";
  import iconList from "@/config/iconList";
  import func from "@/util/func";
  import {getMenuTree} from "@/api/system/menu";
import { getLazyList, remove, update, add, getMenu } from "@/api/system/menu";
import { mapGetters } from "vuex";
import iconList from "@/config/iconList";
import func from "@/util/func";
import { getMenuTree } from "@/api/system/menu";

  export default {
    data() {
      return {
        form: {},
        query: {},
        loading: true,
        selectionList: [],
        parentId: 0,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
        },
        option: {
          lazy: true,
          tip: false,
          simplePage: true,
          searchShow: true,
          searchMenuSpan: 6,
          dialogWidth: "60%",
          tree: true,
          border: true,
          index: true,
          selection: true,
          viewBtn: true,
          menuWidth: 300,
          dialogClickModal: false,
          column: [
            {
              label: "菜单名称",
              prop: "name",
              search: true,
              rules: [
                {
                  required: true,
                  message: "请输入菜单名称",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "路由地址",
              prop: "path",
              rules: [
                {
                  required: true,
                  message: "请输入路由地址",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "上级菜单",
              prop: "parentId",
              type: "tree",
              dicData: [],
              hide: true,
              addDisabled: false,
              props: {
                label: "title"
export default {
  data() {
    return {
      form: {},
      query: {},
      loading: true,
      selectionList: [],
      parentId: 0,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      option: {
        lazy: true,
        tip: false,
        simplePage: true,
        searchShow: true,
        searchMenuSpan: 6,
        dialogWidth: "60%",
        tree: true,
        border: true,
        index: true,
        selection: true,
        viewBtn: true,
        menuWidth: 300,
        dialogClickModal: false,
        column: [
          {
            label: "菜单名称",
            prop: "name",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入菜单名称",
                trigger: "blur",
              },
              rules: [
                {
                  required: false,
                  message: "请选择上级菜单",
                  trigger: "click"
                }
              ]
            ],
          },
          {
            label: "路由地址",
            prop: "path",
            rules: [
              {
                required: true,
                message: "请输入路由地址",
                trigger: "blur",
              },
            ],
          },
          {
            label: "上级菜单",
            prop: "parentId",
            type: "tree",
            dicData: [],
            hide: true,
            addDisabled: false,
            props: {
              label: "title",
            },
            {
              label: "菜单图标",
              prop: "source",
              type: "icon",
              slot: true,
              iconList: iconList,
              rules: [
                {
                  required: true,
                  message: "请输入菜单图标",
                  trigger: "click"
                }
              ]
            },
            {
              label: "菜单编号",
              prop: "code",
              search: true,
              rules: [
                {
                  required: true,
                  message: "请输入菜单编号",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "菜单类型",
              prop: "category",
              type: "radio",
              dicData: [
                {
                  label: "菜单",
                  value: 1
                },
                {
                  label: "按钮",
                  value: 2
                }
              ],
              hide: true,
              rules: [
                {
                  required: true,
                  message: "请选择菜单类型",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "菜单别名",
              prop: "alias",
              search: true,
              rules: [
                {
                  required: true,
                  message: "请输入菜单别名",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "新窗口",
              prop: "isOpen",
              type: "radio",
              disabled: false,
              dicData: [
                {
                  label: "否",
                  value: 1
                },
                {
                  label: "是",
                  value: 2
                }
              ],
              value: 1,
              rules: [
                {
                  required: true,
                  message: "请选择新窗口打开",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "菜单排序",
              prop: "sort",
              type: "number",
              row: true,
              span: 24,
              rules: [
                {
                  required: true,
                  message: "请输入菜单排序",
                  trigger: "blur"
                }
              ]
            },
            {
              label: "菜单备注",
              prop: "remark",
              type: "textarea",
              span: 24,
              minRows: 2,
              hide: true
            }
          ]
        },
        data: []
            rules: [
              {
                required: false,
                message: "请选择上级菜单",
                trigger: "click",
              },
            ],
          },
          {
            label: "菜单图标",
            prop: "source",
            type: "icon",
            slot: true,
            iconList: iconList,
            rules: [
              {
                required: true,
                message: "请输入菜单图标",
                trigger: "click",
              },
            ],
          },
          {
            label: "菜单编号",
            prop: "code",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入菜单编号",
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单类型",
            prop: "category",
            type: "radio",
            dicData: [
              {
                label: "菜单",
                value: 1,
              },
              {
                label: "按钮",
                value: 2,
              },
            ],
            hide: true,
            rules: [
              {
                required: true,
                message: "请选择菜单类型",
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单别名",
            prop: "alias",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入菜单别名",
                trigger: "blur",
              },
            ],
          },
          {
            label: "新窗口",
            prop: "isOpen",
            type: "radio",
            disabled: false,
            dicData: [
              {
                label: "否",
                value: 1,
              },
              {
                label: "是",
                value: 2,
              },
            ],
            value: 1,
            rules: [
              {
                required: true,
                message: "请选择新窗口打开",
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单排序",
            prop: "sort",
            type: "number",
            row: true,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入菜单排序",
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单备注",
            prop: "remark",
            type: "textarea",
            span: 24,
            minRows: 2,
            hide: true,
          },
        ],
      },
      data: [],
    };
  },
  watch: {
    "form.category"() {
      const category = func.toInt(this.form.category);
      this.$refs.crud.option.column.filter((item) => {
        if (item.prop === "path") {
          item.rules[0].required = category === 1;
        }
        if (item.prop === "isOpen") {
          item.disabled = category === 2;
        }
      });
    },
  },
  computed: {
    ...mapGetters(["userInfo", "permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.menu_add, false),
        viewBtn: this.vaildData(this.permission.menu_view, false),
        delBtn: this.vaildData(this.permission.menu_delete, false),
        editBtn: this.vaildData(this.permission.menu_edit, false),
      };
    },
    watch: {
      'form.category'() {
        const category = func.toInt(this.form.category);
        this.$refs.crud.option.column.filter(item => {
          if (item.prop === "path") {
            item.rules[0].required = category === 1;
          }
          if (item.prop === 'isOpen') {
            item.disabled = category === 2;
          }
        });
      },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    computed: {
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.menu_add, false),
          viewBtn: this.vaildData(this.permission.menu_view, false),
          delBtn: this.vaildData(this.permission.menu_delete, false),
          editBtn: this.vaildData(this.permission.menu_edit, false)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      }
    },
    methods: {
      initData() {
        getMenuTree().then(res => {
          const column = this.findObject(this.option.column, "parentId");
          column.dicData = res.data.data;
        });
      },
      handleAdd(row) {
        this.parentId = row.id;
  },
  methods: {
    initData() {
      getMenuTree().then((res) => {
        const column = this.findObject(this.option.column, "parentId");
        column.value = row.id;
        column.addDisabled = true;
        this.$refs.crud.rowAdd();
      },
      rowSave(row, done, loading) {
        add(row).then((res) => {
        column.dicData = res.data.data;
      });
    },
    handleAdd(row) {
      this.parentId = row.id;
      const column = this.findObject(this.option.column, "parentId");
      column.value = row.id;
      column.addDisabled = true;
      this.$refs.crud.rowAdd();
    },
    rowSave(row, done, loading) {
      add(row).then(
        (res) => {
          // 获取新增数据的相关字段
          const data = res.data.data;
          row.id = data.id;
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          // 数据回调进行刷新
          done(row);
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        });
      },
      rowUpdate(row, index, done, loading) {
        update(row).then(() => {
        }
      );
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(
        () => {
          this.$message({
            type: "success",
            message: "操作成功!"
            message: "操作成功!",
          });
          // 数据回调进行刷新
          done(row);
        }, error => {
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowDel(row, index, done) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          // 数据回调进行刷新
          done(row);
        });
      },
      rowDel(row, index, done) {
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            // 数据回调进行刷新
            done(row);
        .then(() => {
          // 刷新表格数据并重载
          this.data = [];
          this.parentId = 0;
          this.$refs.crud.refreshTable();
          this.$refs.crud.toggleSelection();
          // 表格数据重载
          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.data = [];
            this.parentId = 0;
            this.$refs.crud.refreshTable();
            this.$refs.crud.toggleSelection();
            // 表格数据重载
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      searchReset() {
        this.query = {};
        this.parentId = 0;
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.parentId = '';
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      beforeOpen(done, type) {
        if (["add", "edit"].includes(type)) {
          this.initData();
        }
        if (["edit", "view"].includes(type)) {
          getMenu(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      beforeClose(done) {
        this.parentId = "";
        const column = this.findObject(this.option.column, "parentId");
        column.value = "";
        column.addDisabled = false;
        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;
        getLazyList(this.parentId, Object.assign(params, this.query)).then(res => {
        });
    },
    searchReset() {
      this.query = {};
      this.parentId = 0;
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.parentId = "";
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    beforeOpen(done, type) {
      if (["add", "edit"].includes(type)) {
        this.initData();
      }
      if (["edit", "view"].includes(type)) {
        getMenu(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    beforeClose(done) {
      this.parentId = "";
      const column = this.findObject(this.option.column, "parentId");
      column.value = "";
      column.addDisabled = false;
      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;
      getLazyList(this.parentId, Object.assign(params, this.query)).then(
        (res) => {
          this.data = res.data.data;
          this.loading = false;
          this.selectionClear();
        });
      },
      treeLoad(tree, treeNode, resolve) {
        const parentId = tree.id;
        getLazyList(parentId).then(res => {
          resolve(res.data.data);
        });
      }
    }
  };
        }
      );
    },
    treeLoad(tree, treeNode, resolve) {
      const parentId = tree.id;
      getLazyList(parentId).then((res) => {
        resolve(res.data.data);
      });
    },
  },
};
</script>

<style>

 src/views/system/topmenu.vue

@@ -1,332 +1,371 @@
<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">
  <basic-container class="topmenu">
    <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.topmenu_delete"
                   @click="handleDelete">删 除
        <el-button
          type="danger"
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.topmenu_delete"
          @click="handleDelete"
          >删 除
        </el-button>
        <el-button size="small"
                   icon="el-icon-delete"
                   @click="handleMenuSetting"
                   v-if="permission.topmenu_setting"
                   plain>菜单配置
        <el-button
          size="small"
          icon="el-icon-delete"
          @click="handleMenuSetting"
          v-if="permission.topmenu_setting"
          plain
          >菜单配置
        </el-button>
      </template>
      <template slot-scope="{row}" slot="source">
        <div style="text-align:center">
      <template slot-scope="{ row }" slot="source">
        <div style="text-align: center">
          <i :class="row.source"></i>
        </div>
      </template>
      <template slot="sort" slot-scope="{row}" >
        <el-input-number v-model="row.sort" @change="sortChange(row)" :min="1" :max="100"></el-input-number>
      <template slot="sort" slot-scope="{ row }">
        <el-input-number
          v-model="row.sort"
          @change="sortChange(row)"
          :min="1"
          :max="100"
        ></el-input-number>
      </template>
    </avue-crud>
    <el-dialog title="下级菜单配置"
               append-to-body
               :visible.sync="box"
               width="345px">

      <el-tree :data="menuGrantList"
               show-checkbox
               node-key="id"
               ref="treeMenu"
               :default-checked-keys="menuTreeObj"
               :props="props">
    <el-dialog
      title="下级菜单配置"
      append-to-body
      :visible.sync="box"
      width="345px"
    >
      <el-tree
        :data="menuGrantList"
        show-checkbox
        node-key="id"
        ref="treeMenu"
        :default-checked-keys="menuTreeObj"
        :props="props"
      >
      </el-tree>

      <span slot="footer"
            class="dialog-footer">
      <span slot="footer" class="dialog-footer">
        <el-button @click="box = false">取 消</el-button>
        <el-button type="primary"
                   @click="submit">确 定</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </el-dialog>
  </basic-container>
</template>

<script>
  import {getList, getDetail, add, update, remove, grant, grantTree, getTopTree} from "@/api/system/topmenu";
  import {mapGetters} from "vuex";
  import iconList from "@/config/iconList";
import {
  getList,
  getDetail,
  add,
  update,
  remove,
  grant,
  grantTree,
  getTopTree,
} from "@/api/system/topmenu";
import { mapGetters } from "vuex";
import iconList from "@/config/iconList";

  export default {
    data() {
      return {
        form: {},
        box: false,
        query: {},
        loading: true,
        props: {
          label: "title",
          value: "key"
        },
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        selectionList: [],
        menuGrantList: [],
        menuTreeObj: [],
        option: {
          height: 'auto',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
          dialogWidth: 900,
          dialogClickModal: false,
          column: [
            {
              label: "菜单名",
              prop: "name",
              search: true,
              rules: [{
export default {
  data() {
    return {
      form: {},
      box: false,
      query: {},
      loading: true,
      props: {
        label: "title",
        value: "key",
      },
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      menuGrantList: [],
      menuTreeObj: [],
      option: {
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        viewBtn: true,
        selection: true,
        dialogWidth: 900,
        dialogClickModal: false,
        column: [
          {
            label: "菜单名",
            prop: "name",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入菜单名",
                trigger: "blur"
              }]
            },
            {
              label: "菜单图标",
              prop: "source",
              type: "icon",
              slot: true,
              iconList: iconList,
              rules: [
                {
                  required: true,
                  message: "请输入菜单图标",
                  trigger: "click"
                }
              ]
            },
            {
              label: "菜单编号",
              prop: "code",
              search: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单图标",
            prop: "source",
            type: "icon",
            slot: true,
            iconList: iconList,
            rules: [
              {
                required: true,
                message: "请输入菜单图标",
                trigger: "click",
              },
            ],
          },
          {
            label: "菜单编号",
            prop: "code",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入菜单编号",
                trigger: "blur"
              }]
            },
            {
              label: "菜单排序",
              prop: "sort",
              type: "number",
              slot: true,
              rules: [{
                trigger: "blur",
              },
            ],
          },
          {
            label: "菜单排序",
            prop: "sort",
            type: "number",
            slot: true,
            rules: [
              {
                required: true,
                message: "请输入菜单排序",
                trigger: "blur"
              }]
            },
          ]
        },
        data: []
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.topmenu_add, false),
        viewBtn: this.vaildData(this.permission.topmenu_view, false),
        delBtn: this.vaildData(this.permission.topmenu_delete, false),
        editBtn: this.vaildData(this.permission.topmenu_edit, false),
      };
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(this.permission.topmenu_add, false),
          viewBtn: this.vaildData(this.permission.topmenu_view, false),
          delBtn: this.vaildData(this.permission.topmenu_delete, false),
          editBtn: this.vaildData(this.permission.topmenu_edit, false)
        };
      },
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids.join(",");
      },
      idsArray() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
        return ids;
      }
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    methods: {
      submit() {
        const menuList = this.$refs.treeMenu.getCheckedKeys();
        grant(this.idsArray, menuList).then(() => {
          this.box = false;
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.onLoad(this.page);
    idsArray() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids;
    },
  },
  methods: {
    submit() {
      const menuList = this.$refs.treeMenu.getCheckedKeys();
      grant(this.idsArray, menuList).then(() => {
        this.box = false;
        this.$message({
          type: "success",
          message: "操作成功!",
        });
      },
      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: "操作成功!"
            });
          });
      },
      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();
          });
      },
      handleMenuSetting() {
        if (this.selectionList.length !== 1) {
          this.$message.warning("只能选择一条数据");
          return;
        }
        this.menuTreeObj = [];
        grantTree()
          .then(res => {
            this.menuGrantList = res.data.data.menu;
            getTopTree(this.ids).then(res => {
              this.menuTreeObj = res.data.data.menu;
              this.box = true;
            });
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      sortChange(row) {
        update(row).then(() => {
          this.onLoad(this.page);
        }, error => {
          window.console.log(error);
        });
      },
      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();
      });
    },
    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: "操作成功!",
          });
        });
    },
    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();
        });
    },
    handleMenuSetting() {
      if (this.selectionList.length !== 1) {
        this.$message.warning("只能选择一条数据");
        return;
      }
      this.menuTreeObj = [];
      grantTree().then((res) => {
        this.menuGrantList = res.data.data.menu;
        getTopTree(this.ids).then((res) => {
          this.menuTreeObj = res.data.data.menu;
          this.box = true;
        });
      });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
    }
  };
      done();
    },
    sortChange(row) {
      update(row).then(
        () => {
          this.onLoad(this.page);
        },
        (error) => {
          window.console.log(error);
        }
      );
    },
    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>
  .none-border {
    border: 0;
    background-color: transparent !important;
  }
.none-border {
  border: 0;
  background-color: transparent !important;
}
</style>

 src/views/trainingRegistration/index.vue

@@ -64,12 +64,13 @@
        tip: false,
        searchSize: "mini",
        searchMenuSpan: 6,
        height: 627,
        height: 693,
        index: true,
        menuWidth: 290,
        align: "center",
        selection: true,
        column: column,
        delBtn: false
        delBtn: false,
      },
    };
  },

 src/views/workreport/data.js

@@ -1,230 +1,230 @@
//已发送列表信息
export var workreportColumn = [{
        label: "汇报时间",
        prop: "reportTime",
        type: "datetime",
        format: "yyyy-MM-dd HH:mm:ss",
        valueFormat: "yyyy-MM-dd HH:mm:ss",
        searchRange: true,
        searchSpan: 6,
        hide: false,
        addDisplay: false,
        editDisplay: false,
        // viewDisplay: false,
        search: false,
        rules: [{
            required: true,
            message: "请输入时间",
            trigger: "blur"
        }]
    }, {
        label: "汇报类别",
        prop: "category",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        searchSpan: 4,
        search: true,
        rules: [{
            required: true,
            message: "请选择汇报类别",
            trigger: "blur"
        }]
    }, {
        label: "汇报类型",
        prop: "type",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        searchSpan: 4,
        search: true,
        rules: [{
            required: true,
            message: "请选择汇报类型",
            trigger: "blur"
        }]
    label: "汇报时间",
    prop: "reportTime",
    type: "datetime",
    format: "yyyy-MM-dd HH:mm:ss",
    valueFormat: "yyyy-MM-dd HH:mm:ss",
    searchRange: true,
    searchSpan: 6,
    hide: false,
    addDisplay: false,
    editDisplay: false,
    // viewDisplay: false,
    search: false,
    rules: [{
        required: true,
        message: "请输入时间",
        trigger: "blur"
    }]
}, {
    label: "汇报类别",
    prop: "category",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "汇报人身份证号",
        prop: "idCardNo",
        hide: true,
        addDisplay: false,
        editDisplay: false,
        viewDisplay: false,
    dataType: "number",
    searchSpan: 5,
    search: true,
    rules: [{
        required: true,
        message: "请选择汇报类别",
        trigger: "blur"
    }]
}, {
    label: "汇报类型",
    prop: "type",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportType",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "汇报内容",
        prop: "content",
        type: "textarea",
        span: 24,
        rules: [{
            required: true,
            message: "请输入汇报内容",
            trigger: "blur"
        }]
    dataType: "number",
    searchSpan: 5,
    search: true,
    rules: [{
        required: true,
        message: "请选择汇报类型",
        trigger: "blur"
    }]
},
{
    label: "汇报人身份证号",
    prop: "idCardNo",
    hide: true,
    addDisplay: false,
    editDisplay: false,
    viewDisplay: false,
},
{
    label: "汇报内容",
    prop: "content",
    type: "textarea",
    span: 24,
    rules: [{
        required: true,
        message: "请输入汇报内容",
        trigger: "blur"
    }]
},
{
    label: "接收人",
    prop: "receivedIds",
    span: 24,
    type: "tree",
    dicUrl: "/api/blade-system/dept/lazy-tree-user",
    hide: true,
    props: {
        label: "title",
        value: "id",
    },
    {
        label: "接收人",
        prop: "receivedIds",
        span: 24,
        type: "tree",
        dicUrl: "/api/blade-system/dept/lazy-tree-user",
        hide: true,
        props: {
            label: "title",
            value: "id",
        },
        multiple: true,
        // dataType: "number",
        rules: [{
            required: true,
            message: "请选择接收人",
            trigger: "blur"
        }]
    },
    {
        label: "接收人",
        prop: "replyRealName",
        addDisplay: false,
        editDisplay: false,
        viewDisplay: false,
    },
    {
        label: "接收人单位",
        prop: "replyDeptName",
        addDisplay: false,
        editDisplay: false,
        // viewDisplay: false,
    },
    {
        label: "回复内容",
        prop: "replyContent",
        type: "textarea",
        span: 24,
        addDisplay: false,
        editDisplay: false,
        rules: [{
            required: true,
            message: "请输入回复内容",
            trigger: "blur"
        }]
    }
    multiple: true,
    // dataType: "number",
    rules: [{
        required: true,
        message: "请选择接收人",
        trigger: "blur"
    }]
},
{
    label: "接收人",
    prop: "replyRealName",
    addDisplay: false,
    editDisplay: false,
    viewDisplay: false,
},
{
    label: "接收人单位",
    prop: "replyDeptName",
    addDisplay: false,
    editDisplay: false,
    // viewDisplay: false,
},
{
    label: "回复内容",
    prop: "replyContent",
    type: "textarea",
    span: 24,
    addDisplay: false,
    editDisplay: false,
    rules: [{
        required: true,
        message: "请输入回复内容",
        trigger: "blur"
    }]
}
]


//接收人列信息
export var workreplyColumn = [{
        label: "汇报人",
        prop: "realName",
        disabled: true,
        span: 24,
        rules: [{
            required: true,
            message: "请选择接收人",
            trigger: "blur"
        }]
    label: "汇报人",
    prop: "realName",
    disabled: true,
    span: 24,
    rules: [{
        required: true,
        message: "请选择接收人",
        trigger: "blur"
    }]
},
{
    label: "汇报人单位",
    prop: "deptName",
    addDisplay: false,
    editDisplay: false,
    // viewDisplay: false,
}, {
    label: "汇报时间",
    prop: "reportTime",
    type: "datetime",
    format: "yyyy-MM-dd HH:mm:ss",
    valueFormat: "yyyy-MM-dd HH:mm:ss",
    searchRange: true,
    searchSpan: 6,
    hide: false,
    addDisplay: false,
    editDisplay: false,
    // viewDisplay: false,
    search: false,
    rules: [{
        required: true,
        message: "请输入时间",
        trigger: "blur"
    }]
}, {
    label: "汇报类别",
    prop: "category",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    {
        label: "汇报人单位",
        prop: "deptName",
        addDisplay: false,
        editDisplay: false,
        // viewDisplay: false,
    }, {
        label: "汇报时间",
        prop: "reportTime",
        type: "datetime",
        format: "yyyy-MM-dd HH:mm:ss",
        valueFormat: "yyyy-MM-dd HH:mm:ss",
        searchRange: true,
        searchSpan: 6,
        hide: false,
        addDisplay: false,
        editDisplay: false,
        // viewDisplay: false,
        search: false,
        rules: [{
            required: true,
            message: "请输入时间",
            trigger: "blur"
        }]
    }, {
        label: "汇报类别",
        prop: "category",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        searchSpan: 4,
        search: true,
        hide: true,
        editDisplay: false,
        rules: [{
            required: true,
            message: "请选择汇报类别",
            trigger: "blur"
        }]
    }, {
        label: "汇报类型",
        prop: "type",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        searchSpan: 4,
        search: true,
        disabled: true,
        rules: [{
            required: true,
            message: "请选择汇报类型",
            trigger: "blur"
        }]
    dataType: "number",
    searchSpan: 4,
    search: true,
    hide: true,
    editDisplay: false,
    rules: [{
        required: true,
        message: "请选择汇报类别",
        trigger: "blur"
    }]
}, {
    label: "汇报类型",
    prop: "type",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportType",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    // {
    //     label: "汇报人身份证号",
    //     prop: "idCardNo",
    //     hide: true,
    //     addDisplay: false,
    //     editDisplay: false,
    //     viewDisplay: false,
    // },
    {
        label: "汇报内容",
        prop: "content",
        type: "textarea",
        // editDisplay: false,
        disabled: true,
        span: 24,
        rules: [{
            required: true,
            message: "请输入汇报内容",
            trigger: "blur"
        }]
    },
    {
        label: "回复内容",
        prop: "replyContent",
        type: "textarea",
        span: 24,
        rules: [{
            required: true,
            message: "请输入回复内容",
            trigger: "blur"
        }]
    }
    dataType: "number",
    searchSpan: 4,
    search: true,
    disabled: true,
    rules: [{
        required: true,
        message: "请选择汇报类型",
        trigger: "blur"
    }]
},
// {
//     label: "汇报人身份证号",
//     prop: "idCardNo",
//     hide: true,
//     addDisplay: false,
//     editDisplay: false,
//     viewDisplay: false,
// },
{
    label: "汇报内容",
    prop: "content",
    type: "textarea",
    // editDisplay: false,
    disabled: true,
    span: 24,
    rules: [{
        required: true,
        message: "请输入汇报内容",
        trigger: "blur"
    }]
},
{
    label: "回复内容",
    prop: "replyContent",
    type: "textarea",
    span: 24,
    rules: [{
        required: true,
        message: "请输入回复内容",
        trigger: "blur"
    }]
}

]

 src/views/workreport/workreport.vue

@@ -1,5 +1,5 @@
<template>
  <basic-container>
  <basic-container class="workreply">
    <avue-crud
      :option="option"
      :table-loading="loading"
@@ -271,4 +271,8 @@
</script>

<style>
.workreply .el-card.is-never-shadow.avue-crud__search {
  width: calc(100% - 380px) !important;
  left: 200px !important;
}
</style>

 vue.config.js

@@ -29,6 +29,7 @@
        //本地服务接口地址
        // target: 'http://localhost',
        target: 'http://192.168.0.114:81',//钟W
        // target: 'http://192.168.0.109:81',//tangW
        // target: 'http://192.168.0.104:80',//唐N
        //远程演示服务地址,可用于直接启动项目
        // target: 'https://saber.bladex.vip/api',