Bugfix: Unavailable services/database (#313)

diff --git a/src/store/modules/dashboard/dashboard-data-layout.ts b/src/store/modules/dashboard/dashboard-data-layout.ts
index 57906aa..51ac6d6 100644
--- a/src/store/modules/dashboard/dashboard-data-layout.ts
+++ b/src/store/modules/dashboard/dashboard-data-layout.ts
@@ -16,24 +16,22 @@
  */
 
 import { MutationTree } from 'vuex';
-import { CompsTree, DashboardTemplate } from '@/types/dashboard';
+import { CompsTree } from '@/types/dashboard';
 import * as types from './mutation-types';
 export interface State {
   current: number;
   group: number;
   index: number;
   tree: CompsTree[];
-  allTemplates: DashboardTemplate[];
 }
 
 export const initState: State = {
-  allTemplates: [],
   current: 0,
   group: 0,
   index: 0,
   tree: [
     {
-      name: 'Service Dashboard',
+      name: '',
       type: 'service',
       query: {
         service: {},
@@ -41,27 +39,13 @@
         instance: {},
         database: {},
       },
-      children: [{}], // groupServiceTemp
-    },
-    {
-      name: 'Database Dashboard',
-      type: 'database',
-      query: {
-        service: {},
-        endpoint: {},
-        instance: {},
-        database: {},
-      },
-      children: [{}], // groupDatabaseTemp
+      children: [],
     },
   ],
 };
 
 // mutations
 const mutations: MutationTree<State> = {
-  [types.SET_ALL_TEMPLATES](state: State, data: DashboardTemplate[]) {
-    state.allTemplates = data;
-  },
   [types.SET_COMPS_TREE](state: State, data: CompsTree[]) {
     state.tree = data;
   },
@@ -91,42 +75,13 @@
       return;
     }
 
-    switch (params.type) {
-      case 'metric':
-        const newTree = [];
-        Object.keys(state.tree).forEach((i: any) => {
-          newTree.push(state.tree[i]);
-        });
-        newTree.push({ name: params.name, type: params.type, query: {}, children: [{ name: 'demo', children: [] }] });
-        state.tree = newTree;
-        break;
-      case 'service':
-        const newServerTree = [];
-        Object.keys(state.tree).forEach((i: any) => {
-          newServerTree.push(state.tree[i]);
-        });
-        newServerTree.push({
-          name: params.name,
-          type: params.type,
-          query: {},
-          children: [{ name: 'demo', children: [] }],
-        });
-        state.tree = newServerTree;
-        break;
-      case 'database':
-        const newDatabaseTree = [];
-        Object.keys(state.tree).forEach((i: any) => {
-          newDatabaseTree.push(state.tree[i]);
-        });
-        newDatabaseTree.push({
-          name: params.name,
-          type: params.type,
-          query: {},
-          children: [{ name: 'demo', children: [] }],
-        });
-        state.tree = newDatabaseTree;
-        break;
-    }
+    const newTree = [];
+    Object.keys(state.tree).forEach((i: any) => {
+      newTree.push(state.tree[i]);
+    });
+    newTree.push({ name: params.name, type: params.type, query: {}, children: [{ name: 'demo', children: [] }] });
+    state.tree = newTree;
+
     window.localStorage.setItem('dashboard', JSON.stringify(state.tree));
   },
   [types.ADD_COMPS_TREE](state: State, params: { name: string }) {
@@ -176,14 +131,6 @@
     state.tree[state.group].children[state.current].children[params.index] = { ...temp, ...params.values };
     window.localStorage.setItem('dashboard', JSON.stringify(state.tree));
   },
