yh-pub 1.0.0

package/layout/main/system/orgManage.vue

@@ -0,0 +1,473 @@
+<template>
+  <div class="search">
+    <el-row class="operation">
+      <div>
+        <el-button @click="addNew">
+          <i class="iconfont icon-plus"></i>
+          新增
+        </el-button>
+        <el-popconfirm
+          title="您确认要删除所选的数据吗？"
+          ok-text="删除"
+          cancel-text="再考虑下"
+          @confirm="delAll"
+          style="margin-left: 12px">
+          <template #reference>
+            <el-button>
+              <i class="iconfont icon-delete"></i>
+              删除
+            </el-button>
+          </template>
+        </el-popconfirm>
+        <el-button @click="getAllList">
+          <i class="iconfont icon-refresh"></i>
+          刷新
+        </el-button>
+      </div>
+    </el-row>
+    <el-row
+      type="flex"
+      justify="start"
+      :gutter="16"
+      v-show="showType === 'tree'">
+      <el-col
+        :sm="8"
+        :md="8"
+        :lg="8"
+        :xl="6">
+        <el-alert
+          show-icon
+          :title="`当前选择编辑： ${editTitle} `"
+          :closable="false"
+          style="margin-bottom: 10px"></el-alert>
+        <el-input
+          v-model="searchKey"
+          @search="search"
+          placeholder="输入机构名搜索"
+          clearable
+          enter-button>
+          <template #prepend>
+            <i class="iconfont icon-search"></i>
+          </template>
+        </el-input>
+        <div v-loading="loading">
+          <div
+            class="tree-bar"
+            :style="{ maxHeight: maxHeight }">
+            <el-tree
+              ref="tree"
+              show-checkbox
+              :data="data"
+              :props="treeProp"
+              node-key="key"
+              default-expand-all
+              :current-node-key="treeSelectedKeys"
+              @current-change="selectTree"
+              @check-change="changeSelect"></el-tree>
+          </div>
+        </div>
+      </el-col>
+      <el-col
+        :sm="16"
+        :md="16"
+        :lg="16"
+        :xl="9">
+        <el-form
+          ref="form"
+          :model="form"
+          :rules="formValidate"
+          label-width="90px">
+          <el-form-item
+            label="机构编码"
+            prop="value">
+            <el-input
+              v-model="form.value"
+              ref="orgCodeRef" />
+          </el-form-item>
+          <el-form-item
+            label="机构名称"
+            prop="name">
+            <el-input v-model="form.name" />
+          </el-form-item>
+          <el-form-item
+            label="机构类型"
+            prop="adOrgtypeId">
+            <dict
+              dict="adOrgtypeId"
+              url="/orgController/getOrgType"
+              v-model="form.adOrgtypeId"
+              placeholder="请选择或输入搜索"
+              filterable
+              clearable />
+          </el-form-item>
+          <el-form-item
+            label="上级机构"
+            prop="parentId"
+            v-if="pOrgRefreshFlag">
+            <dict
+              dict="parentId"
+              url="/orgController/getGroupOrgs"
+              v-model="form.parentId"
+              placeholder="请选择或输入搜索"
+              filterable
+              clearable />
+          </el-form-item>
+          <el-form-item
+            label="备注"
+            prop="description">
+            <el-input
+              v-model="form.description"
+              type="textarea" />
+          </el-form-item>
+          <el-form-item label="是否有效">
+            <el-switch
+              v-model="form.isactive"
+              checked-children="Y"
+              un-checked-children="N"
+              default-checked />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              style="margin-right: 5px"
+              @click="submitEdit"
+              :loading="submitLoading"
+              :disabled="form.adOrgId != ''"
+              type="primary">
+              <i class="iconfont icon-plus"></i>
+              保存新增
+            </el-button>
+            <el-button
+              style="margin-right: 5px"
+              @click="submitEdit"
+              :loading="submitLoading"
+              :disabled="form.adOrgId === ''"
+              type="primary">
+              <i class="iconfont icon-save"></i>
+              保存修改
+            </el-button>
+            <el-button @click="handleReset">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import dict from "yh-pub/layout/main/system/dict.vue";
+export default {
+  name: "menu-manage",
+  components: {
+    dict,
+  },
+  data() {
+    return {
+      showType: "tree",
+      loading: true,
+      strict: false,
+      maxHeight: "500px",
+      expandLevel: 4,
+      pOrgRefreshFlag: true,
+      menuModalVisible: false,
+      iconModalVisible: false,
+      selectList: [],
+      showParent: false,
+      searchKey: "",
+      parentTitle: "",
+      editTitle: "",
+      modalTitle: "",
+      treeProp: {
+        label: "title",
+      },
+      form: {
+        value: "",
+        name: "",
+        adOrgtypeId: "",
+        parentId: "",
+        description: "",
+        isactive: "",
+        adOrgId: "",
+      },
+      region_id: "DCA5A753114B4D0997F9EAB5BE1F767D",
+      button_id: "3093BCBB01784DCC907639C0FC5FB6B8",
+      formAdd: {},
+      formValidate: {
+        value: [{ required: true, message: "编码不能为空", trigger: "change" }],
+        name: [{ required: true, message: "名称不能为空", trigger: "change" }],
+        MENU_TYPE: [{ required: true, message: "菜单类型不能为空", trigger: "change" }],
+        SYS_MODULE_ID: [{ required: true, message: "所属模块不能为空", trigger: "change" }],
+        parentId: [{ required: false, message: "上级菜单不能为空", trigger: "change" }],
+        seq: [
+          {
+            type: "number",
+            message: "排序值不能为空",
+            trigger: "change",
+          },
+        ],
+      },
+      submitLoading: false,
+      data: [],
+      tableData: [],
+      dictPermissions: [],
+      treeSelectedKeys: [],
+    };
+  },
+  methods: {
+    init() {
+      this.getAllList();
+    },
+    loadData(item, callback) {},
+    pOrgReload() {
+      this.pOrgRefreshFlag = false;
+      this.$nextTick(() => (this.pOrgRefreshFlag = true));
+    },
+    parseTreeData(curLevelData, curLevel) {
+      let newLevelData = curLevelData;
+      newLevelData["key"] = curLevelData.adOrgId;
+      newLevelData["title"] = curLevelData.name;
+      newLevelData["level"] = curLevel;
+      if (curLevelData["_childs"] && curLevelData["_childs"].length > 0) {
+        curLevelData["_childs"].forEach((sonTreeData) => {
+          if (!newLevelData.children) {
+            newLevelData.children = [];
+          }
+          newLevelData.children.push(this.parseTreeData(sonTreeData, curLevel + 1));
+        });
+      }
+      return newLevelData;
+    },
+    getAllList() {
+      this.loading = true;
+      // 重载父机构数据
+      this.pOrgReload();
+      // 请求系统数据
+      this.axios.post("/orgController/getOrgData", this.$qs.stringify({})).then((response) => {
+        if (response.data.result) {
+          let newTreeData = [];
+          // 仅展开指定级数 默认后端已展开所有
+          let expandLevel = this.expandLevel;
+          response.data.orgList.forEach((e) => {
+            newTreeData.push(this.parseTreeData(e, 0, expandLevel));
+          });
+          this.data = newTreeData;
+        }
+        this.loading = false;
+      });
+    },
+    search() {
+      if (this.searchKey) {
+        this.loading = true;
+        this.axios
+          .post("/orgController/getOrgData", this.$qs.stringify({ orgName: this.searchKey }))
+          .then((response) => {
+            if (response.data.result) {
+              this.loading = false;
+              let newTreeData = [];
+              response.data.orgList.forEach(function (e) {
+                newTreeData.push(this.parseTreeData(e, 0));
+              });
+              this.data = newTreeData;
+              this.tableData = newTreeData;
+            }
+          });
+      } else {
+        this.getAllList();
+      }
+    },
+    selectTree(data, node) {
+      if (data) {
+        this.form = data;
+        this.editTitle = this.form.title;
+        this.selectedNodes = data;
+        this.treeSelectedKeys = data.adMenuId;
+      } else {
+        this.cancelEdit();
+      }
+    },
+    selectTreeEdit(v) {
+      if (v.length > 0) {
+        // 转换null为""
+        for (let attr in v[0]) {
+          if (v[0][attr] === null) {
+            v[0][attr] = "";
+          }
+        }
+        let str = JSON.stringify(v[0]);
+        let data = JSON.parse(str);
+        if (this.form.id === data.id) {
+          this.$message.warning("请勿选择自己作为父菜单");
+          v[0].selected = false;
+          return;
+        }
+        this.form.parentId = data.id;
+        this.form._parentId_name = data.title;
+      }
+    },
+    addNew() {
+      this.cancelEdit();
+      this.treeSelectedKeys = [];
+      // 然后调用focus方法
+      this.$nextTick(() => {
+        this.$refs.orgCodeRef.focus();
+      });
+    },
+    cancelEdit() {
+      this.handleReset();
+    },
+    handleReset() {
+      this.treeSelectedKeys = [];
+      this.form.adOrgId = "";
+      this.editTitle = "";
+      this.$refs.form.resetFields();
+    },
+    submitEdit() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.submitLoading = true;
+          let curForm = {
+            value: this.form.value,
+            name: this.form.name,
+            adOrgtypeId: this.form.adOrgtypeId,
+            parentId: this.form.parentId,
+            description: this.form.description,
+            isactive: this.form.isactive,
+            adOrgId: this.form.adOrgId,
+          };
+          this.axios
+            .post("/orgController/submitOrg", this.$qs.stringify(curForm))
+            .then((response) => {
+              if (response.data.result) {
+                this.$message.success((this.form.adOrgId !== "" ? "修改" : "新增") + "成功");
+                this.getAllList();
+                this.handleReset();
+              } else {
+                this.$message.error(response.data.msg);
+              }
+              this.submitLoading = false;
+            })
+            .catch((response) => {
+              this.submitLoading = false;
+            });
+        }
+      });
+    },
+    add() {
+      if (!this.form.id) {
+        this.$message.warning("请先点击选择一个菜单权限节点");
+        return;
+      }
+      this.parentTitle = this.form.title;
+      this.modalTitle = "添加子节点(可拖动)";
+      this.showParent = true;
+      let type = 0;
+      if (this.form.level === 1) {
+        type = 0;
+      } else if (this.form.level === 2) {
+        type = 1;
+      } else if (this.form.level === 3) {
+        this.$modal.warning({
+          title: "抱歉，不能添加啦",
+          content: "左侧仅支持2级菜单目录",
+        });
+        return;
+      } else {
+        type = 0;
+      }
+      if (!this.form.children) {
+        this.form.children = [];
+      }
+      this.formAdd = {
+        icon: "",
+        type: type,
+        parentId: this.form.id,
+        level: Number(this.form.level) + 1,
+        sortOrder: this.form.children.length + 1,
+        buttonType: "",
+        status: 0,
+        showAlways: true,
+      };
+      if (this.form.level === 0) {
+        this.formAdd.path = "/";
+        this.formAdd.component = "Main";
+      }
+      this.menuModalVisible = true;
+    },
+    changeSelect() {
+      this.selectList = this.$refs.tree.getCheckedKeys();
+    },
+    showSelect(e) {
+      this.selectList = e;
+    },
+    clearSelectAll() {
+      this.$refs.table.selectAll(false);
+    },
+    remove(v) {
+      this.selectList = [];
+      this.selectList.push(v);
+      this.delAll();
+    },
+    delAll() {
+      if (this.selectList.length <= 0) {
+        this.$message.warning("您还未勾选要删除的数据");
+        return;
+      }
+      let ids = this.selectList.join(",");
+      this.axios.post("/orgController/delOrgByIds", this.$qs.stringify({ ids: ids })).then((response) => {
+        if (response.data.result) {
+          this.$message.success(response.data.msg);
+          this.selectList = [];
+          this.getAllList();
+          this.handleReset();
+        } else {
+          this.$message.error(response.data.msg);
+        }
+        this.submitLoading = false;
+      });
+    },
+  },
+  mounted() {
+    // 计算高度
+    let height = document.documentElement.clientHeight;
+    this.maxHeight = Number(height - 106) + "px";
+    this.init();
+  },
+};
+</script>
+<style lang="scss">
+.search {
+  padding: 10px 0;
+  .operation {
+    margin-bottom: 2vh;
+  }
+
+  .select-title {
+    font-weight: 600;
+    color: #40a9ff;
+  }
+
+  .select-clear {
+    margin-left: 10px;
+  }
+  .el-form-item__content {
+    .el-select {
+      flex: 1;
+    }
+  }
+
+  .tree-bar {
+    overflow: auto;
+    margin-top: 5px;
+    position: relative;
+    min-height: 80px;
+    &::-webkit-scrollbar {
+      width: 6px;
+      height: 6px;
+    }
+    &::-webkit-scrollbar-thumb {
+      border-radius: 4px;
+      box-shadow: inset 0 0 2px #d1d1d1;
+      background: #e4e4e4;
+    }
+  }
+}
+</style>