diff --git a/package.json b/package.json
index 8cc295e7..142b68e5 100644
--- a/package.json
+++ b/package.json
@@ -21,8 +21,6 @@
     "@types/crypto-js": "^4.1.1",
     "@types/keymaster": "^1.6.30",
     "@types/lodash": "^4.14.184",
-    "@vicons/fluent": "^0.12.0",
-    "@vicons/tabler": "^0.12.0",
     "animate.css": "^4.1.1",
     "axios": "^1.4.0",
     "color": "^4.2.3",
@@ -60,7 +58,10 @@
     "@typescript-eslint/eslint-plugin": "^5.18.0",
     "@typescript-eslint/parser": "^5.18.0",
     "@vicons/carbon": "^0.12.0",
+    "@vicons/fluent": "^0.12.0",
     "@vicons/ionicons5": "~0.11.0",
+    "@vicons/material": "^0.12.0",
+    "@vicons/tabler": "^0.12.0",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vitejs/plugin-vue-jsx": "^3.0.1",
     "@vue/compiler-sfc": "^3.2.31",
diff --git a/src/App.vue b/src/App.vue
index 04025bcf..442c1031 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -19,26 +19,27 @@ import { GoAppProvider } from '@/components/GoAppProvider'
 import { I18n } from '@/components/I18n'
 import { useSystemInit, useDarkThemeHook, useThemeOverridesHook, useCode, useLang } from '@/hooks'
 import { getToken } from '@/api/path'
-import { onMounted, onUnmounted } from 'vue'
 import { useRouterStore } from '@/store/modules/routerStore/routerStore'
+import { useOriginStore } from '@/store/modules/originStore/originStore'
+import { useGetMessageByParent } from '@/utils/utils'
+
+const {getMessageByParent} = useGetMessageByParent()
 
 const routerStore = useRouterStore()