-  [types.SWICH_COMP](state: State, params: any) {
-    const tempStart: any = state.tree[state.group].children[state.current].children[params.start];
-    state.tree[state.group].children[state.current].children[params.start] =
-      state.tree[state.group].children[state.current].children[params.end];
-    state.tree[state.group].children[state.current].children[params.end] = tempStart;
-    state.tree = { ...state.tree };
-    window.localStorage.setItem('dashboard', JSON.stringify(state.tree));
-  },
 };
 
 export default {
diff --git a/src/store/modules/dashboard/dashboard-data-query.ts b/src/store/modules/dashboard/dashboard-data-query.ts
index 8ca48fe..889abeb 100644
--- a/src/store/modules/dashboard/dashboard-data-query.ts
+++ b/src/store/modules/dashboard/dashboard-data-query.ts
@@ -96,36 +96,53 @@
               labels,
             };
       } else {
-        variables = names.includes(config.queryMetricType)
-          ? {
-              duration: params.duration,
-              condition: {
-                name,
-                parentService: config.parentService ? (normal ? currentServiceId : currentDatabaseId) : null,
+        if (names.includes(config.queryMetricType)) {
+          const parentService = normal ? currentServiceId : currentDatabaseId;
+
+          if (config.parentService && !parentService) {
+            return;
+          }
+          variables = {
+            duration: params.duration,
+            condition: {
+              name,
+              parentService: config.parentService ? parentService : null,
+              normal,
+              scope: normal ? config.entityType : config.parentService ? 'Service' : config.entityType,
+              topN: 10,
+              order: config.sortOrder || 'DES',
+            },
+          };
+        } else {
+          const serviceName = normal ? currentServiceId : currentDatabaseId;
+          if (!serviceName) {
+            return null;
+          }
+          if (config.entityType === 'ServiceInstance' && !currentInstanceId) {
+            return null;
+          }
+          if (config.entityType === 'Endpoint' && !currentEndpointId) {
+            return null;
+          }
+          variables = {
+            duration: params.duration,
+            condition: {
+              name,
+              entity: {
+                scope: normal ? config.entityType : 'Service',
+                serviceName,
+                serviceInstanceName: config.entityType === 'ServiceInstance' ? currentInstanceId : undefined,
+                endpointName: config.entityType === 'Endpoint' ? currentEndpointId : undefined,
                 normal,
-                scope: normal ? config.entityType : config.parentService ? 'Service' : config.entityType,
-                topN: 10,
-                order: config.sortOrder || 'DES',
+                // destNormal: normal,
+                // destServiceName: '',
+                // destServiceInstanceName: '',
+                // destEndpointName: '',
               },
-            }
-          : {
-              duration: params.duration,
-              condition: {
-                name,
-                entity: {
-                  scope: normal ? config.entityType : 'Service',
-                  serviceName: normal ? currentServiceId : currentDatabaseId,
-                  serviceInstanceName: config.entityType === 'ServiceInstance' ? currentInstanceId : undefined,
-                  endpointName: config.entityType === 'Endpoint' ? currentEndpointId : undefined,
-                  normal,
-                  // destNormal: normal,
-                  // destServiceName: '',
-                  // destServiceInstanceName: '',
-                  // destEndpointName: '',
-                },
-              },
-              labels,
-            };
+            },
+            labels,
+          };
+        }
       }
 
       return variables;
@@ -140,14 +157,18 @@
     const query = `query queryData(${queryVariables}) {${fragments}}`;
 
     return Promise.all(
-      variablesList.map((variable: string, index: string) => {
-        return axios
-          .post('/graphql', { query, variables: variable }, { cancelToken: cancelToken() })
-          .then((res: AxiosResponse<any>) => {
-            const resData = res.data.data;
+      variablesList.map((variable: any) => {
+        if (variable) {
+          return axios
+            .post('/graphql', { query, variables: variable }, { cancelToken: cancelToken() })
+            .then((res: AxiosResponse<any>) => {
+              const resData = res.data.data;
 
-            return { ...resData, config, metricName: variablesList[index].condition.name };
-          });
+              return { ...resData, config, metricName: variable.condition.name };
+            });
+        } else {
+          return { config };
+        }
       }),
     ).then((data: any) => {
       return data;
diff --git a/src/store/modules/dashboard/mutation-types.ts b/src/store/modules/dashboard/mutation-types.ts
index f5aaa35..8da2958 100644
--- a/src/store/modules/dashboard/mutation-types.ts
+++ b/src/store/modules/dashboard/mutation-types.ts
@@ -34,7 +34,6 @@
 export const SET_CURRENT_INSTANCE = 'SET_CURRENT_INSTANCE';
 export const SET_INSTANCE_INFO = 'SET_INSTANCE_INFO';
 export const SET_KEYWORDSERVICE = 'SET_KEYWORDSERVICE';
-export const SET_ALL_TEMPLATES = 'SET_ALL_TEMPLATES';
 
 // comp
 export const SET_CURRENT_GROUP = 'SET_CURRENT_GROUP';
@@ -48,7 +47,6 @@
 export const DELETE_COMPS_TREE = 'DELETE_COMPS_TREE';
 export const ADD_COMP = 'ADD_COMP';
 export const DELETE_COMP = 'DELETE_COMP';
-export const SWICH_COMP = 'SWICH_COMP';
 export const SET_COMPS_TREE = 'SET_COMPS_TREE';
 export const SWICH_CURRENTCOMP = 'SWICH_CURRENTCOMP';
 export const SET_GROUP_QUERY = 'SET_GROUP_QUERY';
diff --git a/src/store/mutation-types.ts b/src/store/mutation-types.ts
index 0605563..0d7d7b0 100644
--- a/src/store/mutation-types.ts
+++ b/src/store/mutation-types.ts
@@ -24,7 +24,6 @@
 export const DELETE_COMPS_TREE = 'DELETE_COMPS_TREE';
 export const ADD_COMP = 'ADD_COMP';
 export const DELETE_COMP = 'DELETE_COMP';
-export const SWICH_COMP = 'SWICH_COMP';
 export const SET_COMPS_TREE = 'SET_COMPS_TREE';
 export const SWICH_CURRENTCOMP = 'SWICH_CURRENTCOMP';
 export const EDIT_COMP = 'EDIT_COMP';
diff --git a/src/views/components/dashboard/dashboard-item.vue b/src/views/components/dashboard/dashboard-item.vue
index d2863df..fa26e41 100644
--- a/src/views/components/dashboard/dashboard-item.vue
+++ b/src/views/components/dashboard/dashboard-item.vue
@@ -79,7 +79,6 @@
     @State('rocketbot') private rocketGlobal: any;
     @Mutation('EDIT_COMP_CONFIG') private EDIT_COMP_CONFIG: any;
     @Mutation('DELETE_COMP') private DELETE_COMP: any;
-    @Mutation('SWICH_COMP') private SWICH_COMP: any;
     @Mutation('rocketTopo/DELETE_TOPO_ENDPOINT') private DELETE_TOPO_ENDPOINT: any;
     @Mutation('rocketTopo/DELETE_TOPO_INSTANCE') private DELETE_TOPO_INSTANCE: any;
     @Action('GET_QUERY') private GET_QUERY: any;
@@ -112,7 +111,9 @@
       if (!types.includes(this.updateObjects)) {
         return;
       }
-      this.chartRender();
+      setTimeout(() => {
+        this.chartRender();
+      }, 200);
     }
 
     private chartRender() {
diff --git a/src/views/components/dashboard/tool-nav.vue b/src/views/components/dashboard/tool-nav.vue
index 1ccb2c0..99b008c 100644
--- a/src/views/components/dashboard/tool-nav.vue
+++ b/src/views/components/dashboard/tool-nav.vue
@@ -14,7 +14,11 @@
 limitations under the License. -->
 <template>
   <nav class="rk-dashboard-nav">
-    <span v-for="(i, index) in rocketComps.tree[rocketComps.group].children" :key="index" class="mr-20">
+    <span
+      v-for="(i, index) in rocketComps.tree[rocketComps.group] && rocketComps.tree[rocketComps.group].children"
+      :key="index"
+      class="mr-20"
+    >
       <a
         class="rk-dashboard-nav-i b"
         @click="
diff --git a/src/views/containers/dashboard.vue b/src/views/containers/dashboard.vue
index 0bbe1e4..f996dd4 100644
--- a/src/views/containers/dashboard.vue
+++ b/src/views/containers/dashboard.vue
@@ -25,7 +25,8 @@
     <ToolNav :rocketGlobal="rocketGlobal" :rocketComps="rocketComps" />
     <div class="dashboard-container clear">
       <DashboardItem
-        v-for="(i, index) in rocketComps.tree[rocketComps.group].children[rocketComps.current] &&
+        v-for="(i, index) in rocketComps.tree[rocketComps.group] &&
+          rocketComps.tree[rocketComps.group].children[rocketComps.current] &&
           rocketComps.tree[rocketComps.group].children[rocketComps.current].children"
         :key="index + i.title + i.width"
         :index="index"
@@ -75,9 +76,7 @@
     // @Action('ADD_TEMPLATE') private ADD_TEMPLATE: any;
     @Getter('durationTime') private durationTime: any;
     @Mutation('SET_COMPS_TREE') private SET_COMPS_TREE: any;
-    @Mutation('SET_CURRENT_COMPS') private SET_CURRENT_COMPS: any;
     @Mutation('ADD_COMP') private ADD_COMP: any;
-    @Mutation('SET_ALL_TEMPLATES') private SET_ALL_TEMPLATES: any;
     @Mutation('SET_EDIT') private SET_EDIT: any;
 
     private ObjectsType = ObjectsType;
@@ -111,21 +110,16 @@
       // }).then((data: any) => {
       //   console.log(data);
       // });
-      this.GET_ALL_TEMPLATES().then((allTemplate: ITemplate[]) => {
-        this.SET_ALL_TEMPLATES(allTemplate);
-        if (window.localStorage.getItem('version') !== '8.0') {
+      if (window.localStorage.getItem('version') !== '8.0') {
+        this.GET_ALL_TEMPLATES().then((allTemplate: ITemplate[]) => {
           window.localStorage.removeItem('dashboard');
           this.setDashboardTemplates(allTemplate);
           this.handleOption();
-          return;
-        }
-        if (window.localStorage.getItem('dashboard')) {
-          const data: string = `${window.localStorage.getItem('dashboard')}`;
-          this.SET_COMPS_TREE(JSON.parse(data));
-        } else {
-          this.setDashboardTemplates(allTemplate);
-        }
-      });
+        });
+      } else {
+        const data: string = `${window.localStorage.getItem('dashboard')}`;
+        this.SET_COMPS_TREE(JSON.parse(data));
+      }
       this.handleOption();
     }
     private setDashboardTemplates(allTemplate: ITemplate[]) {