diff --git a/src/hooks/useExpressionsProcessor.ts b/src/hooks/useExpressionsProcessor.ts
index ecd74cfc..6c77c6b8 100644
--- a/src/hooks/useExpressionsProcessor.ts
+++ b/src/hooks/useExpressionsProcessor.ts
@@ -141,7 +141,6 @@ export async function useDashboardQueryProcessor(configList: Indexable[]) {
         }
       }
     }
-
     return { source, tips, typesOfMQE };
   }
   async function fetchMetrics(configArr: any) {
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index 5640a21d..0c843f2b 100644
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@@ -395,5 +395,6 @@ const msg = {
   profilingEvents: "Async Profiling Events",
   execArgs: "Exec Args",
   instances: "Instances",
+  snapshot: "Snapshot",
 };
 export default msg;
diff --git a/src/locales/lang/es.ts b/src/locales/lang/es.ts
index 4496b367..d9e46725 100644
--- a/src/locales/lang/es.ts
+++ b/src/locales/lang/es.ts
@@ -395,5 +395,6 @@ const msg = {
   profilingEvents: "Async Profiling Events",
   execArgs: "Exec Args",
   instances: "Instances",
+  snapshot: "Snapshot",
 };
 export default msg;
diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts
index 800d8c78..9f39144b 100644
--- a/src/locales/lang/zh.ts
+++ b/src/locales/lang/zh.ts
@@ -393,5 +393,6 @@ const msg = {
   profilingEvents: "异步分析事件",
   execArgs: "String任务扩展",
   instances: "实例",
+  snapshot: "快照",
 };
 export default msg;
diff --git a/src/types/alarm.d.ts b/src/types/alarm.d.ts
index 06c09958..df791ca2 100644
--- a/src/types/alarm.d.ts
+++ b/src/types/alarm.d.ts
@@ -27,6 +27,7 @@ export interface Alarm {
   scope: string;
   tags: Array<{ key: string; value: string }>;
   events: Event[];
+  snapshot: Indexable;
 }
 
 export interface Event {
diff --git a/src/views/alarm/Content.vue b/src/views/alarm/Content.vue
index 0a8988ae..759422b1 100644
--- a/src/views/alarm/Content.vue
+++ b/src/views/alarm/Content.vue
@@ -75,6 +75,9 @@ limitations under the License. -->
           </ul>
         </div>
       </span>
+      <span v-else-if="item.label === 'snapshot'">
+        <Snapshot :snapshot="currentDetail.snapshot" />
+      </span>
       <span v-else>{{ currentDetail[item.label] }}</span>
     </div>
   </el-dialog>
@@ -117,6 +120,7 @@ limitations under the License. -->
   import { useAlarmStore } from "@/store/modules/alarm";
   import { EventsDetailHeaders, AlarmDetailCol, EventsDetailKeys } from "./data";
   import { dateFormat } from "@/utils/dateFormat";
+  import Snapshot from "./components/Snapshot.vue";
 
   const { t } = useI18n();
   const alarmStore = useAlarmStore();
diff --git a/src/views/alarm/components/Snapshot.vue b/src/views/alarm/components/Snapshot.vue
new file mode 100644
index 00000000..b9e7afc4
--- /dev/null
+++ b/src/views/alarm/components/Snapshot.vue
@@ -0,0 +1,26 @@
+<!-- Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License. -->
+<template>
+  <div class="snapshot flex-v"> Line Charts </div>
+</template>
+<script lang="ts" setup>
+  /*global defineProps */
+  const props = defineProps({
+    snapshot: { type: Object, default: () => {} },
+  });
+
+  console.log(props.snapshot);
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/views/alarm/data.ts b/src/views/alarm/data.ts
index d78f7ea8..e8bcd4d6 100644
--- a/src/views/alarm/data.ts
+++ b/src/views/alarm/data.ts
@@ -52,6 +52,10 @@ export const AlarmDetailCol = [
     label: "events",
     value: "eventDetail",
   },
+  {
+    label: "snapshot",
+    value: "snapshot",
+  },
 ];
 
 export const EventsDetailKeys = [