-let handleMessage = function(event:{data:string}) {
-  const {data}:{data:any} = event
-  if(data.page === 'customLargeScreen' && data.type === 'setCallByParent') {
-    routerStore.setCallByParent(data.callByParent)
+getMessageByParent('setCallByParent', (e) => {
+  if(e.data.type === 'setCallByParent' && e.data.page === 'customLargeScreen') {
+    const {data}:{data:any} = e
+    if(data.page === 'customLargeScreen' && data.type === 'setCallByParent') {
+      routerStore.setCallByParent(data.callByParent)
+    }
   }
-}
-onMounted(() => {
-  window.addEventListener('message', handleMessage);
-  let obj = {
-    page: 'customLargeScreen',
-    type: 'bindPostMessageEvent'
-  }
-  window.parent.postMessage(JSON.stringify(obj), '*');
 })
-onUnmounted(() => {
-  window.removeEventListener('message', handleMessage);
+
+const originStore = useOriginStore()
+getMessageByParent('getStore', (e) => {
+  if(e.data.type === 'getStore' && e.data.page === 'customLargeScreen') {
+    originStore.setOriginStore(e.data.data, false)
+  }
 })
 
 getToken()
diff --git a/src/api/path/business.api.ts b/src/api/path/business.api.ts
index c1b06b6d..c04c209e 100644
--- a/src/api/path/business.api.ts
+++ b/src/api/path/business.api.ts
@@ -2,10 +2,15 @@
 import { http } from "@/api/http";
 import { RequestHttpEnum } from "@/enums/httpEnum";
 import { httpErrorHandle } from '@/utils'
+import moment from 'moment'
 
 export function getToken() {
-    const storage_access_token = localStorage.getItem('access_token')
-    if(storage_access_token) return storage_access_token
+    const storage_access_token = localStorage.getItem('access_token_obj')
+    if(storage_access_token) {
+        const obj = JSON.parse(storage_access_token)
+        const { access_token, expiration } = obj
+        if(expiration >= moment().format('x')) return access_token
+    }
     let queryStr = window.location.href
     queryStr = queryStr.split('?')[1]
     if(queryStr && queryStr.indexOf('#') > -1) queryStr = queryStr.split('#')[0]
@@ -13,7 +18,11 @@ export function getToken() {
     queryStr && queryStr.split('&').forEach((item:string) => {
         query[item.split('=')[0]] = item.split('=')[1]
     })
-    if(query.access_token) localStorage.setItem('access_token', query.access_token)
+    const obj = {
+        access_token: query.access_token,
+        expiration: 86400000 + moment().format('x')
+    }
+    if(query.access_token) localStorage.setItem('access_token_obj', JSON.stringify(obj))
     return query.access_token
 }
 
diff --git a/src/assets/images/chart/customponents/OverviewOfComputingNodes.png b/src/assets/images/chart/customponents/OverviewOfComputingNodes.png
new file mode 100644
index 00000000..0ec3e482
Binary files /dev/null and b/src/assets/images/chart/customponents/OverviewOfComputingNodes.png differ
diff --git a/src/assets/images/chart/customponents/RealTimeEvent.png b/src/assets/images/chart/customponents/RealTimeEvent.png
new file mode 100644
index 00000000..3d8f370a
Binary files /dev/null and b/src/assets/images/chart/customponents/RealTimeEvent.png differ
diff --git a/src/packages/components/CustomComponents/CustomComponents/ComprehensivePUE/index.vue b/src/packages/components/CustomComponents/CustomComponents/ComprehensivePUE/index.vue
index cf411daa..976c5db1 100644
--- a/src/packages/components/CustomComponents/CustomComponents/ComprehensivePUE/index.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/ComprehensivePUE/index.vue
@@ -45,7 +45,7 @@ const props = defineProps({
   }
 })
 Object.assign(props.chartConfig.attr, { w: 380, h: 250 })
-Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
 
 const { w, h } = toRefs(props.chartConfig.attr)
 const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
@@ -58,7 +58,7 @@ const getStyle = (radius: number) => {
 }
 
 const value = reactive([
-  {label: '实时PUE', value: '0.000'},
+  {label: '实时PUE', value: '1.000'},
   {label: '昨日PUE', value: '0.000'},
   {label: '上周PUE', value: '0.000'},
   {label: '上月PUE', value: '0.000'},
diff --git a/src/packages/components/CustomComponents/CustomComponents/DeviceAlarmOverview/index.vue b/src/packages/components/CustomComponents/CustomComponents/DeviceAlarmOverview/index.vue
index 3d61a791..9a72a595 100644
--- a/src/packages/components/CustomComponents/CustomComponents/DeviceAlarmOverview/index.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/DeviceAlarmOverview/index.vue
@@ -53,7 +53,7 @@ const props = defineProps({
   }
 })
 Object.assign(props.chartConfig.attr, { w: 380, h: 250 })
-Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
 
 const { w, h } = toRefs(props.chartConfig.attr)
 const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
diff --git a/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.ts b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.ts
new file mode 100644
index 00000000..19de6e7f
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.ts
@@ -0,0 +1,25 @@
+import { PublicConfigClass } from '@/packages/public'
+import { CreateComponentType } from '@/packages/index.d'
+import { OverviewOfComputingNodesConfig } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+// import logo from '@/assets/logo.png'
+
+export const option = {
+  // 图片路径
+  dataset: '',
+  // 适应方式
+  fit: 'contain',
+  // 圆角
+  borderRadius: 0
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType
+{
+  public key = OverviewOfComputingNodesConfig.key
+  public chartConfig = cloneDeep(OverviewOfComputingNodesConfig)
+  public option = cloneDeep(option)
+  public customData = cloneDeep({
+    title: '计算节点运行概况',
+    showInterval: true,
+  })
+}
diff --git a/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.vue b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.vue
new file mode 100644
index 00000000..d1759a1d
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/config.vue
@@ -0,0 +1,67 @@
+<template>
+<!--  <collapse-item name="属性" :expanded="true">-->
+<!--    <setting-item-box name="路径" :alone="true">-->
+<!--      <setting-item>-->
+<!--        <n-input v-model:value="optionData.dataset" size="small"></n-input>-->
+<!--      </setting-item>-->
+<!--    </setting-item-box>-->
+<!--    <setting-item-box name="样式">-->
+<!--      <setting-item name="类型">-->
+<!--        <n-select-->
+<!--          v-model:value="optionData.fit"-->
+<!--          size="small"-->
+<!--          :options="fitList"-->
+<!--        ></n-select>-->
+<!--      </setting-item>-->
+<!--      <setting-item name="圆角">-->
+<!--        <n-input-number-->
+<!--          v-model:value="optionData.borderRadius"-->
+<!--          size="small"-->
+<!--          :min="0"-->
+<!--          placeholder="圆角"-->
+<!--        ></n-input-number>-->
+<!--      </setting-item>-->
+<!--    </setting-item-box>-->
+<!--  </collapse-item>-->
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import { option } from './config'
+import {
+  CollapseItem,
+  SettingItemBox,
+  SettingItem,
+} from '@/components/Pages/ChartItemSetting'
+
+const props = defineProps({
+  optionData: {
+    type: Object as PropType<typeof option>,
+    required: true,
+  },
+})
+
+// 适应类型
+const fitList = [
+  {
+    value: 'fill',
+    label: 'fill'
+  },
+  {
+    value: 'contain',
+    label: 'contain'
+  },
+  {
+    value: 'cover',
+    label: 'cover'
+  },
+  {
+    value: 'scale-down',
+    label: 'scale-down'
+  },
+  {
+    value: 'none',
+    label: 'none'
+  },
+]
+</script>
diff --git a/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/configData.vue b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/configData.vue
new file mode 100644
index 00000000..2c83af5e
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/configData.vue
@@ -0,0 +1,16 @@
+<template>
+  <n-space vertical>
+    <setting-item-box name="标题" :alone="true">
+      <n-input v-model:value="props.customData.title" size="small" placeholder="请输入"/>
+    </setting-item-box>
+  </n-space>
+</template>
+
+<script lang="ts" setup>
+import { SettingItemBox } from '@/components/Pages/ChartItemSetting'
+
+const props = defineProps(['customData', 'request'])
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.ts b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.ts
new file mode 100644
index 00000000..5c61d155
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.ts
@@ -0,0 +1,16 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
+import { ChatCategoryEnum, ChatCategoryEnumName } from '@/packages/components/CustomComponents/index.d'
+
+export const OverviewOfComputingNodesConfig: ConfigType = {
+  key: 'OverviewOfComputingNodes',
+  chartKey: 'VOverviewOfComputingNodes',
+  conKey: 'VCOverviewOfComputingNodes',
+  // VCD开头
+  conDataKey: 'VCDOverviewOfComputingNodes',
+  title: '计算节点运行概况',
+  category: ChatCategoryEnum.CUSTOMCOMPONENTS,
+  categoryName: ChatCategoryEnumName.CUSTOMCOMPONENTS,
+  package: PackagesCategoryEnum.CUSTOMCOMPONENTS,
+  chartFrame: ChartFrameEnum.COMMON,
+  image: 'OverviewOfComputingNodes.png'
+}
diff --git a/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.vue b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.vue
new file mode 100644
index 00000000..9ec7b6f7
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/OverviewOfComputingNodes/index.vue
@@ -0,0 +1,214 @@
+<template>
+  <BorderBox :title="props.chartConfig.customData.title" :style="getStyle(borderRadius)" style="overflow: visible">
+    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 401 236" style="width: 100%;height: 100%">
+      <defs>
+        <linearGradient id="linear-gradient-compute-node" x1="99" y1="176" x2="99" y2="120" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="aqua" stop-opacity="0.3" />
+          <stop offset="1" stop-color="aqua" stop-opacity="0.1" />
+        </linearGradient>
+        <linearGradient id="linear-gradient-compute-node-2" x1="301" y1="176" x2="301" y2="120" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#999" stop-opacity="0.3" />
+          <stop offset="1" stop-color="#999" stop-opacity="0.1" />
+        </linearGradient>
+        <linearGradient id="linear-gradient-compute-node-3" x1="99" y1="236" x2="99" y2="180" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#f43b42" stop-opacity="0.3" />
+          <stop offset="1" stop-color="#f43b42" stop-opacity="0.1" />
+        </linearGradient>
+        <linearGradient id="linear-gradient-compute-node-4" x1="301" y1="236" x2="301" y2="180" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#f5b442" stop-opacity="0.3" />
+          <stop offset="1" stop-color="#f5b442" stop-opacity="0.1" />
+        </linearGradient>
+        <linearGradient id="linear-gradient-compute-node-5" x1="1" y1="100" x2="401" y2="100" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#4196ff" stop-opacity="0.1" />
+          <stop offset="1" stop-color="#4196ff" stop-opacity="0" />
+        </linearGradient>
+        <linearGradient id="linear-gradient-compute-node-6" x1="1" y1="115.5" x2="21" y2="115.5" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#4196ff" stop-opacity="0" />
+          <stop offset="1" stop-color="#4196ff" />
+        </linearGradient>
+      </defs>
+      <g>
+        <rect y="120" width="198" height="56" style="fill:url(#linear-gradient-compute-node)" />
+        <!-- <text transform="translate(160 155.6)" style="font-size:20px;fill:aqua;font-family:SourceHanSansCN-Bold, SourceHanSansCN Bold-GBpc-EUC-H;font-weight:700">{{ computeNodeData.sever_count }}</text> -->
+        <text transform="translate(160 155.6)" style="font-size:20px;fill:aqua;font-weight:700">{{ computeNodeData.sever_count }}</text>
+        <rect y="174" width="198" height="2" style="fill:aqua" />
+        <text transform="translate(28 152)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">服务总数</text>
+        <rect x="6" y="140" width="16" height="16" style="fill:#fff;opacity:0" />
+        <path d="M14,142a6,6,0,1,1-6,6,6,6,0,0,1,6-6m0-1a7,7,0,1,0,7,7,7,7,0,0,0-7-7Z" style="fill:#fff" />
+        <polyline points="20 148 14 148 14 142" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <rect x="202" y="120" width="198" height="56" style="fill:url(#linear-gradient-compute-node-2)" />
+        <text transform="translate(362 155.6)" style="font-size:20px;fill:#999;font-weight:700">{{ computeNodeData.offline_server_count }}</text>
+        <rect x="202" y="174" width="198" height="2" style="fill:#999" />
+        <text transform="translate(230 152)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">离线服务</text>
+        <rect x="208" y="140" width="16" height="16" style="fill:#fff;opacity:0" />
+        <line x1="219" y1="149" x2="213" y2="155" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <line x1="213" y1="149" x2="219" y2="155" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <path d="M216,144a5,5,0,0,0-4.65,3.18l.93.36a4,4,0,0,1,7.43,0l.93-.36A5,5,0,0,0,216,144Z" style="fill:#fff" />
+        <path d="M216,141a8,8,0,0,0-7.45,5.09l.93.36a7,7,0,0,1,13,0l.93-.36A8,8,0,0,0,216,141Z" style="fill:#fff" />
+        <rect y="180" width="198" height="56" style="fill:url(#linear-gradient-compute-node-3)" />
+        <text transform="translate(165 215.6)" style="font-size:20px;fill:#f43b42;font-weight:700">{{ computeNodeData.busy_server_count }}</text>
+        <rect y="234" width="198" height="2" style="fill:#f43b42" />
+        <text transform="translate(28 212)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">拥堵服务</text>
+        <rect x="6" y="200" width="16" height="16" style="fill:#fff;opacity:0" />
+        <path d="M14,202a6,6,0,1,1-6,6,6,6,0,0,1,6-6m0-1a7,7,0,1,0,7,7,7,7,0,0,0-7-7Z" style="fill:#fff" />
+        <line x1="21" y1="208" x2="7" y2="208" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <line x1="21" y1="208" x2="10" y2="203" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <line x1="21" y1="208" x2="10" y2="213" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <rect x="202" y="180" width="198" height="56" style="fill:url(#linear-gradient-compute-node-4)" />
+        <text transform="translate(367 215.6)" style="font-size:20px;fill:#f5b442;font-weight:700">{{ computeNodeData.loss_server_count }}</text>
+        <rect x="202" y="234" width="198" height="2" style="fill:#f5b442" />
+        <text transform="translate(230 212)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">缺失服务</text>
+        <rect x="208" y="200" width="16" height="16" style="fill:#fff;opacity:0" />
+        <path d="M216,202a6,6,0,1,1-6,6,6,6,0,0,1,6-6m0-1a7,7,0,1,0,7,7,7,7,0,0,0-7-7Z" style="fill:#fff" />
+        <line x1="220.95" y1="203.05" x2="211.05" y2="212.95" style="fill:none;stroke:#fff;stroke-miterlimit:10" />
+        <rect x="1" y="84" width="400" height="32" style="fill:url(#linear-gradient-compute-node-5)" />
+        <rect x="1" y="115" width="20" height="1" style="fill:url(#linear-gradient-compute-node-6)" />
+        <text transform="translate(11 105)" style="font-size:14px;fill:#fff;font-family:PingFang-SC-Bold, PingFang SC-Bold;font-weight:700">计算节点服务统计</text>
+        <rect x="1" width="400" height="68" style="fill:#4196ff;fill-opacity:0.08" />
+        <rect x="101" y="14" width="1" height="40" style="fill:#4196ff;fill-opacity:0.08" />
+        <rect x="201" y="14" width="1" height="40" style="fill:#4196ff;fill-opacity:0.08" />
+        <rect x="301" y="14" width="1" height="40" style="fill:#4196ff;fill-opacity:0.08" />
+        <text transform="translate(27 30)" style="font-size:20px;fill:aqua;font-weight:700">{{ computeNodeData.node_count }}</text>
+        <text transform="translate(27 51)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">计算节点</text>
+        <text transform="translate(133 51)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">待更新</text>
+        <text transform="translate(227 51)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">异常节点</text>
+        <text transform="translate(327 51)" style="font-size:12px;fill:#fff;font-family:PingFang-SC-Regular, PingFang SC-Regular">异常服务</text>
+        <text transform="translate(133 30)" style="font-size:20px;fill:#fff;font-weight:700">{{ computeNodeData.need_updated_count }}</text>
+        <text transform="translate(228 30)" style="font-size:20px;fill:#f43b42;font-weight:700">{{ computeNodeData.abnormal_count }}</text>
+        <text transform="translate(327 30)" style="font-size:20px;fill:#fc8358;font-weight:700">{{ computeNodeData.abnormal_server_count }}</text>
+      </g>
+    </svg>
+  </BorderBox>
+</template>
+
+<script setup lang="ts">
+import { PropType, shallowReactive, watch, toRefs, reactive, onMounted, onUnmounted, nextTick, ref } from 'vue'
+import { useChartDataFetch } from '@/hooks'
+import { CreateComponentType } from '@/packages/index.d'
+import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+import { publicInterface } from '@/api/path/business.api'
+import BorderBox from '../components/BorderBox.vue'
+import VChart from 'vue-echarts'
+import {isPreview} from '@/utils'
+import {graphic} from "echarts";
+import {cloneDeep} from 'lodash'
+import moment from "moment"
+import {selectTimeOptions} from "@/views/chart/ContentConfigurations/components/ChartData/index.d";
+import {RequestHttpIntervalEnum} from "@/enums/httpEnum";
+
+const props = defineProps({
+  chartConfig: {
+    type: Object as PropType<CreateComponentType>,
+    required: true
+  }
+})
+Object.assign(props.chartConfig.attr, { w: 380, h: 250 })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+
+const { w, h } = toRefs(props.chartConfig.attr)
+const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
+
+const getStyle = (radius: number) => {
+  return {
+    borderRadius: `${radius}px`,
+    overflow: 'hidden'
+  }
+}
+
+const computeNodeData:{[k:string]: number} = reactive({
+  abnormal_count: 0,
+  abnormal_server_count: 0,
+  busy_server_count: 0,
+  loss_server_count: 0,
+  need_updated_count: 0,
+  node_count: 0,
+  offline_server_count: 0,
+  sever_count: 0
+})
+const getData = () => {
+  publicInterface('/dcim/dems/statistic', 'count_node', {}).then(res => {
+    if (res && res.data) {
+      for (const key in computeNodeData) {
+        computeNodeData[key] = res.data[key]
+      }
+    }
+  })
+}
+let timer:unknown
+watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'), v => {
+  if(!isPreview()) return
+  if(props.chartConfig.request.requestInterval) {
+    if(timer) clearInterval(timer as number)
+    const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+    const unit = obj.unit
+    const number = unit * props.chartConfig.request.requestInterval
+    timer = setInterval(() => {
+      getData()
+    }, number)
+  }
+})
+onMounted(() => {
+  nextTick(() => {
+    getData()
+  })
+  if(!isPreview()) return
+  const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+  const unit = obj.unit
+  const number = unit * props.chartConfig.request.requestInterval!
+  timer = setInterval(() => {
+    nextTick(() => {
+      getData()
+    })
+  }, number)
+})
+onUnmounted(() => {
+  clearInterval(timer as number)
+})
+
+// const option = shallowReactive({
+//   dataset: ''
+// })
+// // 预览更新
+// useChartDataFetch(props.chartConfig, useChartEditStore, (newData: any) => {
+//   option.dataset = newData
+// })
+</script>
+
+<style lang="scss" scoped>
+.item{
+  background: rgba(65,150,255,.08);
+  width: calc(50% - 7px);
+  height: calc(50% - 7px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  .left{
+    color: #0ff;
+    height: 60px;
+  }
+  .right{
+    margin-left: 10px;
+    .label{
+      color: #fff;
+      height: 20px;
+      line-height: 20px;
+      font-size: 12px;
+    }
+    .value{
+      color: #0ff;
+      height: 20px;
+      line-height: 20px;
+      font-size: 20px;
+      margin-top: 8px;
+    }
+  }
+  .leftRed{
+    color: #f43b42;
+  }
+  .rightRed{
+    .value{
+      color: #f43b42;
+    }
+  }
+}
+</style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/Svg.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/Svg.vue
index 2b797fe4..10c2eb72 100644
--- a/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/Svg.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/Svg.vue
@@ -1,510 +1,513 @@
 <template>
-  <svg v-show="alarmLevels.length === 5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
-    <g>
-      <g>
-        <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
-      </g>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+  <div class="box">
+    <img class="scaner" src="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" alt="">
+    <svg v-show="alarmLevels.length === 5" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
       <g>
+        <g>
+          <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
+        </g>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
         <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <radialGradient id="real_time_alarm_statistics_5_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
-          <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
-          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <radialGradient id="real_time_alarm_statistics_5_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
+            <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
+            <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          </radialGradient>
+          <path style="fill:url(#real_time_alarm_statistics_5_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <g style="opacity:0.5;">
+            <path style="fill:#FFFFFF;" d="M100,11c49.074,0,89,39.925,89,89c0,49.075-39.926,89-89,89c-49.075,0-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+          </g>
+        </g>
+        <radialGradient id="real_time_alarm_statistics_5_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
+          <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
         </radialGradient>
-        <path style="fill:url(#real_time_alarm_statistics_5_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <g style="opacity:0.5;">
-          <path style="fill:#FFFFFF;" d="M100,11c49.074,0,89,39.925,89,89c0,49.075-39.926,89-89,89c-49.075,0-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_5_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
+        <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
+        <g style="opacity:0.2;">
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
+        </g>
+        <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
+        <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
+        <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
+        <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
+        <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
+        <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
+        <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
+        <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
+        <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
+        <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M31.521,77.75C40.896,48.877,68.004,28,100,28c0-6.904,0-13.677,0-20C59.114,8,24.465,34.673,12.486,71.564L31.521,77.75z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M28,100c0-7.768,1.245-15.241,3.521-22.25l-19.034-6.186C9.578,80.521,8,90.075,8,100c0,30.6,14.942,57.704,37.924,74.43l11.762-16.189C39.7,145.15,28,123.947,28,100z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" d="M154.076,174.43l-11.762-16.189C130.434,166.887,115.817,172,100,172c-15.818,0-30.435-5.113-42.314-13.76L45.924,174.43C61.104,185.478,79.789,192,100,192S138.896,185.478,154.076,174.43z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;" d="M100,28c31.999,0,59.104,20.879,68.479,49.75l19.035-6.185C175.535,34.673,140.886,8,100,8C100,14.323,100,21.096,100,28z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;" d="M187.514,71.565l-19.035,6.185C170.755,84.759,172,92.232,172,100c0,23.948-11.701,45.15-29.686,58.24l11.762,16.189C177.058,157.704,192,130.6,192,100C192,90.075,190.422,80.521,187.514,71.565z" />
+        <g>
+          <text transform="matrix(0.809 0.5878 -0.5878 0.809 135.6914 29.3159)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ eventName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(0.309 -0.9511 0.9511 0.309 176.5986 139.2744)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ commonName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 86.3184 184.9395)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ importantName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(0.309 0.9511 -0.9511 0.309 16.4736 115.8477)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(0.809 -0.5878 0.5878 0.809 42.084 46.4502)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
         </g>
       </g>
-      <radialGradient id="real_time_alarm_statistics_5_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
-        <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
-      </radialGradient>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_5_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
-      <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
-      <g style="opacity:0.2;">
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
-      </g>
-      <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
-      <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
-      <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
-      <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
-      <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
-      <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
-      <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
-      <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
-      <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
-      <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M31.521,77.75C40.896,48.877,68.004,28,100,28c0-6.904,0-13.677,0-20C59.114,8,24.465,34.673,12.486,71.564L31.521,77.75z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M28,100c0-7.768,1.245-15.241,3.521-22.25l-19.034-6.186C9.578,80.521,8,90.075,8,100c0,30.6,14.942,57.704,37.924,74.43l11.762-16.189C39.7,145.15,28,123.947,28,100z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" d="M154.076,174.43l-11.762-16.189C130.434,166.887,115.817,172,100,172c-15.818,0-30.435-5.113-42.314-13.76L45.924,174.43C61.104,185.478,79.789,192,100,192S138.896,185.478,154.076,174.43z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;" d="M100,28c31.999,0,59.104,20.879,68.479,49.75l19.035-6.185C175.535,34.673,140.886,8,100,8C100,14.323,100,21.096,100,28z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;" d="M187.514,71.565l-19.035,6.185C170.755,84.759,172,92.232,172,100c0,23.948-11.701,45.15-29.686,58.24l11.762,16.189C177.058,157.704,192,130.6,192,100C192,90.075,190.422,80.521,187.514,71.565z" />
+  <!--    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />-->
       <g>
-        <text transform="matrix(0.809 0.5878 -0.5878 0.809 135.6914 29.3159)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ eventName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(0.309 -0.9511 0.9511 0.309 176.5986 139.2744)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ commonName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 86.3184 184.9395)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ importantName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(0.309 0.9511 -0.9511 0.309 16.4736 115.8477)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(0.809 -0.5878 0.5878 0.809 42.084 46.4502)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
-      </g>
-    </g>
-    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />
-    <g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;fill-opacity:0.3;" d="M151,119.578c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C149.21,115.576,151,117.367,151,119.578z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;fill-opacity:0.6;" cx="147" cy="119.578" r="2.399" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;" cx="147.002" cy="119.578" r="1.2" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;fill-opacity:0.3;" cx="132.799" cy="59.001" r="4" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;fill-opacity:0.6;" cx="132.799" cy="59.001" r="2.399" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;" cx="132.801" cy="59.001" r="1.2" />
-      </g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M58,119.579c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C56.209,115.577,58,117.368,58,119.579z" />
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M56.4,119.579c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C55.324,117.179,56.4,118.253,56.4,119.579z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="53.999" cy="119.579" r="1.2" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="68.801" cy="59.109" r="4" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="68.8" cy="59.109" r="2.401" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="68.8" cy="59.109" r="1.2" />
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 63.8945 80)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 49.0938 109)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 142.0957 109)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
-      </g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.3;" d="M104,154.002c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C102.21,150,104,151.791,104,154.002z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.6;" cx="100" cy="154.002" r="2.399" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" cx="100.002" cy="154.002" r="1.2" />
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 95.0957 143.4238)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["secondary"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 124.5898 78.2905)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["record"] : 0 }}</text>
-      </g>
-    </g>
-  </svg>
-  <svg v-show="alarmLevels.length === 4 || alarmLevels.length === 0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
-    <defs>
-      <radialGradient id="real_time_alarm_statistics_35" cx="100" cy="660" r="92" gradientTransform="matrix(1, 0, 0, -1, 0, 760)" gradientUnits="userSpaceOnUse">
-        <stop offset="0.84" stop-color="#fff" stop-opacity="0.05" />
-        <stop offset="1" stop-color="#d0e3ea" stop-opacity="0.9" />
-      </radialGradient>
-      <radialGradient id="real_time_alarm_statistics_36" cx="100" cy="660" r="72.8" gradientTransform="matrix(1, 0, 0, -1, 0, 760)" gradientUnits="userSpaceOnUse">
-        <stop offset="0.9" stop-color="#d0e3ea" stop-opacity="0.9" />
-        <stop offset="1" stop-color="#d0e3ea" stop-opacity="0.05" />
-      </radialGradient>
-    </defs>
-    <g>
-      <circle cx="100" cy="100" r="100" style="fill:#4196ff;opacity:0.20000000298023224;isolation:isolate" />
-      <circle cx="100" cy="100" r="92" style="fill:#d0e3ea;fill-opacity:0.6000000238418579" />
-      <circle cx="100" cy="100" r="92" style="fill:#d0e3ea" />
-      <circle cx="100" cy="100" r="92" style="fill:#d0e3ea" />
-      <path d="M100,8a92,92,0,1,0,92,92A92,92,0,0,0,100,8Z" style="fill:url(#real_time_alarm_statistics_35)" />
-      <circle cx="100" cy="100" r="92" style="fill:#091c38" />
-      <g style="opacity:0.5">
-        <path d="M100,11a89,89,0,1,1-89,89,89,89,0,0,1,89-89m0-3a92,92,0,1,0,92,92A92,92,0,0,0,100,8Z" style="fill:#fff" />
-      </g>
-      <circle cx="100" cy="100" r="72.8" style="fill-opacity:0.6000000238418579;fill:url(#real_time_alarm_statistics_36)" />
-      <path d="M100,27.6A72.4,72.4,0,1,0,172.4,100,72.4,72.4,0,0,0,100,27.6Z" style="fill:#091c38" />
-      <g style="opacity:0.20000000298023224">
-        <line x1="100" y1="100" x2="100" y2="29.6" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="81.78" y2="32" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="64.8" y2="39.03" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="50.22" y2="50.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="39.03" y2="64.8" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="32" y2="81.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="29.6" y2="100" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="32" y2="118.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="39.03" y2="135.2" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="50.22" y2="149.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="64.8" y2="160.97" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="81.78" y2="168" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="100" y2="170.4" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="118.22" y2="168" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="135.2" y2="160.97" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="149.78" y2="149.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="160.97" y2="135.2" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="168" y2="118.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="170.4" y2="100" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="168" y2="81.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="160.97" y2="64.8" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="149.78" y2="50.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="135.2" y2="39.03" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-        <line x1="100" y1="100" x2="118.22" y2="32" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
-      </g>
-      <path d="M100,96.43A3.57,3.57,0,1,1,96.43,100h0A3.57,3.57,0,0,1,100,96.43m0-.8a4.37,4.37,0,1,0,4.37,4.37A4.37,4.37,0,0,0,100,95.63Z" style="fill:#4196ff;opacity:0.10000000149011612;isolation:isolate" />
-      <path d="M100,88.18A11.82,11.82,0,1,1,88.18,100h0A11.83,11.83,0,0,1,100,88.18m0-.8A12.62,12.62,0,1,0,112.62,100,12.62,12.62,0,0,0,100,87.38Z" style="fill:#4196ff;opacity:0.11999999731779099;isolation:isolate" />
-      <path d="M100,79.92A20.08,20.08,0,1,1,79.92,100h0A20.1,20.1,0,0,1,100,79.92m0-.8A20.88,20.88,0,1,0,120.88,100,20.88,20.88,0,0,0,100,79.12Z" style="fill:#4196ff;opacity:0.14000000059604645;isolation:isolate" />
-      <path d="M100,71.67A28.33,28.33,0,1,1,71.67,100h0A28.36,28.36,0,0,1,100,71.67m0-.8A29.13,29.13,0,1,0,129.13,100,29.13,29.13,0,0,0,100,70.87Z" style="fill:#4196ff;opacity:0.1599999964237213;isolation:isolate" />
-      <path d="M100,63.42A36.58,36.58,0,1,1,63.42,100h0A36.63,36.63,0,0,1,100,63.42m0-.8A37.38,37.38,0,1,0,137.38,100,37.38,37.38,0,0,0,100,62.62Z" style="fill:#4196ff;opacity:0.18000000715255737;isolation:isolate" />
-      <path d="M100,55.16A44.84,44.84,0,1,1,55.16,100h0A44.89,44.89,0,0,1,100,55.16m0-.8A45.64,45.64,0,1,0,145.64,100,45.64,45.64,0,0,0,100,54.36Z" style="fill:#4196ff;opacity:0.20000000298023224;isolation:isolate" />
-      <path d="M100,46.91A53.09,53.09,0,1,1,46.91,100h0A53.15,53.15,0,0,1,100,46.91m0-.8A53.89,53.89,0,1,0,153.89,100,53.89,53.89,0,0,0,100,46.11Z" style="fill:#4196ff;opacity:0.2199999988079071;isolation:isolate" />
-      <path d="M100,38.65A61.35,61.35,0,1,1,38.65,100h0A61.42,61.42,0,0,1,100,38.65m0-.8A62.15,62.15,0,1,0,162.15,100,62.15,62.15,0,0,0,100,37.85h0Z" style="fill:#4196ff;opacity:0.23999999463558197;isolation:isolate" />
-      <path d="M100,30.4A69.6,69.6,0,1,1,30.4,100h0A69.68,69.68,0,0,1,100,30.4m0-.8A70.4,70.4,0,1,0,170.4,100,70.4,70.4,0,0,0,100,29.6h0Z" style="fill:#4196ff;opacity:0.25999999046325684;isolation:isolate" />
-      <circle cx="100" cy="100" r="0.47" style="fill:#cc3c35;fill-opacity:0" />
-      <path d="M100,8V28a72,72,0,0,1,72,72h20A92,92,0,0,0,100,8Z" style="fill:#f8ca00" />
-      <path d="M8,100H28a72,72,0,0,1,72-72V8A92,92,0,0,0,8,100Z" style="fill:#f00" />
-      <path d="M100,192V172a72,72,0,0,1-72-72H8A92,92,0,0,0,100,192Z" style="fill:#f43b42" />
-      <path d="M192,100H172a72,72,0,0,1-72,72v20A92,92,0,0,0,192,100Z" style="fill:#fc8358" />
-      <text transform="translate(146.31 35.77) rotate(45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ commonName }}</text>
-      <text transform="translate(150.42 169.77) rotate(-45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ importantName }}</text>
-      <text transform="translate(32.77 152.04) rotate(45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ seriousName }}</text>
-      <text transform="translate(34.42 56.17) rotate(-45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ urgentName }}</text>
-      <image class="scaner" width="735" height="736" transform="translate(29.6 29.6) scale(0.19 0.19)" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" />
-      <circle cx="132.8" cy="132.8" r="4" style="fill:#e3bb26;fill-opacity:0.30000001192092896" />
-      <circle cx="132.8" cy="132.8" r="2.4" style="fill:#e3bb26;fill-opacity:0.6000000238418579" />
-      <circle cx="132.8" cy="132.8" r="1.2" style="fill:#e3bb26" />
-      <circle cx="132.8" cy="69.6" r="4" style="fill:#4fa5c2;fill-opacity:0.30000001192092896" />
-      <circle cx="132.8" cy="69.6" r="2.4" style="fill:#4fa5c2;fill-opacity:0.6000000238418579" />
-      <circle cx="132.8" cy="69.6" r="1.2" style="fill:#4fa5c2" />
-      <circle cx="68.8" cy="132.8" r="4" style="fill:#e27b56;fill-opacity:0.30000001192092896" />
-      <circle cx="68.8" cy="132.8" r="2.4" style="fill:#e27b56;fill-opacity:0.6000000238418579" />
-      <circle cx="68.8" cy="132.8" r="1.2" style="fill:#e27b56" />
-      <circle cx="68.8" cy="69.6" r="4" style="fill:#d73d40;fill-opacity:0.30000001192092896" />
-      <circle cx="68.8" cy="69.6" r="2.4" style="fill:#d73d40;fill-opacity:0.6000000238418579" />
-      <circle cx="68.8" cy="69.6" r="1.2" style="fill:#d73d40" />
-      <text transform="translate(63.89 90.49)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
-      <text transform="translate(63.89 122.22)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
-      <text transform="translate(127.89 122.22)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
-      <text transform="translate(124.59 88.89)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["secondary"] : 0 }}</text>
-    </g>
-  </svg>
-  <svg v-show="alarmLevels.length === 3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
-    <g>
-      <g>
-        <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
-      </g>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <radialGradient id="real_time_alarm_statistics_3_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
-          <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
-          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        </radialGradient>
-        <path style="fill:url(#real_time_alarm_statistics_3_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <g style="opacity:0.5;">
-          <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89s-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;fill-opacity:0.3;" d="M151,119.578c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C149.21,115.576,151,117.367,151,119.578z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;fill-opacity:0.6;" cx="147" cy="119.578" r="2.399" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#4FBADB;" cx="147.002" cy="119.578" r="1.2" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;fill-opacity:0.3;" cx="132.799" cy="59.001" r="4" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;fill-opacity:0.6;" cx="132.799" cy="59.001" r="2.399" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#14C6BD;" cx="132.801" cy="59.001" r="1.2" />
+        </g>
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M58,119.579c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C56.209,115.577,58,117.368,58,119.579z" />
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M56.4,119.579c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C55.324,117.179,56.4,118.253,56.4,119.579z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="53.999" cy="119.579" r="1.2" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="68.801" cy="59.109" r="4" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="68.8" cy="59.109" r="2.401" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="68.8" cy="59.109" r="1.2" />
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 63.8945 80)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 49.0938 109)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 142.0957 109)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
+        </g>
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.3;" d="M104,154.002c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C102.21,150,104,151.791,104,154.002z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.6;" cx="100" cy="154.002" r="2.399" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" cx="100.002" cy="154.002" r="1.2" />
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 95.0957 143.4238)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["secondary"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 124.5898 78.2905)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["record"] : 0 }}</text>
         </g>
       </g>
