diff --git a/src/views/iot/rule/scene/form/selectors/PropertySelector.vue b/src/views/iot/rule/scene/form/selectors/PropertySelector.vue index c5b9d6c2..e353fc27 100644 --- a/src/views/iot/rule/scene/form/selectors/PropertySelector.vue +++ b/src/views/iot/rule/scene/form/selectors/PropertySelector.vue @@ -37,90 +37,122 @@ - -
- + + + - - -
+ +
+
+ + + {{ selectedProperty.name }} + + + {{ getPropertyTypeName(selectedProperty.dataType) }} + +
+ +
+
+ + 标识符: + + + {{ selectedProperty.identifier }} + +
+ +
+ + 描述: + + + {{ selectedProperty.description }} + +
+ +
+ + 单位: + + + {{ selectedProperty.unit }} + +
+ +
+ + 取值范围: + + + {{ selectedProperty.range }} + +
+ +
-
- - - {{ selectedProperty.name }} - - - {{ getPropertyTypeName(selectedProperty.dataType) }} - -
-
-
- - 标识符: - - - {{ selectedProperty.identifier }} - -
-
- - 描述: - - - {{ selectedProperty.description }} - -
-
- - 单位: - - - {{ selectedProperty.unit }} - -
-
- - 取值范围: - - - {{ selectedProperty.range }} - -
-
- -
- 关闭 -
+ + 访问模式: + + + {{ getAccessModeText(selectedProperty.accessMode) }} + +
+ +
+ + 事件类型: + + + {{ getEventTypeText(selectedProperty.eventType) }} + +
+ +
+ + 调用类型: + + + {{ getCallTypeText(selectedProperty.callType) }} +
- -
+
+
@@ -153,25 +185,6 @@ const loading = ref(false) const propertyList = ref([]) const thingModelTSL = ref(null) -// 属性详情弹出层相关状态 -const showPropertyDetail = ref(false) -const detailTriggerRef = ref() -const propertyDetailRef = ref() -const popoverStyle = ref({}) - -// 点击外部关闭弹出层 -const handleClickOutside = (event: MouseEvent) => { - if ( - showPropertyDetail.value && - propertyDetailRef.value && - detailTriggerRef.value && - !propertyDetailRef.value.contains(event.target as Node) && - !detailTriggerRef.value.$el.contains(event.target as Node) - ) { - hidePropertyDetail() - } -} - // 计算属性 const propertyGroups = computed(() => { const groups: { label: string; options: any[] }[] = [] @@ -235,65 +248,33 @@ const getPropertyTypeTag = (dataType: string) => { return tagMap[dataType] || 'info' } -// 弹出层控制方法 -const togglePropertyDetail = () => { - if (showPropertyDetail.value) { - hidePropertyDetail() - } else { - showPropertyDetailPopover() +// 工具函数 - 获取访问模式文本 +const getAccessModeText = (accessMode: string) => { + const modeMap = { + r: '只读', + w: '只写', + rw: '读写' } + return modeMap[accessMode] || accessMode } -const showPropertyDetailPopover = () => { - if (!selectedProperty.value || !detailTriggerRef.value) return - - showPropertyDetail.value = true - - nextTick(() => { - updatePopoverPosition() - }) +// 工具函数 - 获取事件类型文本 +const getEventTypeText = (eventType: string) => { + const typeMap = { + info: '信息', + alert: '告警', + error: '故障' + } + return typeMap[eventType] || eventType } -const hidePropertyDetail = () => { - showPropertyDetail.value = false -} - -const updatePopoverPosition = () => { - if (!detailTriggerRef.value || !propertyDetailRef.value) return - - const triggerEl = detailTriggerRef.value.$el - const triggerRect = triggerEl.getBoundingClientRect() - const popoverEl = propertyDetailRef.value - - // 计算弹出层位置 - const left = triggerRect.left + triggerRect.width + 8 - const top = triggerRect.top - - // 检查是否超出视窗右边界 - const popoverWidth = 400 // 最大宽度 - const viewportWidth = window.innerWidth - - let finalLeft = left - if (left + popoverWidth > viewportWidth - 16) { - // 如果超出右边界,显示在左侧 - finalLeft = triggerRect.left - popoverWidth - 8 - } - - // 检查是否超出视窗下边界 - let finalTop = top - const popoverHeight = popoverEl.offsetHeight || 200 - const viewportHeight = window.innerHeight - - if (top + popoverHeight > viewportHeight - 16) { - finalTop = Math.max(16, viewportHeight - popoverHeight - 16) - } - - popoverStyle.value = { - position: 'fixed', - left: `${finalLeft}px`, - top: `${finalTop}px`, - zIndex: 9999 +// 工具函数 - 获取调用类型文本 +const getCallTypeText = (callType: string) => { + const typeMap = { + sync: '同步', + async: '异步' } + return typeMap[callType] || callType } // 事件处理 @@ -305,8 +286,7 @@ const handleChange = (value: string) => { config: property }) } - // 选择变化时隐藏详情弹出层 - hidePropertyDetail() + // 选择变化时,el-popover 会自动关闭 } // 获取物模型TSL数据 @@ -441,21 +421,6 @@ const getPropertyRange = (property: any) => { return undefined } -// 获取数据范围描述(保留兼容性) -const getDataRange = (dataSpecs: any) => { - if (!dataSpecs) return undefined - - if (dataSpecs.min !== undefined && dataSpecs.max !== undefined) { - return `${dataSpecs.min}~${dataSpecs.max}` - } - - if (dataSpecs.dataSpecsList && Array.isArray(dataSpecs.dataSpecsList)) { - return dataSpecs.dataSpecsList.map((item: any) => `${item.name}(${item.value})`).join(', ') - } - - return undefined -} - // 监听产品变化 watch( () => props.productId, @@ -470,74 +435,30 @@ watch( () => props.triggerType, () => { localValue.value = '' - hidePropertyDetail() + // el-popover 会自动关闭,无需手动处理 } ) - -// 监听窗口大小变化,重新计算弹出层位置 -const handleResize = () => { - if (showPropertyDetail.value) { - updatePopoverPosition() - } -} - -// 生命周期 -onMounted(() => { - document.addEventListener('click', handleClickOutside) - window.addEventListener('resize', handleResize) -}) - -onUnmounted(() => { - document.removeEventListener('click', handleClickOutside) - window.removeEventListener('resize', handleResize) -}) diff --git a/src/views/iot/rule/scene/form/selectors/ServiceSelector.vue b/src/views/iot/rule/scene/form/selectors/ServiceSelector.vue deleted file mode 100644 index d9ef7ed1..00000000 --- a/src/views/iot/rule/scene/form/selectors/ServiceSelector.vue +++ /dev/null @@ -1,446 +0,0 @@ - - - - - -