perf:【IoT 物联网】场景联动触发器优化

This commit is contained in:
puhui999
2025-08-01 17:18:23 +08:00
parent 081603788a
commit a5d458b96d
16 changed files with 122 additions and 435 deletions

View File

@ -29,17 +29,14 @@ import { IotRuleSceneTriggerConditionTypeEnum } from '@/api/iot/rule/scene/scene
/** 条件类型选择器组件 */
defineOptions({ name: 'ConditionTypeSelector' })
interface Props {
defineProps<{
modelValue?: number
}
}>()
interface Emits {
const emit = defineEmits<{
(e: 'update:modelValue', value: number): void
(e: 'change', value: number): void
}
const props = defineProps<Props>()
const emit = defineEmits<Emits>()
}>()
// 条件类型选项
const conditionTypeOptions = [

View File

@ -18,9 +18,9 @@
>
<div class="flex items-center justify-between w-full py-4px">
<div class="flex-1">
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px">{{
device.deviceName
}}</div>
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px"
>{{ device.deviceName }}
</div>
<div class="text-12px text-[var(--el-text-color-secondary)]">{{ device.deviceKey }}</div>
</div>
<div class="flex items-center gap-4px">
@ -42,18 +42,15 @@ import { DeviceApi } from '@/api/iot/device/device'
/** 设备选择器组件 */
defineOptions({ name: 'DeviceSelector' })
interface Props {
const props = defineProps<{
modelValue?: number
productId?: number
}
}>()
interface Emits {
const emit = defineEmits<{
(e: 'update:modelValue', value?: number): void
(e: 'change', value?: number): void
}
const props = defineProps<Props>()
const emit = defineEmits<Emits>()
}>()
// 状态
const deviceLoading = ref(false)

View File

@ -39,19 +39,15 @@ import { useVModel } from '@vueuse/core'
/** 操作符选择器组件 */
defineOptions({ name: 'OperatorSelector' })
interface Props {
const props = defineProps<{
modelValue?: string
propertyType?: string
}
}>()
interface Emits {
const emit = defineEmits<{
(e: 'update:modelValue', value: string): void
(e: 'change', value: string): void
}
const props = defineProps<Props>()
const emit = defineEmits<Emits>()
}>()
const localValue = useVModel(props, 'modelValue', emit)

View File

