From e0f9517f4b60d253b46abb20feb15d23ebaf32bc Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Wed, 22 Mar 2023 16:31:34 +0800
Subject: [PATCH] 添加断开连接的按钮
---
src/views/funcController.vue | 26 ++++++++++++++++++++++----
src/views/funcView.vue | 20 +++++++++++++++++++-
2 files changed, 41 insertions(+), 5 deletions(-)
diff --git a/src/views/funcController.vue b/src/views/funcController.vue
index e3b483b..62569ab 100644
--- a/src/views/funcController.vue
+++ b/src/views/funcController.vue
@@ -1,6 +1,11 @@
<template>
<div>
- <avue-form ref="form" v-model="form" :option="option" @submit="connect"></avue-form>
+ <avue-form ref="form" v-model="form" :option="option" @submit="connect">
+ <template slot-scope="{size}" slot="menuForm">
+ <el-button v-if="!socketIoClient" type="primary" :size="size" @click="$refs.form.submit()">连 接</el-button>
+ <el-button v-if="socketIoClient" type="danger" :size="size" @click="disconnect">断 开</el-button>
+ </template>
+ </avue-form>
<div class="menu-btn-group">
<el-button size="small" v-for="data in menuList" :index="data.id" :key="data.id" @click="menuChange(data)">
{{ data.name }}
@@ -47,6 +52,7 @@
option:{
emptyBtn:false,
submitText: "连接",
+ submitBtn:false,
menuSpan: 1,
column:[
{
@@ -81,6 +87,7 @@
},
menuList:[],
currentClick:{},
+ socketIoClient:null,
}
},
mounted() {
@@ -102,9 +109,6 @@
},
//连接
connect(form,done){
- // if (this.socketIoClient !=null ){
- // this.socketIoClient.disconnect()
- // }
let serveUri = 'http://192.168.0.200:10246'
let params = {
current :form.controllerEquipmentCode
@@ -127,6 +131,7 @@
getAll(params).then(res=>{
if (res.data.code == 200){
this.menuList = res.data.data
+ this.$notify.success({title:"连接成功"})
}
})
}
@@ -138,6 +143,19 @@
});
});
},
+ disconnect() {
+ console.log(this.socketIoClient)
+ if (this.socketIoClient != null){
+ this.socketIoClient.disconnect()
+ this.menuList = []
+ if (this.socketIoClient.disconnected){
+ this.socketIoClient = null
+ this.$notify.success({title:"断开成功"})
+ }else {
+ this.$notify.error({title:"断开失败"})
+ }
+ }
+ },
}
}
</script>
diff --git a/src/views/funcView.vue b/src/views/funcView.vue
index 04749d1..5d322f2 100644
--- a/src/views/funcView.vue
+++ b/src/views/funcView.vue
@@ -3,9 +3,13 @@
<el-row>
<el-col :span="4">
<div class="search">
- <avue-form :option="option" v-model="form" @submit="connect">
+ <avue-form ref="form" :option="option" v-model="form" @submit="connect">
<template slot-scope="{}" slot="equipmentCodeLabel">
<span></span>
+ </template>
+ <template slot-scope="{size}" slot="menuForm">
+ <el-button v-if="!socketIoClient" type="primary" :size="size" @click="$refs.form.submit()">连 接</el-button>
+ <el-button v-if="socketIoClient" type="danger" :size="size" @click="disconnect">断 开</el-button>
</template>
</avue-form>
</div>
@@ -119,6 +123,7 @@
menuSpan: 6,
emptyBtn: false,
submitText: '连接',
+ submitBtn:false,
column: [
{
label: "显示设备",
@@ -249,6 +254,19 @@
});
},
+ disconnect() {
+ console.log(this.socketIoClient)
+ if (this.socketIoClient != null){
+ this.socketIoClient.disconnect()
+ this.menuList = []
+ if (this.socketIoClient.disconnected){
+ this.socketIoClient = null
+ this.$notify.success({title:"断开成功"})
+ }else {
+ this.$notify.error({title:"断开失败"})
+ }
+ }
+ },
left() {
this.$refs.flipbook.flipLeft()
},
--
Gitblit v1.9.3