-      <radialGradient id="real_time_alarm_statistics_3_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
-        <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
-      </radialGradient>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_3_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
-      <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
-      <g style="opacity:0.2;">
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
-      </g>
-      <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
-      <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
-      <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
-      <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
-      <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
-      <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
-      <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
-      <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
-      <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
-      <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C65.95,8,36.223,26.499,20.314,53.994l17.339,10.01C50.104,42.486,73.353,28,100,28c26.648,0,49.896,14.487,62.347,36.004l17.339-10.01C163.777,26.499,134.05,8,100,8z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" d="M162.347,64.004C168.475,74.596,172,86.883,172,100c0,39.768-32.237,72-72,72v20c50.811,0,92-41.189,92-92c0-16.761-4.484-32.473-12.314-46.006L162.347,64.004z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M28,100c0-13.118,3.525-25.404,9.654-35.996l-17.34-10.011C12.484,67.527,8,83.239,8,100c0,50.811,41.189,92,92,92v-20C60.232,172,28,139.764,28,100z" />
-      <g>
-        <text transform="matrix(0.5 -0.866 0.866 0.5 166.7588 154.3428)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ importantName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(0.5 0.866 -0.866 0.5 21.5938 132.8682)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 87.5 22.5889)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
-      </g>
-    </g>
-    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />
-    <g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.3;" d="M147,122.579c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C145.21,118.577,147,120.368,147,122.579z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.6;" cx="143" cy="122.579" r="2.399" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" cx="143.002" cy="122.579" r="1.2" />
-      </g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M62,122.579c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C60.209,118.577,62,120.368,62,122.579z" />
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M60.4,122.579c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C59.324,120.179,60.4,121.253,60.4,122.579z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="57.999" cy="122.579" r="1.2" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="100" cy="49.001" r="4" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="99.999" cy="49.001" r="2.401" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="99.999" cy="49.001" r="1.2" />
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 95.0938 69.8911)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 53.0938 112)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 138.0957 112.001)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
-      </g>
-    </g>
-  </svg>
-  <svg v-show="alarmLevels.length === 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
-    <g>
-      <g>
-        <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
-      </g>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <radialGradient id="real_time_alarm_statistics_2_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
-          <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
-          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+    </svg>
+    <svg v-show="alarmLevels.length === 4 || alarmLevels.length === 0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
+      <defs>
+        <radialGradient id="real_time_alarm_statistics_35" cx="100" cy="660" r="92" gradientTransform="matrix(1, 0, 0, -1, 0, 760)" gradientUnits="userSpaceOnUse">
+          <stop offset="0.84" stop-color="#fff" stop-opacity="0.05" />
+          <stop offset="1" stop-color="#d0e3ea" stop-opacity="0.9" />
         </radialGradient>
