From 7cf58a4d2fff6b9cba9029d4d43ba9744dbef864 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期四, 18 七月 2024 15:49:03 +0800
Subject: [PATCH] 工单更新
---
src/views/demo/tree/index.vue | 156 +++++++++++++++++++++++----------------------------
1 files changed, 71 insertions(+), 85 deletions(-)
diff --git a/src/views/demo/tree/index.vue b/src/views/demo/tree/index.vue
index 1526fb3..da3f326 100644
--- a/src/views/demo/tree/index.vue
+++ b/src/views/demo/tree/index.vue
@@ -3,7 +3,9 @@
<Row :gutter="[16, 16]">
<Col :span="8">
<BasicTree title="鍩虹绀轰緥锛岄粯璁ゅ睍寮�绗竴灞�" :treeData="treeData" defaultExpandLevel="1">
- <template #title> 123123 </template>
+ <template #icon><SmileTwoTone style="font-size: 16px" /></template>
+ <template #title>666</template>
+ <template #switcherIcon> <CarryOutOutlined /></template>
</BasicTree>
</Col>
<Col :span="8">
@@ -53,96 +55,80 @@
</Row>
</PageWrapper>
</template>
-<script lang="ts">
- import { defineComponent, nextTick, ref, unref } from 'vue';
- import { BasicTree, TreeActionType, TreeItem } from '/@/components/Tree/index';
+<script lang="ts" setup>
+ import { nextTick, ref, unref } from 'vue';
+ import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { treeData } from './data';
- import { PageWrapper } from '/@/components/Page';
+ import { PageWrapper } from '@/components/Page';
import { Card, Row, Col, Spin } from 'ant-design-vue';
import { cloneDeep, uniq } from 'lodash-es';
- import { isArray } from '/@/utils/is';
+ import { isArray } from '@/utils/is';
+ import { type Nullable } from '@vben/types';
+ import { SmileTwoTone, CarryOutOutlined } from '@ant-design/icons-vue';
- export default defineComponent({
- components: { BasicTree, PageWrapper, Card, Row, Col, Spin },
- setup() {
- const asyncTreeRef = ref<Nullable<TreeActionType>>(null);
- const asyncExpandTreeRef = ref<Nullable<TreeActionType>>(null);
- const loadTreeRef = ref<Nullable<TreeActionType>>(null);
- const tree2 = ref<TreeItem[]>([]);
- const treeLoading = ref(false);
+ const asyncTreeRef = ref<Nullable<TreeActionType>>(null);
+ const asyncExpandTreeRef = ref<Nullable<TreeActionType>>(null);
+ const loadTreeRef = ref<Nullable<TreeActionType>>(null);
+ const tree2 = ref<TreeItem[]>([]);
+ const treeLoading = ref(false);
- function handleCheck(checkedKeys, e) {
- console.log('onChecked', checkedKeys, e);
- }
+ function handleCheck(checkedKeys, e) {
+ console.log('onChecked', checkedKeys, e);
+ }
- function loadTreeData() {
- treeLoading.value = true;
- // 浠ヤ笅鏄ā鎷熷紓姝ヨ幏鍙栨暟鎹�
- setTimeout(() => {
- // 璁剧疆鏁版嵁婧�
- tree2.value = cloneDeep(treeData);
- treeLoading.value = false;
- // 灞曞紑鍏ㄩ儴
- nextTick(() => {
- console.log(unref(asyncExpandTreeRef));
- unref(asyncExpandTreeRef)?.expandAll(true);
- });
- }, 2000);
- }
- function loadTreeData2() {
- treeLoading.value = true;
- // 浠ヤ笅鏄ā鎷熷紓姝ヨ幏鍙栨暟鎹�
- setTimeout(() => {
- // 璁剧疆鏁版嵁婧�
- tree2.value = cloneDeep(treeData);
- treeLoading.value = false;
- }, 2000);
- }
+ function loadTreeData() {
+ treeLoading.value = true;
+ // 浠ヤ笅鏄ā鎷熷紓姝ヨ幏鍙栨暟鎹�
+ setTimeout(() => {
+ // 璁剧疆鏁版嵁婧�
+ tree2.value = cloneDeep(treeData);
+ treeLoading.value = false;
+ // 灞曞紑鍏ㄩ儴
+ nextTick(() => {
+ console.log(unref(asyncExpandTreeRef));
+ unref(asyncExpandTreeRef)?.expandAll(true);
+ });
+ }, 2000);
+ }
+ function loadTreeData2() {
+ treeLoading.value = true;
+ // 浠ヤ笅鏄ā鎷熷紓姝ヨ幏鍙栨暟鎹�
+ setTimeout(() => {
+ // 璁剧疆鏁版嵁婧�
+ tree2.value = cloneDeep(treeData);
+ treeLoading.value = false;
+ }, 2000);
+ }
- const tree = ref([
- {
- title: 'parent ',
- key: '0-0',
- },
- ]);
-
- function onLoadData(treeNode) {
- return new Promise((resolve: (value?: unknown) => void) => {
- if (isArray(treeNode.children) && treeNode.children.length > 0) {
- resolve();
- return;
- }
- setTimeout(() => {
- const asyncTreeAction: TreeActionType | null = unref(asyncTreeRef);
- if (asyncTreeAction) {
- const nodeChildren = [
- { title: `Child Node ${treeNode.eventKey}-0`, key: `${treeNode.eventKey}-0` },
- { title: `Child Node ${treeNode.eventKey}-1`, key: `${treeNode.eventKey}-1` },
- ];
- asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: nodeChildren });
- asyncTreeAction.setExpandedKeys(
- uniq([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]),
- );
- }
-
- resolve();
- return;
- }, 300);
- });
- }
- return {
- treeData,
- handleCheck,
- tree,
- onLoadData,
- asyncTreeRef,
- asyncExpandTreeRef,
- loadTreeRef,
- tree2,
- loadTreeData,
- treeLoading,
- loadTreeData2,
- };
+ const tree = ref([
+ {
+ title: 'parent ',
+ key: '0-0',
},
- });
+ ]);
+
+ function onLoadData(treeNode) {
+ return new Promise((resolve: (value?: unknown) => void) => {
+ if (isArray(treeNode.children) && treeNode.children.length > 0) {
+ resolve();
+ return;
+ }
+ setTimeout(() => {
+ const asyncTreeAction: TreeActionType | null = unref(asyncTreeRef);
+ if (asyncTreeAction) {
+ const nodeChildren = [
+ { title: `Child Node ${treeNode.eventKey}-0`, key: `${treeNode.eventKey}-0` },
+ { title: `Child Node ${treeNode.eventKey}-1`, key: `${treeNode.eventKey}-1` },
+ ];
+ asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: nodeChildren });
+ asyncTreeAction.setExpandedKeys(
+ uniq([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]),
+ );
+ }
+
+ resolve();
+ return;
+ }, 300);
+ });
+ }
</script>
--
Gitblit v1.9.3