diff --git a/src/views/dashboard/configuration/widget/metric/Index.vue b/src/views/dashboard/configuration/widget/metric/Index.vue
index e84e7f42..6c156efb 100644
--- a/src/views/dashboard/configuration/widget/metric/Index.vue
+++ b/src/views/dashboard/configuration/widget/metric/Index.vue
@@ -349,6 +349,9 @@ async function queryMetrics() {
     return;
   }
   const { metricConfig, metricTypes, metrics } = dashboardStore.selectedGrid;
+  if (!(metrics && metrics[0] && metricTypes && metricTypes[0])) {
+    return;
+  }
   const catalog = await useGetMetricEntity(metrics[0], metricTypes[0]);
   const params = useQueryProcessor({ ...states, metricConfig, catalog });
   if (!params) {
diff --git a/src/views/dashboard/graphs/HeatMap.vue b/src/views/dashboard/graphs/HeatMap.vue
index 80e1f73b..f90d387a 100644
--- a/src/views/dashboard/graphs/HeatMap.vue
+++ b/src/views/dashboard/graphs/HeatMap.vue
@@ -36,8 +36,11 @@ const props = defineProps({
 const option = computed(() => getOption());
 
 function getOption() {
-  const metric = props.config.metrics[0];
-  const nodes = (props.data[metric] && props.data[metric].nodes) || [];
+  const metric = props.config.metrics && props.config.metrics[0];
+  let nodes: any = [];
+  if (metric) {
+    nodes = (props.data[metric] && props.data[metric].nodes) || [];
+  }
   const source = (nodes || []).map((d: number[]) => d[2]);
   const maxItem = Math.max(...source);
   const minItem = Math.min(...source);