diff --git a/web/.env.dev b/web/.env.dev
index fc948b4..265c534 100644
--- a/web/.env.dev
+++ b/web/.env.dev
@@ -1,4 +1,4 @@
-NODE_ENV=production
+NODE_ENV=development
 
 VITE_DEV=true
 
diff --git a/web/src/views/gas/alarmrule/AlarmRuleForm.vue b/web/src/views/gas/alarmrule/AlarmRuleForm.vue
index 61e1cad..62ab4b8 100644
--- a/web/src/views/gas/alarmrule/AlarmRuleForm.vue
+++ b/web/src/views/gas/alarmrule/AlarmRuleForm.vue
@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle" :scroll="true" v-model="dialogVisible">
     <el-form
       ref="formRef"
       :model="formData"
@@ -37,10 +37,10 @@
       <el-form-item label="警报名称颜色" prop="alarmNameColor">
         <el-color-picker v-model="formData.alarmNameColor" :disabled="true" />
       </el-form-item>
-      <el-form-item label="警报颜色" prop="alarmColor">
+      <el-form-item label="警报背景颜色" prop="alarmColor">
         <el-color-picker
           v-model="formData.alarmColor"
-          placeholder="请输入警报颜色"
+          placeholder="警报颜色"
           :disabled="true"
         />
       </el-form-item>
@@ -163,13 +163,19 @@ const submitForm = async () => {
   try {
     const data = formData.value as unknown as AlarmRule
     if (formType.value === 'create') {
-      await AlarmRuleApi.createAlarmRule(data)
-      message.success(t('common.createSuccess'))
+      const res=await AlarmRuleApi.createAlarmRule(data)
+      if(res.code===0){
+        message.success(t('common.createSuccess'))
+            dialogVisible.value = false
+      }
     } else {
-      await AlarmRuleApi.updateAlarmRule(data)
-      message.success(t('common.updateSuccess'))
+      const res=await AlarmRuleApi.updateAlarmRule(data)
+      if(res.code===0){
+        message.success(t('common.updateSuccess'))
+            dialogVisible.value = false
+      }
     }
-    dialogVisible.value = false
+
     // 发送操作成功的事件
     emit('success')
   } finally {
@@ -200,5 +206,7 @@ const resetForm = () => {
 const handleAlarmTypeIdChange = (value: number) => {
   formData.value.alarmName = props.alarmTypes.find((item) => item.id === value)?.name
   formData.value.alarmNameColor = props.alarmTypes.find((item) => item.id === value)?.nameColor
+  formData.value.alarmColor = props.alarmTypes.find((item) => item.id === value)?.color
+  formData.value.alarmLevel = props.alarmTypes.find((item) => item.id === value)?.level
 }
 </script>
diff --git a/web/src/views/gas/alarmrule/index.vue b/web/src/views/gas/alarmrule/index.vue
index c27666e..d7e7da8 100644
--- a/web/src/views/gas/alarmrule/index.vue
+++ b/web/src/views/gas/alarmrule/index.vue
@@ -261,8 +261,12 @@ const handleExport = async () => {
   }
 }
 
+ 
+ 
 /** 初始化 **/
 onMounted(() => {
   getList()
+  handDetectorStore.getAllGasTypes()
+  handDetectorStore.getAllAlarmTypes()
 })
 </script>
diff --git a/web/src/views/gas/alarmtype/AlarmTypeForm.vue b/web/src/views/gas/alarmtype/AlarmTypeForm.vue
index 17cbed9..a84fffd 100644
--- a/web/src/views/gas/alarmtype/AlarmTypeForm.vue
+++ b/web/src/views/gas/alarmtype/AlarmTypeForm.vue
@@ -13,7 +13,7 @@
       <el-form-item label="名称颜色" prop="nameColor">
         <el-color-picker v-model="formData.nameColor" />
       </el-form-item>
-      <el-form-item label="颜色" prop="color">
+      <el-form-item label="背景颜色" prop="color">
         <el-color-picker v-model="formData.color" />
       </el-form-item>
       <el-form-item label="警报方式/级别" prop="level">
diff --git a/web/src/views/gas/alarmtype/index.vue b/web/src/views/gas/alarmtype/index.vue
index 99b6298..4953ee8 100644
--- a/web/src/views/gas/alarmtype/index.vue
+++ b/web/src/views/gas/alarmtype/index.vue
@@ -71,19 +71,21 @@
     >
       <el-table-column type="selection" width="55" />
       <el-table-column label="名称" align="center" prop="name" />
-      <el-table-column label="图例" align="center"
-        ><template #default="scope">
-          <div class="flex items-center">
+      <el-table-column label="图例" align="center">
+        <template #default="scope">
             <div
-              class="w-4px h-4px rounded-full"
+              class="inline-block px-[12px]"
               :style="{ backgroundColor: scope.row.color, color: scope.row.nameColor || '#000' }"
             >
               {{ getDictLabel(DICT_TYPE.HAND_DETECTOR_ALARM_LEVEL, scope.row.level as number) }}
             </div>
-          </div>
         </template></el-table-column
       >
-      <el-table-column label="警报方式/级别" align="center" prop="level" />
+      <el-table-column label="警报方式/级别" align="center" prop="level" >
+        <template #default="scope">
+          {{ getDictLabel(DICT_TYPE.HAND_DETECTOR_ALARM_LEVEL, scope.row.level as number) }}
+        </template>
+      </el-table-column>
       <el-table-column label="排序" align="center" prop="sortOrder" />
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column
diff --git a/web/src/views/gas/handdetector/index.vue b/web/src/views/gas/handdetector/index.vue
index 8dcaa81..970ca93 100644
--- a/web/src/views/gas/handdetector/index.vue
+++ b/web/src/views/gas/handdetector/index.vue
@@ -141,7 +141,7 @@ import { HandDetectorApi, HandDetector } from '@/api/gas/handdetector'
 import HandDetectorForm from './HandDetectorForm.vue'
 import { DICT_TYPE } from '@/utils/dict'
 import { Fence } from '@/api/gas/fence'
-import { Type } from '@/api/gas/gastype'
+import type { Type } from '@/api/gas/gastype'
 import { useHandDetectorStore } from '@/store/modules/handDetector'
 /** GAS手持探测器 列表 */
 defineOptions({ name: 'HandDetector' })