Merge remote-tracking branch 'origin/master'
This commit is contained in:
@@ -5,6 +5,7 @@
|
|||||||
v-model="deptFormData.parent"
|
v-model="deptFormData.parent"
|
||||||
:props="defaultTreeProps"
|
:props="defaultTreeProps"
|
||||||
:data="deptDefaultList"
|
:data="deptDefaultList"
|
||||||
|
:cache-data="props.cacheData"
|
||||||
lazy
|
lazy
|
||||||
check-strictly
|
check-strictly
|
||||||
:load="handleTreeLoad"
|
:load="handleTreeLoad"
|
||||||
@@ -43,6 +44,7 @@ import type Node from 'element-plus/es/components/tree/src/model/node';
|
|||||||
interface IProps {
|
interface IProps {
|
||||||
initFormData: TreeItemType | null;
|
initFormData: TreeItemType | null;
|
||||||
treeData: TreeItemType[];
|
treeData: TreeItemType[];
|
||||||
|
cacheData: TreeItemType[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const defaultTreeProps: any = {
|
const defaultTreeProps: any = {
|
||||||
@@ -67,6 +69,7 @@ const rules = reactive<FormRules>({
|
|||||||
const props = withDefaults(defineProps<IProps>(), {
|
const props = withDefaults(defineProps<IProps>(), {
|
||||||
initFormData: () => null,
|
initFormData: () => null,
|
||||||
treeData: () => [],
|
treeData: () => [],
|
||||||
|
cacheData: () => [],
|
||||||
});
|
});
|
||||||
const emit = defineEmits(['drawerClose']);
|
const emit = defineEmits(['drawerClose']);
|
||||||
|
|
||||||
|
|||||||
@@ -137,7 +137,7 @@ const handleLoadNode = (node: Node, resolve: Function) => {
|
|||||||
const handleNodeClick = (record: TreeItemType, node: Node) => {
|
const handleNodeClick = (record: TreeItemType, node: Node) => {
|
||||||
treeSelectDept.value = record;
|
treeSelectDept.value = record;
|
||||||
treeSelectNode.value = node;
|
treeSelectNode.value = node;
|
||||||
emit('treeClick', record.id);
|
emit('treeClick', record);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -198,6 +198,10 @@ const handleSort = async (type: string) => {
|
|||||||
sortDisable.value = false;
|
sortDisable.value = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
treeRef,
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -3,7 +3,13 @@
|
|||||||
<el-row class="dept-el-row">
|
<el-row class="dept-el-row">
|
||||||
<el-col :span="6">
|
<el-col :span="6">
|
||||||
<div class="dept-box dept-left">
|
<div class="dept-box dept-left">
|
||||||
<DeptTreeCom :treeData="deptTreeData" @treeClick="handleTreeClick" @updateDept="handleUpdateMenu" @deleteDept="handleDeleteMenu" />
|
<DeptTreeCom
|
||||||
|
ref="deptTreeRef"
|
||||||
|
:treeData="deptTreeData"
|
||||||
|
@treeClick="handleTreeClick"
|
||||||
|
@updateDept="handleUpdateMenu"
|
||||||
|
@deleteDept="handleDeleteMenu"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
@@ -15,7 +21,13 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-drawer v-model="drawerVisible" title="部门配置" direction="rtl" size="500px" :close-on-click-modal="false" :before-close="handleDrawerClose">
|
<el-drawer v-model="drawerVisible" title="部门配置" direction="rtl" size="500px" :close-on-click-modal="false" :before-close="handleDrawerClose">
|
||||||
<DeptFormCom v-if="drawerVisible" :initFormData="drawerFormData" :treeData="deptTreeData" @drawerClose="handleDrawerClose" />
|
<DeptFormCom
|
||||||
|
v-if="drawerVisible"
|
||||||
|
:initFormData="drawerFormData"
|
||||||
|
:treeData="deptTreeData"
|
||||||
|
:cacheData="deptTreeCacheData"
|
||||||
|
@drawerClose="handleDrawerClose"
|
||||||
|
/>
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
</fs-page>
|
</fs-page>
|
||||||
</template>
|
</template>
|
||||||
@@ -32,9 +44,11 @@ import { successNotification } from '../../../utils/message';
|
|||||||
import { APIResponseData, TreeItemType } from './types';
|
import { APIResponseData, TreeItemType } from './types';
|
||||||
|
|
||||||
let deptTreeData = ref([]);
|
let deptTreeData = ref([]);
|
||||||
|
let deptTreeCacheData = ref<TreeItemType[]>([]);
|
||||||
let drawerVisible = ref(false);
|
let drawerVisible = ref(false);
|
||||||
let drawerFormData = ref<Partial<TreeItemType>>({});
|
let drawerFormData = ref<Partial<TreeItemType>>({});
|
||||||
let deptUserRef = ref<InstanceType<typeof DeptUserCom> | null>(null);
|
let deptUserRef = ref<InstanceType<typeof DeptUserCom> | null>(null);
|
||||||
|
let deptTreeRef = ref<InstanceType<typeof DeptTreeCom> | null>(null);
|
||||||
|
|
||||||
const getData = async () => {
|
const getData = async () => {
|
||||||
let res: APIResponseData = await GetList({});
|
let res: APIResponseData = await GetList({});
|
||||||
@@ -53,8 +67,8 @@ const getData = async () => {
|
|||||||
/**
|
/**
|
||||||
* 部门的点击事件
|
* 部门的点击事件
|
||||||
*/
|
*/
|
||||||
const handleTreeClick = (id: string) => {
|
const handleTreeClick = (record: TreeItemType) => {
|
||||||
deptUserRef.value?.handleDoRefreshUser(id);
|
deptUserRef.value?.handleDoRefreshUser(record.id as string);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -81,6 +95,8 @@ const handleDeleteMenu = (id: string, callback: Function) => {
|
|||||||
*/
|
*/
|
||||||
const handleUpdateMenu = (type: string, record?: TreeItemType) => {
|
const handleUpdateMenu = (type: string, record?: TreeItemType) => {
|
||||||
if (type === 'update' && record) {
|
if (type === 'update' && record) {
|
||||||
|
const parentData = deptTreeRef.value?.treeRef?.currentNode.parent.data || {};
|
||||||
|
deptTreeCacheData.value = [parentData];
|
||||||
drawerFormData.value = record;
|
drawerFormData.value = record;
|
||||||
}
|
}
|
||||||
drawerVisible.value = true;
|
drawerVisible.value = true;
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ export interface FormType<T> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface TreeItemType {
|
export interface TreeItemType {
|
||||||
id?: number;
|
id?: number | string;
|
||||||
modifier_name?: string;
|
modifier_name?: string;
|
||||||
creator_name?: string;
|
creator_name?: string;
|
||||||
create_datetime?: string;
|
create_datetime?: string;
|
||||||
|
|||||||
@@ -14,6 +14,7 @@
|
|||||||
v-model="menuFormData.parent"
|
v-model="menuFormData.parent"
|
||||||
:props="defaultTreeProps"
|
:props="defaultTreeProps"
|
||||||
:data="deptDefaultList"
|
:data="deptDefaultList"
|
||||||
|
:cache-data="props.cacheData"
|
||||||
lazy
|
lazy
|
||||||
check-strictly
|
check-strictly
|
||||||
clearable
|
clearable
|
||||||
@@ -110,6 +111,7 @@ import type Node from 'element-plus/es/components/tree/src/model/node';
|
|||||||
interface IProps {
|
interface IProps {
|
||||||
initFormData: Partial<MenuTreeItemType> | null;
|
initFormData: Partial<MenuTreeItemType> | null;
|
||||||
treeData: MenuTreeItemType[];
|
treeData: MenuTreeItemType[];
|
||||||
|
cacheData: MenuTreeItemType[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const defaultTreeProps: any = {
|
const defaultTreeProps: any = {
|
||||||
@@ -136,6 +138,7 @@ const validateWebPath = (rule: any, value: string, callback: Function) => {
|
|||||||
const props = withDefaults(defineProps<IProps>(), {
|
const props = withDefaults(defineProps<IProps>(), {
|
||||||
initFormData: () => null,
|
initFormData: () => null,
|
||||||
treeData: () => [],
|
treeData: () => [],
|
||||||
|
cacheData: () => [],
|
||||||
});
|
});
|
||||||
const emit = defineEmits(['drawerClose']);
|
const emit = defineEmits(['drawerClose']);
|
||||||
|
|
||||||
|
|||||||
@@ -205,6 +205,10 @@ const handleSort = async (type: string) => {
|
|||||||
sortDisable.value = false;
|
sortDisable.value = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
treeRef,
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -3,7 +3,13 @@
|
|||||||
<el-row class="menu-el-row">
|
<el-row class="menu-el-row">
|
||||||
<el-col :span="6">
|
<el-col :span="6">
|
||||||
<div class="menu-box menu-left-box">
|
<div class="menu-box menu-left-box">
|
||||||
<MenuTreeCom :treeData="menuTreeData" @treeClick="handleTreeClick" @updateDept="handleUpdateMenu" @deleteDept="handleDeleteMenu" />
|
<MenuTreeCom
|
||||||
|
ref="menuTreeRef"
|
||||||
|
:treeData="menuTreeData"
|
||||||
|
@treeClick="handleTreeClick"
|
||||||
|
@updateDept="handleUpdateMenu"
|
||||||
|
@deleteDept="handleDeleteMenu"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
@@ -15,7 +21,13 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-drawer v-model="drawerVisible" title="菜单配置" direction="rtl" size="500px" :close-on-click-modal="false" :before-close="handleDrawerClose">
|
<el-drawer v-model="drawerVisible" title="菜单配置" direction="rtl" size="500px" :close-on-click-modal="false" :before-close="handleDrawerClose">
|
||||||
<MenuFormCom v-if="drawerVisible" :initFormData="drawerFormData" :treeData="menuTreeData" @drawerClose="handleDrawerClose" />
|
<MenuFormCom
|
||||||
|
v-if="drawerVisible"
|
||||||
|
:initFormData="drawerFormData"
|
||||||
|
:cacheData="menuTreeCacheData"
|
||||||
|
:treeData="menuTreeData"
|
||||||
|
@drawerClose="handleDrawerClose"
|
||||||
|
/>
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
</fs-page>
|
</fs-page>
|
||||||
</template>
|
</template>
|
||||||
@@ -31,10 +43,12 @@ import { GetList, DelObj } from './api';
|
|||||||
import { successNotification } from '/@/utils/message';
|
import { successNotification } from '/@/utils/message';
|
||||||
import { APIResponseData, MenuTreeItemType } from './types';
|
import { APIResponseData, MenuTreeItemType } from './types';
|
||||||
|
|
||||||
let menuButtonRef = ref<InstanceType<typeof MenuButtonCom> | null>(null);
|
|
||||||
let menuTreeData = ref([]);
|
let menuTreeData = ref([]);
|
||||||
|
let menuTreeCacheData = ref<MenuTreeItemType[]>([]);
|
||||||
let drawerVisible = ref(false);
|
let drawerVisible = ref(false);
|
||||||
let drawerFormData = ref<Partial<MenuTreeItemType>>({});
|
let drawerFormData = ref<Partial<MenuTreeItemType>>({});
|
||||||
|
let menuTreeRef = ref<InstanceType<typeof MenuTreeCom> | null>(null);
|
||||||
|
let menuButtonRef = ref<InstanceType<typeof MenuButtonCom> | null>(null);
|
||||||
|
|
||||||
const getData = () => {
|
const getData = () => {
|
||||||
GetList({}).then((ret: APIResponseData) => {
|
GetList({}).then((ret: APIResponseData) => {
|
||||||
@@ -60,6 +74,8 @@ const handleTreeClick = (record: MenuTreeItemType) => {
|
|||||||
*/
|
*/
|
||||||
const handleUpdateMenu = (type: string, record?: MenuTreeItemType) => {
|
const handleUpdateMenu = (type: string, record?: MenuTreeItemType) => {
|
||||||
if (type === 'update' && record) {
|
if (type === 'update' && record) {
|
||||||
|
const parentData = menuTreeRef.value?.treeRef?.currentNode.parent.data || {};
|
||||||
|
menuTreeCacheData.value = [parentData];
|
||||||
drawerFormData.value = record;
|
drawerFormData.value = record;
|
||||||
}
|
}
|
||||||
drawerVisible.value = true;
|
drawerVisible.value = true;
|
||||||
|
|||||||
Reference in New Issue
Block a user