From f36337a2fb5442241cca477f6b994948dd4d123f Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期日, 08 十月 2023 18:49:45 +0800 Subject: [PATCH] 添加debuggtool --- src/pages/desktop/index/components/ToolsEntry.vue | 2 src/pages/index/App.vue | 2 src/pages/debuggTool/index/event.ts | 12 +++ src/pages/debuggTool/index/App.vue | 190 +++++++++++++++++++++++++++++++++++++++++++++++ src/pages/debuggTool/index/main.ts | 13 +++ 5 files changed, 217 insertions(+), 2 deletions(-) diff --git a/src/pages/debuggTool/index/App.vue b/src/pages/debuggTool/index/App.vue new file mode 100644 index 0000000..47fc84c --- /dev/null +++ b/src/pages/debuggTool/index/App.vue @@ -0,0 +1,190 @@ +<template> + <div class="container"> + <div class="device-form"> + <el-form :inline="true" :model="deviceForm" class="demo-form-inline"> + <el-form-item label="PLC鍝佺墝"> + <el-select v-model="deviceForm.brand" placeholder="鍝佺墝鍘傚晢" size="mini"> + <el-option label="鍏ㄩ儴" value="all"></el-option> + <el-option label="涓夎彵" value="mitsubishi"></el-option> + <el-option label="瑗块棬瀛�" value="siemens"></el-option> + <el-option label="娆у榫�" value="omron"></el-option> + <el-option label="姹囧窛" value="inovance"></el-option> + </el-select> + </el-form-item> + <el-form-item label="鎺ュ彛绫诲瀷"> + <el-select v-model="deviceForm.type" placeholder="鎺ュ彛绫诲瀷" size="mini"> + <el-option label="modbus" value="modbusTCP"></el-option> + <el-option label="涓插彛" value="serial"></el-option> + </el-select> + </el-form-item> + <el-form-item label="閫氳鍦板潃"> + <el-input v-model="deviceForm.ipaddr" placeholder="璁惧ip鍦板潃" size="mini"></el-input> + </el-form-item> + <el-form-item label="绔彛"> + <el-input v-model="deviceForm.port" placeholder="modbus绔彛" size="mini"></el-input> + </el-form-item> + <el-form-item label="鏁版嵁鍦板潃"> + <el-input v-model.number="deviceForm.startAddr" placeholder="璧峰鍦板潃" size="mini"></el-input> + </el-form-item> + <el-form-item label="-"> + <el-input v-model.number="deviceForm.endAddr" placeholder="鐩爣鍦板潃" size="mini"></el-input> + </el-form-item> + <el-form-item label=""> + <el-checkbox v-model="enableLoop">鍚敤瀹氭椂璇诲彇</el-checkbox> + </el-form-item> + <el-form-item label=""> + <el-input + v-model.number="deviceForm.interval" + placeholder="鐩爣鍦板潃" + size="mini" + style="width:50px" + ></el-input> + <span style="margin-left:5px">绉�/娆�</span> + </el-form-item> + </el-form> + + <el-button type="primary" size="mini" @click="connectPlc">杩炴帴</el-button> + <el-button type="danger" size="mini" @click="disconnectPlc">鏂紑</el-button> + <el-button type="success" size="mini" @click="readData">寮�濮嬭鍙�</el-button> + <el-button type="warning" size="mini" @click="disconnectPlc">缁撴潫璇诲彇</el-button> + <el-button type="info" size="mini" @click="disconnectPlc">娓呯┖鏁版嵁</el-button> + </div> + + <div class="data-filter"></div> + <div class="data-list"></div> + </div> +</template> + +<script> +import Event from "./event" +export default { + name: "plcDebuggTool", + computed: {}, + data() { + return { + //wsServer: `ws://${location.host}/ws/connect`, + wsServer: `ws://${location.host}/ws/connect`, + // wsServer: `/ws/connect`, + wsClient: null, + wsConnected: false, + loading: false, // 鍔犺浇 + deviceForm: { + brand: "all", + type: "modbusTCP", + ipaddr: "", + port: "502", + dataType: "int", + startAddr: "", + endAddr: "", + interval: 0 + }, + enableLoop: false + } + }, + created() {}, + mounted() { + this.connectWs() + console.log("websocketCheckConn") + this.websocketCheckConn() + }, + beforeDestroy() { + if (this.wsClient) { + this.wsClient.close() + } + }, + methods: { + connectPlc() { + if (this.deviceForm.type == "modbusTCP" && this.deviceForm.ipaddr == "") { + this.$message.warning("璇疯緭鍏ヨ澶噄p鍦板潃") + return + } + let msg = { + msgType: Event.CONNECT_DEVICE, + data: this.deviceForm + } + + this.websocketSendMsg(msg) + }, + disconnectPlc() { + let msg = { + msgType: Event.DISCONNECT_DEVICE, + data: "" + } + this.websocketSendMsg(msg) + }, + readData() { + let msg = { + msgType: Event.START_READ, + data: { + startAddr: this.deviceForm.startAddr, + endAddr: this.deviceForm.endAddr, + interval: 0 + } + } + + this.websocketSendMsg(msg) + }, + connectWs() { + this.wsClient == null + this.initWebsocket() + }, + initWebsocket() { + if (typeof WebSocket === "undefined") { + alert("鎮ㄧ殑娴忚鍣ㄤ笉鏀寔socket") + } else { + // 瀹炰緥鍖杝ocket + this.wsClient = new WebSocket(this.wsServer) + + // 鐩戝惉socket娑堟伅 + this.wsClient.onerror = this.websocketOnError + this.wsClient.onopen = this.websocketOnOpen + this.wsClient.onmessage = this.websocketOnMessage + this.wsClient.onclose = this.websocketOnClose + } + }, + websocketOnClose() { + this.wsConnected = false + this.initWebsocket() + }, + websocketOnError(e) { + this.$message.warning("鏈嶅姟绔繛鎺ュけ璐�") + + this.wsConnected = false + }, + websocketOnOpen() { + this.wsConnected = true + console.log("ws open") + }, + websocketOnMessage(e) { + console.log(e) + // let data = JSON.parse(e.data) + }, + websocketSendMsg(msg) { + if (this.wsClient && this.wsClient.readyState == 1) { + this.wsClient.send(JSON.stringify(msg)) + } else { + this.$message("璇锋眰鏁版嵁澶辫触, 鏈嶅姟绔湭杩炴帴") + } + }, + websocketCheckConn() { + setInterval(() => { + if (this.wsClient == null || this.wsClient.readyState != 1) { + this.initWebsocket() + } + }, 5000) + } + } +} +</script> + +<style lang="scss"> +.container { + height: 100%; + display: flex; + flex-direction: row; + flex: 1; + flex-basis: auto; + box-sizing: border-box; + background-color: #fff; +} +</style> diff --git a/src/pages/debuggTool/index/event.ts b/src/pages/debuggTool/index/event.ts new file mode 100644 index 0000000..24517c2 --- /dev/null +++ b/src/pages/debuggTool/index/event.ts @@ -0,0 +1,12 @@ +/* eslint-disable */ + +module.exports = { + CONNECT_DEVICE: "connect_plc_device", // 杩炴帴璁惧 + DISCONNECT_DEVICE: "disconnect_plc_device", // 鏂紑杩炴帴 + CONNECTION_STAT_DEVICE: "connection_stat_device", // 璁惧杩炴帴鐘舵�� + START_READ: "start_read", // 寮�鍚畾鏃惰鍙� + STOP_READ: "stop_read", // 寮�鍚畾鏃惰鍙� + ENABLE_LOOP_READ: "enable_loop_read", // 寮�鍚畾鏃惰鍙� + STOP_LOOP_READ: "stop_loop_read", // 寮�鍚畾鏃惰鍙� + SET_INTERVAL: "set_interval" +} diff --git a/src/pages/debuggTool/index/main.ts b/src/pages/debuggTool/index/main.ts new file mode 100644 index 0000000..03148ee --- /dev/null +++ b/src/pages/debuggTool/index/main.ts @@ -0,0 +1,13 @@ +import Vue from 'vue'; +import App from './App.vue'; + +import ElementUI from 'element-ui'; +import 'element-ui/lib/theme-chalk/index.css'; +// import "@/assets/css/element-variables.scss"; + +Vue.use(ElementUI) + +new Vue({ + el: '#app', + render: h => h(App) +}) diff --git a/src/pages/desktop/index/components/ToolsEntry.vue b/src/pages/desktop/index/components/ToolsEntry.vue index 34a4eae..5076ecf 100644 --- a/src/pages/desktop/index/components/ToolsEntry.vue +++ b/src/pages/desktop/index/components/ToolsEntry.vue @@ -185,7 +185,7 @@ if (dock.type === "1") { window.open(dock.url) } else if (dock.type === "2" && !dock.isOpen) { - if ((dock.url).indexOf('/view/debuggTool')>=0||(dock.url).indexOf('/view/knowledge')>=0) { + if (dock.url.indexOf("/view/knowledge") >= 0) { return true } this.$store.dispatch("desktop/addFrame", { diff --git a/src/pages/index/App.vue b/src/pages/index/App.vue index 9a4d3bc..6b982cf 100644 --- a/src/pages/index/App.vue +++ b/src/pages/index/App.vue @@ -43,7 +43,7 @@ import { getMenuListData } from "@/api/utils" export default { - name: "smartai init", + name: "smartaiInit", components: { formAccount, formNet, -- Gitblit v1.8.0