chore: 调整分类树
This commit is contained in:
parent
e09e95c3f5
commit
b641b0eb15
@ -1,9 +1,22 @@
|
|||||||
import type { CategoryForm, CategoryQuery, CategoryVO } from './model';
|
import type {
|
||||||
|
CategoryForm,
|
||||||
|
CategoryQuery,
|
||||||
|
CategoryTree,
|
||||||
|
CategoryVO,
|
||||||
|
} from './model';
|
||||||
|
|
||||||
import type { ID, IDS } from '#/api/common';
|
import type { ID, IDS } from '#/api/common';
|
||||||
|
|
||||||
import { requestClient } from '#/api/request';
|
import { requestClient } from '#/api/request';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取流程分类树列表
|
||||||
|
* @returns tree
|
||||||
|
*/
|
||||||
|
export function categoryTree() {
|
||||||
|
return requestClient.get<CategoryTree[]>('/workflow/category/categoryTree');
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 查询流程分类列表
|
* 查询流程分类列表
|
||||||
* @param params
|
* @param params
|
||||||
|
@ -86,3 +86,12 @@ export interface CategoryQuery {
|
|||||||
*/
|
*/
|
||||||
params?: any;
|
params?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface CategoryTree {
|
||||||
|
id: number;
|
||||||
|
parentId: number;
|
||||||
|
label: string;
|
||||||
|
weight: number;
|
||||||
|
children: CategoryTree[];
|
||||||
|
key: string;
|
||||||
|
}
|
||||||
|
@ -1,14 +1,12 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { CategoryVO } from '#/api/workflow/category/model';
|
import type { CategoryTree } from '#/api/workflow/category/model';
|
||||||
|
|
||||||
import { onMounted, type PropType, ref } from 'vue';
|
import { onMounted, type PropType, ref } from 'vue';
|
||||||
|
|
||||||
import { listToTree } from '@vben/utils';
|
|
||||||
|
|
||||||
import { SyncOutlined } from '@ant-design/icons-vue';
|
import { SyncOutlined } from '@ant-design/icons-vue';
|
||||||
import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
|
import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
|
||||||
|
|
||||||
import { categoryList } from '#/api/workflow/category';
|
import { categoryTree } from '#/api/workflow/category';
|
||||||
|
|
||||||
defineOptions({ inheritAttrs: false });
|
defineOptions({ inheritAttrs: false });
|
||||||
|
|
||||||
@ -33,7 +31,7 @@ const searchValue = defineModel('searchValue', {
|
|||||||
default: '',
|
default: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
const categoryTreeArray = ref<CategoryVO[]>([]);
|
const categoryTreeArray = ref<CategoryTree[]>([]);
|
||||||
/** 骨架屏加载 */
|
/** 骨架屏加载 */
|
||||||
const showTreeSkeleton = ref<boolean>(true);
|
const showTreeSkeleton = ref<boolean>(true);
|
||||||
|
|
||||||
@ -42,11 +40,7 @@ async function loadTree() {
|
|||||||
searchValue.value = '';
|
searchValue.value = '';
|
||||||
selectCode.value = [];
|
selectCode.value = [];
|
||||||
|
|
||||||
const ret = await categoryList();
|
const treeData = await categoryTree();
|
||||||
const treeData = listToTree(ret, {
|
|
||||||
id: 'categoryId',
|
|
||||||
pid: 'parentId',
|
|
||||||
});
|
|
||||||
|
|
||||||
categoryTreeArray.value = treeData;
|
categoryTreeArray.value = treeData;
|
||||||
showTreeSkeleton.value = false;
|
showTreeSkeleton.value = false;
|
||||||
@ -91,14 +85,14 @@ onMounted(loadTree);
|
|||||||
v-if="categoryTreeArray.length > 0"
|
v-if="categoryTreeArray.length > 0"
|
||||||
v-model:selected-keys="selectCode"
|
v-model:selected-keys="selectCode"
|
||||||
:class="$attrs.class"
|
:class="$attrs.class"
|
||||||
:field-names="{ title: 'categoryName', key: 'categoryId' }"
|
:field-names="{ title: 'label', key: 'id' }"
|
||||||
:show-line="{ showLeafIcon: false }"
|
:show-line="{ showLeafIcon: false }"
|
||||||
:tree-data="categoryTreeArray"
|
:tree-data="categoryTreeArray"
|
||||||
:virtual="false"
|
:virtual="false"
|
||||||
default-expand-all
|
default-expand-all
|
||||||
@select="$emit('select')"
|
@select="$emit('select')"
|
||||||
>
|
>
|
||||||
<template #title="{ categoryName: label }">
|
<template #title="{ label }">
|
||||||
<span v-if="label.indexOf(searchValue) > -1">
|
<span v-if="label.indexOf(searchValue) > -1">
|
||||||
{{ label.substring(0, label.indexOf(searchValue)) }}
|
{{ label.substring(0, label.indexOf(searchValue)) }}
|
||||||
<span style="color: #f50">{{ searchValue }}</span>
|
<span style="color: #f50">{{ searchValue }}</span>
|
||||||
|
@ -70,9 +70,9 @@ const gridOptions: VxeGridProps = {
|
|||||||
query: async ({ page }, formValues = {}) => {
|
query: async ({ page }, formValues = {}) => {
|
||||||
// 部门树选择处理
|
// 部门树选择处理
|
||||||
if (selectedCode.value.length === 1) {
|
if (selectedCode.value.length === 1) {
|
||||||
formValues.categoryCode = selectedCode.value[0];
|
formValues.category = selectedCode.value[0];
|
||||||
} else {
|
} else {
|
||||||
Reflect.deleteProperty(formValues, 'categoryCode');
|
Reflect.deleteProperty(formValues, 'category');
|
||||||
}
|
}
|
||||||
|
|
||||||
return await workflowDefinitionList({
|
return await workflowDefinitionList({
|
||||||
|
@ -3,15 +3,10 @@ import { computed, ref } from 'vue';
|
|||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
import { $t } from '@vben/locales';
|
import { $t } from '@vben/locales';
|
||||||
import {
|
import { addFullName, cloneDeep, getPopupContainer } from '@vben/utils';
|
||||||
addFullName,
|
|
||||||
cloneDeep,
|
|
||||||
getPopupContainer,
|
|
||||||
listToTree,
|
|
||||||
} from '@vben/utils';
|
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form';
|
import { useVbenForm } from '#/adapter/form';
|
||||||
import { categoryList } from '#/api/workflow/category';
|
import { categoryTree } from '#/api/workflow/category';
|
||||||
import {
|
import {
|
||||||
workflowDefinitionAdd,
|
workflowDefinitionAdd,
|
||||||
workflowDefinitionInfo,
|
workflowDefinitionInfo,
|
||||||
@ -42,19 +37,15 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
|
|
||||||
async function setupCategorySelect() {
|
async function setupCategorySelect() {
|
||||||
// menu
|
// menu
|
||||||
const resp = await categoryList();
|
const tree = await categoryTree();
|
||||||
const tree = listToTree(resp, {
|
addFullName(tree, 'label', ' / ');
|
||||||
id: 'categoryId',
|
|
||||||
pid: 'parentId',
|
|
||||||
});
|
|
||||||
addFullName(tree, 'categoryName', ' / ');
|
|
||||||
|
|
||||||
formApi.updateSchema([
|
formApi.updateSchema([
|
||||||
{
|
{
|
||||||
componentProps: {
|
componentProps: {
|
||||||
fieldNames: {
|
fieldNames: {
|
||||||
label: 'categoryName',
|
label: 'label',
|
||||||
value: 'categoryId',
|
value: 'id',
|
||||||
},
|
},
|
||||||
getPopupContainer,
|
getPopupContainer,
|
||||||
// 设置弹窗滚动高度 默认256
|
// 设置弹窗滚动高度 默认256
|
||||||
@ -66,7 +57,7 @@ async function setupCategorySelect() {
|
|||||||
treeDefaultExpandedKeys: [0],
|
treeDefaultExpandedKeys: [0],
|
||||||
treeLine: { showLeafIcon: false },
|
treeLine: { showLeafIcon: false },
|
||||||
// 筛选的字段
|
// 筛选的字段
|
||||||
treeNodeFilterProp: 'categoryName',
|
treeNodeFilterProp: 'label',
|
||||||
treeNodeLabelProp: 'fullName',
|
treeNodeLabelProp: 'fullName',
|
||||||
},
|
},
|
||||||
fieldName: 'category',
|
fieldName: 'category',
|
||||||
|
Loading…
Reference in New Issue
Block a user