From a3c868db4d017961be2d394eadb7d428045d5adc Mon Sep 17 00:00:00 2001 From: lihang <lihang@vci-tech.com> Date: 星期四, 13 七月 2023 11:13:16 +0800 Subject: [PATCH] 业务类型页面增加生命周期的处理 --- Source/UBCS-WEB/dist/src/views/authority/role.vue | 380 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 380 insertions(+), 0 deletions(-) diff --git a/Source/UBCS-WEB/dist/src/views/authority/role.vue b/Source/UBCS-WEB/dist/src/views/authority/role.vue new file mode 100644 index 0000000..0384af2 --- /dev/null +++ b/Source/UBCS-WEB/dist/src/views/authority/role.vue @@ -0,0 +1,380 @@ +<template> + <basic-container> + <avue-crud :option="option" + :table-loading="loading" + :data="data" + ref="crud" + v-model="form" + :permission="permissionList" + :before-open="beforeOpen" + @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"> + <template slot="menuLeft"> + <el-button type="danger" + size="small" + icon="el-icon-delete" + v-if="permission.role_delete" + plain + @click="handleDelete">鍒� 闄� + </el-button> + <el-button size="small" + icon="el-icon-setting" + @click="handleRole" + v-if="userInfo.role_name.includes('admin')" + plain>鏉冮檺璁剧疆 + </el-button> + </template> + </avue-crud> + <el-dialog title="瑙掕壊鏉冮檺閰嶇疆" + append-to-body + :visible.sync="box" + width="345px"> + <el-tabs type="border-card"> + <el-tab-pane label="鑿滃崟鏉冮檺"> + <el-tree :data="menuGrantList" + show-checkbox + node-key="id" + ref="treeMenu" + :default-checked-keys="menuTreeObj" + :props="props"> + </el-tree> + </el-tab-pane> + <el-tab-pane label="鏁版嵁鏉冮檺"> + <el-tree :data="dataScopeGrantList" + show-checkbox + node-key="id" + ref="treeDataScope" + :default-checked-keys="dataScopeTreeObj" + :props="props"> + </el-tree> + </el-tab-pane> + <el-tab-pane label="鎺ュ彛鏉冮檺"> + <el-tree :data="apiScopeGrantList" + show-checkbox + node-key="id" + ref="treeApiScope" + :default-checked-keys="apiScopeTreeObj" + :props="props"> + </el-tree> + </el-tab-pane> + </el-tabs> + + <span slot="footer" + class="dialog-footer"> + <el-button @click="box = false">鍙� 娑�</el-button> + <el-button type="primary" + @click="submit">纭� 瀹�</el-button> + </span> + </el-dialog> + </basic-container> +</template> + +<script> + import {add, getList, getRole, getRoleTreeById, grant, grantTree, remove, update} from "@/api/system/role"; + import {mapGetters} from "vuex"; + import website from '@/config/website'; + + export default { + data() { + return { + form: {}, + box: false, + props: { + label: "title", + value: "key" + }, + menuGrantList: [], + dataScopeGrantList: [], + apiScopeGrantList: [], + apiGrantList: [], + menuTreeObj: [], + dataScopeTreeObj: [], + apiScopeTreeObj: [], + selectionList: [], + query: {}, + loading: true, + page: { + pageSize: 10, + currentPage: 1, + total: 0 + }, + option: { + tip: false, + simplePage: true, + searchShow: true, + searchMenuSpan: 6, + tree: true, + border: true, + index: true, + selection: true, + viewBtn: true, + dialogWidth: 900, + dialogClickModal: false, + column: [ + { + label: "瑙掕壊鍚嶇О", + prop: "roleName", + search: true, + span: 24, + rules: [ + { + required: true, + message: "璇疯緭鍏ヨ鑹插悕绉�", + trigger: "blur" + } + ] + }, + { + label: "鎵�灞炵鎴�", + prop: "tenantId", + type: "tree", + dicUrl: "/api/ubcs-system/tenant/select", + addDisplay: false, + editDisplay: false, + viewDisplay: website.tenantMode, + span: 24, + props: { + label: "tenantName", + value: "tenantId" + }, + hide: !website.tenantMode, + search: website.tenantMode, + rules: [{ + required: true, + message: "璇疯緭鍏ユ墍灞炵鎴�", + trigger: "click" + }] + }, + { + label: "瑙掕壊鍒悕", + prop: "roleAlias", + search: true, + span: 24, + rules: [ + { + required: true, + message: "璇疯緭鍏ヨ鑹插埆鍚�", + trigger: "blur" + } + ] + }, + { + label: "涓婄骇瑙掕壊", + prop: "parentId", + dicData: [], + type: "tree", + hide: true, + span: 24, + props: { + label: "title" + }, + rules: [ + { + required: false, + message: "璇烽�夋嫨涓婄骇瑙掕壊", + trigger: "click" + } + ] + }, + { + label: "瑙掕壊鎺掑簭", + prop: "sort", + type: "number", + span: 24, + rules: [ + { + required: true, + message: "璇疯緭鍏ヨ鑹叉帓搴�", + trigger: "blur" + } + ] + } + ] + }, + data: [] + }; + }, + computed: { + ...mapGetters(["userInfo", "permission"]), + permissionList() { + return { + addBtn: this.vaildData(this.permission.role_add, false), + viewBtn: this.vaildData(this.permission.role_view, false), + delBtn: this.vaildData(this.permission.role_delete, false), + editBtn: this.vaildData(this.permission.role_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; + } + }, + methods: { + initData(roleId){ + getRoleTreeById(roleId).then(res => { + const column = this.findObject(this.option.column, "parentId"); + column.dicData = res.data.data; + }); + }, + submit() { + const menuList = this.$refs.treeMenu.getCheckedKeys(); + const dataScopeList = this.$refs.treeDataScope.getCheckedKeys(); + const apiScopeList = this.$refs.treeApiScope.getCheckedKeys(); + grant(this.idsArray, menuList, dataScopeList, apiScopeList).then(() => { + this.box = false; + this.$message({ + type: "success", + message: "鎿嶄綔鎴愬姛!" + }); + this.onLoad(this.page); + }); + }, + rowSave(row, done, loading) { + add(row).then(() => { + this.onLoad(this.page); + this.$message({ + type: "success", + message: "鎿嶄綔鎴愬姛!" + }); + done(); + }, error => { + window.console.log(error); + loading(); + }); + }, + rowUpdate(row, index, done, loading) { + update(row).then(() => { + this.onLoad(this.page); + this.$message({ + type: "success", + message: "鎿嶄綔鎴愬姛!" + }); + done(); + }, error => { + window.console.log(error); + loading(); + }); + }, + rowDel(row) { + this.$confirm("纭畾灏嗛�夋嫨鏁版嵁鍒犻櫎?", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + return remove(row.id); + }) + .then(() => { + this.onLoad(this.page); + this.$message({ + type: "success", + message: "鎿嶄綔鎴愬姛!" + }); + }); + }, + + searchReset() { + this.query = {}; + this.onLoad(this.page); + }, + searchChange(params, done) { + this.query = params; + this.page.currentPage = 1; + this.onLoad(this.page, params); + done(); + }, + selectionChange(list) { + this.selectionList = list; + }, + selectionClear() { + this.selectionList = []; + this.$refs.crud.toggleSelection(); + }, + beforeOpen(done, type) { + if (["add", "edit"].includes(type)) { + this.initData(this.form.id); + } + done(); + }, + handleRole() { + if (this.selectionList.length !== 1) { + this.$message.warning("鍙兘閫夋嫨涓�鏉℃暟鎹�"); + return; + } + this.menuTreeObj = []; + this.dataScopeTreeObj = []; + this.apiScopeTreeObj = []; + grantTree() + .then(res => { + this.menuGrantList = res.data.data.menu; + this.dataScopeGrantList = res.data.data.dataScope; + this.apiScopeGrantList = res.data.data.apiScope; + getRole(this.ids).then(res => { + this.menuTreeObj = res.data.data.menu; + this.dataScopeTreeObj = res.data.data.dataScope; + this.apiScopeTreeObj = res.data.data.apiScope; + this.box = true; + }); + }); + }, + handleDelete() { + if (this.selectionList.length === 0) { + this.$message.warning("璇烽�夋嫨鑷冲皯涓�鏉℃暟鎹�"); + return; + } + this.$confirm("纭畾灏嗛�夋嫨鏁版嵁鍒犻櫎?", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + return remove(this.ids); + }) + .then(() => { + this.onLoad(this.page); + this.$message({ + type: "success", + message: "鎿嶄綔鎴愬姛!" + }); + this.$refs.crud.toggleSelection(); + }); + }, + currentChange(currentPage) { + this.page.currentPage = currentPage; + }, + sizeChange(pageSize) { + this.page.pageSize = pageSize; + }, + refreshChange() { + this.onLoad(this.page, this.query); + }, + onLoad(page, params = {}) { + this.loading = true; + getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => { + this.data = res.data.data; + this.loading = false; + this.selectionClear(); + }); + } + } + }; +</script> -- Gitblit v1.9.3