diff --git a/package.json b/package.json
index e536d3c..b00dd3d 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
     "@wangeditor/editor-for-vue": "^5.1.10",
     "animate.css": "^4.1.1",
     "axios": "^1.3.4",
+    "can-autoplay": "^3.0.2",
     "crypto-js": "^4.2.0",
     "echarts": "^5.2.2",
     "element-plus": "^2.2.32",
diff --git a/src/api/waring/index.ts b/src/api/waring/index.ts
index f5a99d2..4297055 100644
--- a/src/api/waring/index.ts
+++ b/src/api/waring/index.ts
@@ -37,3 +37,16 @@ export function process(id: string) {
     method: 'post'
   });
 }
+
+/**
+ * 关闭报警
+ *
+ * @param data
+ */
+export function setAlarm(data: any) {
+  return request({
+    url: '/dc/dcBusiAlertJob/alertSwith',
+    method: 'post',
+    data: data
+  });
+}
diff --git a/src/api/waring/types.ts b/src/api/waring/types.ts
index b5be01c..601bd8d 100644
--- a/src/api/waring/types.ts
+++ b/src/api/waring/types.ts
@@ -6,7 +6,8 @@ export interface waringVo {
   alertLastTime: string;
   alertLevel: number;
   alertName: string;
-  alertTime:string
+  alertSwitch: string;
+  alertTime: string;
   alertReadTime: string;
   deviceName: string;
   deviceUuid: string;
diff --git a/src/assets/icons/alarm.svg b/src/assets/icons/alarm.svg
new file mode 100644
index 0000000..7bec76b
--- /dev/null
+++ b/src/assets/icons/alarm.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1703641634745" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2841" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M804.93945313 922.18554688c-7.64648438-7.64648438-17.49023438-13.09570313-28.47656251-15.29296876-6.59179688-1.31835938-11.33789063-6.94335938-11.33789062-13.62304687V570.18359375c0-139.74609375-114.34570313-255.5859375-254.09179688-255.05859375-139.30664063 0.52734375-252.15820313 113.64257813-252.15820312 253.125v325.01953125c0 6.6796875-4.74609375 12.3046875-11.33789063 13.62304688-25.6640625 5.2734375-44.91210938 27.94921875-44.91210937 55.10742187h618.75c0-15.55664063-6.328125-29.61914063-16.43554688-39.81445313zM560.60351563 469.8125l-17.05078125 152.31445313H610.4375L463.484375 835.4375l17.05078125-152.31445313H413.5625L560.60351563 469.8125zM512 244.8125c-15.55664063 0-28.125-12.56835938-28.125-28.125V90.125c0-15.55664063 12.56835938-28.125 28.125-28.125s28.125 12.56835938 28.125 28.125v126.5625c0 15.55664063-12.56835938 28.125-28.125 28.125zM308.09375 322.24414062c-13.44726563 7.734375-30.67382813 3.1640625-38.40820313-10.28320312l-63.28125-109.59960938c-7.734375-13.44726563-3.1640625-30.67382813 10.28320313-38.40820312 13.44726563-7.734375 30.67382813-3.1640625 38.40820313 10.28320313l63.28125 109.59960937c7.734375 13.44726563 3.1640625 30.5859375-10.28320313 38.40820313zM715.90625 322.24414062c13.44726563 7.734375 30.67382813 3.1640625 38.40820313-10.28320312l63.28125-109.59960938c7.734375-13.44726563 3.1640625-30.67382813-10.28320313-38.40820312-13.44726563-7.734375-30.67382813-3.1640625-38.40820313 10.28320313l-63.28125 109.59960937c-7.734375 13.44726563-3.1640625 30.5859375 10.28320313 38.40820313zM239.97851562 453.02539062c-4.04296875 15.02929688-19.42382813 23.90625-34.45312499 19.86328125L83.26953125 440.19335937C68.24023437 436.15039062 59.36328125 420.76953125 63.31835937 405.74023437c4.04296875-15.02929688 19.42382813-23.90625 34.45312501-19.86328124l122.25585937 32.78320312c15.02929688 3.95507813 23.90625 19.3359375 19.95117188 34.36523438zM784.02148438 453.02539062c4.04296875 15.02929688 19.42382813 23.90625 34.45312499 19.86328125l122.25585938-32.78320312c15.02929688-4.04296875 23.90625-19.42382813 19.86328125-34.453125-4.04296875-15.02929688-19.42382813-23.90625-34.453125-19.86328125l-122.25585938 32.78320313c-14.94140625 4.04296875-23.81835938 19.42382813-19.86328124 34.453125z" fill="#d81e06" p-id="2842"></path></svg>
\ No newline at end of file
diff --git a/src/assets/media/alarm.mp3 b/src/assets/media/alarm.mp3
new file mode 100644
index 0000000..ef00043
Binary files /dev/null and b/src/assets/media/alarm.mp3 differ
diff --git a/src/assets/media/alarm1.mp3 b/src/assets/media/alarm1.mp3
new file mode 100644
index 0000000..cbc41a1
Binary files /dev/null and b/src/assets/media/alarm1.mp3 differ
diff --git a/src/assets/media/alarm2.mp3 b/src/assets/media/alarm2.mp3
new file mode 100644
index 0000000..c81fcc6
Binary files /dev/null and b/src/assets/media/alarm2.mp3 differ
diff --git a/src/components/Widgets/button.vue b/src/components/Widgets/button.vue
new file mode 100644
index 0000000..7b269e0
--- /dev/null
+++ b/src/components/Widgets/button.vue
@@ -0,0 +1,40 @@
+<template>
+  <button class="btn-donate">确认</button>
+</template>
+<style scoped>
+.btn-donate {
+  --clr-font-main: hsla(0 0% 20% / 100);
+  --btn-bg-1: hsla(194 100% 69% / 1);
+  --btn-bg-2: hsla(217 100% 56% / 1);
+  --btn-bg-color: hsla(360 100% 100% / 1);
+  --radii: 0.5em;
+  cursor: pointer;
+  padding: 8px 15px;
+  font-size: var(--size, 1rem);
+  font-family: 'Segoe UI', system-ui, sans-serif;
+  font-weight: 500;
+  transition: 0.8s;
+  background-size: 280% auto;
+  background-image: linear-gradient(325deg, var(--btn-bg-2) 0%, var(--btn-bg-1) 55%, var(--btn-bg-2) 90%);
+  border: none;
+  border-radius: var(--radii);
+  color: var(--btn-bg-color);
+  box-shadow: 0px 0px 20px rgba(71, 184, 255, 0.5), 0px 5px 5px -1px rgba(58, 125, 233, 0.25),
+    inset 4px 4px 8px rgba(175, 230, 255, 0.5), inset -4px -4px 8px rgba(19, 95, 216, 0.35);
+}
+
+.btn-donate:hover {
+  background-position: right top;
+}
+
+.btn-donate:is(:focus, :focus-visible, :active) {
+  outline: none;
+  box-shadow: 0 0 0 3px var(--btn-bg-color), 0 0 0 6px var(--btn-bg-2);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .btn-donate {
+    transition: linear;
+  }
+}
+</style>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 4f73d5f..0831d47 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -64,6 +64,15 @@
           justify-content: space-between;
           align-items: center;
           margin-bottom: 10px;
+          .title {
+            display: flex;
+            align-items: center;
+            .svg-icon {
+              width: 16px !important;
+              height: 16px !important;
+              margin-right: 5px;
+            }
+          }
 
           span {
             font-size: 16px;
@@ -139,6 +148,7 @@
             .confirm {
               background-color: #022a5a !important;
               border: 1px solid #114073;
+              margin-left: 10px;
             }
           }
         }
diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts
index 5742656..67e581d 100644
--- a/src/types/auto-imports.d.ts
+++ b/src/types/auto-imports.d.ts
@@ -2,7 +2,6 @@
 export {}
 declare global {
   const EffectScope: typeof import('vue')['EffectScope']
-  const ElForm: typeof import('element-plus/es')['ElForm']
   const ElMessage: typeof import('element-plus/es')['ElMessage']
   const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
   const ElNotification: typeof import('element-plus/es')['ElNotification']
@@ -273,7 +272,6 @@ import { UnwrapRef } from 'vue'
 declare module 'vue' {
   interface ComponentCustomProperties {
     readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
-    readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
     readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
     readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
     readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
diff --git a/src/types/components.d.ts b/src/types/components.d.ts
index 0dcb051..a2672c5 100644
--- a/src/types/components.d.ts
+++ b/src/types/components.d.ts
@@ -8,6 +8,7 @@ export {}
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
+    Button: typeof import('./../components/Widgets/button.vue')['default']
     ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
     ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
     ElButton: typeof import('element-plus/es')['ElButton']
diff --git a/src/views/monitoring/components/header.vue b/src/views/monitoring/components/header.vue
index 4303d75..7478a6e 100644
--- a/src/views/monitoring/components/header.vue
+++ b/src/views/monitoring/components/header.vue
@@ -77,7 +77,10 @@
       <div class="waringList">
         <div class="item" v-for="(item, index) in waringData" :key="index">
           <div class="name">
-            <span>{{ item.deviceName }}</span>
+            <div class="title">
+              <svg-icon icon-class="alarm" v-if="audioType === true && item.alertSwitch === '1'" />
+              <span>{{ item.deviceName }}</span>
+            </div>
             <span class="time">{{ item.alertTime }}</span>
           </div>
           <div class="info">
@@ -114,6 +117,13 @@
         </el-table-column>
         <el-table-column fixed="right" label="操作" align="center">
           <template #default="scope">
+            <el-switch
+              v-model="scope.row.alertSwitchBoolean"
+              inline-prompt
+              active-text="开"
+              inactive-text="关"
+              @change="alarrmChange($event, scope.row)"
+            />
             <el-button class="confirm" type="info" size="small" @click="waringConfirm(scope.row)">确认</el-button>
           </template>
         </el-table-column>
@@ -132,19 +142,24 @@
       </div>
     </n-card>
   </n-modal>
+  <div class="alarm">
+    <audio loop autoplay muted ref="alarmRef" ebkit-playsinline="true" playsinline="true" :src="audioUrl"></audio>
+  </div>
 </template>
-<script lang="ts" setup>
+<script setup>
 import { useRoute, useRouter } from 'vue-router';
 import { useUserStore } from '@/store/modules/user';
 import { getWeather } from '@/api/user/index';
-import { getWarList, process } from '@/api/waring/index';
-import { waringVo } from '@/api/waring/types';
+import { getWarList, process, setAlarm } from '@/api/waring/index';
+// import { waringVo } from '@/api/waring/types';
 import { Filter, Maximize, Settings, Power, Bell, ChartLine } from '@vicons/tabler';
 import { CloseCircleOutline, ReturnDownBack } from '@vicons/ionicons5';
 import { useDateFormat, useNow } from '@vueuse/core';
-import { uniqueArrayObject } from '@/utils/index';
+// import { uniqueArrayObject } from '@/utils/index';
+import canAutoPlay from 'can-autoplay';
 import mitt from '@/plugins/bus';
 import calendar from '@/utils/lunar';
+import audioUrl from '@/assets/media/alarm.mp3';
 
 const userStore = useUserStore();
 const hoursNow = useNow().value.getHours();
@@ -157,8 +172,10 @@ const timer = ref();
 const isCurrentRoute = ref(true);
 const waringDrawer = ref(false);
 const waringModal = ref(false);
-const waringData = ref<waringVo[]>([]);
-const waringList = ref<waringVo[]>([]);
+// const waringData = ref<waringVo[]>([]);
+// const waringList = ref<waringVo[]>([]);
+const waringData = ref([]);
+const waringList = ref([]);
 const routerType = ref('');
 const deptId = ref(0);
 const params = reactive({
@@ -167,9 +184,12 @@ const params = reactive({
   pageNum: 1
 });
 
+const alarmRef = ref();
+const audioType = ref(false);
+
 const weatherData = ref({ city: '', weather: '', temperature: '', weatherImg: '' });
 
-const lunarDay: any = calendar.solarToLunar(
+const lunarDay = calendar.solarToLunar(
   useNow().value.getUTCFullYear(),
   useNow().value.getUTCMonth() + 1,
   useNow().value.getUTCDate()
@@ -211,10 +231,41 @@ const timePeriod = computed(() => {
   }
 });
 
-mitt.on('waringMessage', (res: any) => {
+mitt.on('waringMessage', res => {
   //监听报警信息
   console.log('waringMessage--', res.data);
   waringData.value = res.data;
+  res.data.map(item => {
+    // console.log(item.deviceName, item.alertSwitch);
+    if (item.alertSwitch === '1') {
+      canAutoPlay.audio().then(({ result }) => {
+        if (result === true) {
+          audioType.value = true;
+          alarmRef.value.play();
+          alarmRef.value.muted = false;
+        } else {
+          ElMessageBox.alert('检测到您的浏览器不支持媒体自动播放，是否同意播放测试音?', '提示', {
+            // if you want to disable its autofocus
+            // autofocus: false,
+            showclose: false,
+            confirmButtonText: '同意',
+            callback: action => {
+              audioType.value = true;
+              alarmRef.value.play();
+              alarmRef.value.muted = false;
+            }
+          });
+          // this.$alert('检测到您的浏览器不支持媒体自动播放，是否同意播放测试音', '提示', {
+          //   confirmButtonText: '确定',
+          //   callback: action => {
+          //     alarmRef.value.play();
+          //   }
+          // });
+        }
+      });
+      return;
+    }
+  });
   // waringData.value.push(res.data)
   // console.log("waringData--", waringData.value);
   // waringData.value = uniqueArrayObject(waringData.value, "id")
@@ -257,7 +308,7 @@ function lineClick() {
   });
 }
 
-function handleCurrentChange(val: any) {
+function handleCurrentChange(val) {
   //点击分页
   params.pageNum = val;
   getwaringList();
@@ -265,7 +316,7 @@ function handleCurrentChange(val: any) {
 
 function getWeatherData() {
   //获取天气
-  getWeather().then((res: any) => {
+  getWeather().then(res => {
     if (res.code === 200) {
       if (isCurrentRoute.value) {
         timer.value = setTimeout(async () => {
@@ -294,7 +345,7 @@ function getwaringList() {
     orgCode: sessionStorage.getItem('deptId') === null ? 0 : Number(sessionStorage.getItem('deptId')),
     params
   };
-  getWarList(paramsr).then((res: any) => {
+  getWarList(paramsr).then(res => {
     if (res.code === 200) {
       waringList.value = res.rows;
       params.total = res.total;
@@ -303,7 +354,23 @@ function getwaringList() {
     }
   });
 }
-function waringConfirm(item: any) {
+function alarrmChange(val, row) {
+  //关闭报警
+  const paramsr = {
+    id: row.id,
+    flag: val === true ? '1' : '0'
+  };
+  setAlarm(paramsr).then(res => {
+    if (res.code === 200) {
+      if (val === false) {
+        audioType.value = false;
+        alarmRef.value.pause();
+        alarmRef.value.muted = true;
+      }
+    }
+  });
+}
+function waringConfirm(item) {
   //报警确认
   ElMessageBox.confirm('是否确认操作?', '提示', {
     confirmButtonText: '确认',
@@ -312,7 +379,7 @@ function waringConfirm(item: any) {
   })
     .then(() => {
       const params = item.id;
-      process(params).then((res: any) => {
+      process(params).then(res => {
         if (res.code === 200) {
           waringList.value = res.data;
           // waringDrawer.value = false
diff --git a/src/views/monitoring/screen/components/main.vue b/src/views/monitoring/screen/components/main.vue
index e674241..40253a5 100644
--- a/src/views/monitoring/screen/components/main.vue
+++ b/src/views/monitoring/screen/components/main.vue
@@ -211,7 +211,7 @@ const userInfo = JSON.parse(userStorageInfo === null ? '' : userStorageInfo);
 //const baseApi = import.meta.env.VITE_APP_BASE_API
 //const apiUrl = baseApi.replace(/https?:/, '');
 const wsUrl = `ws://${window.location.host}/ws/websocket/${userInfo.userName}`; //websocket地址
-// const wsUrl = `ws://10.10.10.55:8021/ws/websocket/${userInfo.userName}`; //websocket地址
+// const wsUrl = `ws://172.1.2.39:9010/websocket/${userInfo.userName}`; //websocket地址
 
 const emit = defineEmits(['tableHeaderData']);
 // const listData = ref([
diff --git a/vite.config.ts b/vite.config.ts
index c625c75..3889fbe 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -45,7 +45,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
       hmr: true, //配置HMR
       proxy: {
         '/dev-api': {
-          // target: 'http://172.1.2.146:9010/', //本地接口地址
+          // target: 'http://172.1.2.39:9010/', //本地接口地址
           // target: 'http://172.1.2.90:9010/', //本地接口地址
           target: 'http://10.10.10.56:9010/', //线上测试接口地址
           changeOrigin: true,