140 lines
3.9 KiB
Vue
140 lines
3.9 KiB
Vue
<!-- 产品的物模型表单(service 项) -->
|
||
<template>
|
||
<el-form-item
|
||
:rules="[{ required: true, message: '请选择调用方式', trigger: 'change' }]"
|
||
label="调用方式"
|
||
prop="service.callType"
|
||
>
|
||
<el-radio-group v-model="service.callType">
|
||
<el-radio
|
||
v-for="callType in Object.values(IoTThingModelServiceCallTypeEnum)"
|
||
:key="callType.value"
|
||
:value="callType.value"
|
||
>
|
||
{{ callType.label }}
|
||
</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="输入参数">
|
||
<ThingModelInputOutputParam
|
||
v-model="service.inputParams"
|
||
:direction="IoTThingModelParamDirectionEnum.INPUT"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="输出参数">
|
||
<ThingModelInputOutputParam
|
||
v-model="service.outputParams"
|
||
:direction="IoTThingModelParamDirectionEnum.OUTPUT"
|
||
/>
|
||
</el-form-item>
|
||
|
||
<!-- Modbus 配置 -->
|
||
<el-divider content-position="left">Modbus 配置(可选)</el-divider>
|
||
<el-form-item label="完整帧">
|
||
<el-input
|
||
v-model="service.modbusConfig.fullFrame"
|
||
placeholder="十六进制完整帧,如:40050000FF00832B"
|
||
clearable
|
||
/>
|
||
<div class="form-item-tip">
|
||
如果配置了完整帧,将直接使用该帧发送命令(推荐用于固定命令)
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="功能码">
|
||
<el-input-number
|
||
v-model="service.modbusConfig.functionCode"
|
||
:min="1"
|
||
:max="127"
|
||
placeholder="如:5"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="寄存器地址">
|
||
<el-input-number
|
||
v-model="service.modbusConfig.registerAddress"
|
||
:min="0"
|
||
:max="65535"
|
||
placeholder="如:0"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="写入值">
|
||
<el-input-number
|
||
v-model="service.modbusConfig.writeValue"
|
||
placeholder="写入值"
|
||
/>
|
||
</el-form-item>
|
||
<!-- 字节序 -->
|
||
<el-form-item label="字节序" prop="service.modbusConfig.byteOrder">
|
||
<el-radio-group v-model="service.modbusConfig.byteOrder">
|
||
<el-radio
|
||
v-for="order in Object.values(IoTModbusByteOrderEnum)"
|
||
:key="order.value"
|
||
:label="order.value"
|
||
>
|
||
{{ order.label }}
|
||
</el-radio>
|
||
</el-radio-group>
|
||
|
||
</el-form-item>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import ThingModelInputOutputParam from './ThingModelInputOutputParam.vue'
|
||
import { useVModel } from '@vueuse/core'
|
||
import { ThingModelService } from '@/api/iot/thingmodel'
|
||
import { isEmpty } from '@/utils/is'
|
||
import {
|
||
IoTThingModelParamDirectionEnum,
|
||
IoTThingModelServiceCallTypeEnum,
|
||
IoTModbusByteOrderEnum
|
||
} from '@/views/iot/utils/constants'
|
||
|
||
/** IoT 物模型服务 */
|
||
defineOptions({ name: 'ThingModelService' })
|
||
|
||
const props = defineProps<{ modelValue: any; isStructDataSpecs?: boolean }>()
|
||
const emits = defineEmits(['update:modelValue'])
|
||
const service = useVModel(props, 'modelValue', emits) as Ref<ThingModelService>
|
||
|
||
/** 初始化 modbusConfig */
|
||
if (!service.value.modbusConfig) {
|
||
service.value.modbusConfig = {
|
||
functionCode: undefined,
|
||
registerAddress: undefined,
|
||
writeValue: undefined,
|
||
registerCount: undefined,
|
||
fullFrame: '',
|
||
crcHex: '',
|
||
byteOrder: IoTModbusByteOrderEnum.BIG_ENDIAN.value // 默认大端模式
|
||
}
|
||
} else if (!service.value.modbusConfig.byteOrder) {
|
||
// 向下兼容:如果没有 byteOrder,默认设置为大端模式
|
||
service.value.modbusConfig.byteOrder = IoTModbusByteOrderEnum.BIG_ENDIAN.value
|
||
}
|
||
|
||
|
||
|
||
/** 默认选中,ASYNC 异步 */
|
||
watch(
|
||
() => service.value.callType,
|
||
(val: string) =>
|
||
isEmpty(val) && (service.value.callType = IoTThingModelServiceCallTypeEnum.ASYNC.value),
|
||
{ immediate: true }
|
||
)
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
:deep(.el-form-item) {
|
||
.el-form-item {
|
||
margin-bottom: 0;
|
||
}
|
||
}
|
||
.form-item-tip {
|
||
font-size: 12px;
|
||
color: #999;
|
||
margin-top: 4px;
|
||
line-height: 1.5;
|
||
}
|
||
</style>
|