-        <path style="fill:url(#real_time_alarm_statistics_2_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
-      </g>
+        <radialGradient id="real_time_alarm_statistics_36" cx="100" cy="660" r="72.8" gradientTransform="matrix(1, 0, 0, -1, 0, 760)" gradientUnits="userSpaceOnUse">
+          <stop offset="0.9" stop-color="#d0e3ea" stop-opacity="0.9" />
+          <stop offset="1" stop-color="#d0e3ea" stop-opacity="0.05" />
+        </radialGradient>
+      </defs>
       <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
+        <circle cx="100" cy="100" r="100" style="fill:#4196ff;opacity:0.20000000298023224;isolation:isolate" />
+        <circle cx="100" cy="100" r="92" style="fill:#d0e3ea;fill-opacity:0.6000000238418579" />
+        <circle cx="100" cy="100" r="92" style="fill:#d0e3ea" />
+        <circle cx="100" cy="100" r="92" style="fill:#d0e3ea" />
+        <path d="M100,8a92,92,0,1,0,92,92A92,92,0,0,0,100,8Z" style="fill:url(#real_time_alarm_statistics_35)" />
+        <circle cx="100" cy="100" r="92" style="fill:#091c38" />
+        <g style="opacity:0.5">
+          <path d="M100,11a89,89,0,1,1-89,89,89,89,0,0,1,89-89m0-3a92,92,0,1,0,92,92A92,92,0,0,0,100,8Z" style="fill:#fff" />
+        </g>
+        <circle cx="100" cy="100" r="72.8" style="fill-opacity:0.6000000238418579;fill:url(#real_time_alarm_statistics_36)" />
+        <path d="M100,27.6A72.4,72.4,0,1,0,172.4,100,72.4,72.4,0,0,0,100,27.6Z" style="fill:#091c38" />
+        <g style="opacity:0.20000000298023224">
+          <line x1="100" y1="100" x2="100" y2="29.6" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="81.78" y2="32" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="64.8" y2="39.03" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="50.22" y2="50.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="39.03" y2="64.8" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="32" y2="81.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="29.6" y2="100" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="32" y2="118.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="39.03" y2="135.2" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="50.22" y2="149.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="64.8" y2="160.97" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="81.78" y2="168" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="100" y2="170.4" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="118.22" y2="168" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="135.2" y2="160.97" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="149.78" y2="149.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="160.97" y2="135.2" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="168" y2="118.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="170.4" y2="100" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="168" y2="81.78" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="160.97" y2="64.8" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="149.78" y2="50.22" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="135.2" y2="39.03" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+          <line x1="100" y1="100" x2="118.22" y2="32" style="fill:none;stroke:#4196ff;stroke-linecap:round;stroke-linejoin:round" />
+        </g>
+        <path d="M100,96.43A3.57,3.57,0,1,1,96.43,100h0A3.57,3.57,0,0,1,100,96.43m0-.8a4.37,4.37,0,1,0,4.37,4.37A4.37,4.37,0,0,0,100,95.63Z" style="fill:#4196ff;opacity:0.10000000149011612;isolation:isolate" />
+        <path d="M100,88.18A11.82,11.82,0,1,1,88.18,100h0A11.83,11.83,0,0,1,100,88.18m0-.8A12.62,12.62,0,1,0,112.62,100,12.62,12.62,0,0,0,100,87.38Z" style="fill:#4196ff;opacity:0.11999999731779099;isolation:isolate" />
+        <path d="M100,79.92A20.08,20.08,0,1,1,79.92,100h0A20.1,20.1,0,0,1,100,79.92m0-.8A20.88,20.88,0,1,0,120.88,100,20.88,20.88,0,0,0,100,79.12Z" style="fill:#4196ff;opacity:0.14000000059604645;isolation:isolate" />
+        <path d="M100,71.67A28.33,28.33,0,1,1,71.67,100h0A28.36,28.36,0,0,1,100,71.67m0-.8A29.13,29.13,0,1,0,129.13,100,29.13,29.13,0,0,0,100,70.87Z" style="fill:#4196ff;opacity:0.1599999964237213;isolation:isolate" />
+        <path d="M100,63.42A36.58,36.58,0,1,1,63.42,100h0A36.63,36.63,0,0,1,100,63.42m0-.8A37.38,37.38,0,1,0,137.38,100,37.38,37.38,0,0,0,100,62.62Z" style="fill:#4196ff;opacity:0.18000000715255737;isolation:isolate" />
+        <path d="M100,55.16A44.84,44.84,0,1,1,55.16,100h0A44.89,44.89,0,0,1,100,55.16m0-.8A45.64,45.64,0,1,0,145.64,100,45.64,45.64,0,0,0,100,54.36Z" style="fill:#4196ff;opacity:0.20000000298023224;isolation:isolate" />
+        <path d="M100,46.91A53.09,53.09,0,1,1,46.91,100h0A53.15,53.15,0,0,1,100,46.91m0-.8A53.89,53.89,0,1,0,153.89,100,53.89,53.89,0,0,0,100,46.11Z" style="fill:#4196ff;opacity:0.2199999988079071;isolation:isolate" />
+        <path d="M100,38.65A61.35,61.35,0,1,1,38.65,100h0A61.42,61.42,0,0,1,100,38.65m0-.8A62.15,62.15,0,1,0,162.15,100,62.15,62.15,0,0,0,100,37.85h0Z" style="fill:#4196ff;opacity:0.23999999463558197;isolation:isolate" />
+        <path d="M100,30.4A69.6,69.6,0,1,1,30.4,100h0A69.68,69.68,0,0,1,100,30.4m0-.8A70.4,70.4,0,1,0,170.4,100,70.4,70.4,0,0,0,100,29.6h0Z" style="fill:#4196ff;opacity:0.25999999046325684;isolation:isolate" />
+        <circle cx="100" cy="100" r="0.47" style="fill:#cc3c35;fill-opacity:0" />
+        <path d="M100,8V28a72,72,0,0,1,72,72h20A92,92,0,0,0,100,8Z" style="fill:#f8ca00" />
+        <path d="M8,100H28a72,72,0,0,1,72-72V8A92,92,0,0,0,8,100Z" style="fill:#f00" />
+        <path d="M100,192V172a72,72,0,0,1-72-72H8A92,92,0,0,0,100,192Z" style="fill:#f43b42" />
+        <path d="M192,100H172a72,72,0,0,1-72,72v20A92,92,0,0,0,192,100Z" style="fill:#fc8358" />
+        <text transform="translate(146.31 35.77) rotate(45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ commonName }}</text>
+        <text transform="translate(150.42 169.77) rotate(-45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ importantName }}</text>
+        <text transform="translate(32.77 152.04) rotate(45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ seriousName }}</text>
+        <text transform="translate(34.42 56.17) rotate(-45)" style="isolation:isolate;font-size:12.500060081481934px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ urgentName }}</text>
+  <!--      <image class="scaner" width="735" height="736" transform="translate(29.6 29.6) scale(0.19 0.19)" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" />-->
+        <circle cx="132.8" cy="132.8" r="4" style="fill:#e3bb26;fill-opacity:0.30000001192092896" />
+        <circle cx="132.8" cy="132.8" r="2.4" style="fill:#e3bb26;fill-opacity:0.6000000238418579" />
+        <circle cx="132.8" cy="132.8" r="1.2" style="fill:#e3bb26" />
+        <circle cx="132.8" cy="69.6" r="4" style="fill:#4fa5c2;fill-opacity:0.30000001192092896" />
+        <circle cx="132.8" cy="69.6" r="2.4" style="fill:#4fa5c2;fill-opacity:0.6000000238418579" />
+        <circle cx="132.8" cy="69.6" r="1.2" style="fill:#4fa5c2" />
+        <circle cx="68.8" cy="132.8" r="4" style="fill:#e27b56;fill-opacity:0.30000001192092896" />
+        <circle cx="68.8" cy="132.8" r="2.4" style="fill:#e27b56;fill-opacity:0.6000000238418579" />
+        <circle cx="68.8" cy="132.8" r="1.2" style="fill:#e27b56" />
+        <circle cx="68.8" cy="69.6" r="4" style="fill:#d73d40;fill-opacity:0.30000001192092896" />
+        <circle cx="68.8" cy="69.6" r="2.4" style="fill:#d73d40;fill-opacity:0.6000000238418579" />
+        <circle cx="68.8" cy="69.6" r="1.2" style="fill:#d73d40" />
+        <text transform="translate(63.89 90.49)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        <text transform="translate(63.89 122.22)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
+        <text transform="translate(127.89 122.22)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
+        <text transform="translate(124.59 88.89)" style="isolation:isolate;font-size:14px;fill:#fff;font-family:MicrosoftYaHei, Microsoft YaHei">{{ alarmMonitorData ? alarmMonitorData["secondary"] : 0 }}</text>
       </g>
