fix: set config to control depth selector (#16)

src/views/dashboard/related/topology/components/Graph.vue

@@ -23,14 +23,16 @@ limitations under the License. -->
       <Settings @update="updateSettings" @updateNodes="freshNodes" />
     </div>
     <div class="tool">
-      <span class="label">{{ t("currentDepth") }}</span>
-      <Selector
-        class="inputs"
-        :value="depth"
-        :options="DepthList"
-        placeholder="Select a option"
-        @change="changeDepth"
-      />
+      <span v-show="dashboardStore.selectedGrid.showDepth">
+        <span class="label">{{ t("currentDepth") }}</span>
+        <Selector
+          class="inputs"
+          :value="depth"
+          :options="DepthList"
+          placeholder="Select a option"
+          @change="changeDepth"
+        />
+      </span>
       <span class="switch-icon ml-5" title="Settings" @click="setConfig">
         <Icon size="middle" iconName="settings" />
       </span>
@@ -108,7 +110,7 @@ const items = ref<
   { id: "inspect", title: "Inspect", func: handleInspect },
   { id: "alarm", title: "Alarm", func: handleGoAlarm },
 ]);
-const depth = ref<string>(topologyStore.defaultDepth);
+const depth = ref<string>(dashboardStore.selectedGrid.depth || "2");
 
 onMounted(async () => {
   loading.value = true;

src/views/dashboard/related/topology/components/PodTopology.vue

@@ -14,7 +14,12 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
   <div class="tool">
-    <span v-show="dashboardStore.entity === EntityType[2].value">
+    <span
+      v-show="
+        dashboardStore.entity === EntityType[2].value &&
+        dashboardStore.selectedGrid.showDepth
+      "
+    >
       <span class="label">{{ t("currentDepth") }}</span>
       <Selector
         class="inputs"
@@ -89,7 +94,7 @@ const width = ref<number>(document.body.clientWidth - 40);
 const showSettings = ref<boolean>(false);
 const settings = ref<any>({});
 const operationsPos = reactive<{ x: number; y: number }>({ x: NaN, y: NaN });
-const depth = ref<string>(topologyStore.defaultDepth);
+const depth = ref<string>(dashboardStore.selectedGrid.depth || "3");
 const items = [
   { id: "inspect", title: "Inspect", func: inspect },
   { id: "dashboard", title: "View Dashboard", func: goDashboard },