|
@@ -0,0 +1,381 @@
|
|
|
|
|
+<!--
|
|
|
|
|
+ * @Title:
|
|
|
|
|
+ * @Description:
|
|
|
|
|
+ * @Author: swp
|
|
|
|
|
+ * @Date: 2022-08-24 10:49:21
|
|
|
|
|
+ * @LastEditors:
|
|
|
|
|
+ * @LastEditTime: 2022-08-24 10:49:21
|
|
|
|
|
+-->
|
|
|
|
|
+<template>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-row>
|
|
|
|
|
+ <el-col :span="4">
|
|
|
|
|
+ <div class="box">
|
|
|
|
|
+ <el-scrollbar>
|
|
|
|
|
+ <basic-container>
|
|
|
|
|
+ <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick">
|
|
|
|
|
+ <span class="el-tree-node__label" slot-scope="{ node, data }">
|
|
|
|
|
+ <span>
|
|
|
|
|
+ <i class="el-icon-office-building"></i>
|
|
|
|
|
+ {{ (node || {}).label }}
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </avue-tree>
|
|
|
|
|
+ </basic-container>
|
|
|
|
|
+ </el-scrollbar>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="20">
|
|
|
|
|
+ <basic-container>
|
|
|
|
|
+ <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page"
|
|
|
|
|
+ :before-open="beforeOpen" ref="crud" v-model="form" :permission="permissionList" @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"
|
|
|
|
|
+ @before-open="beforeOpen" @select-change="selectChange">
|
|
|
|
|
+ <template slot-scope="{ row, index }" slot="menu">
|
|
|
|
|
+ <!-- <el-button type="text" size="small" @click="toAddMonitorPoint(row)" icon="el-icon-plus">添加下级机构
|
|
|
|
|
+ </el-button> -->
|
|
|
|
|
+ <el-button type="text" size="small" @click="toAddOrgAdmin(row)" icon="el-icon-plus">添加管理员
|
|
|
|
|
+ </el-button>
|
|
|
|
|
+ <el-button type="text" size="small" @click="toOrgAdminList(row)" icon="el-icon-plus">管理员列表
|
|
|
|
|
+ </el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ </avue-crud>
|
|
|
|
|
+ </basic-container>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+
|
|
|
|
|
+ <el-drawer title="添加管理员" :visible.sync="addOrgAdminDialog" size="60%" append-to-body v-if="addOrgAdminDialog">
|
|
|
|
|
+ <addorgadminVue ref="addorgadminRef" :visible.sync="addOrgAdminDialog" :orgId="orgId" :orgName="orgName"
|
|
|
|
|
+ @fevent="update_table">
|
|
|
|
|
+ </addorgadminVue>
|
|
|
|
|
+ </el-drawer>
|
|
|
|
|
+
|
|
|
|
|
+ <el-drawer title="管理员列表" :visible.sync="orgAdminListDialog" size="60%" append-to-body v-if="orgAdminListDialog">
|
|
|
|
|
+ <orgadminlistVue ref="orgadminListRef" :visible.sync="orgAdminListDialog" :orgId="orgId" @fevent="update_table">
|
|
|
|
|
+ </orgadminlistVue>
|
|
|
|
|
+ </el-drawer>
|
|
|
|
|
+ </div>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script>
|
|
|
|
|
+import { getTree, getPage, add, update, remove } from "@/api/baseinfo/org";
|
|
|
|
|
+import { mapGetters } from "vuex";
|
|
|
|
|
+import addorgadminVue from "./addorgadmin.vue";
|
|
|
|
|
+import orgadminlistVue from "./orgadminlist.vue";
|
|
|
|
|
+
|
|
|
|
|
+export default {
|
|
|
|
|
+ components: {
|
|
|
|
|
+ addorgadminVue,
|
|
|
|
|
+ orgadminlistVue
|
|
|
|
|
+ },
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ addOrgAdminDialog: false,
|
|
|
|
|
+ orgAdminListDialog: false,
|
|
|
|
|
+ orgId: '',
|
|
|
|
|
+ orgName: '',
|
|
|
|
|
+ form: {},
|
|
|
|
|
+ selectionList: [],
|
|
|
|
|
+ query: {},
|
|
|
|
|
+ loading: true,
|
|
|
|
|
+ page: {
|
|
|
|
|
+ pageSize: 10,
|
|
|
|
|
+ currentPage: 1,
|
|
|
|
|
+ total: 0,
|
|
|
|
|
+ },
|
|
|
|
|
+ treeCode: '',
|
|
|
|
|
+ treeParentCode: '',
|
|
|
|
|
+ treeData: [],
|
|
|
|
|
+ treeOption: {
|
|
|
|
|
+ nodeKey: "id",
|
|
|
|
|
+ defaultExpandedKeys: [],
|
|
|
|
|
+ lazy: false,
|
|
|
|
|
+ // treeLoad: function (node, resolve) {
|
|
|
|
|
+ // const parentCode = (node.level === 0) ? "" : node.data.id;
|
|
|
|
|
+ // getLazyDeptTree(parentCode, {}).then(res => {
|
|
|
|
|
+ // resolve(res.data.data.map(item => {
|
|
|
|
|
+ // return {
|
|
|
|
|
+ // ...item,
|
|
|
|
|
+ // leaf: !item.hasChildren
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }))
|
|
|
|
|
+ // });
|
|
|
|
|
+ // },
|
|
|
|
|
+ addBtn: false,
|
|
|
|
|
+ menu: true,
|
|
|
|
|
+ size: "small",
|
|
|
|
|
+ props: {
|
|
|
|
|
+ labelText: "标题",
|
|
|
|
|
+ label: "title",
|
|
|
|
|
+ value: "value",
|
|
|
|
|
+ children: "children",
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ option: {
|
|
|
|
|
+ labelWidth: 140,
|
|
|
|
|
+ viewLabelWidth: 140,
|
|
|
|
|
+ searchLabelWidth: 140,
|
|
|
|
|
+ height: "auto",
|
|
|
|
|
+ calcHeight: 80,
|
|
|
|
|
+ align: "center",
|
|
|
|
|
+ headerAlign: "center",
|
|
|
|
|
+ lazy: false,
|
|
|
|
|
+ tip: false,
|
|
|
|
|
+ simplePage: true,
|
|
|
|
|
+ searchShow: true,
|
|
|
|
|
+ searchMenuSpan: 6,
|
|
|
|
|
+ tree: true,
|
|
|
|
|
+ border: true,
|
|
|
|
|
+ index: true,
|
|
|
|
|
+ selection: false,
|
|
|
|
|
+ viewBtn: false,
|
|
|
|
|
+ editBtn: true,
|
|
|
|
|
+ delBtn: true,
|
|
|
|
|
+ addBtn: true,
|
|
|
|
|
+ menuWidth: 400,
|
|
|
|
|
+ dialogType: "drawer",
|
|
|
|
|
+ addBtnText: '新增机构',
|
|
|
|
|
+ dialogClickModal: false,
|
|
|
|
|
+ columnBtn: false,
|
|
|
|
|
+ column: [
|
|
|
|
|
+ {
|
|
|
|
|
+ label: "单位全称",
|
|
|
|
|
+ prop: "deptName",
|
|
|
|
|
+ span: 24,
|
|
|
|
|
+ search: true,
|
|
|
|
|
+ rules: [
|
|
|
|
|
+ {
|
|
|
|
|
+ required: true,
|
|
|
|
|
+ message: "请录入单位全称",
|
|
|
|
|
+ trigger: "click",
|
|
|
|
|
+ },
|
|
|
|
|
+ ],
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: "备注说明",
|
|
|
|
|
+ prop: "remark",
|
|
|
|
|
+ span: 24,
|
|
|
|
|
+ type: "textarea",
|
|
|
|
|
+ },
|
|
|
|
|
+ ],
|
|
|
|
|
+ },
|
|
|
|
|
+ data: [],
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ computed: {
|
|
|
|
|
+ ...mapGetters(["userInfo", "permission"]),
|
|
|
|
|
+ permissionList() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ addBtn: true,
|
|
|
|
|
+ viewBtn: false,
|
|
|
|
|
+ delBtn: true,
|
|
|
|
|
+ editBtn: true,
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ created() {
|
|
|
|
|
+ this.initTree();
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ initTree() {
|
|
|
|
|
+ this.treeData = [];
|
|
|
|
|
+ getTree().then(res => {
|
|
|
|
|
+ this.treeData = res.data.data.map(item => {
|
|
|
|
|
+ return {
|
|
|
|
|
+ ...item,
|
|
|
|
|
+ leaf: !item.hasChildren
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ this.treeOption.defaultExpandedKeys.push(this.treeData[0].id);
|
|
|
|
|
+ this.treeCode = this.treeData[0].id;
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.query['parentId'] = this.treeCode;
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ nodeClick(data) {
|
|
|
|
|
+ this.treeCode = data.id;
|
|
|
|
|
+ this.excludeCode = data.exclude;
|
|
|
|
|
+ this.treeParentCode = data.parentId;
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.query['parentId'] = this.treeCode;
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ var params = {};
|
|
|
|
|
+ this.onLoad(this.page, params);
|
|
|
|
|
+ },
|
|
|
|
|
+ update_table() {
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page, this.query);
|
|
|
|
|
+ this.initTree();
|
|
|
|
|
+ },
|
|
|
|
|
+ toAddOrgAdmin(row) {
|
|
|
|
|
+ this.addOrgAdminDialog = true;
|
|
|
|
|
+ this.orgId = row.id;
|
|
|
|
|
+ this.orgName = row.deptName;
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ this.$refs["addorgadminRef"].init();
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ toOrgAdminList(row) {
|
|
|
|
|
+ this.orgAdminListDialog = true;
|
|
|
|
|
+ this.orgId = row.id;
|
|
|
|
|
+ this.orgName = row.deptName;
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ this.$refs["orgadminListRef"].init();
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ searchReset() {
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page);
|
|
|
|
|
+ },
|
|
|
|
|
+ searchChange(params, done) {
|
|
|
|
|
+ this.query = params;
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page, params);
|
|
|
|
|
+ done();
|
|
|
|
|
+ },
|
|
|
|
|
+ currentChange(currentPage) {
|
|
|
|
|
+ this.page.currentPage = currentPage;
|
|
|
|
|
+ },
|
|
|
|
|
+ sizeChange(pageSize) {
|
|
|
|
|
+ this.page.pageSize = pageSize;
|
|
|
|
|
+ },
|
|
|
|
|
+ refreshChange() {
|
|
|
|
|
+ var params = {};
|
|
|
|
|
+ this.onLoad(this.page, params);
|
|
|
|
|
+ },
|
|
|
|
|
+ selectionChange(list) {
|
|
|
|
|
+ this.selectionList = list;
|
|
|
|
|
+ },
|
|
|
|
|
+ selectChange(item) {
|
|
|
|
|
+ console.log(JSON.stringify(item));
|
|
|
|
|
+ },
|
|
|
|
|
+ selectionClear() {
|
|
|
|
|
+ this.selectionList = [];
|
|
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
|
|
+ },
|
|
|
|
|
+ rowSave(row, done, loading) {
|
|
|
|
|
+ row['parentId'] = this.treeCode;
|
|
|
|
|
+ console.log(JSON.stringify(row))
|
|
|
|
|
+ add(row).then(
|
|
|
|
|
+ () => {
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page);
|
|
|
|
|
+ this.initTree();
|
|
|
|
|
+
|
|
|
|
|
+ this.$message({
|
|
|
|
|
+ type: "success",
|
|
|
|
|
+ message: "操作成功!",
|
|
|
|
|
+ });
|
|
|
|
|
+ done();
|
|
|
|
|
+ },
|
|
|
|
|
+ (error) => {
|
|
|
|
|
+ window.console.log(error);
|
|
|
|
|
+ loading();
|
|
|
|
|
+ }
|
|
|
|
|
+ );
|
|
|
|
|
+ },
|
|
|
|
|
+ rowUpdate(row, index, done, loading) {
|
|
|
|
|
+ update(row).then(
|
|
|
|
|
+ () => {
|
|
|
|
|
+ this.query = {};
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page);
|
|
|
|
|
+ this.initTree();
|
|
|
|
|
+ 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.query = {};
|
|
|
|
|
+ this.page.currentPage = 1;
|
|
|
|
|
+ this.onLoad(this.page);
|
|
|
|
|
+ this.initTree();
|
|
|
|
|
+ this.$message({
|
|
|
|
|
+ type: "success",
|
|
|
|
|
+ message: "操作成功!",
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ handleDelete() {
|
|
|
|
|
+ if (this.selectionList.length === 0) {
|
|
|
|
|
+ this.$message.warning("请选择至少一条数据");
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ this.$confirm("确定将选择数据删除?", {
|
|
|
|
|
+ confirmButtonText: "确定",
|
|
|
|
|
+ cancelButtonText: "取消",
|
|
|
|
|
+ type: "warning",
|
|
|
|
|
+ })
|
|
|
|
|
+ .then(() => {
|
|
|
|
|
+ return remove(this.ids);
|
|
|
|
|
+ })
|
|
|
|
|
+ .then(() => {
|
|
|
|
|
+ this.onLoad(this.page);
|
|
|
|
|
+ this.$message({
|
|
|
|
|
+ type: "success",
|
|
|
|
|
+ message: "操作成功!",
|
|
|
|
|
+ });
|
|
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ beforeOpen(done, type) {
|
|
|
|
|
+ if (["edit", "view"].includes(type)) {
|
|
|
|
|
+ // getDetail(this.form.id).then((res) => {
|
|
|
|
|
+ // this.form = res.data.data;
|
|
|
|
|
+ // });
|
|
|
|
|
+ }
|
|
|
|
|
+ done();
|
|
|
|
|
+ },
|
|
|
|
|
+ onLoad(page, params = {}) {
|
|
|
|
|
+ this.loading = true;
|
|
|
|
|
+ getPage(
|
|
|
|
|
+ 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>
|
|
|
|
|
+.box {
|
|
|
|
|
+ height: 800px;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.el-scrollbar {
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.box .el-scrollbar__wrap {
|
|
|
|
|
+ overflow: scroll;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|