BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 1b2dc570de9bca616f664838c147e9f81fdc2f1c

Authored by YunaiV
1 parent f564137f

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

Inline Side-by-side
Showing 2 changed files with 36 additions and 3 deletions
yudao-ui-admin/src/views/system/dept/index.vue
  View file @1b2dc57
... ... @@ -17,12 +17,16 @@
17 17  
18 18 <el-row :gutter="10" class="mb8">
19 19 <el-col :span="1.5">
20   - <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:dept:create']">新增</el-button>
  20 + <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
  21 + v-hasPermi="['system:dept:create']">新增</el-button>
  22 + </el-col>
  23 + <el-col :span="1.5">
  24 + <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
21 25 </el-col>
22 26 <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
23 27 </el-row>
24 28  
25   - <el-table v-loading="loading" :data="deptList" row-key="id" default-expand-all
  29 + <el-table v-if="refreshTable" v-loading="loading" :data="deptList" row-key="id" :default-expand-all="isExpandAll"
26 30 :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
27 31 <el-table-column prop="name" label="部门名称" width="260"></el-table-column>
28 32 <el-table-column prop="leader" label="负责人" :formatter="userNicknameFormat" width="120"/>
... ... @@ -131,6 +135,12 @@ export default {
131 135 title: "",
132 136 // 是否显示弹出层
133 137 open: false,
  138 + // 是否展开，默认全部展开
  139 + isExpandAll: true,
  140 + // 重新渲染表格状态
  141 + refreshTable: true,
  142 + // 是否展开
  143 + expand: false,
134 144 // 状态数据字典
135 145 statusOptions: [],
136 146 // 查询参数
... ... @@ -255,6 +265,14 @@ export default {
255 265 this.deptOptions = this.handleTree(response.data, "id");
256 266 });
257 267 },
  268 + /** 展开/折叠操作 */
  269 + toggleExpandAll() {
  270 + this.refreshTable = false;
  271 + this.isExpandAll = !this.isExpandAll;
  272 + this.$nextTick(() => {
  273 + this.refreshTable = true;
  274 + });
  275 + },
258 276 /** 修改按钮操作 */
259 277 handleUpdate(row) {
260 278 this.reset();
... ...
yudao-ui-admin/src/views/system/menu/index.vue
  View file @1b2dc57
... ... @@ -20,10 +20,13 @@
20 20 <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
21 21 v-hasPermi="['system:menu:create']">新增</el-button>
22 22 </el-col>
  23 + <el-col :span="1.5">
  24 + <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
  25 + </el-col>
23 26 <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
24 27 </el-row>
25 28  
26   - <el-table v-loading="loading" :data="menuList" row-key="id"
  29 + <el-table v-if="refreshTable" v-loading="loading" :data="menuList" row-key="id" :default-expand-all="isExpandAll"
27 30 :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
28 31 <el-table-column prop="name" label="菜单名称" :show-overflow-tooltip="true" width="250"></el-table-column>
29 32 <el-table-column prop="icon" label="图标" align="center" width="100">
... ... @@ -155,6 +158,10 @@ export default {
155 158 title: "",
156 159 // 是否显示弹出层
157 160 open: false,
  161 + // 是否展开，默认全部折叠
  162 + isExpandAll: false,
  163 + // 重新渲染表格状态
  164 + refreshTable: true,
158 165 // 查询参数
159 166 queryParams: {
160 167 name: undefined,
... ... @@ -249,6 +256,14 @@ export default {
249 256 this.resetForm("queryForm");
250 257 this.handleQuery();
251 258 },
  259 + /** 展开/折叠操作 */
  260 + toggleExpandAll() {
  261 + this.refreshTable = false;
  262 + this.isExpandAll = !this.isExpandAll;
  263 + this.$nextTick(() => {
  264 + this.refreshTable = true;
  265 + });
  266 + },
252 267 /** 新增按钮操作 */
253 268 handleAdd(row) {
254 269 this.reset();
... ...