| | |
|---|
| | | <template>
|
|---|
| | | <div class="app-container">
|
|---|
| | | <el-row :gutter="20">
|
|---|
| | | <splitpanes class="default-theme">
|
|---|
| | | <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
|
|---|
| | | <!--部门数据-->
|
|---|
| | | <pane size="16">
|
|---|
| | | <el-col>
|
|---|
| | |
|---|
| | | </el-col>
|
|---|
| | | </pane>
|
|---|
| | | <!--用户数据-->
|
|---|
| | | <pane>
|
|---|
| | | <el-col size="84">
|
|---|
| | | <pane size="84">
|
|---|
| | | <el-col>
|
|---|
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|---|
| | | <el-form-item label="用户名称" prop="userName">
|
|---|
| | | <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
|
|---|
| | |
|---|
| | | </el-col>
|
|---|
| | | <el-col :span="12">
|
|---|
| | | <el-form-item label="归属部门" prop="deptId">
|
|---|
| | | <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
|
|---|
| | | <treeselect v-model="form.deptId" :options="enabledDeptOptions" :show-count="true" placeholder="请选择归属部门" />
|
|---|
| | | </el-form-item>
|
|---|
| | | </el-col>
|
|---|
| | | </el-row>
|
|---|
| | |
|---|
| | | userList: null,
|
|---|
| | | // 弹出层标题
|
|---|
| | | title: "",
|
|---|
| | | // 部门树选项
|
|---|
| | | // 所有部门树选项
|
|---|
| | | deptOptions: undefined,
|
|---|
| | | // 过滤掉已禁用部门树选项
|
|---|
| | | enabledDeptOptions: undefined,
|
|---|
| | | // 是否显示弹出层
|
|---|
| | | open: false,
|
|---|
| | | // 部门名称
|
|---|
| | |
|---|
| | | getDeptTree() {
|
|---|
| | | deptTreeSelect().then(response => {
|
|---|
| | | this.deptOptions = response.data;
|
|---|
| | | this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)));
|
|---|
| | | });
|
|---|
| | | },
|
|---|
| | | // 过滤禁用的部门
|
|---|
| | | filterDisabledDept(deptList) {
|
|---|
| | | return deptList.filter(dept => {
|
|---|
| | | if (dept.disabled) {
|
|---|
| | | return false;
|
|---|
| | | }
|
|---|
| | | if (dept.children && dept.children.length) {
|
|---|
| | | dept.children = this.filterDisabledDept(dept.children);
|
|---|
| | | }
|
|---|
| | | return true;
|
|---|
| | | });
|
|---|
| | | },
|
|---|
| | | // 筛选节点
|
|---|
