diff --git a/src/renderer/src/assets/images/common/table_addBtn.png b/src/renderer/src/assets/images/common/table_addBtn.png new file mode 100644 index 0000000..074a3d9 Binary files /dev/null and b/src/renderer/src/assets/images/common/table_addBtn.png differ diff --git a/src/renderer/src/views/Design/CommManagement/commManagement.vue b/src/renderer/src/views/Design/CommManagement/commManagement.vue index 3faec7a..c1c15c5 100644 --- a/src/renderer/src/views/Design/CommManagement/commManagement.vue +++ b/src/renderer/src/views/Design/CommManagement/commManagement.vue @@ -48,158 +48,24 @@
- -
通信协议
- - - - - - - - - - - - - - - -
通信参数
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 16进制 - - - 清空内容 - 接收数据 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
输出列表
- - - - - - -
添加数据
-
- - + + + + + +
@@ -215,6 +81,9 @@ import { DSButton } from '@/components/Button' import { DSDialog } from '@/components/Dialog' import DeviceDialog from './deviceDialog.vue' import EventDialog from './eventDialog.vue' +import DeviceForm from './deviceForm.vue' +import ReceiveEventForm from './receiveEventForm.vue' +import SendEventForm from './sendEventForm.vue' import DeviceIcon from '@/assets/images/common/device.png' import DeviceSelectedIcon from '@/assets/images/common/device_selected.png' import SendIcon from '@/assets/images/common/send.png' @@ -323,7 +192,7 @@ const receiveList = ref([ } }, { name: '文本-协议组装', enabled: false }, - { name: '字节匹配-协议组装', enabled: false }, + { name: '字节-协议组装', enabled: false }, { name: '脚本', enabled: false } ]) // 发送事件列表 @@ -346,7 +215,9 @@ const sendList = ref([ { name: '脚本', enabled: false } ]) -const dataTab = ref('receive') +// 事件类型 +const receiveEventType = ref('') +const sendEventType = ref('') // 设备信息表单 const formDeviceInfo = reactive({ protocol: '', @@ -359,7 +230,22 @@ const formDeviceInfo = reactive({ endInfo: '' }) // 接收事件信息表单 -const formEventInfo = reactive({}) +const formEventInfo = reactive({ + deviceName: '', + separator: '', + lengthCompare: false, + characterLength: '', + tableData: [] +}) + +// 发送事件信息表单 +const formSendEventInfo = reactive({ + deviceName: '', + separator: '', + lengthCompare: false, + characterLength: '', + tableData: [] +}) interface CommBar { label: string @@ -397,6 +283,32 @@ const selectDevice = (device: Device) => { if (activeTab.value === 'device') { Object.assign(formDeviceInfo, device.info) } else if (activeTab.value === 'receive') { + switch (device.name) { + case '文本-协议解析': + receiveEventType.value = 'textParse' + break + case '文本-协议组装': + receiveEventType.value = 'textMake' + break + case '字节-协议组装': + receiveEventType.value = 'byteMake' + break + case '脚本': + receiveEventType.value = 'script' + break + } + } else if (activeTab.value === 'send') { + switch (device.name) { + case '文本-直接输出': + sendEventType.value = 'textParse' + break + case '文本-组装输出': + sendEventType.value = 'textMake' + break + case '脚本': + sendEventType.value = 'script' + break + } } } @@ -414,6 +326,24 @@ const addDevice = () => { console.log(isDeviceDialog.value, 'isDeviceDialog.value') } +const handleTableAdd = () => { + if (activeTab.value === 'receive') { + formEventInfo.tableData.push({ + num: formEventInfo.tableData.length + 1, + name: 'output1', + type: 'int', + result: '' + }) + } else if (activeTab.value === 'send') { + formSendEventInfo.tableData.push({ + num: formSendEventInfo.tableData.length + 1, + name: 'input', + type: 'int', + result: '' + }) + } +} + // 接收事件内容 const receiveData = ref('') // 发送事件内容 @@ -537,6 +467,15 @@ const handleClose = () => { height: 224px; background: #363940; } + .table-add-btn { + box-sizing: border-box; + width: 128px; + height: 40px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + } } } .commManagement-line-first, @@ -551,14 +490,5 @@ const handleClose = () => { .commManagement-line-second { left: 372px; } - :deep(.eventList-table .el-table__header > thead th) { - color: #fff; - - background-color: rgba(21, 77, 221, 0.8); - border-color: #4e5969; - } - :deep(.el-table--fit .el-table__inner-wrapper:before) { - background-color: #4e5969; - } } diff --git a/src/renderer/src/views/Design/CommManagement/deviceForm.vue b/src/renderer/src/views/Design/CommManagement/deviceForm.vue new file mode 100644 index 0000000..a71f01e --- /dev/null +++ b/src/renderer/src/views/Design/CommManagement/deviceForm.vue @@ -0,0 +1,134 @@ + + + + + diff --git a/src/renderer/src/views/Design/CommManagement/receiveEventForm.vue b/src/renderer/src/views/Design/CommManagement/receiveEventForm.vue new file mode 100644 index 0000000..3ed02e4 --- /dev/null +++ b/src/renderer/src/views/Design/CommManagement/receiveEventForm.vue @@ -0,0 +1,508 @@ + + + + + diff --git a/src/renderer/src/views/Design/CommManagement/sendEventForm.vue b/src/renderer/src/views/Design/CommManagement/sendEventForm.vue new file mode 100644 index 0000000..592d746 --- /dev/null +++ b/src/renderer/src/views/Design/CommManagement/sendEventForm.vue @@ -0,0 +1,441 @@ + + + + +