huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2024-11-26 17:21:53 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

v3.7.0 菜单&部门新增展开/折叠功能

Browse Source
This commit is contained in:
YunaiV 2022-02-17 11:30:31 +08:00
parent f564137f05
commit 1b2dc570de
2 changed files with 36 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
yudao-ui-admin/src/views/system/dept/index.vue
View File

@ -17,12 +17,16 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:dept:create']">新增</el-button>
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:dept:create']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="deptList" row-key="id" default-expand-all
<el-table v-if="refreshTable" v-loading="loading" :data="deptList" row-key="id" :default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column prop="name" label="部门名称" width="260"></el-table-column>
<el-table-column prop="leader" label="负责人" :formatter="userNicknameFormat" width="120"/>
@ -131,6 +135,12 @@ export default {
title: "",
// 是否显示弹出层
open: false,
// 是否展开，默认全部展开
isExpandAll: true,
// 重新渲染表格状态
refreshTable: true,
// 是否展开
expand: false,
// 状态数据字典
statusOptions: [],
// 查询参数
@ -255,6 +265,14 @@ export default {
this.deptOptions = this.handleTree(response.data, "id");
});
},
/** 展开/折叠操作 */
toggleExpandAll() {
this.refreshTable = false;
this.isExpandAll = !this.isExpandAll;
this.$nextTick(() => {
this.refreshTable = true;
});
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();

17
yudao-ui-admin/src/views/system/menu/index.vue
View File

@ -20,10 +20,13 @@
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:menu:create']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="menuList" row-key="id"
<el-table v-if="refreshTable" v-loading="loading" :data="menuList" row-key="id" :default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column prop="name" label="菜单名称" :show-overflow-tooltip="true" width="250"></el-table-column>
<el-table-column prop="icon" label="图标" align="center" width="100">
@ -155,6 +158,10 @@ export default {
title: "",
// 是否显示弹出层
open: false,
// 是否展开，默认全部折叠
isExpandAll: false,
// 重新渲染表格状态
refreshTable: true,
// 查询参数
queryParams: {
name: undefined,
@ -249,6 +256,14 @@ export default {
this.resetForm("queryForm");
this.handleQuery();
},
/** 展开/折叠操作 */
toggleExpandAll() {
this.refreshTable = false;
this.isExpandAll = !this.isExpandAll;
this.$nextTick(() => {
this.refreshTable = true;
});
},
/** 新增按钮操作 */
handleAdd(row) {
this.reset();