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/views/system/role/index.vue | 325 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 324 insertions(+), 1 deletions(-)
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>
--
Gitblit v1.9.3