Просмотр исходного кода

perf: 【IoT 物联网】场景联动优化 ConditionTypeSelector 的内容直接内联在主组件中

puhui999 7 месяцев назад
Родитель
Сommit
18b4775e98

+ 27 - 3
src/views/iot/rule/scene/form/configs/ConditionConfig.vue

@@ -5,11 +5,20 @@
     <el-row :gutter="16">
       <el-col :span="8">
         <el-form-item label="条件类型" required>
-          <ConditionTypeSelector
+          <el-select
             :model-value="condition.type"
             @update:model-value="(value) => updateConditionField('type', value)"
             @change="handleConditionTypeChange"
-          />
+            placeholder="请选择条件类型"
+            class="w-full"
+          >
+            <el-option
+              v-for="option in conditionTypeOptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            />
+          </el-select>
         </el-form-item>
       </el-col>
     </el-row>
@@ -114,7 +123,6 @@
 
 <script setup lang="ts">
 import { useVModel } from '@vueuse/core'
-import ConditionTypeSelector from '../selectors/ConditionTypeSelector.vue'
 import DeviceStatusConditionConfig from './DeviceStatusConditionConfig.vue'
 import CurrentTimeConditionConfig from './CurrentTimeConditionConfig.vue'
 import ProductSelector from '../selectors/ProductSelector.vue'
@@ -146,6 +154,22 @@ const condition = useVModel(props, 'modelValue', emit)
 // 常量定义
 const ConditionTypeEnum = IotRuleSceneTriggerConditionTypeEnum
 
+// 条件类型选项
+const conditionTypeOptions = [
+  {
+    value: IotRuleSceneTriggerConditionTypeEnum.DEVICE_STATUS,
+    label: '设备状态'
+  },
+  {
+    value: IotRuleSceneTriggerConditionTypeEnum.DEVICE_PROPERTY,
+    label: '设备属性'
+  },
+  {
+    value: IotRuleSceneTriggerConditionTypeEnum.CURRENT_TIME,
+    label: '当前时间'
+  }
+]
+
 // 状态
 const propertyType = ref<string>('string')
 const propertyConfig = ref<any>(null)

+ 0 - 77
src/views/iot/rule/scene/form/selectors/ConditionTypeSelector.vue

@@ -1,77 +0,0 @@
-<!-- 条件类型选择器组件 -->
-<template>
-  <el-select
-    :model-value="modelValue"
-    @update:model-value="handleChange"
-    placeholder="请选择条件类型"
-    class="w-full"
-  >
-    <el-option
-      v-for="option in conditionTypeOptions"
-      :key="option.value"
-      :label="option.label"
-      :value="option.value"
-    >
-      <div class="flex items-center justify-between w-full">
-        <div class="flex items-center gap-8px">
-          <Icon :icon="option.icon" :class="option.iconClass" />
-          <span>{{ option.label }}</span>
-        </div>
-        <el-tag :type="option.tag" size="small">{{ option.category }}</el-tag>
-      </div>
-    </el-option>
-  </el-select>
-</template>
-
-<script setup lang="ts">
-import { IotRuleSceneTriggerConditionTypeEnum } from '@/views/iot/utils/constants'
-
-/** 条件类型选择器组件 */
-defineOptions({ name: 'ConditionTypeSelector' })
-
-defineProps<{
-  modelValue?: number
-}>()
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', value: number): void
-  (e: 'change', value: number): void
-}>()
-
-// 条件类型选项
-const conditionTypeOptions = [
-  {
-    value: IotRuleSceneTriggerConditionTypeEnum.DEVICE_STATUS,
-    label: '设备状态',
-    description: '监控设备的在线/离线状态变化',
-    icon: 'ep:connection',
-    iconClass: 'text-blue-500',
-    tag: 'primary',
-    category: '设备'
-  },
-  {
-    value: IotRuleSceneTriggerConditionTypeEnum.DEVICE_PROPERTY,
-    label: '设备属性',
-    description: '监控设备属性值的变化',
-    icon: 'ep:data-analysis',
-    iconClass: 'text-green-500',
-    tag: 'success',
-    category: '属性'
-  },
-  {
-    value: IotRuleSceneTriggerConditionTypeEnum.CURRENT_TIME,
-    label: '当前时间',
-    description: '基于当前时间的条件判断',
-    icon: 'ep:timer',
-    iconClass: 'text-orange-500',
-    tag: 'warning',
-    category: '时间'
-  }
-]
-
-// 事件处理
-const handleChange = (value: number) => {
-  emit('update:modelValue', value)
-  emit('change', value)
-}
-</script>