From 5700aa436cf4e058cef10560c324e2ee762eebcc Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期五, 05 七月 2024 14:34:16 +0800 Subject: [PATCH] 角色管理 表格查询分页 增删改 分配成员 统计 导入角色 --- Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue | 6 Source/plt-web/plt-web-ui/src/views/system/role/index.vue | 325 ++++++++++++++++++++++++++++++++++++++++ Source/plt-web/plt-web-ui/src/App.vue | 2 Source/plt-web/plt-web-ui/src/views/system/user/index.vue | 6 Source/plt-web/plt-web-ui/src/api/system/user/api.js | 4 Source/plt-web/plt-web-ui/src/api/system/role/api.js | 72 +++++++++ Source/plt-web/plt-web-ui/src/views/system/role/option.js | 33 ++++ Source/plt-web/plt-web-ui/src/components/PLT-basic-component/upload-file.vue | 1 Source/plt-web/plt-web-ui/src/views/system/user/option.js | 5 9 files changed, 440 insertions(+), 14 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/App.vue b/Source/plt-web/plt-web-ui/src/App.vue index 32b2829..f1e0fcb 100644 --- a/Source/plt-web/plt-web-ui/src/App.vue +++ b/Source/plt-web/plt-web-ui/src/App.vue @@ -32,7 +32,7 @@ margin: 50px auto; } .avue-dialog .el-dialog{ - top:50%; + top:47%; max-height: calc(100% - 100px); -webkit-transform: translate(-50%, 0); transform: translate(-50%, -50%); diff --git a/Source/plt-web/plt-web-ui/src/api/system/role/api.js b/Source/plt-web/plt-web-ui/src/api/system/role/api.js new file mode 100644 index 0000000..caccba5 --- /dev/null +++ b/Source/plt-web/plt-web-ui/src/api/system/role/api.js @@ -0,0 +1,72 @@ +import request from '@/router/axios'; + +// 鍒楄〃鏌ヨ +export function gridRoles(page,limit,params) { + return request({ + url: "/api/roleQueryController/gridRoles", + method: "get", + params:{ + page, + limit, + ...params + } + }); +} + +// 娣诲姞 +export function addRole(row) { + return request({ + url: "/api/roleQueryController/addRole", + method: "post", + data:row + }); +} + +// 淇敼 +export function updateRole(row) { + return request({ + url: "/api/roleQueryController/updateRole", + method: "put", + data:row + }); +} + +// 鍒犻櫎 +export function deleteRole(params) { + return request({ + url: "/api/roleQueryController/deleteRole", + method: "delete", + params + }); +} + +// 鍒嗛厤鐣岄潰-瑙掕壊鍐呮垚鍛樻煡璇� 鎴栬�� 缁熻椤甸潰鏌ヨ +export function listUserByRoleOid(params) { + return request({ + url: "/api/userQueryController/listUserByRoleOid", + method: "get", + params + }); +} + +// 鍒嗛厤鐣岄潰-瑙掕壊澶栨垚鍛樻煡璇� +export function listUserUnInRoleOid(params) { + return request({ + url: "/api/userQueryController/listUserUnInRoleOid", + method: "get", + params + }); +} + +// 鍒嗛厤鐣岄潰-淇濆瓨 +export function saveRight(params) { + let formData = new FormData; + for (let key in params){ + formData.append(key,params[key]) + } + return request({ + url: "/api/roleQueryController/saveRight", + method: "post", + data:formData + }); +} diff --git a/Source/plt-web/plt-web-ui/src/api/system/user/api.js b/Source/plt-web/plt-web-ui/src/api/system/user/api.js index ce644b2..cfecaef 100644 --- a/Source/plt-web/plt-web-ui/src/api/system/user/api.js +++ b/Source/plt-web/plt-web-ui/src/api/system/user/api.js @@ -63,11 +63,11 @@ } // 淇敼鎴愬憳 -export function updateUser(data) { +export function updateUser(row) { return request({ url: "/api/userQueryController/updateUser", method: "put", - data:data + data:row }); } diff --git a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue index 68f7a40..03159a9 100644 --- a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue +++ b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/transfer.vue @@ -53,10 +53,10 @@ if (newval) { // 娓呯┖data鏁扮粍 this.data = []; - newval.forEach((city) => { + newval.forEach((item) => { this.data.push({ - label: city.name, - key: city.oid, + label: item.name, + key: item.oid, }); }); this.loading = false; diff --git a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/upload-file.vue b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/upload-file.vue index d75110c..37862b0 100644 --- a/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/upload-file.vue +++ b/Source/plt-web/plt-web-ui/src/components/PLT-basic-component/upload-file.vue @@ -111,6 +111,7 @@ if (resbonse.code === 200) { this.$message.success("瀵煎叆鎴愬姛锛�"); this.visible = false; + this.$emit('updata'); } else { this.$message.error(resbonse.msg); } diff --git a/Source/plt-web/plt-web-ui/src/views/system/role/index.vue b/Source/plt-web/plt-web-ui/src/views/system/role/index.vue index 82a0b37..19ec3c8 100644 --- a/Source/plt-web/plt-web-ui/src/views/system/role/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/system/role/index.vue @@ -1,10 +1,333 @@ <template> + <basic-container> + <avue-crud + ref="roleCrud" + :data="tableData" + :option="option" + :page.sync="page" + :table-loading="tableLoading" + @on-load="getTableList" + @refresh-change="handleRefresh" + @size-change="sizeChange" + @current-change="currentChange" + @selection-change="selectChange" + @row-click="rowClickHandler" + @row-save="rowSaveHandler" + @row-update="rowUpdateHandler" + @row-del="rowDeleteHandler" + > + <template slot="menuLeft" slot-scope="scope"> + <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">鍒犻櫎</el-button> + <el-button icon="el-icon-school" plain size="small" type="primary" @click="assignMembersHandler">鍒嗛厤鎴愬憳 + </el-button> + <el-button icon="el-icon-user" plain size="small" type="primary" @click="statisticsHandler">缁熻</el-button> + <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="upLoadRole">瀵煎叆瑙掕壊</el-button> + <el-button icon="el-icon-download" plain size="small" type="primary">瀵煎嚭</el-button> + </template> + <template slot="roleClassifyText" slot-scope="{row}"> + <el-tag type="success">{{ row.roleClassifyText }}</el-tag> + </template> + </avue-crud> + + <!-- 鍒嗛厤瑙掕壊绌挎妗� --> + <transfer ref="transfer" :left-role-data="leftRoleData" :right-role-data="rightRoleData" + :transferTitle="transferTitle" title="瑙掕壊娣诲姞鎴愬憳" + @transferSend="roleSendHandler"> + </transfer> + + <!-- 缁熻瀵硅瘽妗� --> + <el-dialog + v-dialogDrag + v-loading="statisticsLoading" + :destroy-on-close="true" + :visible.sync="statisticsVisible" + append-to-body="true" + class="avue-dialog" + title="浜哄憳淇℃伅" + width="50%" + > + <avue-crud + :data="countData" + :option="countOption" + > + </avue-crud> + <div slot="footer" class="dialog-footer" style="display: flex;gap: 20px;justify-content: center"> + <div> + <el-tag>褰撳墠瑙掕壊鎬讳汉鏁�: {{this.countData.length}}</el-tag> + </div> + <el-button size="small" @click="statisticsVisible = false" icon="el-icon-close" type="danger">鍏� 闂�</el-button> + </div> + </el-dialog> + + <!-- 瀵煎叆瑙掕壊 --> + <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" @updata="getTableList" title="瀵煎叆瑙掕壊"></upload-file> + + </basic-container> </template> <script> +import { + gridRoles, + addRole, + updateRole, + deleteRole, + listUserUnInRoleOid, + listUserByRoleOid, + saveRight +} from '@/api/system/role/api' +import basicOption from "@/util/basic-option"; +import {column} from "@/views/system/role/option"; + export default { -name: "index" + name: "index", + data() { + return { + tableData: [], + option: { + ...basicOption, + dialogTop: 0, + dialogWidth: '30%', + calcHeight: -60, + column: column + }, + page: { + currentPage: 1, + pageSize: 10, + total: 0, + pageSizes: [10, 30, 50, 100], + }, + onLoadParams: {}, + tableLoading: false, + selectList: [], + leftRoleData: [], // 鍒嗛厤鎴愬憳绌挎妗嗗乏渚у垵濮嬫暟鎹� + rightRoleData: [], // 鍒嗛厤鎴愬憳绌挎妗嗗彸渚у垵濮嬫暟鎹� + transferTitle: ['瑙掕壊澶栨垚鍛�', '瑙掕壊鍐呮垚鍛�'], + statisticsLoading: false, + statisticsVisible: false, + countData: [], + countOption: { + ...basicOption, + selection:false, + refreshBtn: false, + addBtn:false, + menu:false, + column: [ + { + label: '閮ㄩ棬', + prop: 'pkDepartmentName', + sortable: true, + }, + { + label: '鐢ㄦ埛鍚�', + prop: 'id', + sortable: true, + }, + { + label: '鐪熷疄濮撳悕', + prop: 'name', + sortable: true, + }, + { + label: '瑙掕壊', + prop: 'pkPersonName', + sortable: true, + }, + ] + }, + upFileType: ['xls', 'xlsx'], + fileUrl: 'api/roleQueryController/importRole', + } + }, + methods: { + // 琛ㄦ牸鍒濆鍖栬姹� + getTableList() { + this.tableLoading = true; + gridRoles(this.page.currentPage, this.page.pageSize, this.onLoadParams).then(res => { + const data = res.data.data; + this.tableData = data; + this.page.total = res.data.total; + this.tableLoading = false; + }) + }, + + // 鍒楀ご鍒锋柊 + handleRefresh() { + this.getTableList() + }, + + // 鏉℃暟 + sizeChange(val) { + this.page.pageSize = val; + }, + + // 椤电爜 + currentChange(val) { + this.page.currentPage = val; + }, + + // 涓嬫媺 + selectChange(row) { + this.selectList = row; + }, + + // 琛屽崟閫� + rowClickHandler(row) { + this.$refs.roleCrud.toggleRowSelection(row); + }, + + // 娣诲姞 + rowSaveHandler(row, done) { + delete row.roleClassifyText; + addRole(row).then(res => { + console.log(res) + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTableList(); + } + }) + done(); + }, + + // 缂栬緫 + rowUpdateHandler(row, index, done) { + delete row.roleClassifyText; + updateRole(row).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTableList(); + } + }).catch(err => { + console.log(err); + }); + done() + }, + + // 鍒犻櫎 + rowDeleteHandler(row) { + let params = { + ids: row.oid + } + deleteRole(params).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTableList(); + } + }).catch(err => { + console.log(err); + }) + }, + + // 澶氶�夊垹闄� + allDelHandler() { + let params = { + ids: this.selectList.map(item => item.oid).join(',') + } + if (this.selectList.length <= 0) { + this.$message.warning('璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹繘琛屽垹闄わ紒') + return; + } + this.$confirm('鎮ㄧ‘瀹氳鍒犻櫎鎵�閫夋嫨鐨勮鑹插悧锛�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + deleteRole(params).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTableList(); + } + }); + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + + // 鍒嗛厤鎴愬憳 + assignMembersHandler() { + if (this.selectList.length <= 0) { + this.$message.warning('璇烽�夋嫨瑙掕壊杩涜鎴愬憳鍒嗛厤锛�'); + return; + } + + if (this.selectList.length > 1) { + this.$message.warning('涓�娆″彧鑳藉涓�涓鑹茶繘琛屽垎閰嶆垚鍛樻搷浣滐紒'); + return; + } + Promise.all([ + listUserUnInRoleOid({pkRole: this.selectList[0].oid}), + listUserByRoleOid({pkRole: this.selectList[0].oid}) + ]).then(([unInRoleRes, byRoleRes]) => { + if (unInRoleRes.data.code === 200 && byRoleRes.data.code === 200) { + const leftData = [...unInRoleRes.data.data, ...byRoleRes.data.data]; + // 缁勮濂界┛姊鍙敤鏁版嵁 + this.leftRoleData = leftData.map(item => { + return { + name: item.name + `(${item.id})`, + oid: item.oid + } + }) + this.rightRoleData = byRoleRes.data.data.map(item => item.oid); + this.$refs.transfer.visible = true; + } + }).catch(err => { + console.error(err); + }); + + }, + + // 鍒嗛厤鎴愬憳绌挎妗嗗洖濉� + roleSendHandler(row) { + let params = { + userOids: row.join(','), + roleId: this.selectList[0].oid + } + saveRight(params).then(res => { + this.$message.success(res.data.obj); + this.getTableList(); + }).catch(err => { + this.$message.error(err) + }) + }, + + // 缁熻 + statisticsHandler() { + if (this.selectList.length <= 0) { + this.$message.warning('璇烽�夋嫨瑙掕壊锛�'); + return; + } + + if (this.selectList.length > 1) { + this.$message.warning('鏈�澶氬彧鑳介�夋嫨涓�涓鑹茶繘琛岀粺璁★紒'); + return; + } + listUserByRoleOid({pkRole: this.selectList[0].oid}).then(res => { + console.log(res) + if (res.data.code === 200) { + const data = res.data.data; + this.countData = data.map(item => { + return { + pkDepartmentName: item.pkDepartmentName, + name:item.name, + id:item.id, + pkPersonName:this.selectList[0].name + } + }); + this.statisticsVisible = true; + } + }).catch(err => { + console.log(err) + }) + }, + + // 瀵煎叆瑙掕壊 + upLoadRole(){ + this.$refs.upload.visible = true; + } + } } </script> diff --git a/Source/plt-web/plt-web-ui/src/views/system/role/option.js b/Source/plt-web/plt-web-ui/src/views/system/role/option.js new file mode 100644 index 0000000..dde34e4 --- /dev/null +++ b/Source/plt-web/plt-web-ui/src/views/system/role/option.js @@ -0,0 +1,33 @@ +export const column = [ + { + label: '鍚嶇О', + prop: 'name', + sortable: true, + row:true, + span:22, + icon: 'el-icon-edit-outline', + rules: [ + { + required: true, + message: '璇疯緭鍏ュ鍚�', + trigger: 'blur' + } + ] + }, + { + label: '瑙掕壊绫诲瀷', + prop: 'roleClassifyText', + sortable: true, + display:false + }, + { + label: '鎻忚堪', + prop: 'description', + type:'textarea', + span:22, + minRows:8, + row:true, + sortable: true, + }, + +] diff --git a/Source/plt-web/plt-web-ui/src/views/system/user/index.vue b/Source/plt-web/plt-web-ui/src/views/system/user/index.vue index 1970aa3..2303278 100644 --- a/Source/plt-web/plt-web-ui/src/views/system/user/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/system/user/index.vue @@ -62,7 +62,7 @@ <el-button icon="el-icon-user" plain size="small" type="primary" @click="roleHandler">鍒嗛厤瑙掕壊</el-button> <el-button icon="el-icon-school" plain size="small" type="primary" @click="departmentHandler">鍒嗛厤閮ㄩ棬</el-button> <el-button icon="el-icon-key" plain size="small" type="success" @click="setPwsHandler">璁剧疆瀵嗙爜绛栫暐</el-button> - <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadRole">瀵煎叆浜哄憳</el-button> + <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadUser">瀵煎叆浜哄憳</el-button> <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadHandler">涓嬭浇瀵煎叆妯℃澘</el-button> </template> </avue-crud> @@ -100,7 +100,7 @@ </el-dialog> <!-- 瀵煎叆浜哄憳 --> - <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" title="瀵煎叆浜哄憳"></upload-file> + <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" title="瀵煎叆浜哄憳" @updata="getTableList"></upload-file> <!-- 鍒嗛厤閮ㄩ棬瀵硅瘽妗� --> <el-dialog @@ -489,7 +489,7 @@ }, // 瀵煎叆浜哄憳 - uploadRole() { + uploadUser() { this.$refs.upload.visible = true; }, diff --git a/Source/plt-web/plt-web-ui/src/views/system/user/option.js b/Source/plt-web/plt-web-ui/src/views/system/user/option.js index 07f7c2b..d302eb2 100644 --- a/Source/plt-web/plt-web-ui/src/views/system/user/option.js +++ b/Source/plt-web/plt-web-ui/src/views/system/user/option.js @@ -1,4 +1,4 @@ -export let column = [ +export const column = [ { label: '璐﹀彿', prop: 'id', @@ -61,7 +61,6 @@ prop: 'status', display:false, sortable:true, - slot: true, }, { label: '瀵嗙爜绛栫暐', @@ -81,8 +80,6 @@ align:'center', search:true, sortable:true, - searchslot:true, - formslot:true, }, { label: '涓撲笟', -- Gitblit v1.9.3