refactor(layout): 添加扫码录入页面和菜单
This commit is contained in:
fhysy
parent
9934f65ab6
commit
5ebb6625dc
|
|
@ -13,7 +13,8 @@ const settings = defineProps({
|
|||
<!-- <el-menu-item index="/system/videoplayer"><span class="iconfont icon-icon_jiankong"></span> 视频监控</el-menu-item>-->
|
||||
<el-menu-item index="/system/serialport"><span class="iconfont icon-chuankou2"></span> 设备参数读写</el-menu-item>
|
||||
<el-menu-item index="/system/devicestandard"><span class="iconfont icon-icon_chajian"></span> 空开标定</el-menu-item>
|
||||
<el-menu-item index="/gateway/southdirection"><span class="iconfont icon-icon_chajian"></span> 南向采集配置</el-menu-item>
|
||||
<el-menu-item index="/system/scancodewrite"><span class="iconfont icon-chuankou2"></span> 扫码录入</el-menu-item>
|
||||
<!-- <el-menu-item index="/gateway/southdirection"><span class="iconfont icon-icon_chajian"></span> 南向采集配置</el-menu-item>-->
|
||||
<!-- <el-menu-item index="/gateway/northboundtask"><span class="iconfont icon-icon_chajian"></span> 北向任务配置</el-menu-item>-->
|
||||
<!-- <el-menu-item index="/gateway/collectdatamonitor"><span class="iconfont icon-icon_chajian"></span> 采集数据监视</el-menu-item>-->
|
||||
<!-- <el-menu-item index="/system/test"><el-icon> <Menu /> </el-icon>测试</el-menu-item>-->
|
||||
|
|
|
|||
|
|
@ -44,6 +44,15 @@ const router = createRouter({
|
|||
keepAlive: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'scancodewrite',
|
||||
name: 'scancodewrite',
|
||||
component: () => import('@renderer/views/system/scancodewrite/index.vue'),
|
||||
meta: {
|
||||
menu: 'scancodewrite',
|
||||
keepAlive: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'devicestandard',
|
||||
name: 'devicestandard',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,957 @@
|
|||
<template>
|
||||
<div id="serialport-box">
|
||||
<div id="serialport-main" class="serialport-main">
|
||||
<el-collapse v-model="activeFold" @change="foldChange">
|
||||
<!-- <el-collapse-item name="1" title="串口设置">-->
|
||||
<!-- <el-form ref="serialportFormRef" :model="serialportForm" :rules="serialportRules" class="demo-serialportForm" label-width="auto" status-icon>-->
|
||||
<!-- <el-form-item label="端口" prop="port" required>-->
|
||||
<!-- <el-select v-model="serialportForm.port" :disabled="connectionState" placeholder="选择端口" style="flex: 1">-->
|
||||
<!-- <el-option v-for="(item, index) in serialportList" :key="index" :label="item" :value="item" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- <el-button style="margin-left: 10px" type="primary" @click="getSerialPortList">获取端口列表</el-button>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="波特率" prop="baudrate" required>-->
|
||||
<!-- <el-select v-model="serialportForm.baudrate" :disabled="connectionState" placeholder="选择波特率">-->
|
||||
<!-- <el-option label="4800" :value="4800" />-->
|
||||
<!-- <el-option label="9600" :value="9600" />-->
|
||||
<!-- <el-option label="19200" :value="19200" />-->
|
||||
<!-- <el-option label="43000" :value="43000" />-->
|
||||
<!-- <el-option label="56000" :value="56000" />-->
|
||||
<!-- <el-option label="115200" :value="115200" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="数据位" prop="databits" required>-->
|
||||
<!-- <el-select v-model="serialportForm.databits" :disabled="connectionState" placeholder="选择数据位">-->
|
||||
<!-- <el-option label="5" :value="5" />-->
|
||||
<!-- <el-option label="6" :value="6" />-->
|
||||
<!-- <el-option label="7" :value="7" />-->
|
||||
<!-- <el-option label="8" :value="8" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="校验位" prop="parity" required>-->
|
||||
<!-- <el-select v-model="serialportForm.parity" :disabled="connectionState" placeholder="选择校验位">-->
|
||||
<!-- <el-option label="None" :value="0" />-->
|
||||
<!-- <el-option label="Odd" :value="1" />-->
|
||||
<!-- <el-option label="Even" :value="2" />-->
|
||||
<!-- <el-option label="Mark" :value="3" />-->
|
||||
<!-- <el-option label="Space" :value="4" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="停止位" prop="stopbits" required>-->
|
||||
<!-- <el-select v-model="serialportForm.stopbits" :disabled="connectionState" placeholder="选择停止位">-->
|
||||
<!-- <el-option label="1" :value="0" />-->
|
||||
<!-- <el-option label="1.5" :value="1" />-->
|
||||
<!-- <el-option label="2" :value="2" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item class="btn-box">-->
|
||||
<!-- <el-button type="danger" @click="disconnSerialPort">关闭 </el-button>-->
|
||||
<!-- <el-button type="primary" @click="connectSerialPort(serialportFormRef)">{{ connectionState ? '已打开' : '打开' }}</el-button>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-form>-->
|
||||
<!-- </el-collapse-item>-->
|
||||
<!-- <el-collapse-item name="2" title="通用调试">-->
|
||||
<!-- <el-form ref="commonDebuggerFormRef" :model="commonDebuggerForm" :rules="commonDebuggerRules" class="demo-serialportForm" label-width="auto" status-icon>-->
|
||||
<!-- <el-row>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="本地ID" prop="localId">-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.localId" placeholder="请输入本地ID" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="目标ID" prop="remoteId">-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.remoteId" placeholder="请输入目标ID" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- <el-row>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="设备类型" prop="devType" required>-->
|
||||
<!-- <el-select v-model="commonDebuggerForm.devType" placeholder="选择设备类型" style="flex: 1">-->
|
||||
<!-- <el-option v-for="(item, index) in devTypeList" :key="index" :label="item.label" :value="item.value" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="数据类型" prop="dataType" required>-->
|
||||
<!-- <el-select v-model="commonDebuggerForm.dataType" placeholder="选择数据类型" style="flex: 1">-->
|
||||
<!-- <el-option v-for="(item, index) in dataTypeList" :key="index" :label="item.label" :value="item.value" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- <el-row>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="指令码" prop="cmd" required>-->
|
||||
<!-- <el-select v-model="commonDebuggerForm.cmd" placeholder="选择指令码" style="flex: 1">-->
|
||||
<!-- <el-option v-for="(item, index) in cmdList" :key="index" :label="item.label" :value="item.value" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="数据长度类型" prop="dataLenType" required>-->
|
||||
<!-- <el-select v-model="commonDebuggerForm.dataLenType" placeholder="选择数据长度类型" style="flex: 1">-->
|
||||
<!-- <el-option v-for="(item, index) in dataLenTypeList" :key="index" :label="item.label" :value="item.value" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- <el-row v-if="commonDebuggerForm.cmd === '0100' || commonDebuggerForm.cmd === '0011'">-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="起始地址" prop="writeStart" required>-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.writeStart" type="number" placeholder="请输入起始地址" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="长度" prop="writeLength" required>-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.writeLength" type="number" placeholder="请输入长度" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- <el-form-item v-if="commonDebuggerForm.cmd === '0100'" label="数据" prop="writeData">-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.writeData" type="textarea" :rows="2" placeholder="请输入数据" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="发送包" prop="dataStr">-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.dataStr" disabled />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="返回包" prop="hexStr">-->
|
||||
<!-- <el-input v-model="commonDebuggerForm.hexStr" disabled />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item class="btn-box">-->
|
||||
<!-- <el-button type="primary" :loading="sendCommonDebuggerState" @click="sendCommonDebugger(commonDebuggerFormRef)">发送</el-button>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-form>-->
|
||||
<!-- </el-collapse-item>-->
|
||||
<el-collapse-item name="3" title="设备参数">
|
||||
<div class="device-attr-list">
|
||||
<div v-for="(item, index) in deviceAttrList" :key="item.id" class="device-attr-item">
|
||||
<div class="device-attr-item-name">{{ item.name }}</div>
|
||||
<div class="device-attr-item-value">
|
||||
<el-input v-model="item.outputValue" class="device-attr-input" disabled />
|
||||
<el-button type="primary" :loading="item.outputLoadingStatus" @click="sendDeviceAttr(item, 'output', index)">读取</el-button>
|
||||
</div>
|
||||
<div class="device-attr-item-value">
|
||||
<el-input v-model="item.inputValue"
|
||||
focus placeholder="扫码输入"
|
||||
:disabled="item.inputDisable" class="device-attr-input" v-if="item.name === '设备序列号（SN）'"/>
|
||||
<el-input v-model="item.inputValue" :disabled="item.inputDisable" class="device-attr-input" v-else/>
|
||||
<el-button type="primary" :disabled="item.inputDisable" :loading="item.inputLoadingStatus" @click="sendDeviceAttr(item, 'input', index)">写入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<el-button type="primary" @click="allReadDeviceAttr">一键读取</el-button>
|
||||
<el-button type="primary" @click="allWriteDeviceAttr">一键写入</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import axios from 'axios'; // 引入axios
|
||||
import config from '@renderer/util/config.js';
|
||||
|
||||
import { reactive, ref, onMounted, onUnmounted, watch, computed } from 'vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { buildHead, hexToString, hexToVersion, rearrangeHexStr, versionToHex } from '../serialport/js/fun';
|
||||
import { useSerialPortStore } from '@renderer/stores/seralPort.js';
|
||||
|
||||
const useseralPortStore = useSerialPortStore();
|
||||
const activeFold = ref(['1', '2', '3']);
|
||||
|
||||
//连接状态
|
||||
const connectionState = ref(false);
|
||||
|
||||
const serialportFormRef = ref();
|
||||
|
||||
const serialportList = ref([]);
|
||||
|
||||
// const serialportForm = reactive({
|
||||
// port: '',
|
||||
// baudrate: 115200,
|
||||
// databits: 8,
|
||||
// parity: 0,
|
||||
// stopbits: 0
|
||||
// });
|
||||
|
||||
const serialportForm = computed(() => {
|
||||
return useseralPortStore.serialport;
|
||||
});
|
||||
|
||||
// 监听 serialportForm 的变化
|
||||
// watch(
|
||||
// () => ({ ...serialportForm }),
|
||||
// newVal => {
|
||||
// // 将新的值存储到 localStorage 中
|
||||
// newVal.port = newVal.port.toLowerCase();
|
||||
// useseralPortStore.setSerialport(newVal);
|
||||
// // localStorage.setItem('serialportForm', newVal);
|
||||
// },
|
||||
// { deep: true }
|
||||
// );
|
||||
|
||||
const serialportRules = reactive({
|
||||
port: [{ required: true, message: '请选择端口', trigger: 'change' }],
|
||||
baudrate: [{ required: true, message: '请选择波特率', trigger: 'change' }],
|
||||
databits: [{ required: true, message: '请选择port', trigger: 'change' }],
|
||||
parity: [{ required: true, message: '请选择userName', trigger: 'change' }],
|
||||
stopbits: [{ required: true, message: '请选择passWord', trigger: 'change' }]
|
||||
});
|
||||
|
||||
//获取端口列表
|
||||
const getSerialPortList = (msgShow = true) => {
|
||||
axios
|
||||
.get(config.serialPortUrl + '/serial/list', {})
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
if (response.data.code === 0) {
|
||||
serialportList.value = response.data.data.List || [];
|
||||
if (msgShow) {
|
||||
ElMessage.success('获取端口列表成功');
|
||||
}
|
||||
} else {
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
// 错误处理
|
||||
ElMessage.error(error);
|
||||
});
|
||||
};
|
||||
|
||||
//打开
|
||||
const connectSerialPort = formEl => {
|
||||
if (!formEl) return;
|
||||
formEl.validate(valid => {
|
||||
if (valid) {
|
||||
serialportForm.port = serialportForm.port.toLowerCase();
|
||||
axios
|
||||
.post(config.serialPortUrl + '/serial/open', serialportForm)
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
console.log(response); // 打印响应数据
|
||||
if (response.data.code === 0) {
|
||||
ElMessage.success('打开成功');
|
||||
connectionState.value = true;
|
||||
} else {
|
||||
if (response.data.code === 60) {
|
||||
connectionState.value = false;
|
||||
}
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
// 错误处理
|
||||
if (error.response.data.message) {
|
||||
ElMessage.error(error.response.data.message);
|
||||
} else {
|
||||
ElMessage.error(error);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
//关闭串口
|
||||
const disconnSerialPort = () => {
|
||||
serialportForm.port = serialportForm.port.toLowerCase();
|
||||
axios
|
||||
.get(config.serialPortUrl + '/serial/close', {
|
||||
params: {
|
||||
port: serialportForm.port
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
if (response.data.code === 0) {
|
||||
connectionState.value = false;
|
||||
ElMessage.success('关闭成功');
|
||||
} else {
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
// 错误处理
|
||||
ElMessage.error(error);
|
||||
});
|
||||
};
|
||||
const deviceAttrCommonList = ref({
|
||||
input: {
|
||||
//数据长度类型
|
||||
datalentype: '00',
|
||||
//目标ID
|
||||
remote_id: '0',
|
||||
//本地ID
|
||||
local_id: '0',
|
||||
//指令码
|
||||
cmd: '0100',
|
||||
//设备类型
|
||||
devtype: '00',
|
||||
//数据类型
|
||||
datatype: '00'
|
||||
},
|
||||
output: {
|
||||
//数据长度类型
|
||||
datalentype: '00',
|
||||
//目标ID
|
||||
remote_id: '0',
|
||||
//本地ID
|
||||
local_id: '0',
|
||||
//指令码
|
||||
cmd: '0011',
|
||||
//设备类型
|
||||
devtype: '00',
|
||||
//数据类型
|
||||
datatype: '00'
|
||||
}
|
||||
});
|
||||
|
||||
const deviceAttrList = ref([
|
||||
{
|
||||
id: 1,
|
||||
name: '芯片ID',
|
||||
startValue: 0,
|
||||
lengthValue: 4,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'hex',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '设备序列号（SN）',
|
||||
startValue: 4,
|
||||
lengthValue: 8,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '产品主型号',
|
||||
startValue: 12,
|
||||
lengthValue: 4,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '产品次型号',
|
||||
startValue: 16,
|
||||
lengthValue: 4,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '产品密钥',
|
||||
startValue: 20,
|
||||
lengthValue: 8,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: '主板序列号',
|
||||
startValue: 28,
|
||||
lengthValue: 8,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: '69序列号',
|
||||
startValue: 36,
|
||||
lengthValue: 8,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'str',
|
||||
inputDisable: false
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: '通信版本号',
|
||||
startValue: 44,
|
||||
lengthValue: 1,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'firmware',
|
||||
inputDisable: true
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
name: '软件固件号',
|
||||
startValue: 45,
|
||||
lengthValue: 1,
|
||||
inputValue: '',
|
||||
inputLoadingStatus: false,
|
||||
outputValue: '',
|
||||
outputLoadingStatus: false,
|
||||
dataType: 'firmware',
|
||||
inputDisable: true
|
||||
}
|
||||
]);
|
||||
|
||||
//解码
|
||||
const analysisData = (hexData, data) => {
|
||||
if (hexData.length < 28) {
|
||||
console.log('返回hex小于28个字符串', hexData);
|
||||
return '';
|
||||
} else {
|
||||
// let head = hexData.substring(0,8);
|
||||
// let startAddr = hexData.substring(8,16);
|
||||
// let len = hexData.substring(16,24);
|
||||
let hexValue = hexData.substring(24, data.lengthValue * 4 * 2 + 24);
|
||||
// let crc = hexData.substring(hexData.length - 4);
|
||||
if (data.dataType === 'str') {
|
||||
let str = hexToString(hexValue).trim();
|
||||
return str;
|
||||
} else if (data.dataType === 'hex') {
|
||||
let str = rearrangeHexStr(hexValue);
|
||||
return str;
|
||||
}
|
||||
// else if(data.dataType === 'firmware'){
|
||||
// let str = hexToVersion(hexValue);
|
||||
// return str;
|
||||
// }
|
||||
else {
|
||||
return hexValue;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const sendDeviceAttr = (data, type, index) => {
|
||||
if (!serialportForm.port) {
|
||||
ElMessage.error('请先打开串口');
|
||||
return '';
|
||||
}
|
||||
console.log('readDeviceAttr', data);
|
||||
|
||||
let head = buildHead(
|
||||
deviceAttrCommonList.value[type].datalentype,
|
||||
deviceAttrCommonList.value[type].remote_id,
|
||||
deviceAttrCommonList.value[type].local_id,
|
||||
deviceAttrCommonList.value[type].cmd,
|
||||
deviceAttrCommonList.value[type].devtype,
|
||||
deviceAttrCommonList.value[type].datatype,
|
||||
data.startValue,
|
||||
data.lengthValue,
|
||||
data.inputValue,
|
||||
data
|
||||
);
|
||||
|
||||
if (type === 'input') {
|
||||
deviceAttrList.value[index].inputLoadingStatus = true;
|
||||
// head = head + 'd240';
|
||||
} else {
|
||||
deviceAttrList.value[index].outputLoadingStatus = true;
|
||||
}
|
||||
axios
|
||||
.post(
|
||||
config.serialPortUrl + '/serial/response',
|
||||
{
|
||||
port: serialportForm.port,
|
||||
data: head,
|
||||
hex: 1,
|
||||
crc: 1,
|
||||
flush: 1
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded'
|
||||
}
|
||||
}
|
||||
)
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
console.log('串口请求', response); // 打印响应数据
|
||||
if (response.data.code === 0) {
|
||||
ElMessage.success('操作成功');
|
||||
if (type === 'output') {
|
||||
deviceAttrList.value[index].outputValue = analysisData(response.data.data.hex || '', data);
|
||||
}
|
||||
} else {
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
if (type === 'input') {
|
||||
deviceAttrList.value[index].inputLoadingStatus = false;
|
||||
} else {
|
||||
deviceAttrList.value[index].outputLoadingStatus = false;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error);
|
||||
if (type === 'input') {
|
||||
deviceAttrList.value[index].inputLoadingStatus = false;
|
||||
} else {
|
||||
deviceAttrList.value[index].outputLoadingStatus = false;
|
||||
}
|
||||
// 错误处理
|
||||
if (error.response.data.message) {
|
||||
ElMessage.error(error.response.data.message);
|
||||
} else {
|
||||
ElMessage.error(error);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const allReadDeviceAttr = () => {
|
||||
if (!serialportForm.port) {
|
||||
ElMessage.error('请先打开串口');
|
||||
return '';
|
||||
}
|
||||
|
||||
let head = buildHead(
|
||||
deviceAttrCommonList.value['output'].datalentype,
|
||||
deviceAttrCommonList.value['output'].remote_id,
|
||||
deviceAttrCommonList.value['output'].local_id,
|
||||
deviceAttrCommonList.value['output'].cmd,
|
||||
deviceAttrCommonList.value['output'].devtype,
|
||||
deviceAttrCommonList.value['output'].datatype,
|
||||
0,
|
||||
46,
|
||||
''
|
||||
);
|
||||
|
||||
axios
|
||||
.post(
|
||||
config.serialPortUrl + '/serial/response',
|
||||
{
|
||||
port: serialportForm.port,
|
||||
data: head,
|
||||
hex: 1,
|
||||
crc: 1,
|
||||
flush: 1
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded'
|
||||
}
|
||||
}
|
||||
)
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
console.log('串口请求', response); // 打印响应数据
|
||||
if (response.data.code === 0) {
|
||||
ElMessage.success('操作成功');
|
||||
let hexValue = response.data.data.hex.substring(24, 392);
|
||||
let startValue = 0;
|
||||
deviceAttrList.value.forEach((item, index) => {
|
||||
if (startValue === 0) {
|
||||
startValue = item.startValue;
|
||||
}
|
||||
let value = hexValue.substring(startValue, item.lengthValue * 4 * 2 + startValue);
|
||||
startValue = startValue + item.lengthValue * 4 * 2;
|
||||
console.log('value', value);
|
||||
if (item.dataType === 'str') {
|
||||
deviceAttrList.value[index].outputValue = hexToString(value).trim();
|
||||
deviceAttrList.value[index].inputValue = hexToString(value).trim();
|
||||
} else if (item.dataType === 'hex') {
|
||||
deviceAttrList.value[index].outputValue = rearrangeHexStr(value);
|
||||
deviceAttrList.value[index].inputValue = rearrangeHexStr(value);
|
||||
} else {
|
||||
deviceAttrList.value[index].outputValue = value;
|
||||
deviceAttrList.value[index].inputValue = value;
|
||||
}
|
||||
});
|
||||
// deviceAttrList.value[index].outputValue = analysisData(response.data.data.hex || '', data);
|
||||
} else {
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error);
|
||||
// 错误处理
|
||||
if (error.response.data.message) {
|
||||
ElMessage.error(error.response.data.message);
|
||||
} else {
|
||||
ElMessage.error(error);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const allWriteDeviceAttr = () => {
|
||||
if (!serialportForm.port) {
|
||||
ElMessage.error('请先打开串口');
|
||||
return '';
|
||||
}
|
||||
deviceAttrList.value.forEach((item, index) => {
|
||||
setTimeout(() => {
|
||||
sendDeviceAttr(item, 'input', index);
|
||||
}, 50);
|
||||
});
|
||||
|
||||
// let head = buildHead(
|
||||
// deviceAttrCommonList.value['input'].datalentype,
|
||||
// deviceAttrCommonList.value['input'].remote_id,
|
||||
// deviceAttrCommonList.value['input'].local_id,
|
||||
// deviceAttrCommonList.value['input'].cmd,
|
||||
// deviceAttrCommonList.value['input'].devtype,
|
||||
// deviceAttrCommonList.value['input'].datatype,
|
||||
// 0,
|
||||
// 46,
|
||||
// ''
|
||||
// );
|
||||
//
|
||||
// axios
|
||||
// .post(
|
||||
// config.serialPortUrl + '/serial/response',
|
||||
// {
|
||||
// port: serialportForm.port,
|
||||
// data: head,
|
||||
// hex: 1,
|
||||
// crc: 1
|
||||
// },
|
||||
// {
|
||||
// headers: {
|
||||
// 'Content-Type': 'application/x-www-form-urlencoded'
|
||||
// }
|
||||
// }
|
||||
// )
|
||||
// .then(response => {
|
||||
// // 成功响应后的处理
|
||||
// console.log('串口请求', response); // 打印响应数据
|
||||
// if (response.data.code === 0) {
|
||||
// ElMessage.success('操作成功');
|
||||
// let hexValue = response.data.data.hex.substring(24, 392);
|
||||
// let startValue = 0;
|
||||
// deviceAttrList.value.forEach((item, index) => {
|
||||
// if(startValue === 0){
|
||||
// startValue = item.startValue;
|
||||
// }
|
||||
// let value = hexValue.substring(startValue, item.lengthValue * 4 * 2 + startValue);
|
||||
// startValue = startValue + item.lengthValue * 4 * 2;
|
||||
// console.log("value",value)
|
||||
// if (item.dataType === 'str') {
|
||||
// deviceAttrList.value[index].outputValue = hexToString(value).trim();
|
||||
// deviceAttrList.value[index].inputValue = hexToString(value).trim();
|
||||
// }else{
|
||||
// deviceAttrList.value[index].outputValue = value;
|
||||
// deviceAttrList.value[index].inputValue = value;
|
||||
// }
|
||||
// })
|
||||
// // deviceAttrList.value[index].outputValue = analysisData(response.data.data.hex || '', data);
|
||||
// } else {
|
||||
// ElMessage.error(response.data.message);
|
||||
// }
|
||||
// })
|
||||
// .catch(error => {
|
||||
// console.log('error', error);
|
||||
// // 错误处理
|
||||
// if (error.response.data.message) {
|
||||
// ElMessage.error(error.response.data.message);
|
||||
// } else {
|
||||
// ElMessage.error(error);
|
||||
// }
|
||||
// });
|
||||
};
|
||||
|
||||
const commonDebuggerFormRef = ref();
|
||||
|
||||
const sendCommonDebuggerState = ref(false);
|
||||
|
||||
const commonDebuggerForm = ref({
|
||||
localId: '',
|
||||
remoteId: '',
|
||||
devType: '00',
|
||||
dataType: '00',
|
||||
cmd: '0011',
|
||||
dataLenType: '00',
|
||||
writeStart: 0,
|
||||
writeLength: 0,
|
||||
writeData: '',
|
||||
dataStr: '',
|
||||
hexStr: ''
|
||||
});
|
||||
|
||||
const devTypeList = ref([
|
||||
{
|
||||
label: '配套通信工具',
|
||||
value: '00'
|
||||
},
|
||||
{
|
||||
label: '网关',
|
||||
value: '01'
|
||||
},
|
||||
{
|
||||
label: '设备',
|
||||
value: '10'
|
||||
},
|
||||
{
|
||||
label: '其他',
|
||||
value: '11'
|
||||
}
|
||||
]);
|
||||
|
||||
const dataTypeList = ref([
|
||||
{
|
||||
label: '紧急',
|
||||
value: '00'
|
||||
},
|
||||
{
|
||||
label: '应答',
|
||||
value: '01'
|
||||
},
|
||||
{
|
||||
label: '发送',
|
||||
value: '10'
|
||||
},
|
||||
{
|
||||
label: '广播',
|
||||
value: '11'
|
||||
}
|
||||
]);
|
||||
|
||||
const cmdList = ref([
|
||||
{
|
||||
label: '特殊指令',
|
||||
value: '0000'
|
||||
},
|
||||
{
|
||||
label: '事件指令',
|
||||
value: '0001'
|
||||
},
|
||||
{
|
||||
label: '连接指令',
|
||||
value: '0010'
|
||||
},
|
||||
{
|
||||
label: '地址读指令',
|
||||
value: '0011'
|
||||
},
|
||||
{
|
||||
label: '地址写指令',
|
||||
value: '0100'
|
||||
},
|
||||
{
|
||||
label: '文件读指令',
|
||||
value: '0101'
|
||||
},
|
||||
{
|
||||
label: '文件写指令',
|
||||
value: '0110'
|
||||
},
|
||||
{
|
||||
label: '文件控制指令',
|
||||
value: '0111'
|
||||
},
|
||||
{
|
||||
label: 'OTA升级指令',
|
||||
value: '1000'
|
||||
},
|
||||
{
|
||||
label: '控制台通道',
|
||||
value: '1001'
|
||||
}
|
||||
]);
|
||||
|
||||
const dataLenTypeList = ref([
|
||||
{
|
||||
label: '单帧数据',
|
||||
value: '00'
|
||||
},
|
||||
{
|
||||
label: '多帧数据起始帧',
|
||||
value: '01'
|
||||
},
|
||||
{
|
||||
label: '多帧数据中间帧',
|
||||
value: '10'
|
||||
},
|
||||
{
|
||||
label: '多帧数据结束帧',
|
||||
value: '11'
|
||||
}
|
||||
]);
|
||||
|
||||
const commonDebuggerRules = reactive({
|
||||
devType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
||||
dataType: [{ required: true, message: '请选择数据类型', trigger: 'change' }],
|
||||
cmd: [{ required: true, message: '请选择指令码', trigger: 'change' }],
|
||||
dataLenType: [{ required: true, message: '请选择数据长度类型', trigger: 'change' }],
|
||||
writeStart: [{ required: true, message: '请输入起始地址', trigger: 'blur' }],
|
||||
writeLength: [{ required: true, message: '请输入长度', trigger: 'blur' }]
|
||||
});
|
||||
|
||||
//打开
|
||||
const sendCommonDebugger = formEl => {
|
||||
if (!formEl) return;
|
||||
formEl.validate(valid => {
|
||||
if (valid) {
|
||||
if (!serialportForm.port) {
|
||||
ElMessage.error('请先打开串口');
|
||||
return '';
|
||||
}
|
||||
let head = buildHead(
|
||||
commonDebuggerForm.value.dataLenType,
|
||||
commonDebuggerForm.value.remoteId,
|
||||
commonDebuggerForm.value.localId,
|
||||
commonDebuggerForm.value.cmd,
|
||||
commonDebuggerForm.value.devType,
|
||||
commonDebuggerForm.value.dataType,
|
||||
commonDebuggerForm.value.writeStart,
|
||||
commonDebuggerForm.value.writeLength,
|
||||
commonDebuggerForm.value.writeData,
|
||||
commonDebuggerForm.value
|
||||
);
|
||||
sendCommonDebuggerState.value = true;
|
||||
axios
|
||||
.post(
|
||||
config.serialPortUrl + '/serial/response',
|
||||
{
|
||||
port: serialportForm.port,
|
||||
data: head,
|
||||
hex: 1,
|
||||
crc: 1,
|
||||
flush: 1
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded'
|
||||
}
|
||||
}
|
||||
)
|
||||
.then(response => {
|
||||
// 成功响应后的处理
|
||||
console.log('串口请求', response); // 打印响应数据
|
||||
sendCommonDebuggerState.value = false;
|
||||
if (response.data.code === 0) {
|
||||
ElMessage.success('请求成功');
|
||||
commonDebuggerForm.value.dataStr = head;
|
||||
commonDebuggerForm.value.hexStr = response.data.data.hex;
|
||||
} else {
|
||||
ElMessage.error(response.data.message);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
sendCommonDebuggerState.value = false;
|
||||
console.log('error', error);
|
||||
// 错误处理
|
||||
if (error.response.data.message) {
|
||||
ElMessage.error(error.response.data.message);
|
||||
} else {
|
||||
ElMessage.error(error);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
getSerialPortList(false);
|
||||
});
|
||||
|
||||
onUnmounted(() => {});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
/* 样式可以在这里定义 */
|
||||
#serialport-box {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
padding-bottom: 5px;
|
||||
.serialport-main {
|
||||
height: calc(100% - 60px);
|
||||
overflow-y: auto;
|
||||
border-radius: 10px;
|
||||
background: #f2f2f2;
|
||||
&.open-log {
|
||||
height: calc(50% - 42px);
|
||||
}
|
||||
}
|
||||
.device-attr-list {
|
||||
padding: 20px 10px;
|
||||
.device-attr-item {
|
||||
display: flex;
|
||||
.device-attr-item-name {
|
||||
width: 120px;
|
||||
}
|
||||
.device-attr-item-value {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 5px;
|
||||
.device-attr-input {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-form) {
|
||||
padding: 20px 20px 0;
|
||||
}
|
||||
|
||||
:deep(.el-tabs--border-card > .el-tabs__content) {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
:deep(.el-collapse-item__header) {
|
||||
//height: 42px;
|
||||
//line-height: 42px;
|
||||
}
|
||||
|
||||
:deep(.el-collapse-item__content) {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
:deep(.el-tabs__content) {
|
||||
background: #f2f2f2;
|
||||
}
|
||||
:deep(.el-tabs__item) {
|
||||
background: #e6e6e6;
|
||||
&.is-active {
|
||||
background: #f2f2f2;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.log-box-search .el-input__wrapper) {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
:deep(.log-box-search .el-select__wrapper) {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
:deep(.el-form-item__content) {
|
||||
justify-content: end;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue