Browse Source

feat:树组件补充是否取消逻辑

deploy-dev
xuziqiang 4 months ago
parent
commit
ec94e2b5b4
  1. 1
      lib/component/tree/props.ts
  2. 17
      lib/component/tree/tree-api.vue

1
lib/component/tree/props.ts

@ -46,4 +46,5 @@ export const treeProps = {
type: Function, type: Function,
default: (data: any) => data, default: (data: any) => data,
}, },
cancelable: PropTypes.bool.def(false), // 选中树节点是否可以取消
}; };

17
lib/component/tree/tree-api.vue

@ -12,7 +12,7 @@
</div> </div>
<div style="min-height: 150px"> <div style="min-height: 150px">
<ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys"> <ns-tree v-if="treeData?.length" v-bind="getBindValue" :selectedKeys="selectedKeys">
<template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index"> <template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
<slot :name="item" v-bind="{ ...data, formModel } || {}"></slot> <slot :name="item" v-bind="{ ...data, formModel } || {}"></slot>
</template> </template>
@ -27,7 +27,7 @@
import { TreeDataItem } from 'ant-design-vue/es/tree/Tree'; import { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
import { useApi } from '/nerv-lib/use/use-api'; import { useApi } from '/nerv-lib/use/use-api';
import { AxiosRequestConfig } from 'axios'; import { AxiosRequestConfig } from 'axios';
import { get } from 'lodash-es'; import { get, isEmpty } from 'lodash-es';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { debounce } from 'lodash-es'; import { debounce } from 'lodash-es';
import { treeProps, treeFormProps } from '/nerv-lib/component/tree/props'; import { treeProps, treeFormProps } from '/nerv-lib/component/tree/props';
@ -35,7 +35,7 @@
defineOptions({ defineOptions({
name: 'NsTreeApi', name: 'NsTreeApi',
}); });
const emit = defineEmits(['update:treeData']); const emit = defineEmits(['update:treeData', 'select']);
// const model = defineModel('treeData'); // const model = defineModel('treeData');
const formElRef = ref(); const formElRef = ref();
@ -69,14 +69,25 @@
const isSticky: any = computed(() => { const isSticky: any = computed(() => {
return props.isSticky ? 'sticky' : 'static'; return props.isSticky ? 'sticky' : 'static';
}); });
const formFinish = debounce((data: object) => { const formFinish = debounce((data: object) => {
selectedKeys.value = []; selectedKeys.value = [];
getData(data); getData(data);
}, 200); }, 200);
const handleSelect = (keys: any, selectedRows: any) => {
if (props.cancelable || !isEmpty(keys)) {
selectedKeys.value = keys;
// props.onSelect && props.onSelect(keys, selectedRows);
emit('select', keys, selectedRows);
}
};
const getBindValue = computed(() => ({ const getBindValue = computed(() => ({
...attrs, ...attrs,
...props, ...props,
treeData: treeData.value, treeData: treeData.value,
onSelect: handleSelect,
})); }));
const setLoading = (loading: boolean) => { const setLoading = (loading: boolean) => {
treeState.loading = loading; treeState.loading = loading;

Loading…
Cancel
Save