feat: update Tab

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] = {

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>

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);

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,

src/views/dashboard/panel/Tool.vue

@@ -313,7 +313,7 @@ function setTabControls(id: string) {
       dashboardStore.addTabControls("Topology");
       break;
     default:
-      dashboardStore.addControl("Widget");
+      break;
   }
 }