+    </svg>
+    <svg v-show="alarmLevels.length === 3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
       <g>
-        <g style="opacity:0.5;">
-          <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89s-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        <g>
+          <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
+        </g>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <radialGradient id="real_time_alarm_statistics_3_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
+            <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
+            <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          </radialGradient>
+          <path style="fill:url(#real_time_alarm_statistics_3_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <g style="opacity:0.5;">
+            <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89s-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+          </g>
+        </g>
+        <radialGradient id="real_time_alarm_statistics_3_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
+          <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
+        </radialGradient>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_3_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
+        <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
+        <g style="opacity:0.2;">
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
+        </g>
+        <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
+        <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
+        <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
+        <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
+        <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
+        <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
+        <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
+        <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
+        <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
+        <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C65.95,8,36.223,26.499,20.314,53.994l17.339,10.01C50.104,42.486,73.353,28,100,28c26.648,0,49.896,14.487,62.347,36.004l17.339-10.01C163.777,26.499,134.05,8,100,8z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" d="M162.347,64.004C168.475,74.596,172,86.883,172,100c0,39.768-32.237,72-72,72v20c50.811,0,92-41.189,92-92c0-16.761-4.484-32.473-12.314-46.006L162.347,64.004z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M28,100c0-13.118,3.525-25.404,9.654-35.996l-17.34-10.011C12.484,67.527,8,83.239,8,100c0,50.811,41.189,92,92,92v-20C60.232,172,28,139.764,28,100z" />
+        <g>
+          <text transform="matrix(0.5 -0.866 0.866 0.5 166.7588 154.3428)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ importantName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(0.5 0.866 -0.866 0.5 21.5938 132.8682)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 87.5 22.5889)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
         </g>
       </g>
-      <radialGradient id="real_time_alarm_statistics_2_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
-        <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
-      </radialGradient>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_2_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
-      <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
-      <g style="opacity:0.2;">
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
-      </g>
-      <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
-      <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
-      <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
-      <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
-      <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
-      <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
-      <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
-      <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
-      <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
-      <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C49.189,8,8,49.189,8,100h20c0-39.768,32.236-72,72-72c39.768,0,72,32.236,72,72h20C192,49.189,150.811,8,100,8z" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M172,100c0,39.768-32.237,72-72,72c-39.768,0-72-32.236-72-72H8c0,50.811,41.189,92,92,92s92-41.189,92-92H172z" />
+  <!--    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />-->
       <g>
-        <text transform="matrix(1 0 0 1 88 23)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 88 187)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
-      </g>
-    </g>
-    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />
-    <g>
-      <g>
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M105,132.801c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C103.209,128.799,105,130.59,105,132.801z" />
-        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M103.4,132.801c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C102.324,130.4,103.4,131.475,103.4,132.801z" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="100.999" cy="132.801" r="1.2" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="101" cy="69.6" r="4" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="100.999" cy="69.6" r="2.401" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="100.999" cy="69.6" r="1.2" />
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 96.0938 90.4897)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
-      </g>
-      <g>
-        <text transform="matrix(1 0 0 1 96.0938 122.2217)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
-      </g>
-    </g>
-  </svg>
-  <svg v-show="alarmLevels.length === 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
-    <g>
-      <g>
-        <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
-      </g>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <radialGradient id="real_time_alarm_statistics_1_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
-          <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
-          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        </radialGradient>
-        <path style="fill:url(#real_time_alarm_statistics_1_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
-      </g>
-      <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
-      </g>
-      <g>
-        <g style="opacity:0.5;">
-          <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89c-49.075,0-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.3;" d="M147,122.579c0,2.209-1.79,3.998-3.998,3.998c-2.211,0-4.002-1.789-4.002-3.998c0-2.211,1.791-4.002,4.002-4.002C145.21,118.577,147,120.368,147,122.579z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;fill-opacity:0.6;" cx="143" cy="122.579" r="2.399" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F8CA00;" cx="143.002" cy="122.579" r="1.2" />
+        </g>
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M62,122.579c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C60.209,118.577,62,120.368,62,122.579z" />
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M60.4,122.579c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C59.324,120.179,60.4,121.253,60.4,122.579z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="57.999" cy="122.579" r="1.2" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="100" cy="49.001" r="4" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="99.999" cy="49.001" r="2.401" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="99.999" cy="49.001" r="1.2" />
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 95.0938 69.8911)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 53.0938 112)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 138.0957 112.001)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["important"] : 0 }}</text>
         </g>
       </g>
-      <radialGradient id="real_time_alarm_statistics_1_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
-        <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
-        <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
-      </radialGradient>
-      <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_1_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
-      <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
-      <g style="opacity:0.2;">
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
-        <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
-      </g>
-      <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
-      <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
-      <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
-      <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
-      <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
-      <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
-      <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
-      <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
-      <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
-      <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
-      <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8z M100,172c-39.768,0-72-32.236-72-72c0-39.768,32.236-72,72-72c39.768,0,72,32.236,72,72C172,139.768,139.763,172,100,172z" />
-    </g>
-    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />
-    <g>
+    </svg>
+    <svg v-show="alarmLevels.length === 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
       <g>
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="101" cy="101.001" r="4" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="100.999" cy="101.001" r="2.401" />
-        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="100.999" cy="101.001" r="1.2" />
+        <g>
+          <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
+        </g>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <radialGradient id="real_time_alarm_statistics_2_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
+            <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
+            <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          </radialGradient>
+          <path style="fill:url(#real_time_alarm_statistics_2_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <g style="opacity:0.5;">
+            <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89s-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+          </g>
+        </g>
+        <radialGradient id="real_time_alarm_statistics_2_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
+          <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
+        </radialGradient>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_2_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
+        <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
+        <g style="opacity:0.2;">
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
+        </g>
+        <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
+        <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
+        <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
+        <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
+        <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
+        <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
+        <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
+        <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
+        <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
+        <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C49.189,8,8,49.189,8,100h20c0-39.768,32.236-72,72-72c39.768,0,72,32.236,72,72h20C192,49.189,150.811,8,100,8z" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" d="M172,100c0,39.768-32.237,72-72,72c-39.768,0-72-32.236-72-72H8c0,50.811,41.189,92,92,92s92-41.189,92-92H172z" />
+        <g>
+          <text transform="matrix(1 0 0 1 88 23)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ urgentName }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 88 187)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:12.5001;">{{ seriousName }}</text>
+        </g>
       </g>
+  <!--    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />-->
       <g>
-        <text transform="matrix(1 0 0 1 96.0933 121.8906)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        <g>
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.3;" d="M105,132.801c0,2.209-1.791,3.998-4.001,3.998c-2.208,0-3.999-1.789-3.999-3.998c0-2.211,1.791-4.002,3.999-4.002C103.209,128.799,105,130.59,105,132.801z" />
+          <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;fill-opacity:0.6;" d="M103.4,132.801c0,1.324-1.076,2.398-2.401,2.398c-1.323,0-2.401-1.074-2.401-2.398c0-1.326,1.078-2.4,2.401-2.4C102.324,130.4,103.4,131.475,103.4,132.801z" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#FC8358;" cx="100.999" cy="132.801" r="1.2" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="101" cy="69.6" r="4" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="100.999" cy="69.6" r="2.401" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="100.999" cy="69.6" r="1.2" />
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 96.0938 90.4897)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 96.0938 122.2217)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["serious"] : 0 }}</text>
+        </g>
       </g>
+    </svg>
+    <svg v-show="alarmLevels.length === 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 200">
       <g>
-        <text transform="matrix(1 0 0 1 86.1982 84)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ urgentName }}</text>
+        <g>
+          <circle style="opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;fill:#4196FF;" cx="100" cy="100" r="100" />
+        </g>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;fill-opacity:0.6;" cx="100" cy="100" r="92" />
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#D0E3EA;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <radialGradient id="real_time_alarm_statistics_1_1_" cx="100" cy="100" r="92" gradientUnits="userSpaceOnUse">
+            <stop offset="0.836" style="stop-color:#FFFFFF;stop-opacity:0.05" />
+            <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          </radialGradient>
+          <path style="fill:url(#real_time_alarm_statistics_1_1_);" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+        </g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#091C38;" cx="100" cy="100" r="92" />
+        </g>
+        <g>
+          <g style="opacity:0.5;">
+            <path style="fill:#FFFFFF;" d="M100,11c49.075,0,89,39.925,89,89c0,49.075-39.925,89-89,89c-49.075,0-89-39.925-89-89C11,50.925,50.925,11,100,11 M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8L100,8z" />
+          </g>
+        </g>
+        <radialGradient id="real_time_alarm_statistics_1_2_" cx="100" cy="100" r="72.8008" gradientUnits="userSpaceOnUse">
+          <stop offset="0.9032" style="stop-color:#D0E3EA;stop-opacity:0.9" />
+          <stop offset="1" style="stop-color:#D0E3EA;stop-opacity:0.05" />
+        </radialGradient>
+        <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:url(#real_time_alarm_statistics_1_2_);fill-opacity:0.6;" cx="100" cy="100" r="72.801" />
+        <path style="fill:#091C38;" d="M100,27.6c-39.984,0-72.4,32.413-72.4,72.4s32.416,72.4,72.4,72.4c39.986,0,72.4-32.413,72.4-72.4S139.986,27.6,100,27.6L100,27.6z" />
+        <g style="opacity:0.2;">
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="29.6" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.778" y2="32" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.801" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="50.219" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="64.801" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="81.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="29.6" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="31.998" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="39.032" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="50.219" y2="149.781" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="64.803" y2="160.968" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="81.779" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="100" y2="170.399" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="168" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="160.967" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="149.778" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.968" y2="135.199" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="118.222" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="170.4" y2="100" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="168.004" y2="81.777" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="160.967" y2="64.798" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="149.781" y2="50.218" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="135.198" y2="39.032" />
+          <line style="fill:none;stroke:#4196FF;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="100" y1="100" x2="118.221" y2="32" />
+        </g>
+        <path style="opacity:0.1;fill:#4196FF;" d="M100,96.434c1.969,0,3.568,1.598,3.568,3.566s-1.6,3.566-3.568,3.566s-3.568-1.598-3.568-3.566S98.031,96.434,100,96.434 M100,95.633c-2.412,0-4.369,1.955-4.369,4.367s1.957,4.367,4.369,4.367s4.367-1.955,4.367-4.367S102.412,95.633,100,95.633L100,95.633z" />
+        <path style="opacity:0.12;fill:#4196FF;" d="M100,88.18c6.52,0,11.822,5.301,11.822,11.82S106.52,111.82,100,111.82S88.176,106.52,88.176,100S93.48,88.18,100,88.18 M100,87.379c-6.972,0-12.621,5.65-12.621,12.621s5.649,12.621,12.621,12.621s12.621-5.65,12.621-12.621S106.972,87.379,100,87.379L100,87.379z" />
+        <path style="opacity:0.14;fill:#4196FF;" d="M100,79.924c11.071,0,20.077,9.006,20.077,20.076s-9.006,20.076-20.077,20.076S79.923,111.07,79.923,100S88.929,79.924,100,79.924 M100,79.123c-11.531,0-20.877,9.347-20.877,20.877s9.346,20.876,20.877,20.876c11.529,0,20.877-9.346,20.877-20.876S111.529,79.123,100,79.123L100,79.123z" />
+        <path style="opacity:0.16;fill:#4196FF;" d="M100,71.67c15.623,0,28.33,12.708,28.33,28.33s-12.707,28.33-28.33,28.33S71.67,115.622,71.67,100S84.377,71.67,100,71.67 M100,70.869c-16.09,0-29.131,13.045-29.131,29.131S83.91,129.131,100,129.131s29.131-13.045,29.131-29.131S116.09,70.869,100,70.869L100,70.869z" />
+        <path style="opacity:0.18;fill:#4196FF;" d="M100,63.416c20.173,0,36.584,16.412,36.584,36.584c0,20.173-16.411,36.584-36.584,36.584c-20.174,0-36.584-16.411-36.584-36.584C63.416,79.828,79.826,63.416,100,63.416M100,62.615c-20.646,0-37.385,16.738-37.385,37.385c0,20.646,16.738,37.385,37.385,37.385s37.385-16.739,37.385-37.385C137.385,79.354,120.646,62.615,100,62.615L100,62.615z" />
+        <path style="opacity:0.2;fill:#4196FF;" d="M100,55.163c24.724,0,44.84,20.112,44.84,44.837s-20.116,44.837-44.84,44.837c-24.725,0-44.84-20.112-44.84-44.837S75.275,55.163,100,55.163 M100,54.363c-25.205,0-45.641,20.432-45.641,45.637S74.795,145.637,100,145.637s45.637-20.432,45.637-45.637S125.205,54.363,100,54.363L100,54.363z" />
+        <path style="opacity:0.22;fill:#4196FF;" d="M100,46.906c29.275,0,53.092,23.818,53.092,53.094S129.275,153.094,100,153.094S46.906,129.275,46.906,100S70.725,46.906,100,46.906 M100,46.109c-29.765,0-53.891,24.127-53.891,53.891c0,29.763,24.126,53.891,53.891,53.891s53.891-24.128,53.891-53.891C153.891,70.236,129.765,46.109,100,46.109L100,46.109z" />
+        <path style="opacity:0.24;fill:#4196FF;" d="M100,38.654c33.826,0,61.346,27.52,61.346,61.346s-27.52,61.346-61.346,61.346S38.654,133.826,38.654,100S66.174,38.654,100,38.654 M100,37.854c-34.322,0-62.146,27.823-62.146,62.146c0,34.32,27.824,62.146,62.146,62.146S162.146,134.32,162.146,100C162.146,65.677,134.322,37.854,100,37.854L100,37.854z" />
+        <path style="opacity:0.26;fill:#4196FF;" d="M100,30.4c38.378,0,69.6,31.222,69.6,69.6s-31.222,69.6-69.6,69.6S30.4,138.378,30.4,100S61.622,30.4,100,30.4 M100,29.6c-38.881,0-70.4,31.521-70.4,70.4c0,38.879,31.52,70.4,70.4,70.4c38.883,0,70.4-31.521,70.4-70.4C170.4,61.12,138.883,29.6,100,29.6L100,29.6z" />
+        <circle style="opacity:0;fill:#F43B42;" cx="100" cy="100" r="0.471" />
+        <path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" d="M100,8C49.189,8,8,49.189,8,100s41.189,92,92,92s92-41.189,92-92S150.811,8,100,8z M100,172c-39.768,0-72-32.236-72-72c0-39.768,32.236-72,72-72c39.768,0,72,32.236,72,72C172,139.768,139.763,172,100,172z" />
       </g>
-    </g>
-  </svg>
+  <!--    <image class="scaner" style="overflow:visible;" width="734" height="734" xlink:href="@/assets/customComponents/RealTimeAlarmStatistics/scanner.png" transform="matrix(0.192 0 0 0.192 29.5996 29.5996)" />-->
+      <g>
+        <g>
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.3;" cx="101" cy="101.001" r="4" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;fill-opacity:0.6;" cx="100.999" cy="101.001" r="2.401" />
+          <circle style="fill-rule:evenodd;clip-rule:evenodd;fill:#F43B42;" cx="100.999" cy="101.001" r="1.2" />
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 96.0933 121.8906)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ alarmMonitorData ? alarmMonitorData["urgent"] : 0 }}</text>
+        </g>
+        <g>
+          <text transform="matrix(1 0 0 1 86.1982 84)" style="fill:#FFFFFF; font-family:'MicrosoftYaHei'; font-size:14;">{{ urgentName }}</text>
+        </g>
+      </g>
+    </svg>
+  </div>
 </template>
 
 <script lang="ts" setup>
