From 4e80925745e197a343cf1fad7020fd450d16efdb Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Thu, 3 Mar 2022 15:50:39 +0800
Subject: [PATCH] feat: update Tab

---
 src/store/modules/dashboard.ts       | 30 ++++++++++++++++++++++++----
 src/views/dashboard/Edit.vue         |  1 +
 src/views/dashboard/controls/Tab.vue |  2 +-
 src/views/dashboard/panel/Layout.vue |  1 +
 src/views/dashboard/panel/Tool.vue   |  2 +-
 5 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/src/store/modules/dashboard.ts b/src/store/modules/dashboard.ts
index 73c53075..7f1fb666 100644
--- a/src/store/modules/dashboard.ts
+++ b/src/store/modules/dashboard.ts
@@ -156,7 +156,6 @@ export const dashboardStore = defineStore({
           d.y = d.y + newItem.h;
           return d;
         });
-        console.log(type);
         items.push(newItem);
         this.layout[idx].children[tabIndex].children = items;
       }
@@ -173,7 +172,24 @@ export const dashboardStore = defineStore({
       }
       this.layout[idx].activedTabIndex = index;
     },
+    removeTab(item: LayoutConfig) {
+      this.layout = this.layout.filter((d: LayoutConfig) => d.i !== item.i);
+    },
     removeControls(item: LayoutConfig) {
+      const actived = this.activedGridItem.split("-");
+      const index = this.layout.findIndex(
+        (d: LayoutConfig) => actived[0] === d.i
+      );
+
+      if (actived.length === 3) {
+        const tabIndex = Number(actived[1]);
+        const itemIndex = this.layout[index].children[
+          tabIndex
+        ].children.findIndex((d: LayoutConfig) => actived[2] === d.i);
+
+        this.layout[index].children[tabIndex].children.splice(itemIndex, 1);
+        return;
+      }
       this.layout = this.layout.filter((d: LayoutConfig) => d.i !== item.i);
     },
     removeTabItem(item: LayoutConfig, index: number) {
@@ -226,11 +242,17 @@ export const dashboardStore = defineStore({
       );
 
       if (actived.length === 3) {
-        this.layout[index].children[actived[1]].children[actived[2]] = {
-          ...this.layout[index],
+        const tabIndex = Number(actived[1]);
+        const itemIndex = this.layout[index].children[
+          tabIndex
+        ].children.findIndex((d: LayoutConfig) => actived[2] === d.i);
+
+        this.layout[index].children[tabIndex].children[itemIndex] = {
+          ...this.layout[index].children[tabIndex].children[itemIndex],
           ...param,
         };
-        this.selectedGrid = this.layout[index];
+        this.selectedGrid =
+          this.layout[index].children[tabIndex].children[itemIndex];
         return;
       }
       this.layout[index] = {
diff --git a/src/views/dashboard/Edit.vue b/src/views/dashboard/Edit.vue
index 075b0ec2..d6b3e24a 100644
--- a/src/views/dashboard/Edit.vue
+++ b/src/views/dashboard/Edit.vue
@@ -75,6 +75,7 @@ function handleClick(e: any) {
   e.stopPropagation();
   if (e.target.className === "ds-main") {
     dashboardStore.activeGridItem("");
+    dashboardStore.selectWidget(null);
   }
 }
 </script>
diff --git a/src/views/dashboard/controls/Tab.vue b/src/views/dashboard/controls/Tab.vue
index bb9b0101..486b0897 100644
--- a/src/views/dashboard/controls/Tab.vue
+++ b/src/views/dashboard/controls/Tab.vue
@@ -122,7 +122,7 @@ export default defineComponent({
       dashboardStore.activeGridItem(idx);
     }
     function removeTab() {
-      dashboardStore.removeControls(props.data);
+      dashboardStore.removeTab(props.data);
     }
     function deleteTabItem(idx: number) {
       dashboardStore.removeTabItem(props.data, idx);
diff --git a/src/views/dashboard/panel/Layout.vue b/src/views/dashboard/panel/Layout.vue
index 72c95881..bc3938f8 100644
--- a/src/views/dashboard/panel/Layout.vue
+++ b/src/views/dashboard/panel/Layout.vue
@@ -53,6 +53,7 @@ export default defineComponent({
     }
     function clickGrid(item: LayoutConfig) {
       dashboardStore.activeGridItem(item.i);
+      dashboardStore.selectWidget(item);
     }
     return {
       dashboardStore,
diff --git a/src/views/dashboard/panel/Tool.vue b/src/views/dashboard/panel/Tool.vue
index 94c756e7..37891dcb 100644
--- a/src/views/dashboard/panel/Tool.vue
+++ b/src/views/dashboard/panel/Tool.vue
@@ -313,7 +313,7 @@ function setTabControls(id: string) {
       dashboardStore.addTabControls("Topology");
       break;
     default:
-      dashboardStore.addControl("Widget");
+      break;
   }
 }