From b42686368567be8a35dcca5f8e37331c1dd5f219 Mon Sep 17 00:00:00 2001
From: jeremyjone <jeremyjone@qq.com>
Date: Thu, 11 May 2023 15:20:30 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E2=9C=A8=E6=B7=BB=E5=8A=A0=E5=88=9D?=
 =?UTF-8?q?=E5=A7=8B=E5=8C=96=E6=95=B0=E6=8D=AE=E7=9A=84=20options?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demo/demo.vue                 | 23 ++++++++++++++---------
 src/components/root/index.vue |  2 +-
 src/composables/useData.ts    | 14 ++++++++++----
 3 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/demo/demo.vue b/demo/demo.vue
index 424a149..1b21c61 100644
--- a/demo/demo.vue
+++ b/demo/demo.vue
@@ -1,8 +1,13 @@
 <template>
   <div style="top: 20vh; width: 100%; height: 500px">
-    <x-gantt :data="ganttData" :links="ganttLinks" @row-click="onClickRow">
+    <x-gantt
+      data-id="index"
+      :data="ganttData"
+      :links="ganttLinks"
+      @row-click="onClickRow"
+    >
       <x-gantt-column label="group1">
-        <x-gantt-column prop="id" width="150px"></x-gantt-column>
+        <x-gantt-column prop="index" width="120px"></x-gantt-column>
         <!-- <x-gantt-column label="group2">
           <x-gantt-column
             prop="name"
@@ -60,19 +65,19 @@ for (let i = 0; i < 50; i++) {
 
 ganttData[0].children = [
   {
-    id: ++id,
+    index: ++id,
     name: 'sub-t' + id,
     startDate: new Date(2023, 3, 1),
     endDate: new Date(2023, 3, 5)
   },
   {
-    id: ++id,
+    index: ++id,
     name: 'sub-t' + id,
     startDate: new Date(2023, 3, 1),
     endDate: new Date(2023, 3, 5),
     children: [
       {
-        id: ++id,
+        index: ++id,
         name: 'sub-sub-t' + id,
         startDate: new Date(2023, 3, 1),
         endDate: new Date(2023, 3, 5)
@@ -83,20 +88,20 @@ ganttData[0].children = [
 
 const ganttLinks = [
   {
-    id: 1,
+    index: 1,
     from: 1,
     to: 2
   },
   {
-    id: 2,
+    index: 2,
     from: 2,
-    to: 3
+    to: 5
   }
 ];
 
 function onAdd() {
   ganttData.push({
-    id: ++id,
+    index: ++id,
     name: 't' + id,
     startDate: new Date(2023, 3, id),
     endDate: new Date(2023, 3, id + 5)
diff --git a/src/components/root/index.vue b/src/components/root/index.vue
index 53f4295..ae299e1 100644
--- a/src/components/root/index.vue
+++ b/src/components/root/index.vue
@@ -131,7 +131,7 @@ const { tableWidth } = useTableWidth();
 const { data, links } = toRefs(props);
 
 const { initData } = useData();
-initData(data);
+initData(data, props);
 
 const { initLinks } = useLinks();
 initLinks(links);
diff --git a/src/composables/useData.ts b/src/composables/useData.ts
index 0f13013..2ffd020 100644
--- a/src/composables/useData.ts
+++ b/src/composables/useData.ts
@@ -7,9 +7,15 @@ export default () => {
   const store = useStore();
   const { setGanttHeaders } = useGanttHeader();
 
-  // TODO 这里还需要加 options 的监听
-  function initData(data: Ref<any[]>) {
-    store.$data.init(data.value);
+  function initData(data: Ref<any[]>, props: any) {
+    const options: DataOptions = {
+      dataId: props.dataId,
+      isExpand: !props.showExpand || props.expandAll,
+      startLabel: props.startKey,
+      endLabel: props.endKey
+    };
+
+    store.$data.init(data.value, options);
 
     setGanttHeaders();
 
@@ -17,7 +23,7 @@ export default () => {
       () => data,
       val => {
         // 更新数据
-        store.$data.update(val.value);
+        store.$data.update(val.value, options);
 
         setGanttHeaders();
       },