|
<template>
|
<div style="width: 100%; height: 100%;">
|
<el-table border :data="tableData" style="width: 100%">
|
<el-table-column prop="deviceName" label="设备编号" />
|
<el-table-column prop="diviceHOST" label="ip" width="180" />
|
<el-table-column prop="decicePORT" label="端口" width="100" />
|
<el-table-column prop="connectState" label="连接状态" width="100" >
|
<template #default="scope">
|
<el-tag v-if="scope.row.connectState===0" type="info">未连接</el-tag>
|
<el-tag v-if="scope.row.connectState===1" type="success">已连接</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column fixed="right" label="操作" width="180">
|
<template #header>
|
<el-icon @click="centerDialogVisible=true" ><Setting/></el-icon>
|
<el-icon style="margin-left: 10px;" @click="ToolsClick" ><Tools/></el-icon>
|
</template>
|
<template #default="scope" >
|
<el-button link type="primary" :disabled="scope.row.connectState===1" size="small" @click="openClient(scope.row)">
|
启动初始化
|
</el-button>
|
<el-button link type="primary" :disabled="scope.row.connectState===0" size="small" @click="openClientMsg(scope.row)">
|
打开消息
|
</el-button>
|
<el-button link type="primary" size="small" @click="xioahuiClient(scope.row)">
|
销毁
|
</el-button>
|
</template>
|
</el-table-column>
|
<el-table-column label="接收的数据" show-overflow-tooltip >
|
<template #default="scope">
|
<div v-if="scope.row.connectState">
|
{{scope.row.msgBody}}
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="异常提醒" show-overflow-tooltip >
|
<template #default="scope">
|
{{scope.row.devicErrer}}
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-button @click="test">test</el-button>
|
<!-- 配置客户编号 -->
|
<el-dialog v-model="centerDialogVisible" title="配置客户编号" width="500" center>
|
<span style="text-align: center">
|
|
|
<br>
|
<el-input v-model="clientCode" style="width: 470px" placeholder="请输入客户编号" ></el-input>
|
</span>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="centerDialogVisible = false">取消</el-button>
|
<el-button type="primary" @click="saveConfig">
|
确认
|
</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
<!-- 打开socketc客户端实时通讯 -->
|
<el-dialog v-model="centerDialogVisible2" title="客户端=服务端实时通讯" width="800" center>
|
<span style="text-align: center">
|
|
<div style="width: 100%;">
|
<ul class="infinite-list" style="overflow: auto">
|
<li v-for="(i,index) in lsMsgList" :key="index" class="infinite-list-item">
|
<div :style="{textAlign:i.type?'left':'right'}" style="width: 100%;">{{ i.info }}</div>
|
</li>
|
</ul>
|
</div>
|
|
</span>
|
<template #footer>
|
<div class="dialog-footer">
|
<div class="mt-4">
|
<el-input
|
v-model="inputmsg"
|
type="text"
|
style="max-width: 800px"
|
placeholder="请输入你要发送的内容"
|
class="input-with-select"
|
>
|
<template #prepend>
|
<el-select v-model="select" placeholder="Select" @change="selChange" style="width: 150px">
|
<el-option label="自定义" value="0" />
|
<el-option label="TC治疗条件" value="1" />
|
<el-option label="CM评论数据" value="2" />
|
<el-option label="DT时间设定" value="3" />
|
</el-select>
|
</template>
|
<template #append>
|
<el-button @click="fasongMsg" :icon="Promotion" />
|
</template>
|
</el-input>
|
</div>
|
</div>
|
</template>
|
</el-dialog>
|
<ToolsCocket ref="ToolsCocketRef"></ToolsCocket>
|
|
|
</div>
|
</template>
|
<script setup lang="ts">
|
import { ref ,onMounted, computed} from "vue"
|
import {IDeviceCilent} from "./components/classType"
|
import { clicentStore } from './pinia/clicentStore'
|
import {firstIndexedDB} from './utils/storage'
|
import { Delete, Setting, Promotion, Tools, Upload } from '@element-plus/icons-vue'
|
import ToolsCocket from "./components/ToolsCocket.vue"
|
import axios from 'axios';
|
|
import './demos/ipc'
|
import { ElLoading, ElMessage, ElMessageBox } from "element-plus"
|
import { constants } from "original-fs"
|
import { getMsgDataStr, jianyan } from "./utils/data"
|
interface msgInfo{
|
date:string,
|
info:string,
|
id:number,
|
type:number //0 是客户端发送 ，1接收的信息
|
}
|
// const model:IDeviceCilent={
|
// diviceHOST: '127.0.0.1',
|
// decicePORT: 3031,
|
// connectState: 0,
|
// deviceNo:'',
|
// productKey:'a169jDrPoD2',
|
// deviceSecret: 'd9ad86e4884be6c3c820da8ff339fcf5',
|
// deviceName: "test001",
|
// iotState:0,
|
// state:0,
|
// msgBody: {
|
// 超滤目标: 0,
|
// 已超滤量: 0,
|
// 超滤速率: 0,
|
// 血泵流量设定: 0,
|
// 透析液流量: 0,
|
// 透析液温度: 0,
|
// 电导度: 0,
|
// 静脉压: 0,
|
// 透析液压: 0,
|
// 跨膜压: 0,
|
// 透析时间: 0,
|
// 肝素泵流量: 0,
|
// 累计注射量: 0,
|
// 报警编号: 0,
|
// 剩余时间: 0,
|
// 血流量: 0,
|
// 动脉压: 0,
|
// 收缩压: 0,
|
// 舒张压: 0,
|
// 脉搏: 0
|
// },
|
|
// }
|
|
// ref('CLIENT1139495185846')
|
const centerDialogVisible=ref(false)
|
const centerDialogVisible2=ref(false)
|
const ToolsCocketRef=ref()
|
const clientCode= ref('')
|
const count = ref(0)
|
const inputmsg=ref('') // 发送的数据
|
const select=ref('0') // 选择发送类型
|
const selRow=ref()
|
const lsMsgList =ref(<msgInfo[]>[])
|
const test=()=>{
|
const dd=jianyan('S4016PAT123456789DT0020240806091105')
|
|
alert(dd)
|
}
|
const selChange=(val:any)=>{
|
if(val==='0'){
|
inputmsg.value=''
|
}else if(val==='1'){
|
// DATAID: "01",
|
const infoData= getMsgDataStr({
|
STX: "S4",
|
LEN: "",
|
ID: "999991 ",
|
CN: "TC",
|
DATAID: "",
|
DATA: {
|
data患者ID :'B1999991 ',
|
data患者名 : 'B2王小二 ',// B2 20接受治疗的患者的姓名、汉字。
|
data治疗方案 : 'B30',// 0：HD，1：ECUM，2：HDF，3：HF，4：OHDF（オンライン HDF），5：I‒HDF，6：O/I‒HDF（オンライン I‒HDF），7：予備（未使用）
|
data补充液的选择 : 'D10',//0: 预补充（稀释前）1: 后补充（稀释后）
|
data体重 : 'D2100.00', //0-300.00 6字节 治疗前测量的体重值
|
data干体重 : 'D3098.00', // 0-300.00 6字节 治疗前测量的体重值
|
data透析时间 : 'C1240', // 0-599 3 分钟
|
data脱水时间 : 'C2240', // 0-599 3 分钟
|
data目标脱水 : 'C32.40', // 4字节 2.40 L
|
data脱水率 : 'C40.60', // 4字节 0.60L/h
|
data补液时间 : 'C5060', // 3字节 4分钟
|
data补液量 : 'C604.0', // 4字节 0-99.9 4L
|
data补液率 : 'C704.0', //4字节 4/(60/60) =4L/h 该项目是采用目标补液量和补液时间，还是根据目标补液量和补液时间计算得出，取决于设备。
|
data注射泵一次量 : 'D420.0', // 4 0-20.0 毫升/
|
data注射泵速度 : 'C810.0', // 0-10.0毫升/小时
|
data注射泵自动停止时间 : 'D5120', //0-120 3 分钟 治疗结束前 xx 分钟停止治疗的时间。
|
data血流量 : 'D6300', //D6 0-600 3 毫升/分钟
|
data透析液温度 : 'C936.6', //33.0-40.0 4 ℃
|
data补给温度 : 'CA33.6', //33.0-40.0 4 ℃
|
data透析液流量 : 'D71000', //0-1000 4 毫升/分钟 对于在线 HDF，该值应包括置换液的体积。
|
dataHDF补液时间 : 'D8100', //0-1000 毫升/分钟 对于在线 HDF，该值应包括置换液的体积。
|
dataHDF每次剂量的液体量 : 'D9300', //D9. 0-300 3 毫升 I-HDF 每次剂量的补充液体量
|
dataHDF补液间隔 : 'DA120', //DA 0-120 3 分钟 I-HDF 补充剂的间隔时间。
|
dataHDF补充率 : 'DB300', //DB 0-300 3 毫升/分钟 I-HDF 的补液率。
|
data收缩压上限 : 'DC300', //DC 0,1-300 3 毫米汞柱 收缩压上限警戒点。0 不受监控
|
data收缩压下限 : 'DD300', //DD 0,1-300 3 毫米汞柱 降低收缩压警示点0 不受监控
|
data舒张压上限 : 'DE300', //DE 0,1～300 3 mmHg
|
data舒张压下限 : 'DF300', // DF 0,1～300 3 mmHg
|
data脉冲上限 : 'DG200', // DG 0,1～200 3 bpm
|
data脉搏下限 : 'DH200', // DH 0,1～200 3 bpm
|
data血压自动测量间隔 : 'DI180' // DI 0,1～180 3 min
|
},
|
SUM: "",
|
ETX: "/r/n"
|
})
|
console.log("/r/n")
|
inputmsg.value=infoData
|
}else if(val==='2'){
|
// DATAID: "01",
|
const infoData= getMsgDataStr({
|
STX: "S4",
|
LEN: "",
|
ID: "PAT123456789",
|
CN: "CM",
|
DATAID: "",
|
DATA: {
|
data患者名字 :'DA王二小 ',
|
data评论:'DBtest'.padStart(500,'0')
|
|
},
|
SUM: "",
|
ETX: "/r/n"
|
})
|
inputmsg.value=infoData
|
}else if(val==='3'){
|
// DATAID: "03",
|
const infoData= getMsgDataStr({
|
STX: "S4",
|
LEN: "",
|
ID: "PAT123456789",
|
CN: "DT",
|
DATAID: "",
|
DATA: {
|
data日期设定:'0020240806091105'
|
},
|
SUM: "",
|
ETX: "/r/n"
|
})
|
inputmsg.value=infoData
|
}
|
}
|
/**获取缓存里的设备列表 */
|
const tableData=computed(()=>{
|
return clicentStore().clientSockerList
|
})
|
/**把设备列表缓存到vuex里 */
|
const getDevices=()=>{
|
const loading = ElLoading.service({
|
lock: true,
|
text: 'Loading',
|
background: 'rgba(0, 0, 0, 0.7)',
|
})
|
axios.post(`https://things.icoldchain.cn/device/info/listDevicesByClient?clientCode=${clientCode.value}`).then(re=>{
|
console.log(re.data.data.设备列表)
|
const dievices=re.data.data.设备列表
|
//"{\"isEnabled\":\"0\",\"ip\":\"\",\"port\":\"\",\"work_mode\":\"client\",\"interval\":\"5\"}"
|
let tableDatas=<any>[]
|
dievices.forEach((element:any) => {
|
const de=JSON.parse(element.IP设置)
|
if(de.isEnabled==='1'){
|
tableDatas.push({
|
diviceHOST: de.ip,
|
decicePORT: de.port,
|
connectState: 0,
|
deviceNo:'',
|
devicErrer:'',
|
productKey:element.阿里云物联网平台ProductKey,
|
deviceSecret: element.阿里云物联网平台Secrect,
|
deviceName: element.阿里云物联网平台DeviceName,
|
iotState:0,
|
state:0,
|
msgBody:{}
|
})
|
}
|
|
});
|
clicentStore().setClientSockerList(tableDatas)
|
}).catch((err)=>{
|
|
}).finally(()=>{
|
loading.close()
|
})
|
// clicentStore().setClientSockerList([model,model2])
|
}
|
/**初始化设备socket连接 */
|
const openClient=(row:IDeviceCilent)=>{
|
if(row.connectState){
|
ElMessage.warning('已经打开初始化了')
|
}else{
|
clicentStore().updateClientState2(row.diviceHOST,row.decicePORT, 1)
|
window.ipcRenderer.send('openClient', [row.diviceHOST,row.decicePORT,row.productKey,row.deviceName,row.deviceSecret])
|
}
|
|
}
|
const openClientMsg=(row:IDeviceCilent)=>{
|
if(row.connectState){
|
selRow.value=row
|
centerDialogVisible2.value=true
|
|
}
|
}
|
const fasongMsg=()=>{
|
//要发送的数据
|
let msgData=inputmsg.value
|
const row=selRow.value
|
console.log(row)
|
if(select.value==='0'&&inputmsg.value!==''){
|
msgData+='\r\n'
|
window.ipcRenderer.send('openClientMsg', [row.diviceHOST,row.decicePORT,row.productKey,row.deviceName,row.deviceSecret,msgData])
|
lsMsgList.value.push({id:1,date:new Date().toString(),info:msgData,type:0})
|
}else{
|
window.ipcRenderer.send('openClientMsg', [row.diviceHOST,row.decicePORT,row.productKey,row.deviceName,row.deviceSecret,msgData])
|
lsMsgList.value.push({id:1,date:new Date().toString(),info:msgData,type:0})
|
}
|
|
}
|
/**
|
* 销毁连接
|
*/
|
const xioahuiClient=(row:IDeviceCilent)=>{
|
window.ipcRenderer.send('closeClient', [row.diviceHOST,row.decicePORT])
|
}
|
/**返回服务端消息 */
|
window.ipcRenderer.on('result-data2', (_event, ...args) => {
|
console.log('-----------------111--------------')
|
console.log(args)
|
const textDecoder = new TextDecoder();
|
const str = textDecoder.decode(args[0].data);
|
console.log(str)
|
lsMsgList.value.push({id:1,date:new Date().toString(),info:str,type:1})
|
})
|
/**关闭设备socket连接 */
|
const closeClient=(row:IDeviceCilent)=>{
|
if(row.connectState){
|
window.ipcRenderer.send('closeClient', [row.diviceHOST,row.decicePORT])
|
}else{
|
ElMessage.warning('已经是关闭状态了！')
|
}
|
|
}
|
/**
|
* 发送socket 消息给服务端
|
*/
|
const sundMsg=()=>{
|
|
}
|
/**
|
* 打开socket调试工具
|
*/
|
const ToolsClick=()=>{
|
ToolsCocketRef.value.openShow()
|
}
|
/**
|
* 初始化函数
|
*/
|
onMounted(()=>{
|
ToolsClick()
|
// 先测试调试 其他的先不管
|
// firstIndexedDB.getItem('clientCode').then((value:any)=>{
|
// console.log(value)
|
// if(value===null||value===''){
|
// centerDialogVisible.value=true
|
// console.log('没有缓存到客户编号')
|
// }else{
|
// clientCode.value=value
|
// getDevices()
|
// }
|
// // 赋值给页面
|
|
// }).catch(()=>{
|
// console.log('本地缓存取错了')
|
// })
|
|
})
|
/**
|
* 保存客户编号
|
*/
|
const saveConfig=()=>{
|
firstIndexedDB.setItem('clientCode',clientCode.value)
|
ElMessageBox.alert('客户编号保存成功，请点击确认重新启动程序', '提示', {
|
confirmButtonText: 'OK',
|
callback: () => {
|
window.ipcRenderer.send('reload')
|
console.log('重启')
|
},
|
})
|
}
|
</script>
|
|
<style>
|
.infinite-list {
|
height: 300px;
|
padding: 0;
|
margin: 0;
|
list-style: none;
|
}
|
.infinite-list .infinite-list-item {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
height: 50px;
|
/* background: var(--el-color-primary-light-9); */
|
margin: 10px;
|
color: var(--el-color-primary);
|
}
|
.infinite-list .infinite-list-item + .list-item {
|
margin-top: 10px;
|
|
}
|
</style>
|