@ -22,13 +22,14 @@
>
<div class="flex items-center justify-between w-full py-4px">
<div class="flex-1">
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px">{{ product.name }}</div>
<div class="text-12px text-[var(--el-text-color-secondary)]">{{ product.productKey }}</div>
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px"
>{{ product.name }}
</div>
<div class="text-12px text-[var(--el-text-color-secondary)]"
>{{ product.productKey }}
</div>
</div>
<!-- TODO @puhui999是不是用字典 -->
<el-tag size="small" :type="product.status === 0 ? 'success' : 'danger'">
{{ product.status === 0 ? '正常' : '禁用' }}
</el-tag>
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="product.status" />
</div>
</el-option>
</el-select>
@ -70,8 +71,12 @@
>
<div class="flex items-center justify-between w-full py-4px">
<div class="flex-1">
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px">{{ device.deviceName }}</div>
<div class="text-12px text-[var(--el-text-color-secondary)]">{{ device.nickname || '无备注' }}</div>
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px"
>{{ device.deviceName }}
</div>
<div class="text-12px text-[var(--el-text-color-secondary)]"
>{{ device.nickname || '无备注' }}
</div>
</div>
<el-tag size="small" :type="getDeviceStatusTag(device.state)">
{{ getDeviceStatusText(device.state) }}
@ -84,7 +89,10 @@
</el-row>
<!-- 选择结果展示 -->
<div v-if="localProductId && localDeviceId !== undefined" class="mt-16px p-12px bg-[var(--el-fill-color-light)] rounded-6px border border-[var(--el-border-color-lighter)]">
<div
v-if="localProductId && localDeviceId !== undefined"
class="mt-16px p-12px bg-[var(--el-fill-color-light)] rounded-6px border border-[var(--el-border-color-lighter)]"
>
<div class="flex items-center gap-6px mb-8px">
<Icon icon="ep:check" class="text-[var(--el-color-success)] text-16px" />
<span class="text-14px font-500 text-[var(--el-text-color-primary)]">已选择设备</span>
@ -92,14 +100,22 @@
<div class="flex flex-col gap-6px ml-22px">
<div class="flex items-center gap-8px">
<span class="text-12px text-[var(--el-text-color-secondary)] min-w-40px">产品</span>
<span class="text-12px text-[var(--el-text-color-primary)] font-500">{{ selectedProduct?.name }}</span>
<span class="text-12px text-[var(--el-text-color-primary)] font-500">{{
selectedProduct?.name
}}</span>
<el-tag size="small" type="primary">{{ selectedProduct?.productKey }}</el-tag>
</div>
<div class="flex items-center gap-8px">
<span class="text-12px text-[var(--el-text-color-secondary)] min-w-40px">设备</span>
<span v-if="deviceSelectionMode === 'all'" class="text-12px text-[var(--el-text-color-primary)] font-500">全部设备</span>
<span v-else class="text-12px text-[var(--el-text-color-primary)] font-500">{{ selectedDevice?.deviceName }}</span>
<el-tag v-if="deviceSelectionMode === 'all'" size="small" type="warning"> 全部 </el-tag>
<span
v-if="deviceSelectionMode === 'all'"
class="text-12px text-[var(--el-text-color-primary)] font-500"
>全部设备</span
>
<span v-else class="text-12px text-[var(--el-text-color-primary)] font-500">{{
selectedDevice?.deviceName
}}</span>
<el-tag v-if="deviceSelectionMode === 'all'" size="small" type="warning"> 全部</el-tag>
<el-tag v-else size="small" :type="getDeviceStatusTag(selectedDevice?.state)">
{{ getDeviceStatusText(selectedDevice?.state) }}
</el-tag>
@ -113,6 +129,7 @@
import { useVModel } from '@vueuse/core'
import { ProductApi } from '@/api/iot/product/product'
import { DeviceApi } from '@/api/iot/device/device'
import { DICT_TYPE } from '@/utils/dict'
/** 产品设备选择器组件 */
defineOptions({ name: 'ProductDeviceSelector' })
@ -124,7 +141,9 @@ interface Props {
interface Emits {
(e: 'update:productId', value?: number): void
(e: 'update:deviceId', value?: number): void
(e: 'change', value: { productId?: number; deviceId?: number }): void
}

View File

@ -17,16 +17,14 @@
>
<div class="flex items-center justify-between w-full py-4px">
<div class="flex-1">
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px">{{
product.name
}}</div>
<div class="text-12px text-[var(--el-text-color-secondary)]">{{
product.productKey
}}</div>
<div class="text-14px font-500 text-[var(--el-text-color-primary)] mb-2px"
>{{ product.name }}
</div>
<div class="text-12px text-[var(--el-text-color-secondary)]"
>{{ product.productKey }}
</div>
</div>
<el-tag size="small" :type="product.status === 0 ? 'success' : 'danger'">
{{ product.status === 0 ? '正常' : '禁用' }}
</el-tag>
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="product.status" />
</div>
</el-option>
</el-select>
@ -34,21 +32,19 @@
<script setup lang="ts">
import { ProductApi } from '@/api/iot/product/product'
import { DICT_TYPE } from '@/utils/dict'
/** 产品选择器组件 */
defineOptions({ name: 'ProductSelector' })
interface Props {
defineProps<{
modelValue?: number
}
}>()
interface Emits {
const emit = defineEmits<{
(e: 'update:modelValue', value?: number): void
(e: 'change', value?: number): void
}
defineProps<Props>()
const emit = defineEmits<Emits>()
}>()
// 状态
const productLoading = ref(false)