From 0c6be90e78c1f02a6ba20f219e7b3985af4aca91 Mon Sep 17 00:00:00 2001
From: 田源 <tianyuan@vci-tech.com>
Date: 星期三, 08 一月 2025 10:45:27 +0800
Subject: [PATCH] 按钮设计树结构添加判空不展示图标&&角色管理分配成员修改为行内展示
---
Source/plt-web/plt-web-ui/src/views/system/role/index.vue | 418 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 417 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..a32d588 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,426 @@
<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"
+ >
+ <template slot="menuLeft" slot-scope="scope">
+ <el-button v-if="permissionList.addBtn" class="button-custom-icon" size="small" type="primary"
+ @click="$refs.roleCrud.rowAdd()">
+ <icon-show :name="permissionList.addBtn.source"></icon-show>
+ 鏂� 澧�
+ </el-button>
+ <el-button v-if="permissionList.delBtn" class="button-custom-icon" plain size="small" type="danger"
+ @click="allDelHandler">
+ <icon-show :name="permissionList.delBtn.source"></icon-show>
+ 鍒犻櫎
+ </el-button>
+ <el-button v-if="permissionList.statisticsBtn" class="button-custom-icon" plain size="small" type="primary"
+ @click="statisticsHandler">
+ <icon-show :name="permissionList.statisticsBtn.source"></icon-show>
+ 缁熻
+ </el-button>
+ <el-button v-if="permissionList.importRoleBtn" class="button-custom-icon" plain size="small" type="primary"
+ @click="upLoadRole">
+ <icon-show :name="permissionList.importRoleBtn.source"></icon-show>
+ 瀵煎叆瑙掕壊
+ </el-button>
+ <el-button v-if="permissionList.exportBtn" class="button-custom-icon" plain size="small" type="primary">
+ <icon-show :name="permissionList.exportBtn.source"></icon-show>
+ 瀵煎嚭
+ </el-button>
+ </template>
+ <template slot="menu" slot-scope="{ row, index }">
+ <el-button
+ v-if="permissionList.assignMembersBtn"
+ size="small"
+ type="text"
+ @click="assignMembersHandler(row, index)"
+ >
+ <icon-show :name="permissionList.assignMembersBtn.source"></icon-show>
+ 鍒嗛厤鎴愬憳
+ </el-button>
+ <el-button
+ v-if="permissionList.editBtn"
+ size="small"
+ type="text"
+ @click="handleEdit(row, index)"
+ >
+ <icon-show :name="permissionList.editBtn.source"></icon-show>
+ 缂栬緫
+ </el-button>
+ <el-button
+ v-if="permissionList.delBtn"
+ size="small"
+ type="text"
+ @click="handleDel(row, index)"
+ >
+ <icon-show :name="permissionList.delBtn.source"></icon-show>
+ 鍒犻櫎
+ </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"
+ :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 icon="el-icon-close" size="small" type="danger" @click="statisticsVisible = false">鍏� 闂�</el-button>
+ </div>
+ </el-dialog>
+
+ <!-- 瀵煎叆瑙掕壊 -->
+ <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="瀵煎叆瑙掕壊"
+ @updata="getTableList"></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";
+import func from "@/util/func";
+import {mapGetters} from "vuex";
+
export default {
-name: "index"
+ name: "index",
+ data() {
+ return {
+ tableData: [],
+ 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,
+ header: false,
+ column: [
+ {
+ label: '閮ㄩ棬',
+ prop: 'pkDepartmentName',
+ sortable: true,
+ },
+ {
+ label: '鐢ㄦ埛鍚�',
+ prop: 'id',
+ sortable: true,
+ },
+ {
+ label: '鐪熷疄濮撳悕',
+ prop: 'name',
+ sortable: true,
+ },
+ {
+ label: '瑙掕壊',
+ prop: 'pkPersonName',
+ sortable: true,
+ overHidden: true,
+ },
+ ]
+ },
+ upFileType: ['xls', 'xlsx'],
+ fileUrl: 'api/roleQueryController/importRole',
+ tipList: ["瑙掕壊瀵煎叆鍙湁 鍚嶇О 鍜� 鎻忚堪 涓ゅ垪锛屼笖鍚嶇О涓哄繀杈撻」涓嶈兘涓虹┖"]
+ }
+ },
+ computed: {
+ ...mapGetters(["permission"]),
+ permissionList() {
+ return {
+ addBtn: this.vaildData(this.permission[this.$route.query.id].ADD, false),
+ delBtn: this.vaildData(this.permission[this.$route.query.id].DELETE, false),
+ editBtn: this.vaildData(this.permission[this.$route.query.id].EDIT, false),
+ exportBtn: this.vaildData(this.permission[this.$route.query.id].EXPORT, false),
+ assignMembersBtn: this.vaildData(this.permission[this.$route.query.id].FREEZE, false),
+ importRoleBtn: this.vaildData(this.permission[this.$route.query.id].IMPORT, false),
+ statisticsBtn: this.vaildData(this.permission[this.$route.query.id].DISCARD, false),
+ };
+ },
+ option() {
+ return {
+ ...basicOption,
+ addBtn: false,
+ delBtn: false,
+ editBtn: false,
+ dialogTop: 0,
+ dialogWidth: '30%',
+ column: column,
+ calcHeight: -60,
+ }
+ }
+ },
+ 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;
+ })
+ },
+
+ // 缂栬緫鎸夐挳
+ handleEdit(row, index) {
+ this.$refs.roleCrud.rowEdit(row, index);
+ },
+
+ // 鍒楀ご鍒锋柊
+ handleRefresh() {
+ this.getTableList()
+ },
+
+ // 鏉℃暟
+ sizeChange(val) {
+ this.page.pageSize = val;
+ },
+
+ // 椤电爜
+ currentChange(val) {
+ this.page.currentPage = val;
+ },
+
+ // 涓嬫媺
+ selectChange(row) {
+ this.selectList = row;
+ },
+
+ // 琛屽崟閫�
+ rowClickHandler(row) {
+ func.rowClickHandler(
+ row,
+ this.$refs.roleCrud,
+ this.lastIndex,
+ (newIndex) => {
+ this.lastIndex = newIndex;
+ },
+ () => {
+ this.selectList = [row];
+ }
+ );
+ },
+
+ // 娣诲姞
+ rowSaveHandler(row, done, loading) {
+ delete row.roleClassifyText;
+ addRole(row).then(res => {
+ if (res.data.code === 200) {
+ this.$message.success(res.data.obj);
+ this.getTableList();
+ done();
+ }
+ }).catch(err => {
+ console.log(err);
+ loading();
+ })
+ },
+
+ // 缂栬緫
+ rowUpdateHandler(row, index, done, loading) {
+ delete row.roleClassifyText;
+ updateRole(row).then(res => {
+ if (res.data.code === 200) {
+ this.$message.success(res.data.obj);
+ this.getTableList();
+ done();
+ }
+ }).catch(err => {
+ loading();
+ });
+ },
+
+ // 鍒犻櫎
+ handleDel(row, index) {
+ let params = {
+ ids: row.oid
+ }
+
+ 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: '宸插彇娑堝垹闄�'
+ });
+ });
+ },
+
+ // 澶氶�夊垹闄�
+ 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(row,index) {
+ // if (this.selectList.length <= 0) {
+ // this.$message.warning('璇烽�夋嫨瑙掕壊杩涜鎴愬憳鍒嗛厤锛�');
+ // return;
+ // }
+ //
+ // if (this.selectList.length > 1) {
+ // this.$message.warning('涓�娆″彧鑳藉涓�涓鑹茶繘琛屽垎閰嶆垚鍛樻搷浣滐紒');
+ // return;
+ // }
+ Promise.all([
+ listUserUnInRoleOid({pkRole: row.oid}),
+ listUserByRoleOid({pkRole: row.oid})
+ ]).then(([unInRoleRes, byRoleRes]) => {
+ this.leftRoleData = [];
+ this.rightRoleData = [];
+ 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;
+ }
+ });
+
+ },
+
+ // 鍒嗛厤鎴愬憳绌挎妗嗗洖濉�
+ roleSendHandler(row) {
+ let params = {
+ userOids: row.join(','),
+ roleId: this.selectList[0].oid
+ }
+ saveRight(params).then(res => {
+ this.$message.success(res.data.obj);
+ this.getTableList();
+ })
+ },
+
+ // 缁熻
+ 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 => {
+ 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;
+ }
+ })
+ },
+
+ // 瀵煎叆瑙掕壊
+ upLoadRole() {
+ this.$refs.upload.visible = true;
+ }
+ }
}
</script>
--
Gitblit v1.9.3