✨(component): 开放 tree-select 组件

package/component/src/component/countUp/index.vue

@@ -66,8 +66,8 @@ const printVal = useTransition(localStartVal, {
   disabled: !props.useEasing,
   transition:
     typeof props.easingFn === "string"
-      // @ts-ignore
+      ? // @ts-ignore
-      ? TransitionPresets[props.easingFn]
+        TransitionPresets[props.easingFn]
       : props.easingFn,
 });
 

package/component/src/component/tree/index.vue

@@ -57,7 +57,6 @@ const props = withDefaults(defineProps<TreeProps>(), {
   onlyIconControl: false,
   disabled: false,
   showLine: true,
-  selectedKey: "",
   replaceFields: () => {
     return {
       id: "id",

package/component/src/component/treeSelect/index.vue

@@ -8,6 +8,7 @@ export default {
 import "./index.less";
 import { computed, ref, watch } from "vue";
 import { getNode } from "../../utils/treeUtil";
+import { TreeSelectSize } from "./interface";
 
 export interface LayTreeSelect {
   data: any;
@@ -18,7 +19,7 @@ export interface LayTreeSelect {
   allowClear?: boolean;
   collapseTagsTooltip?: boolean;
   minCollapsedNum?: number;
-  size?: string;
+  size?: TreeSelectSize;
   checkStrictly?: boolean;
 }
 
@@ -66,7 +67,7 @@ const checkedKeys = computed({
 });
 
 watch(
-  [selectedValue],
+  selectedValue,
   () => {
     if (props.multiple) {
       multipleValue.value = selectedValue.value.map((value: any) => {

package/component/src/component/treeSelect/interface.ts

@@ -0,0 +1 @@
+export type TreeSelectSize = "lg" | "md" | "sm" | "xs";

package/component/src/index.ts

@@ -61,6 +61,7 @@ import LayDropdownSubMenu from "./component/dropdownSubMenu/index";
 import LayTab from "./component/tab/index";
 import LayTabItem from "./component/tabItem/index";
 import LayTree from "./component/tree/index";
+import LayTreeSelect from "./component/treeSelect/index";
 import LayTable from "./component/table/index";
 import LayPage from "./component/page/index";
 import LayTransfer from "./component/transfer/index";
@@ -180,6 +181,7 @@ const components: Record<string, Plugin> = {
   LaySpace,
   LayTag,
   LayTagInput,
+  LayTreeSelect
 };
 
 const install = (app: App, options?: InstallOptions): void => {
@@ -276,6 +278,7 @@ export {
   LaySpace,
   LayTag,
   LayTagInput,
+  LayTreeSelect,
   install,
 };
 

package/document-component/src/document/zh-CN/components/treeSelect.md

@@ -13,20 +13,18 @@
 ::: demo 使用 `lay-tree` 标签, 创建树形组件, @node-click 监听节点点击。
 
 <template>
-  <lay-tree-select v-model="value" :data="data"></lay-tree-select>
+  <lay-tree-select v-model="value1" :data="data1"></lay-tree-select>
 </template>
 
 <script setup>
 import { ref } from 'vue';
 
-const value = ref();
+const value1 = ref(1);
 
-const data = ref([{
+const data1 = ref([{
 	title: '一级1',
 	id: 1,
 	field: 'name1',
-	checked: true,
-	spread: true,
 	children: [{
 		title: '二级1-1 可允许跳转',
 		id: 3,
@@ -43,12 +41,10 @@ const data = ref([{
 				children: [{
 					title: '五级1-1-3-1-1',
 					id: 30,
-					field: ''
 				},
 				{
 					title: '五级1-1-3-1-2',
 					id: 31,
-					field: ''
 				}]
 			}]
 		},
@@ -59,7 +55,6 @@ const data = ref([{
 			children: [{
 				title: '四级1-1-1-1 可允许跳转',
 				id: 15,
-				field: '',
 				href: 'https://www.layui.com/doc/'
 			}]
 		},
@@ -70,7 +65,6 @@ const data = ref([{
 			children: [{
 				title: '四级1-1-2-1',
 				id: 32,
-				field: ''
 			}]
 		}]
 	},
@@ -81,13 +75,10 @@ const data = ref([{
 		children: [{
 			title: '三级1-2-1',
 			id: 9,
-			field: '',
-			disabled: true
 		},
 		{
 			title: '三级1-2-2',
 			id: 10,
-			field: ''
 		}]
 	},
 	{
@@ -109,38 +100,29 @@ const data = ref([{
 {
 	title: '一级2',
 	id: 2,
-	field: '',
-	spread: true,
 	children: [{
 		title: '二级2-1',
 		id: 5,
-		field: '',
 		spread: true,
 		children: [{
 			title: '三级2-1-1',
 			id: 11,
-			field: ''
 		},
 		{
 			title: '三级2-1-2',
 			id: 12,
-			field: ''
 		}]
 	},
 	{
 		title: '二级2-2',
 		id: 6,
-		field: '',
 		children: [{
 			title: '三级2-2-1',
 			id: 13,
-			field: ''
 		},
 		{
 			title: '三级2-2-2',
 			id: 14,
-			field: '',
-			disabled: true
 		}]
 	}]
 },
@@ -194,15 +176,15 @@ function handleClick(node) {
 ::: demo 使用 `lay-tree` 标签, 创建树形组件, @node-click 监听节点点击。
 
 <template>
-  <lay-tree-select v-model="value" :data="data" :disabled="true"></lay-tree-select>
+  <lay-tree-select v-model="value2" :data="data2" :disabled="true"></lay-tree-select>
 </template>
 
 <script setup>
 import { ref } from 'vue';
 
-const value = ref();
+const value2 = ref();
 
-const data = ref([{
+const data2 = ref([{
 	title: '一级1',
 	id: 1,
 	field: 'name1',

package/document-component/src/view/utils/menus.ts

@@ -191,6 +191,12 @@ const menus = [
         subTitle: "tagInput",
         path: "/zh-CN/components/tagInput",
       },
+      {
+        id: 39,
+        title: "树选择",
+        subTitle: "treeSelect",
+        path: "/zh-CN/components/treeSelect",
+      },
       {
         id: 40,
         title: "颜色选择器",