修改树形选择器组件

master
RuoYi 2 years ago
parent b2294592f9
commit cc844b6b7c
  1. 18
      src/views/system/dept/index.vue
  2. 18
      src/views/system/menu/index.vue
  3. 10
      src/views/system/user/index.vue

@ -97,11 +97,13 @@
<el-row> <el-row>
<el-col :span="24" v-if="form.parentId !== 0"> <el-col :span="24" v-if="form.parentId !== 0">
<el-form-item label="上级部门" prop="parentId"> <el-form-item label="上级部门" prop="parentId">
<tree-select <el-tree-select
v-model:value="form.parentId" v-model="form.parentId"
:options="deptOptions" :data="deptOptions"
:objMap="{ value: 'deptId', label: 'deptName', children: 'children' }" :props="{ value: 'deptId', label: 'deptName', children: 'children' }"
value-key="deptId"
placeholder="选择上级部门" placeholder="选择上级部门"
check-strictly
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -222,9 +224,9 @@ function resetQuery() {
handleQuery(); handleQuery();
} }
/** 新增按钮操作 */ /** 新增按钮操作 */
async function handleAdd(row) { function handleAdd(row) {
reset(); reset();
await listDept().then(response => { listDept().then(response => {
deptOptions.value = proxy.handleTree(response.data, "deptId"); deptOptions.value = proxy.handleTree(response.data, "deptId");
}); });
if (row != undefined) { if (row != undefined) {
@ -242,9 +244,9 @@ function toggleExpandAll() {
}); });
} }
/** 修改按钮操作 */ /** 修改按钮操作 */
async function handleUpdate(row) { function handleUpdate(row) {
reset(); reset();
await listDeptExcludeChild(row.deptId).then(response => { listDeptExcludeChild(row.deptId).then(response => {
deptOptions.value = proxy.handleTree(response.data, "deptId"); deptOptions.value = proxy.handleTree(response.data, "deptId");
}); });
getDept(row.deptId).then(response => { getDept(row.deptId).then(response => {

@ -103,11 +103,13 @@
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="上级菜单"> <el-form-item label="上级菜单">
<tree-select <el-tree-select
v-model:value="form.parentId" v-model="form.parentId"
:options="menuOptions" :data="menuOptions"
:objMap="{ value: 'menuId', label: 'menuName', children: 'children' }" :props="{ value: 'menuId', label: 'menuName', children: 'children' }"
value-key="menuId"
placeholder="选择上级菜单" placeholder="选择上级菜单"
check-strictly
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -332,9 +334,9 @@ function getList() {
}); });
} }
/** 查询菜单下拉树结构 */ /** 查询菜单下拉树结构 */
async function getTreeselect() { function getTreeselect() {
menuOptions.value = []; menuOptions.value = [];
await listMenu().then(response => { listMenu().then(response => {
const menu = { menuId: 0, menuName: "主类目", children: [] }; const menu = { menuId: 0, menuName: "主类目", children: [] };
menu.children = proxy.handleTree(response.data, "menuId"); menu.children = proxy.handleTree(response.data, "menuId");
menuOptions.value.push(menu); menuOptions.value.push(menu);
@ -386,9 +388,9 @@ function resetQuery() {
handleQuery(); handleQuery();
} }
/** 新增按钮操作 */ /** 新增按钮操作 */
async function handleAdd(row) { function handleAdd(row) {
reset(); reset();
await getTreeselect(); getTreeselect();
if (row != null && row.menuId) { if (row != null && row.menuId) {
form.value.parentId = row.menuId; form.value.parentId = row.menuId;
} else { } else {

@ -207,11 +207,13 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="归属部门" prop="deptId"> <el-form-item label="归属部门" prop="deptId">
<tree-select <el-tree-select
v-model:value="form.deptId" v-model="form.deptId"
:options="deptOptions" :data="deptOptions"
:props="{ value: 'id', label: 'label', children: 'children' }"
value-key="id"
placeholder="请选择归属部门" placeholder="请选择归属部门"
:objMap="{ value: 'id', label: 'label', children: 'children' }" check-strictly
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>

Loading…
Cancel
Save