From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/iot/rule/scene/form/configs/CurrentTimeConditionConfig.vue | 234 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 234 insertions(+), 0 deletions(-)
diff --git a/src/views/iot/rule/scene/form/configs/CurrentTimeConditionConfig.vue b/src/views/iot/rule/scene/form/configs/CurrentTimeConditionConfig.vue
new file mode 100644
index 0000000..9d304b7
--- /dev/null
+++ b/src/views/iot/rule/scene/form/configs/CurrentTimeConditionConfig.vue
@@ -0,0 +1,234 @@
+<!-- 褰撳墠鏃堕棿鏉′欢閰嶇疆缁勪欢 -->
+<template>
+ <div class="flex flex-col gap-16px">
+ <el-row :gutter="16">
+ <!-- 鏃堕棿鎿嶄綔绗﹂�夋嫨 -->
+ <el-col :span="8">
+ <el-form-item label="鏃堕棿鏉′欢" required>
+ <el-select
+ :model-value="condition.operator"
+ @update:model-value="(value) => updateConditionField('operator', value)"
+ placeholder="璇烽�夋嫨鏃堕棿鏉′欢"
+ class="w-full"
+ >
+ <el-option
+ v-for="option in timeOperatorOptions"
+ :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 as any" size="small">{{ option.category }}</el-tag>
+ </div>
+ </el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+
+ <!-- 鏃堕棿鍊艰緭鍏� -->
+ <el-col :span="8">
+ <el-form-item label="鏃堕棿鍊�" required>
+ <el-time-picker
+ v-if="needsTimeInput"
+ :model-value="timeValue"
+ @update:model-value="handleTimeValueChange"
+ placeholder="璇烽�夋嫨鏃堕棿"
+ format="HH:mm:ss"
+ value-format="HH:mm:ss"
+ class="w-full"
+ />
+ <el-date-picker
+ v-else-if="needsDateInput"
+ :model-value="timeValue"
+ @update:model-value="handleTimeValueChange"
+ type="datetime"
+ placeholder="璇烽�夋嫨鏃ユ湡鏃堕棿"
+ format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ class="w-full"
+ />
+ <div v-else class="text-[var(--el-text-color-placeholder)] text-14px">
+ 鏃犻渶璁剧疆鏃堕棿鍊�
+ </div>
+ </el-form-item>
+ </el-col>
+
+ <!-- 绗簩涓椂闂村�硷紙鑼冨洿鏉′欢锛� -->
+ <el-col :span="8" v-if="needsSecondTimeInput">
+ <el-form-item label="缁撴潫鏃堕棿" required>
+ <el-time-picker
+ v-if="needsTimeInput"
+ :model-value="timeValue2"
+ @update:model-value="handleTimeValue2Change"
+ placeholder="璇烽�夋嫨缁撴潫鏃堕棿"
+ format="HH:mm:ss"
+ value-format="HH:mm:ss"
+ class="w-full"
+ />
+ <el-date-picker
+ v-else
+ :model-value="timeValue2"
+ @update:model-value="handleTimeValue2Change"
+ type="datetime"
+ placeholder="璇烽�夋嫨缁撴潫鏃ユ湡鏃堕棿"
+ format="YYYY-MM-DD HH:mm:ss"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ class="w-full"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { useVModel } from '@vueuse/core'
+import { IotRuleSceneTriggerTimeOperatorEnum } from '@/views/iot/utils/constants'
+import type { TriggerCondition } from '@/api/iot/rule/scene'
+
+/** 褰撳墠鏃堕棿鏉′欢閰嶇疆缁勪欢 */
+defineOptions({ name: 'CurrentTimeConditionConfig' })
+
+const props = defineProps<{
+ modelValue: TriggerCondition
+}>()
+
+const emit = defineEmits<{
+ (e: 'update:modelValue', value: TriggerCondition): void
+}>()
+
+const condition = useVModel(props, 'modelValue', emit)
+
+// 鏃堕棿鎿嶄綔绗﹂�夐」
+const timeOperatorOptions = [
+ {
+ value: IotRuleSceneTriggerTimeOperatorEnum.BEFORE_TIME.value,
+ label: IotRuleSceneTriggerTimeOperatorEnum.BEFORE_TIME.name,
+ icon: 'ep:arrow-left',
+ iconClass: 'text-blue-500',
+ tag: 'primary',
+ category: '鏃堕棿鐐�'
+ },
+ {
+ value: IotRuleSceneTriggerTimeOperatorEnum.AFTER_TIME.value,
+ label: IotRuleSceneTriggerTimeOperatorEnum.AFTER_TIME.name,
+ icon: 'ep:arrow-right',
+ iconClass: 'text-green-500',
+ tag: 'success',
+ category: '鏃堕棿鐐�'
+ },
+ {
+ value: IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.value,
+ label: IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.name,
+ icon: 'ep:sort',
+ iconClass: 'text-orange-500',
+ tag: 'warning',
+ category: '鏃堕棿娈�'
+ },
+ {
+ value: IotRuleSceneTriggerTimeOperatorEnum.AT_TIME.value,
+ label: IotRuleSceneTriggerTimeOperatorEnum.AT_TIME.name,
+ icon: 'ep:position',
+ iconClass: 'text-purple-500',
+ tag: 'info',
+ category: '鏃堕棿鐐�'
+ },
+ {
+ value: IotRuleSceneTriggerTimeOperatorEnum.TODAY.value,
+ label: IotRuleSceneTriggerTimeOperatorEnum.TODAY.name,
+ icon: 'ep:calendar',
+ iconClass: 'text-red-500',
+ tag: 'danger',
+ category: '鏃ユ湡'
+ }
+]
+
+// 璁＄畻灞炴�э細鏄惁闇�瑕佹椂闂磋緭鍏�
+const needsTimeInput = computed(() => {
+ const timeOnlyOperators = [
+ IotRuleSceneTriggerTimeOperatorEnum.BEFORE_TIME.value,
+ IotRuleSceneTriggerTimeOperatorEnum.AFTER_TIME.value,
+ IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.value,
+ IotRuleSceneTriggerTimeOperatorEnum.AT_TIME.value
+ ]
+ return timeOnlyOperators.includes(condition.value.operator as any)
+})
+
+// 璁＄畻灞炴�э細鏄惁闇�瑕佹棩鏈熻緭鍏�
+const needsDateInput = computed(() => {
+ return false // 鏆傛椂涓嶆敮鎸佹棩鏈熻緭鍏ワ紝鍙敮鎸佹椂闂�
+})
+
+// 璁＄畻灞炴�э細鏄惁闇�瑕佺浜屼釜鏃堕棿杈撳叆
+const needsSecondTimeInput = computed(() => {
+ return condition.value.operator === IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.value
+})
+
+// 璁＄畻灞炴�э細浠� param 涓В鏋愭椂闂村��
+const timeValue = computed(() => {
+ if (!condition.value.param) return ''
+ const params = condition.value.param.split(',')
+ return params[0] || ''
+})
+
+// 璁＄畻灞炴�э細浠� param 涓В鏋愮浜屼釜鏃堕棿鍊�
+const timeValue2 = computed(() => {
+ if (!condition.value.param) return ''
+ const params = condition.value.param.split(',')
+ return params[1] || ''
+})
+
+/**
+ * 鏇存柊鏉′欢瀛楁
+ * @param field 瀛楁鍚�
+ * @param value 瀛楁鍊�
+ */
+const updateConditionField = (field: any, value: any) => {
+ condition.value[field] = value
+}
+
+/**
+ * 澶勭悊绗竴涓椂闂村�煎彉鍖�
+ * @param value 鏃堕棿鍊�
+ */
+const handleTimeValueChange = (value: string) => {
+ const currentParams = condition.value.param ? condition.value.param.split(',') : []
+ currentParams[0] = value || ''
+
+ // 濡傛灉鏄寖鍥存潯浠讹紝淇濈暀绗簩涓�硷紱鍚﹀垯鍙繚鐣欑涓�涓��
+ if (needsSecondTimeInput.value) {
+ condition.value.param = currentParams.slice(0, 2).join(',')
+ } else {
+ condition.value.param = currentParams[0]
+ }
+}
+
+/**
+ * 澶勭悊绗簩涓椂闂村�煎彉鍖�
+ * @param value 鏃堕棿鍊�
+ */
+const handleTimeValue2Change = (value: string) => {
+ const currentParams = condition.value.param ? condition.value.param.split(',') : ['']
+ currentParams[1] = value || ''
+ condition.value.param = currentParams.slice(0, 2).join(',')
+}
+
+/** 鐩戝惉鎿嶄綔绗﹀彉鍖栵紝娓呯悊涓嶇浉鍏崇殑鏃堕棿鍊� */
+watch(
+ () => condition.value.operator,
+ (newOperator) => {
+ if (newOperator === IotRuleSceneTriggerTimeOperatorEnum.TODAY.value) {
+ // 浠婃棩鏉′欢涓嶉渶瑕佹椂闂村弬鏁�
+ condition.value.param = ''
+ } else if (!needsSecondTimeInput.value) {
+ // 闈炶寖鍥存潯浠跺彧淇濈暀绗竴涓椂闂村��
+ const currentParams = condition.value.param ? condition.value.param.split(',') : []
+ condition.value.param = currentParams[0] || ''
+ }
+ }
+)
+</script>
--
Gitblit v1.8.0