菜单&部门新增展开/折叠功能
This commit is contained in:
parent
14c6c796e8
commit
9ae5edaa74
|
@ -37,14 +37,24 @@
|
||||||
v-hasPermi="['system:dept:add']"
|
v-hasPermi="['system:dept:add']"
|
||||||
>新增</el-button>
|
>新增</el-button>
|
||||||
</el-col>
|
</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>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table
|
||||||
|
v-if="refreshTable"
|
||||||
v-loading="loading"
|
v-loading="loading"
|
||||||
:data="deptList"
|
:data="deptList"
|
||||||
row-key="deptId"
|
row-key="deptId"
|
||||||
default-expand-all
|
:default-expand-all="isExpandAll"
|
||||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
||||||
>
|
>
|
||||||
<el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
|
<el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
|
||||||
|
@ -164,6 +174,12 @@ export default {
|
||||||
title: "",
|
title: "",
|
||||||
// 是否显示弹出层
|
// 是否显示弹出层
|
||||||
open: false,
|
open: false,
|
||||||
|
// 是否展开,默认全部展开
|
||||||
|
isExpandAll: true,
|
||||||
|
// 重新渲染表格状态
|
||||||
|
refreshTable: true,
|
||||||
|
// 是否展开
|
||||||
|
expand: false,
|
||||||
// 状态数据字典
|
// 状态数据字典
|
||||||
statusOptions: [],
|
statusOptions: [],
|
||||||
// 查询参数
|
// 查询参数
|
||||||
|
@ -267,6 +283,14 @@ export default {
|
||||||
this.deptOptions = this.handleTree(response.data, "deptId");
|
this.deptOptions = this.handleTree(response.data, "deptId");
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
/** 展开/折叠操作 */
|
||||||
|
toggleExpandAll() {
|
||||||
|
this.refreshTable = false;
|
||||||
|
this.isExpandAll = !this.isExpandAll;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.refreshTable = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
/** 修改按钮操作 */
|
/** 修改按钮操作 */
|
||||||
handleUpdate(row) {
|
handleUpdate(row) {
|
||||||
this.reset();
|
this.reset();
|
||||||
|
|
|
@ -37,13 +37,24 @@
|
||||||
v-hasPermi="['system:menu:add']"
|
v-hasPermi="['system:menu:add']"
|
||||||
>新增</el-button>
|
>新增</el-button>
|
||||||
</el-col>
|
</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>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table
|
||||||
|
v-if="refreshTable"
|
||||||
v-loading="loading"
|
v-loading="loading"
|
||||||
:data="menuList"
|
:data="menuList"
|
||||||
row-key="menuId"
|
row-key="menuId"
|
||||||
|
:default-expand-all="isExpandAll"
|
||||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
||||||
>
|
>
|
||||||
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
|
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
|
||||||
|
@ -275,6 +286,10 @@ export default {
|
||||||
title: "",
|
title: "",
|
||||||
// 是否显示弹出层
|
// 是否显示弹出层
|
||||||
open: false,
|
open: false,
|
||||||
|
// 是否展开,默认全部折叠
|
||||||
|
isExpandAll: false,
|
||||||
|
// 重新渲染表格状态
|
||||||
|
refreshTable: true,
|
||||||
// 显示状态数据字典
|
// 显示状态数据字典
|
||||||
visibleOptions: [],
|
visibleOptions: [],
|
||||||
// 菜单状态数据字典
|
// 菜单状态数据字典
|
||||||
|
@ -384,6 +399,14 @@ export default {
|
||||||
this.open = true;
|
this.open = true;
|
||||||
this.title = "添加菜单";
|
this.title = "添加菜单";
|
||||||
},
|
},
|
||||||
|
/** 展开/折叠操作 */
|
||||||
|
toggleExpandAll() {
|
||||||
|
this.refreshTable = false;
|
||||||
|
this.isExpandAll = !this.isExpandAll;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.refreshTable = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
/** 修改按钮操作 */
|
/** 修改按钮操作 */
|
||||||
handleUpdate(row) {
|
handleUpdate(row) {
|
||||||
this.reset();
|
this.reset();
|
||||||
|
|
Loading…
Reference in New Issue