120 lines
3.0 KiB
Vue
120 lines
3.0 KiB
Vue
<template>
|
|
<v-container>
|
|
<v-card>
|
|
<v-card-title>
|
|
协议测试
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-row justify="start">
|
|
<v-col cols="6">
|
|
<v-text-field v-model="ws_url"
|
|
label="服务端连接地址"
|
|
variant="outlined"
|
|
clearable
|
|
:error="error"
|
|
:error-messages="error_message"
|
|
:disabled="isconnect || connecting"
|
|
clear-icon="mdi-cancel"></v-text-field>
|
|
</v-col>
|
|
<v-col cols="3">
|
|
<v-btn flat
|
|
:loading="connecting"
|
|
@click="isconnect ? disconnect():connect()"
|
|
color="secondary">
|
|
{{isconnect ? '断开':'连接'}}
|
|
</v-btn>
|
|
</v-col>
|
|
</v-row>
|
|
<v-divider inset></v-divider>
|
|
<v-row class="mt-5">
|
|
<v-col cols="4">
|
|
<v-select :items="proto_models"
|
|
label="选择测试模块"></v-select>
|
|
</v-col>
|
|
<v-col cols="4">
|
|
<v-select :items="proto_models"
|
|
label="选择子协议"></v-select>
|
|
</v-col>
|
|
</v-row>
|
|
</v-card-text>
|
|
</v-card>
|
|
<v-snackbar v-model="error">
|
|
{{ error_message }}
|
|
<template v-slot:actions>
|
|
<v-btn color="pink"
|
|
variant="text"
|
|
@click="error = false">
|
|
Close
|
|
</v-btn>
|
|
</template>
|
|
</v-snackbar>
|
|
</v-container>
|
|
</template>
|
|
|
|
<script>
|
|
import { reactive } from 'vue'
|
|
import proto from '@/pb/proto'
|
|
import { socket } from '@/utils/socket'
|
|
import { defineComponent } from 'vue'
|
|
|
|
export default defineComponent({
|
|
name: 'Protocol',
|
|
components: {},
|
|
data() {
|
|
return {
|
|
ws_url: 'ws://localhost:7891/gateway',
|
|
isconnect: false,
|
|
connecting: false,
|
|
error: false,
|
|
error_message: '',
|
|
protodata: {},
|
|
proto_models: [],
|
|
}
|
|
},
|
|
setup() {
|
|
const protodata = reactive([])
|
|
const proto_models = reactive([])
|
|
for (const v of Object.keys(proto)) {
|
|
let arr = v.split('_')
|
|
if (arr.length == 3) {
|
|
console.log(v)
|
|
var value = proto[v]
|
|
protodata[arr[0]] = value
|
|
console.log(value)
|
|
proto_models.push(arr[0])
|
|
}
|
|
}
|
|
return { protodata, proto_models }
|
|
},
|
|
onBeforeUnmount() {
|
|
// 关闭连接
|
|
socket.close()
|
|
},
|
|
methods: {
|
|
connect() {
|
|
// 发起连接
|
|
this.connecting = true
|
|
socket
|
|
.init(this.ws_url)
|
|
.then((value) => {
|
|
this.error = false
|
|
this.error_message = ''
|
|
this.isconnect = true
|
|
this.connecting = false
|
|
})
|
|
.catch((error) => {
|
|
this.error = true
|
|
this.error_message = error
|
|
this.isconnect = false
|
|
this.connecting = false
|
|
})
|
|
},
|
|
disconnect() {
|
|
socket.close()
|
|
this.isconnect = false
|
|
},
|
|
loginreq() {},
|
|
},
|
|
})
|
|
</script>
|