手持表围栏类型

web/src/views/HandDevice/Home/components/types/map.types.ts

@@ -47,9 +47,9 @@ export interface MarkerData extends HandDetector {
   name: string
   /** 自定义数据 */
   data?: any,
-  value: number,
-  unit: string,
-  time: string
+  value?: number,
+  unit?: string,
+  time?: number
 }
 
 // 地图组件 Props 接口

web/src/views/gas/handdetector/HandDetectorForm.vue

@@ -13,19 +13,9 @@
       <el-form-item label="持有人" prop="name">
         <el-input v-model="formData.name" placeholder="请输入持有人" />
       </el-form-item>
-      <el-form-item label="应用围栏" prop="fenceIdsArray">
-        <el-select v-model="formData.fenceIdsArray" placeholder="请选择应用围栏" multiple>
-          <el-option
-            v-for="fence in fences"
-            :key="fence.id"
-            :label="fence.name"
-            :value="fence.id"
-          />
-        </el-select>
-      </el-form-item>
       <!-- 围栏类型 -->
       <el-form-item label="围栏类型" prop="fenceType">
-        <el-radio-group v-model="formData.fenceType">
+        <el-radio-group v-model="formData.fenceType" @change="fenceTypeChange">
           <el-radio-button
             v-for="dict in getIntDictOptions(DICT_TYPE.HAND_DETECTOR_FENCE_TYPE)"
             :key="dict.value"
@@ -36,6 +26,17 @@
         </el-radio-group>
       </el-form-item>
 
+      <el-form-item label="应用围栏" prop="fenceIdsArray">
+        <el-select v-model="formData.fenceIdsArray" placeholder="请选择应用围栏" multiple>
+          <el-option
+            v-for="fence in selectFences"
+            :key="fence.id"
+            :label="fence.name"
+            :value="fence.id"
+          />
+        </el-select>
+      </el-form-item>
+
       <el-form-item label="气体类型" prop="gasTypeId">
         <el-select
           v-model="formData.gasTypeId"
@@ -156,6 +157,14 @@ const formRules = reactive({
 })
 const formRef = ref() // 表单 Ref
 
+var selectFences=computed(()=>{
+  return props.fences.filter((item) => item.type === formData.value.fenceType)
+})
+/** 围栏类型改变时，应用围栏列表也会改变 */
+const fenceTypeChange = () => {
+  formData.value.fenceIdsArray = []
+}
+
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true

web/src/views/gas/handdetector/index.vue

@@ -86,7 +86,7 @@
       <!-- 围栏类型 -->
       <el-table-column label="围栏类型" align="center" prop="fenceType">
         <template #default="scope">
-          <DictTag :type="DICT_TYPE.HAND_DETECTOR_FENCE_TYPE" :value="scope.row.fenceType" />
+          <DictTag :type="DICT_TYPE.HAND_DETECTOR_FENCE_TYPE" :value="scope.row.fenceType" v-if="scope.row.fenceType" />
         </template>
       </el-table-column>
       <el-table-column label="气体类型" align="center" prop="gasTypeId">