From 0f1d2b6c0e9879ebbf3cbc51dd7c0748820a3d38 Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期二, 20 八月 2024 17:25:34 +0800
Subject: [PATCH] login
---
se-ui/src/views/system/role/index.vue | 294 ++++++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 220 insertions(+), 74 deletions(-)
diff --git a/se-ui/src/views/system/role/index.vue b/se-ui/src/views/system/role/index.vue
index fb3b5ef..3116194 100644
--- a/se-ui/src/views/system/role/index.vue
+++ b/se-ui/src/views/system/role/index.vue
@@ -20,12 +20,7 @@
/>
</el-form-item>
<el-form-item label="鐘舵��" prop="status">
- <el-select
- v-model="queryParams.status"
- placeholder="瑙掕壊鐘舵��"
- clearable
- style="width: 240px"
- >
+ <el-select v-model="queryParams.status" placeholder="瑙掕壊鐘舵��" clearable style="width: 240px">
<el-option
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
@@ -97,7 +92,12 @@
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
- <el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange">
+ <el-table
+ v-loading="loading"
+ :data="roleList"
+ @selection-change="handleSelectionChange"
+ highlight-current-row
+ >
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="瑙掕壊缂栧彿" prop="roleId" width="120" />
<el-table-column label="瑙掕壊鍚嶇О" prop="roleName" :show-overflow-tooltip="true" width="150" />
@@ -134,13 +134,23 @@
@click="handleDelete(scope.row)"
v-hasPermi="['system:role:remove']"
>鍒犻櫎</el-button>
- <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:role:edit']">
+ <el-dropdown
+ size="mini"
+ @command="(command) => handleCommand(command, scope.row)"
+ v-hasPermi="['system:role:edit']"
+ >
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">鏇村</el-button>
<el-dropdown-menu slot="dropdown">
- <el-dropdown-item command="handleDataScope" icon="el-icon-circle-check"
- v-hasPermi="['system:role:edit']">鏁版嵁鏉冮檺</el-dropdown-item>
- <el-dropdown-item command="handleAuthUser" icon="el-icon-user"
- v-hasPermi="['system:role:edit']">鍒嗛厤鐢ㄦ埛</el-dropdown-item>
+ <el-dropdown-item
+ command="handleDataScope"
+ icon="el-icon-circle-check"
+ v-hasPermi="['system:role:edit']"
+ >鏁版嵁鏉冮檺</el-dropdown-item>
+ <el-dropdown-item
+ command="handleAuthUser"
+ icon="el-icon-user"
+ v-hasPermi="['system:role:edit']"
+ >鍒嗛厤鐢ㄦ埛</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
@@ -156,7 +166,82 @@
/>
<!-- 娣诲姞鎴栦慨鏀硅鑹查厤缃璇濇 -->
- <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+ <el-drawer
+ title="淇℃伅淇敼"
+ :visible.sync="open"
+ direction="rtl"
+ custom-class="demo-drawer"
+ ref="drawer"
+ append-to-body
+ >
+ <div class="demo-drawer__content">
+ <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+ <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
+ <el-input v-model="form.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" />
+ </el-form-item>
+ <el-form-item prop="roleKey">
+ <span slot="label">
+ <el-tooltip
+ content="鎺у埗鍣ㄤ腑瀹氫箟鐨勬潈闄愬瓧绗︼紝濡傦細@PreAuthorize(`@ss.hasRole('admin')`)"
+ placement="top"
+ >
+ <i class="el-icon-question"></i>
+ </el-tooltip>鏉冮檺瀛楃
+ </span>
+ <el-input v-model="form.roleKey" placeholder="璇疯緭鍏ユ潈闄愬瓧绗�" />
+ </el-form-item>
+ <el-form-item label="瑙掕壊椤哄簭" prop="roleSort">
+ <el-input-number v-model="form.roleSort" controls-position="right" :min="0" />
+ </el-form-item>
+ <el-form-item label="鐘舵��">
+ <el-radio-group v-model="form.status">
+ <el-radio
+ v-for="dict in dict.type.sys_normal_disable"
+ :key="dict.value"
+ :label="dict.value"
+ >{{dict.label}}</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ <el-form-item label="鑿滃崟鏉冮檺">
+ <el-checkbox
+ v-model="menuExpand"
+ @change="handleCheckedTreeExpand($event, 'menu')"
+ >灞曞紑/鎶樺彔</el-checkbox>
+ <el-checkbox
+ v-model="menuNodeAll"
+ @change="handleCheckedTreeNodeAll($event, 'menu')"
+ >鍏ㄩ��/鍏ㄤ笉閫�</el-checkbox>
+ <el-checkbox
+ v-model="form.menuCheckStrictly"
+ @change="handleCheckedTreeConnect($event, 'menu')"
+ >鐖跺瓙鑱斿姩</el-checkbox>
+ <el-tree
+ class="tree-border"
+ :data="menuOptions"
+ show-checkbox
+ ref="menu"
+ node-key="id"
+ :check-strictly="!form.menuCheckStrictly"
+ empty-text="鍔犺浇涓紝璇风◢鍊�"
+ :props="defaultProps"
+ ></el-tree>
+ </el-form-item>
+ <el-form-item label="澶囨敞">
+ <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
+ </el-form-item>
+ </el-form>
+ <div class="demo-drawer__footer">
+ <!-- <el-button >鍙� 娑�</el-button>
+ <el-button
+ type="primary"
+ @click="$refs.drawer.closeDrawer()"
+ :loading="loading"
+ >{{ loading ? '鎻愪氦涓� ...' : '纭� 瀹�' }}</el-button>-->
+ </div>
+ </div>
+ </el-drawer>
+
+ <!-- <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
<el-input v-model="form.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" />
@@ -205,7 +290,7 @@
<el-button type="primary" @click="submitForm">纭� 瀹�</el-button>
<el-button @click="cancel">鍙� 娑�</el-button>
</div>
- </el-dialog>
+ </el-dialog>-->
<!-- 鍒嗛厤瑙掕壊鏁版嵁鏉冮檺瀵硅瘽妗� -->
<el-dialog :title="title" :visible.sync="openDataScope" width="500px" append-to-body>
@@ -228,8 +313,14 @@
</el-form-item>
<el-form-item label="鏁版嵁鏉冮檺" v-show="form.dataScope == 2">
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">灞曞紑/鎶樺彔</el-checkbox>
- <el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">鍏ㄩ��/鍏ㄤ笉閫�</el-checkbox>
- <el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">鐖跺瓙鑱斿姩</el-checkbox>
+ <el-checkbox
+ v-model="deptNodeAll"
+ @change="handleCheckedTreeNodeAll($event, 'dept')"
+ >鍏ㄩ��/鍏ㄤ笉閫�</el-checkbox>
+ <el-checkbox
+ v-model="form.deptCheckStrictly"
+ @change="handleCheckedTreeConnect($event, 'dept')"
+ >鐖跺瓙鑱斿姩</el-checkbox>
<el-tree
class="tree-border"
:data="deptOptions"
@@ -252,12 +343,24 @@
</template>
<script>
-import { listRole, getRole, delRole, addRole, updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role";
-import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu";
+import {
+ listRole,
+ getRole,
+ delRole,
+ addRole,
+ updateRole,
+ dataScope,
+ changeRoleStatus,
+ deptTreeSelect
+} from "@/api/system/role";
+import {
+ treeselect as menuTreeselect,
+ roleMenuTreeselect
+} from "@/api/system/menu";
export default {
name: "Role",
- dicts: ['sys_normal_disable'],
+ dicts: ["sys_normal_disable"],
data() {
return {
// 閬僵灞�
@@ -338,7 +441,9 @@
roleSort: [
{ required: true, message: "瑙掕壊椤哄簭涓嶈兘涓虹┖", trigger: "blur" }
]
- }
+ },
+ refreshTable: true,
+ timer: null
};
},
created() {
@@ -348,7 +453,8 @@
/** 鏌ヨ瑙掕壊鍒楄〃 */
getList() {
this.loading = true;
- listRole(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+ listRole(this.addDateRange(this.queryParams, this.dateRange)).then(
+ response => {
this.roleList = response.rows;
this.total = response.total;
this.loading = false;
@@ -396,13 +502,17 @@
// 瑙掕壊鐘舵�佷慨鏀�
handleStatusChange(row) {
let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
- this.$modal.confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚楋紵').then(function() {
- return changeRoleStatus(row.roleId, row.status);
- }).then(() => {
- this.$modal.msgSuccess(text + "鎴愬姛");
- }).catch(function() {
- row.status = row.status === "0" ? "1" : "0";
- });
+ this.$modal
+ .confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚楋紵')
+ .then(function() {
+ return changeRoleStatus(row.roleId, row.status);
+ })
+ .then(() => {
+ this.$modal.msgSuccess(text + "鎴愬姛");
+ })
+ .catch(function() {
+ row.status = row.status === "0" ? "1" : "0";
+ });
},
// 鍙栨秷鎸夐挳
cancel() {
@@ -419,22 +529,22 @@
if (this.$refs.menu != undefined) {
this.$refs.menu.setCheckedKeys([]);
}
- this.menuExpand = false,
- this.menuNodeAll = false,
- this.deptExpand = true,
- this.deptNodeAll = false,
- this.form = {
- roleId: undefined,
- roleName: undefined,
- roleKey: undefined,
- roleSort: 0,
- status: "0",
- menuIds: [],
- deptIds: [],
- menuCheckStrictly: true,
- deptCheckStrictly: true,
- remark: undefined
- };
+ (this.menuExpand = false),
+ (this.menuNodeAll = false),
+ (this.deptExpand = true),
+ (this.deptNodeAll = false),
+ (this.form = {
+ roleId: undefined,
+ roleName: undefined,
+ roleKey: undefined,
+ roleSort: 0,
+ status: "0",
+ menuIds: [],
+ deptIds: [],
+ menuCheckStrictly: true,
+ deptCheckStrictly: true,
+ remark: undefined
+ });
this.resetForm("form");
},
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -450,9 +560,9 @@
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
- this.ids = selection.map(item => item.roleId)
- this.single = selection.length!=1
- this.multiple = !selection.length
+ this.ids = selection.map(item => item.roleId);
+ this.single = selection.length != 1;
+ this.multiple = !selection.length;
},
// 鏇村鎿嶄綔瑙﹀彂
handleCommand(command, row) {
@@ -469,12 +579,19 @@
},
// 鏍戞潈闄愶紙灞曞紑/鎶樺彔锛�
handleCheckedTreeExpand(value, type) {
- if (type == 'menu') {
+ if (type == "menu") {
let treeList = this.menuOptions;
for (let i = 0; i < treeList.length; i++) {
this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value;
+ // if (this.$refs.menu.store.nodesMap[treeList[i].id].childNodes) {
+ // let children = this.$refs.menu.store.nodesMap[treeList[i].id]
+ // .childNodes;
+ // for (let i = 0; i < children.length; i++) {
+ // children[i].expanded = value;
+ // }
+ // }
}
- } else if (type == 'dept') {
+ } else if (type == "dept") {
let treeList = this.deptOptions;
for (let i = 0; i < treeList.length; i++) {
this.$refs.dept.store.nodesMap[treeList[i].id].expanded = value;
@@ -483,18 +600,18 @@
},
// 鏍戞潈闄愶紙鍏ㄩ��/鍏ㄤ笉閫夛級
handleCheckedTreeNodeAll(value, type) {
- if (type == 'menu') {
- this.$refs.menu.setCheckedNodes(value ? this.menuOptions: []);
- } else if (type == 'dept') {
- this.$refs.dept.setCheckedNodes(value ? this.deptOptions: []);
+ if (type == "menu") {
+ this.$refs.menu.setCheckedNodes(value ? this.menuOptions : []);
+ } else if (type == "dept") {
+ this.$refs.dept.setCheckedNodes(value ? this.deptOptions : []);
}
},
// 鏍戞潈闄愶紙鐖跺瓙鑱斿姩锛�
handleCheckedTreeConnect(value, type) {
- if (type == 'menu') {
- this.form.menuCheckStrictly = value ? true: false;
- } else if (type == 'dept') {
- this.form.deptCheckStrictly = value ? true: false;
+ if (type == "menu") {
+ this.form.menuCheckStrictly = value ? true : false;
+ } else if (type == "dept") {
+ this.form.deptCheckStrictly = value ? true : false;
}
},
/** 鏂板鎸夐挳鎿嶄綔 */
@@ -507,19 +624,19 @@
/** 淇敼鎸夐挳鎿嶄綔 */
handleUpdate(row) {
this.reset();
- const roleId = row.roleId || this.ids
+ const roleId = row.roleId || this.ids;
const roleMenu = this.getRoleMenuTreeselect(roleId);
getRole(roleId).then(response => {
this.form = response.data;
this.open = true;
this.$nextTick(() => {
roleMenu.then(res => {
- let checkedKeys = res.checkedKeys
- checkedKeys.forEach((v) => {
- this.$nextTick(()=>{
- this.$refs.menu.setChecked(v, true ,false);
- })
- })
+ let checkedKeys = res.checkedKeys;
+ checkedKeys.forEach(v => {
+ this.$nextTick(() => {
+ this.$refs.menu.setChecked(v, true, false);
+ });
+ });
});
});
this.title = "淇敼瑙掕壊";
@@ -527,7 +644,7 @@
},
/** 閫夋嫨瑙掕壊鏉冮檺鑼冨洿瑙﹀彂 */
dataScopeSelectChange(value) {
- if(value !== '2') {
+ if (value !== "2") {
this.$refs.dept.setCheckedKeys([]);
}
},
@@ -587,18 +704,47 @@
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
const roleIds = row.roleId || this.ids;
- this.$modal.confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�"' + roleIds + '"鐨勬暟鎹」锛�').then(function() {
- return delRole(roleIds);
- }).then(() => {
- this.getList();
- this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(() => {});
+ this.$modal
+ .confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�"' + roleIds + '"鐨勬暟鎹」锛�')
+ .then(function() {
+ return delRole(roleIds);
+ })
+ .then(() => {
+ this.getList();
+ this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ })
+ .catch(() => {});
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
- this.download('system/role/export', {
- ...this.queryParams
- }, `role_${new Date().getTime()}.xlsx`)
+ this.download(
+ "system/role/export",
+ {
+ ...this.queryParams
+ },
+ `role_${new Date().getTime()}.xlsx`
+ );
+ },
+ handleClose(done) {
+ if (this.loading) {
+ return;
+ }
+ this.$confirm("纭畾瑕佹彁浜よ〃鍗曞悧锛�")
+ .then(_ => {
+ this.loading = true;
+ this.timer = setTimeout(() => {
+ done();
+ // 鍔ㄧ敾鍏抽棴闇�瑕佷竴瀹氱殑鏃堕棿
+ setTimeout(() => {
+ this.loading = false;
+ }, 400);
+ }, 2000);
+ })
+ .catch(_ => {});
+ },
+ cancelForm() {
+ this.loading = false;
+ clearTimeout(this.timer);
}
}
};
--
Gitblit v1.9.3