@@ -514,5 +517,20 @@ const { urgentName, seriousName, importantName, commonName, eventName, alarmMoni
 </script>
 
 <style lang="scss" scoped>
+@keyframes rotate {
+  from { transform: scale(0.69) rotate(0);}
+  to { transform: scale(0.69) rotate(360deg);}
+}
+.box{
+  position: relative;
+  .scaner{
+    position: absolute;
+    top: -1.5%;
+    left: -0.5%;
+    animation: rotate linear 5s infinite;
+    width: 100%;
+    height: 100%;
+  }
+}
 
 </style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/index.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/index.vue
index 8b58f06e..459f5ee8 100644
--- a/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/index.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeAlarmStatistics/index.vue
@@ -1,13 +1,12 @@
 <template>
   <div :style="getStyle(borderRadius)">
     <BorderBox :title="props.chartConfig.customData.title">
-      <div ref="echart7" class="box-5-item" style="width: 50%"></div>
       <v-chart
         ref="vChartRef"
         :option="option"
         :manual-update="false"
         :update-options="{
-          replaceMerge: ['series', 'xAxis']
+          replaceMerge: ['series', 'xAxis', 'yAxis']
         }"
         autoresize
         style="overflow: visible;width: 50%"
@@ -20,16 +19,16 @@
 </template>
 
 <script setup lang="ts">
-import { PropType, shallowReactive, watch, toRefs, reactive, onMounted, onUnmounted, ref } from 'vue'
-import { requireErrorImg } from '@/utils'
-import { useChartDataFetch } from '@/hooks'
+import { PropType, watch, toRefs, reactive, onMounted, onUnmounted, nextTick, ref } from 'vue'
+import {isPreview} from '@/utils'
 import { CreateComponentType } from '@/packages/index.d'
-import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
-import moment from 'moment'
 import BorderBox from '../components/BorderBox.vue'
 import SvgAll from './Svg.vue'
 import {RequestHttpIntervalEnum} from "@/enums/httpEnum";
-import {postMessageToParent, useGetMessageByParent} from '@/utils/utils'
+import { useOriginStore } from '@/store/modules/originStore/originStore'
+import { publicInterface } from '@/api/path/business.api'
+import {selectTimeOptions} from "@/views/chart/ContentConfigurations/components/ChartData/index.d";
+import VChart from 'vue-echarts'
 
 const props = defineProps({
   chartConfig: {
@@ -39,7 +38,7 @@ const props = defineProps({
 })
 
 Object.assign(props.chartConfig.attr, {w: 380, h: 250})
-Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
 
 const { w, h } = toRefs(props.chartConfig.attr)
 const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
@@ -64,43 +63,269 @@ const nameObj = reactive({
     secondary: 0,
     record: 0
   },
-  alarmLevels: []
+  alarmLevels: [],
+  urgentColor: '#cb3f3f',
+  seriousColor: '#d87855',
+  importantColor: '#dab42e',
+  commonColor: '#47acea',
+  eventColor: '#4fbadb',
 })
 
-const option = reactive({
+const originStore = useOriginStore()
+const systemConfig = originStore?.getOriginStore?.user?.systemConfig
+const systemConstant = originStore?.getOriginStore?.user?.systemConstant
+if (systemConfig['active_alarm_level']) {
+  for (let i = 0; i < Number(systemConfig['active_alarm_level']); i++) {
+    nameObj.alarmLevels.push(i + 1)
+  }
+}
 
-})
-postMessageToParent({type: 'getStore', data: 'user'})
-// const userStore = reactive({})
-const {getMessageByParent} = useGetMessageByParent()
-getMessageByParent('getStore', (e) => {
-  console.log(e)
+nameObj.urgentName = systemConstant['warn_levels'].find((item:any) => item.value === '1') ? systemConstant['warn_levels'].find((item:any) => item.value === '1')['label'] : '紧急'
+nameObj.seriousName = systemConstant['warn_levels'].find((item:any) => item.value === '2') ? systemConstant['warn_levels'].find((item:any) => item.value === '2')['label'] : '严重'
+nameObj.importantName = systemConstant['warn_levels'].find((item:any) => item.value === '3') ? systemConstant['warn_levels'].find((item:any) => item.value === '3')['label'] : '重要'
+nameObj.commonName = systemConstant['warn_levels'].find((item:any) => item.value === '4') ? systemConstant['warn_levels'].find((item:any) => item.value === '4')['label'] : '一般'
+nameObj.eventName = systemConstant['warn_levels'].find((item:any) => item.value === '5') ? systemConstant['warn_levels'].find((item:any) => item.value === '5')['label'] : '事件'
+
+nameObj.urgentColor = systemConstant['warn_levels'].find((item:any) => item.value === '1') ? systemConstant['warn_levels'].find((item:any) => item.value === '1')['remark'] : '#cb3f3f'
+nameObj.seriousColor = systemConstant['warn_levels'].find((item:any) => item.value === '2') ? systemConstant['warn_levels'].find((item:any) => item.value === '2')['remark'] : '#d87855'
+nameObj.importantColor = systemConstant['warn_levels'].find((item:any) => item.value === '3') ? systemConstant['warn_levels'].find((item:any) => item.value === '3')['remark'] : '#dab42e'
+nameObj.commonColor = systemConstant['warn_levels'].find((item:any) => item.value === '4') ? systemConstant['warn_levels'].find((item:any) => item.value === '4')['remark'] : '#47acea'
+nameObj.eventColor = systemConstant['warn_levels'].find((item:any) => item.value === '5') ? systemConstant['warn_levels'].find((item:any) => item.value === '5')['remark'] : '#4fbadb'
+
+const getData = () => {
+  const confirm_statuss = systemConfig?.['active_alarm_confirm_status'] ? [...JSON.parse(systemConfig['active_alarm_confirm_status'])] : []
+  const param = {
+    confirm_statuss
+  }
+
+  publicInterface('/dcim/dems/devie_active_alarm', 'count_by_level_new', param).then(res => {
+    if (res && res.data && JSON.stringify(res.data) !== '{}') {
+      nameObj.alarmMonitorData['urgent'] = res.data['level1'] ? res.data['level1'] : 0
+      nameObj.alarmMonitorData['serious'] = res.data['level2'] ? res.data['level2'] : 0
+      nameObj.alarmMonitorData['important'] = res.data['level3'] ? res.data['level3'] : 0
+      nameObj.alarmMonitorData['secondary'] = res.data['level4'] ? res.data['level4'] : 0
+      nameObj.alarmMonitorData['record'] = res.data['level5'] ? res.data['level5'] : 0
+      initChart()
+    }
+  })
+}
+
+let option = reactive({})
+const initChart = () => {
+  const len = nameObj.alarmLevels.length ? nameObj.alarmLevels.length : 4
+  const yDataArr = [nameObj.eventName, nameObj.commonName, nameObj.importantName, nameObj.seriousName, nameObj.urgentName].reverse().slice(0, len).reverse()
+  const dataArr = [nameObj.alarmMonitorData.record, nameObj.alarmMonitorData.secondary, nameObj.alarmMonitorData.important, nameObj.alarmMonitorData.serious, nameObj.alarmMonitorData.urgent].reverse().slice(0, len).reverse()
+  const yAxisColorList = [
+    nameObj.eventColor ? nameObj.eventColor : '#4fbadb',
+    nameObj.commonColor ? nameObj.commonColor : '#47acea',
+    nameObj.importantColor ? nameObj.importantColor : '#dab42e',
+    nameObj.seriousColor ? nameObj.seriousColor : '#d87855',
+    nameObj.urgentColor ? nameObj.urgentColor : '#cb3f3f'
+  ].reverse().slice(0, len).reverse()
+  const seriesColorList = [
+    {
+      // 横向线性渐变
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 1,
+      y2: 0,
+      colorStops: [{
+        offset: 0, color: '#47acea00' // 0% 处的颜色
+      }, {
+        offset: 1, color: nameObj.eventColor ? nameObj.eventColor : '#4fbadb' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    },
+    {
+      // 横向线性渐变
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 1,
+      y2: 0,
+      colorStops: [{
+        offset: 0, color: '#47acea00' // 0% 处的颜色
+      }, {
+        offset: 1, color: nameObj.commonColor ? nameObj.commonColor : '#47acea' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    },
+    {
+      // 横向线性渐变
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 1,
+      y2: 0,
+      colorStops: [{
+        offset: 0, color: '#dab42e00' // 0% 处的颜色
+      }, {
+        offset: 1, color: nameObj.importantColor ? nameObj.importantColor : '#dab42e' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    },
+    {
+      // 横向线性渐变
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 1,
+      y2: 0,
+      colorStops: [{
+        offset: 0, color: '#d8785500' // 0% 处的颜色
+      }, {
+        offset: 1, color: nameObj.seriousColor ? nameObj.seriousColor : '#d87855' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    },
+    {
+      // 横向线性渐变
+      type: 'linear',
+      x: 0,
+      y: 0,
+      x2: 1,
+      y2: 0,
+      colorStops: [{
+        offset: 0, color: '#cb3f3f00' // 0% 处的颜色
+      }, {
+        offset: 1, color: nameObj.urgentColor ? nameObj.urgentColor : '#cb3f3f' // 100% 处的颜色
+      }],
+      global: false // 缺省为 false
+    }
+  ].reverse().slice(0, len).reverse()
+  const echart7Options = {
+    grid: [
+      {
+        top: '-3%',
+        bottom: '-15%',
+        left: '10%',
+        right: '0%',
+        containLabel: true
+      }
+    ],
+    xAxis: {
+      show: false,
+      // max: 1000,
+      type: 'value',
+      axisLine: { show: false },
+      splitLine: { show: false },
+      axisTick: { show: false },
+      data: dataArr
+    },
+    yAxis: [
+      {
+        type: 'category',
+        // inverse: true,
+        axisLine: { show: false },
+        splitLine: { show: false },
+        axisTick: { show: false },
+        axisLabel: {
+          // inside: true,
+          // verticalAlign: 'center',
+          // align: 'center',
+          color: '#ccc',
+          // padding: [0, 0, 0, 0],
+          fontSize: 14
+        },
+        data: yDataArr
+      },
+      {
+        type: 'category',
+        // inverse: true,
+        axisLine: {
+          show: false
+        },
+        axisTick: {
+          show: false
+        },
+        axisLabel: {
+          show: true,
+          inside: false,
+          // verticalAlign: 'bottom',
+          // 位置 上右下左
+          padding: [0, 10, 15, 0],
+          // lineHeight: '40',
+          textStyle: {
+            fontSize: 14,
+            color: (value:unknown, index:number) => {
+              return yAxisColorList[index]
+            }
+          }
+        },
+        // 统计的总量 用纵坐标模拟
+        data: dataArr
+      }
+    ],
+    series: [
+      {
+        label: {
+          show: false,
+          fontSize: 16,
+          fontWeight: 'bold',
+          // formatter: '已使用{d}({c})',
+          formatter: (params:any) => {
+            return `已使用${(parseFloat(params.value) / 88888 * 100).toFixed(1)}%(${params.value})`
+          },
+          position: 'insideLeft',
+          align: 'left'
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: 'rgba(134, 188, 255, 0.2)'
+        },
+        barWidth: 10,
+        barCategoryGap: '30%',
+        type: 'bar',
+        data: dataArr,
+        itemStyle: {
+          normal: {
+            // 设置柱状图颜色，注意：如果颜色太少的话，后面颜色不会自动循环
+            color: (params:any) => {
+              return seriesColorList[params.dataIndex]
+            }
+          }
+        }
+      }
+    ]
+  }
+  Object.assign(option, echart7Options)
+}
+
+let timer:unknown
+watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'), v => {
+  if(!isPreview()) return
+  if(props.chartConfig.request.requestInterval) {
+    if(timer) clearInterval(timer as number)
+    const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+    const unit = obj.unit
+    const number = unit * props.chartConfig.request.requestInterval
+    timer = setInterval(() => {
+      getData()
+    }, number)
+  }
 })
 
-
+onMounted(() => {
+  nextTick(() => {
+    getData()
+  })
+  if(!isPreview()) return
+  const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+  const unit = obj.unit
+  const number = unit * props.chartConfig.request.requestInterval!
+  timer = setInterval(() => {
+    nextTick(() => {
+      getData()
+    })
+  }, number)
+})
+onUnmounted(() => {
+  clearInterval(timer as number)
+})
 
 </script>
 
 <style lang="scss" scoped>
-.Theme1{
-  position: relative;
-  .full-screen-btn {
-    border: #4396fd 1px solid;
-    border-radius: 3px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 3px 10px;
-    cursor: pointer;
-    position: absolute;
-    top: 16px;
-    right: 9.6%;
-    color: #4396fd;
-    font-size: 14px;
-    .full-screen {
-      font-size: 16px;
-      margin-right: 5px;
-    }
-  }
-}
+
 </style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.ts b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.ts
new file mode 100644
index 00000000..bb4e1c96
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.ts
@@ -0,0 +1,25 @@
+import { PublicConfigClass } from '@/packages/public'
+import { CreateComponentType } from '@/packages/index.d'
+import { RealTimeEventConfig } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+// import logo from '@/assets/logo.png'
+
+export const option = {
+  // 图片路径
+  dataset: '',
+  // 适应方式
+  fit: 'contain',
+  // 圆角
+  borderRadius: 0
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType
+{
+  public key = RealTimeEventConfig.key
+  public chartConfig = cloneDeep(RealTimeEventConfig)
+  public option = cloneDeep(option)
+  public customData = cloneDeep({
+    title: '实时事件',
+    showInterval: true,
+  })
+}
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.vue
new file mode 100644
index 00000000..d1759a1d
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/config.vue
@@ -0,0 +1,67 @@
+<template>
+<!--  <collapse-item name="属性" :expanded="true">-->
+<!--    <setting-item-box name="路径" :alone="true">-->
+<!--      <setting-item>-->
+<!--        <n-input v-model:value="optionData.dataset" size="small"></n-input>-->
+<!--      </setting-item>-->
+<!--    </setting-item-box>-->
+<!--    <setting-item-box name="样式">-->
+<!--      <setting-item name="类型">-->
+<!--        <n-select-->
+<!--          v-model:value="optionData.fit"-->
+<!--          size="small"-->
+<!--          :options="fitList"-->
+<!--        ></n-select>-->
+<!--      </setting-item>-->
+<!--      <setting-item name="圆角">-->
+<!--        <n-input-number-->
+<!--          v-model:value="optionData.borderRadius"-->
+<!--          size="small"-->
+<!--          :min="0"-->
+<!--          placeholder="圆角"-->
+<!--        ></n-input-number>-->
+<!--      </setting-item>-->
+<!--    </setting-item-box>-->
+<!--  </collapse-item>-->
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import { option } from './config'
+import {
+  CollapseItem,
+  SettingItemBox,
+  SettingItem,
+} from '@/components/Pages/ChartItemSetting'
+
+const props = defineProps({
+  optionData: {
+    type: Object as PropType<typeof option>,
+    required: true,
+  },
+})
+
+// 适应类型
+const fitList = [
+  {
+    value: 'fill',
+    label: 'fill'
+  },
+  {
+    value: 'contain',
+    label: 'contain'
+  },
+  {
+    value: 'cover',
+    label: 'cover'
+  },
+  {
+    value: 'scale-down',
+    label: 'scale-down'
+  },
+  {
+    value: 'none',
+    label: 'none'
+  },
+]
+</script>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/configData.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/configData.vue
new file mode 100644
index 00000000..2c83af5e
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/configData.vue
@@ -0,0 +1,16 @@
+<template>
+  <n-space vertical>
+    <setting-item-box name="标题" :alone="true">
+      <n-input v-model:value="props.customData.title" size="small" placeholder="请输入"/>
+    </setting-item-box>
+  </n-space>
+</template>
+
+<script lang="ts" setup>
+import { SettingItemBox } from '@/components/Pages/ChartItemSetting'
+
+const props = defineProps(['customData', 'request'])
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.ts b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.ts
new file mode 100644
index 00000000..1eb07a3f
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.ts
@@ -0,0 +1,16 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
+import { ChatCategoryEnum, ChatCategoryEnumName } from '@/packages/components/CustomComponents/index.d'
+
+export const RealTimeEventConfig: ConfigType = {
+  key: 'RealTimeEvent',
+  chartKey: 'VRealTimeEvent',
+  conKey: 'VCRealTimeEvent',
+  // VCD开头
+  conDataKey: 'VCDRealTimeEvent',
+  title: '实时事件',
+  category: ChatCategoryEnum.CUSTOMCOMPONENTS,
+  categoryName: ChatCategoryEnumName.CUSTOMCOMPONENTS,
+  package: PackagesCategoryEnum.CUSTOMCOMPONENTS,
+  chartFrame: ChartFrameEnum.COMMON,
+  image: 'RealTimeEvent.png'
+}
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.vue
new file mode 100644
index 00000000..29267763
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeEvent/index.vue
@@ -0,0 +1,210 @@
+<template>
+  <BorderBox ref="refBorderBox" :title="props.chartConfig.customData.title" :select1="select1" :select2="select2" :style="getStyle(borderRadius)" style="overflow: visible">
+    <div class="itemBox">
+      <div class="item" v-for="(item, i) in tableData" :key="i">
+        <n-checkbox class="mr10" size="small"/>
+        <n-tag class="mr5" size="small" strong :color="{textColor: '#000', color: item.confirm_status === 'ok' ? '#4DCA59' : '#f5b442'}">{{ item.confirm_status === 'ok'?'已确认':'未确认' }}</n-tag>
+        <n-tag class="mr5" size="small" :color="{textColor: item.color1, borderColor: item.color1}">{{select1.options[item.level - 1].label}}</n-tag>
+        <div style="color: rgba(255, 255, 255, 0.82);">{{ item.content }}</div>
+        <div style="flex: 1"></div>
+        <div class="mr10" style="color: #B5BAC3;">{{ moment(item.generate_time).format('yyyy-MM-DD HH:mm:ss') }}</div>
+        <LocationIcon class="mr10" style="width: 20px;height: 20px;color: #4196ff;"/>
+        <CheckCircleOutlinedIcon v-if="item.confirm_status === 'not'" style="width: 20px;height: 20px;color: #4196ff;"/>
+        <div v-else style="width: 20px"></div>
+      </div>
+    </div>
+  </BorderBox>
+</template>
+
+<script setup lang="ts">
+import { PropType, shallowReactive, watch, toRefs, reactive, onMounted, onUnmounted, nextTick, ref } from 'vue'
+import { useChartDataFetch } from '@/hooks'
+import { CreateComponentType } from '@/packages/index.d'
+import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+import { publicInterface } from '@/api/path/business.api'
+import BorderBox from '../components/BorderBoxV2.vue'
+import VChart from 'vue-echarts'
+import {isPreview} from '@/utils'
+import {graphic} from "echarts";
+import {cloneDeep} from 'lodash'
+import moment from "moment"
+import {selectTimeOptions} from "@/views/chart/ContentConfigurations/components/ChartData/index.d";
+import {RequestHttpIntervalEnum} from "@/enums/httpEnum";
+import {icon} from '@/plugins/icon'
+
+const { LocationIcon } = icon.carbon
+const { CheckCircleOutlinedIcon } = icon.material
+
+const props = defineProps({
+  chartConfig: {
+    type: Object as PropType<CreateComponentType>,
+    required: true
+  }
+})
+Object.assign(props.chartConfig.attr, { w: 1000, h: 250 })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+
+const { w, h } = toRefs(props.chartConfig.attr)
+const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
+
+const getStyle = (radius: number) => {
+  return {
+    borderRadius: `${radius}px`,
+    overflow: 'hidden'
+  }
+}
+
+const select1 = reactive({
+  value: [1, 2],
+  options: [
+    { label: '严重', value: 1, number: 0, color: '#ff0000' },
+    { label: '主要', value: 2, number: 0, color: '#f43b42' },
+    { label: '次要', value: 3, number: 0, color: '#fc8358' },
+    { label: '警告', value: 4, number: 0, color: '#f8ca00' },
+    { label: '事件', value: 5, number: 0, color: '#4fbadb' },
+  ]
+})
+
+const select2 = reactive({
+  value: ['not'],
+  options: [
+    { label: '已确认', value: 'ok', number: 0, color: '#4DCA59' },
+    { label: '未确认', value: 'not', number: 0, color: '#f5b442' },
+  ]
+})
+type tableDataType = {
+  id: number,
+  content: string,
+  generate_time: string,
+  checked: boolean,
+  confirm_status: 'ok' | 'not',
+  level: number,
+  color1: string,
+  color2: string,
+}[]
+let tableData:tableDataType = reactive([])
+let checkAll = ref(false)
+const refBorderBox = ref(null)
+const getData = () => {
+  console.log(refBorderBox.value)
+  const queryModel = {
+    condition: {
+      id: null,
+      levels: select1.value,
+      confirm_statuss: select2.value,
+      space_complete_id: '',
+      append_space_to_content: 'complete',
+      recovery_statuss: ['not'],
+    },
+    page: {
+      page_size: 10,
+      page_number: 1
+    }
+  }
+  publicInterface('/dcim/dems/devie_active_alarm', 'get_page', queryModel).then(res => {
+    if(res && !res.data) {
+      tableData.splice(0)
+      return
+    }
+    if(res && res.data) {
+      const lastTableData = [...tableData]
+      let arr = res.data['item'].map((e:any) => ({
+        id: e.id,
+        content: e.content,
+        generate_time: e.generate_time,
+        level: e.level,
+        checked: false,
+        confirm_status: e.confirm_status,
+        color1: select1.options.find(_ => _.value === e.level)!.color,
+        color2: select2.options.find(_ => _.value === e.confirm_status)!.color,
+      }))
+      if (checkAll.value) {
+        arr = arr.map((e:any) => ({ ...e, checked: e.confirm_status !== 'ok' }))
+      } else if (lastTableData.length) {
+        arr.map(e => {
+          const lastIndex = lastTableData.findIndex(item => item.id === e.id)
+          if (lastIndex !== -1) {
+            e.checked = lastTableData[lastIndex].checked
+          }
+        })
+      }
+      arr = arr.concat(Array(10).fill({}).map(_ => ({
+        id: 1234,
+        content: '1234',
+        generate_time: moment().format('x'),
+        level: 2,
+        checked: false,
+        confirm_status: 'ok',
+        color1: 'green',
+        color2: 'green',
+      })))
+      tableData.splice(0, tableData.length, ...arr)
+      console.log(tableData)
+    }
+  })
+}
+
+let timer:unknown
+watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'), v => {
+  if(!isPreview()) return
+  if(props.chartConfig.request.requestInterval) {
+    if(timer) clearInterval(timer as number)
+    const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+    const unit = obj.unit
+    const number = unit * props.chartConfig.request.requestInterval
+    timer = setInterval(() => {
+      getData()
+    }, number)
+  }
+})
+onMounted(() => {
+  nextTick(() => {
+    getData()
+  })
+  if(!isPreview()) return
+  const obj = selectTimeOptions.find(_ => _.value === props.chartConfig.request.requestIntervalUnit) || {unit: 0}
+  const unit = obj.unit
+  const number = unit * props.chartConfig.request.requestInterval!
+  timer = setInterval(() => {
+    nextTick(() => {
+      getData()
+    })
+  }, number)
+})
+onUnmounted(() => {
+  clearInterval(timer as number)
+})
+
+// const option = shallowReactive({
+//   dataset: ''
+// })
+// // 预览更新
+// useChartDataFetch(props.chartConfig, useChartEditStore, (newData: any) => {
+//   option.dataset = newData
+// })
+</script>
+
+<style lang="scss" scoped>
+.mr5{
+  margin-right: 5px;
+}
+.mr10{
+  margin-right: 10px;
+}
+.itemBox{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+  .item{
+    height: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 10px;
+    margin: 3px 0;
+    background: rgba(65,150,255,.05);
+  }
+}
+</style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue
index d2804ef9..f19e9424 100644
--- a/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue
@@ -38,7 +38,7 @@ const props = defineProps({
   }
 })
 Object.assign(props.chartConfig.attr, { w: 380, h: 250 })
-Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
+if(!props.chartConfig.request.requestInterval) Object.assign(props.chartConfig.request, { requestInterval: 15, requestIntervalUnit: RequestHttpIntervalEnum.SECOND })
 
 const { w, h } = toRefs(props.chartConfig.attr)
 const { dataset, fit, borderRadius } = toRefs(props.chartConfig.option)
diff --git a/src/packages/components/CustomComponents/CustomComponents/components/BorderBox.vue b/src/packages/components/CustomComponents/CustomComponents/components/BorderBox.vue
index ad7458c9..8e9d1e58 100644
--- a/src/packages/components/CustomComponents/CustomComponents/components/BorderBox.vue
+++ b/src/packages/components/CustomComponents/CustomComponents/components/BorderBox.vue
@@ -22,7 +22,7 @@ const { title } = toRefs(props)
   background: rgba(65,150,255,.04);
   .title{
     position: relative;
-    padding-left: 20px;
+    padding: 0 20px;
     height: 38px;
     line-height: 38px;
     font-size: 16px;
diff --git a/src/packages/components/CustomComponents/CustomComponents/components/BorderBoxV2.vue b/src/packages/components/CustomComponents/CustomComponents/components/BorderBoxV2.vue
new file mode 100644
index 00000000..daaf924b
--- /dev/null
+++ b/src/packages/components/CustomComponents/CustomComponents/components/BorderBoxV2.vue
@@ -0,0 +1,88 @@
+<template>
+  <BorderBox>
+    <template #title>
+      <div class="titleBox">
+        <div class="mr10">{{title}}</div>
+        <n-checkbox v-model:checked="checkAll" size="small" class="mr10">全选</n-checkbox>
+        <n-button strong size="tiny" color="rgba(36,197,231,.5)" text-color="#fff" class="button">
+          <template #icon><AssignmentTurnedInRoundIcon/></template>
+          批量确认
+        </n-button>
+        <div style="flex: 1"></div>
+        <n-checkbox-group v-model:value="select1.value" class="mr10" size="small">
+          <n-space item-style="display: flex;" size="small">
+            <n-checkbox :value="item.value" :label="item.label" v-for="(item, i) in select1.options" :key="i">
+              <div :style="{color: item.color}" style="display: inline-block">{{item.label}}</div>
+              <div style="display: inline-block">({{item.number}})</div>
+            </n-checkbox>
+          </n-space>
+        </n-checkbox-group>
+        <n-checkbox-group v-model:value="select2.value" class="mr10" size="small">
+          <n-space item-style="display: flex;">
+            <n-checkbox :value="item.value" :label="item.label" v-for="(item, i) in select2.options" :key="i">
+              <div :style="{color: item.color}" style="display: inline-block">{{item.label}}</div>
+              <div style="display: inline-block">({{item.number}})</div>
+            </n-checkbox>
+          </n-space>
+        </n-checkbox-group>
+        <div class="more">更多>></div>
+      </div>
+    </template>
+    <template #default>
+      <slot></slot>
+    </template>
+  </BorderBox>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive, toRefs } from 'vue'
+import BorderBox from './BorderBox.vue'
+import { icon } from '@/plugins/icon'
+
+const { AssignmentTurnedInRoundIcon } = icon.material
+
+
+const props = defineProps(['title', 'select1', 'select2'])
+
+const { select1, select2 } = toRefs(props)
+
+const checkAll = ref(false)
+
+// const select1 = reactive({
+//   value: [1, 2],
+//   options: [
+//     { label: '严重', value: 1, number: 0, color: '#ff0000' },
+//     { label: '主要', value: 2, number: 0, color: '#f43b42' },
+//     { label: '次要', value: 3, number: 0, color: '#fc8358' },
+//     { label: '警告', value: 4, number: 0, color: '#f8ca00' },
+//     { label: '事件', value: 5, number: 0, color: '#4fbadb' },
+//   ]
+// })
+//
+// const select2 = reactive({
+//   value: [],
+//   options: [
+//     { label: '已确认', value: 'ok', number: 0, color: '#4DCA59' },
+//     { label: '未确认', value: 'not', number: 0, color: '#f5b442' },
+//   ]
+// })
+
+</script>
+
+<style lang="scss" scoped>
+.mr10{
+  margin-right: 10px;
+}
+.button{
+  border: 1px solid #4196ff;
+  //border-color: #4196ff;
+}
+.titleBox{
+  display: flex;
+  align-items: center;
+  .more{
+    color: #409eff;
+    cursor: pointer;
+  }
+}
+</style>
diff --git a/src/packages/components/CustomComponents/CustomComponents/index.ts b/src/packages/components/CustomComponents/CustomComponents/index.ts
index 5c119d46..c977ca8e 100644
--- a/src/packages/components/CustomComponents/CustomComponents/index.ts
+++ b/src/packages/components/CustomComponents/CustomComponents/index.ts
@@ -3,5 +3,15 @@ import { ComprehensivePUEConfig } from './ComprehensivePUE'
 import { DeviceAlarmOverviewConfig } from './DeviceAlarmOverview'
 import { RealTimeTrafficConfig } from './RealTimeTraffic'
 import { RealTimeAlarmStatisticsConfig } from './RealTimeAlarmStatistics'
+import { OverviewOfComputingNodesConfig } from './OverviewOfComputingNodes'
+import { RealTimeEventConfig } from './RealTimeEvent'
 
-export default [ Theme1Config, ComprehensivePUEConfig, DeviceAlarmOverviewConfig, RealTimeTrafficConfig, RealTimeAlarmStatisticsConfig ]
+export default [
+    Theme1Config,
+    ComprehensivePUEConfig,
+    DeviceAlarmOverviewConfig,
+    RealTimeTrafficConfig,
+    RealTimeAlarmStatisticsConfig,
+    OverviewOfComputingNodesConfig,
+    RealTimeEventConfig
+]
diff --git a/src/plugins/icon.ts b/src/plugins/icon.ts
index b98cab0f..acc6e589 100644
--- a/src/plugins/icon.ts
+++ b/src/plugins/icon.ts
@@ -105,12 +105,18 @@ import {
   FilterEdit as FilterEditIcon,
   Laptop as LaptopIcon,
   AreaCustom as AreaCustomIcon,
+  Location as LocationIcon
 } from '@vicons/carbon'
 
 import {
   Apps20Regular as Apps20RegularIcon
 } from '@vicons/fluent'
 
+import {
+  AssignmentTurnedInRound as AssignmentTurnedInRoundIcon,
+  CheckCircleOutlined as CheckCircleOutlinedIcon
+} from '@vicons/material'
+
 const ionicons5 = {
   // 新增
   AddIcon,
@@ -311,6 +317,8 @@ const carbon = {
   LaptopIcon,
   // 自定义
   AreaCustomIcon,
+  // 地点
+  LocationIcon,
 }
 
 const fluent = {
@@ -318,10 +326,18 @@ const fluent = {
   Apps20RegularIcon
 }
 
+const material = {
+  // 批量确认
+  AssignmentTurnedInRoundIcon,
+  // 圆圈 勾
+  CheckCircleOutlinedIcon
+}
+
 // https://www.xicons.org/#/ 还有很多
 
 export const icon = {
   ionicons5,
   carbon,
-  fluent
+  fluent,
+  material
 }
diff --git a/src/store/modules/originStore/originStore.ts b/src/store/modules/originStore/originStore.ts
new file mode 100644
index 00000000..5bec992e
--- /dev/null
+++ b/src/store/modules/originStore/originStore.ts
@@ -0,0 +1,24 @@
+import { defineStore } from 'pinia'
+import { cloneDeep } from 'lodash'
+
+export const useOriginStore = defineStore({
+    id: 'useOriginStore',
+    state: () => ({
+        originStore: {}
+    }),
+    getters: {
+        getOriginStore():{[k:string]: any} {
+            return this.originStore
+        }
+    },
+    actions: {
+        setOriginStore(originStore: {[k:string]: any}, merge: boolean = true) {
+            if(merge) {
+                this.originStore = cloneDeep(originStore)
+            }
+            else {
+                Object.assign(this.originStore, originStore)
+            }
+        }
+    }
+})
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index a91cfe59..34fd48e3 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -356,25 +356,25 @@ export const addWindowUnload = () => {
 /**
  * 向父页面发送消息
  */
-export const postMessageToParent = (obj = {}) => {
-  const routerStore:any = useRouterStore()
-  if (routerStore && routerStore.getCallByParent) {
-    // 获取父页面的 window 对象
-    var parentWindow = window.parent;
-    const message = {
-      // 属于哪个页面
-      page: 'customLargeScreen',
-      // 属于什么类型
-      // type: 'goHome',
-      ...obj
-    }
-    parentWindow.postMessage(JSON.stringify(message), '*');
-    return
-  }
-}
+// export const postMessageToParent = (obj = {}) => {
+//   const routerStore:any = useRouterStore()
+//   if (routerStore && routerStore.getCallByParent) {
+//     // 获取父页面的 window 对象
+//     var parentWindow = window.parent;
+//     const message = {
+//       // 属于哪个页面
+//       page: 'customLargeScreen',
+//       // 属于什么类型
+//       // type: 'goHome',
+//       ...obj
+//     }
+//     parentWindow.postMessage(JSON.stringify(message), '*');
+//     return
+//   }
+// }
 
 /**
- * 从父页面接收消息
+ * 从父页面发送并接收消息
  */
 export const useGetMessageByParent = () => {
   const getMessageByParent = (type = '', cb = (e:any) => {}) => {