|
|
@@ -22,12 +22,14 @@
|
|
|
<el-form label-width="80px">
|
|
|
<el-form-item label="自动接听:">
|
|
|
<el-switch v-model="baseSet.autoAnswer" active-color="#13ce66" inactive-color="#ff4949"
|
|
|
- active-text="开" inactive-text="关">
|
|
|
+ active-text="开" inactive-text="关" :active-value="1" :inactive-value="0"
|
|
|
+ @change="setAutoAnswer">
|
|
|
</el-switch>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="连续定位:">
|
|
|
<el-switch v-model="baseSet.highFreq" active-color="#13ce66" inactive-color="#ff4949"
|
|
|
- active-text="开" inactive-text="关">
|
|
|
+ active-text="开" inactive-text="关" :active-value="1" :inactive-value="0"
|
|
|
+ @change="setContinue">
|
|
|
</el-switch>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="定位频率:">
|
|
|
@@ -104,7 +106,12 @@
|
|
|
|
|
|
<div class="right">
|
|
|
<div class="zy-main-title">控制台日志</div>
|
|
|
- <div class="right__console"></div>
|
|
|
+ <div class="right__console">
|
|
|
+ <div v-for="log in logs" class="right__console__message">
|
|
|
+ <p>{{log.time}}</p>
|
|
|
+ <p>{{log.message}}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -127,12 +134,13 @@
|
|
|
7: '7',
|
|
|
},
|
|
|
submitFlag: false, //阻止重复提交表单
|
|
|
+ logs: [], //mqtt接收日志
|
|
|
};
|
|
|
},
|
|
|
mounted: function() {
|
|
|
- this.initWebSocket("469d1ff28acd4694a79138fa335756a7");
|
|
|
- this.getDeviceDetail("469d1ff28acd4694a79138fa335756a7");
|
|
|
- this.getDeviceBaseSet("469d1ff28acd4694a79138fa335756a7");
|
|
|
+ this.initWebSocket("76f7c742428b4720b363d95d8292b357");
|
|
|
+ this.getDeviceDetail("76f7c742428b4720b363d95d8292b357");
|
|
|
+ this.getDeviceBaseSet("76f7c742428b4720b363d95d8292b357");
|
|
|
},
|
|
|
methods: {
|
|
|
|
|
|
@@ -182,10 +190,10 @@
|
|
|
/**
|
|
|
* 自动接听
|
|
|
*/
|
|
|
- setAutoAnswer: function() {
|
|
|
+ setAutoAnswer: function(tag) {
|
|
|
const param = {
|
|
|
deviceId: this.device.clientId,
|
|
|
- autoAnswer: this.baseSet.autoAnswer
|
|
|
+ autoAnswer: tag
|
|
|
}
|
|
|
this.postGeneral(this.Global.setAutoAnswer, param);
|
|
|
},
|
|
|
@@ -196,7 +204,7 @@
|
|
|
setGpsRate: function() {
|
|
|
const param = {
|
|
|
deviceId: this.device.clientId,
|
|
|
- gpsRate: this.baseSet.gpsRate
|
|
|
+ gpsRate: this.device.gpsRate
|
|
|
}
|
|
|
this.postGeneral(this.Global.setGpsRate, param);
|
|
|
},
|
|
|
@@ -204,10 +212,10 @@
|
|
|
/**
|
|
|
* 连续定位
|
|
|
*/
|
|
|
- setContinue: function() {
|
|
|
+ setContinue: function(tag) {
|
|
|
const param = {
|
|
|
deviceId: this.device.clientId,
|
|
|
- highFreq: this.baseSet.highFreq
|
|
|
+ highFreq: tag
|
|
|
}
|
|
|
this.postGeneral(this.Global.setContinue, param);
|
|
|
},
|
|
|
@@ -265,15 +273,37 @@
|
|
|
* 初始化WebSocket连接
|
|
|
*/
|
|
|
initWebSocket: function(clientId) {
|
|
|
+ const that = this;
|
|
|
const socket = new WebSocket(this.Global.webSocket + clientId);
|
|
|
socket.onmessage = function(evt) {
|
|
|
- const msg = evt.data;
|
|
|
- console.log(msg);
|
|
|
- };
|
|
|
+ const jsonObj = JSON.parse(evt.data);
|
|
|
+ const message = {
|
|
|
+ m: jsonObj.m,
|
|
|
+ r: jsonObj.r,
|
|
|
+ t: jsonObj.t,
|
|
|
+ data: jsonObj.data
|
|
|
+ }
|
|
|
+ const object = {
|
|
|
+ time: that.formatDate(new Date()),
|
|
|
+ message: JSON.stringify(message, null, 4)
|
|
|
+ }
|
|
|
+ that.logs.push(object);
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
- }
|
|
|
- };
|
|
|
+ formatDate: function(date) {
|
|
|
+ const d = new Date(date)
|
|
|
+ const y = d.getFullYear() // 年份
|
|
|
+ const m = (d.getMonth() + 1).toString().padStart(2, '0') // 月份
|
|
|
+ const r = d.getDate().toString().padStart(2, '0') // 日子
|
|
|
+ const hh = d.getHours().toString().padStart(2, '0') // 小时
|
|
|
+ const mm = d.getMinutes().toString().padStart(2, '0') // 分钟
|
|
|
+ const ss = d.getSeconds().toString().padStart(2, '0') // 秒
|
|
|
+ return `${y}-${m}-${r} ${hh}:${mm}:${ss}` // es6 字符串模板
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@@ -282,7 +312,7 @@
|
|
|
height: 100%;
|
|
|
|
|
|
.left {
|
|
|
- width: 61%;
|
|
|
+ width: 49%;
|
|
|
float: left;
|
|
|
height: 100%;
|
|
|
overflow-y: scroll;
|
|
|
@@ -328,15 +358,48 @@
|
|
|
}
|
|
|
|
|
|
.right {
|
|
|
- width: 38%;
|
|
|
+ width: 49%;
|
|
|
float: right;
|
|
|
height: 100%;
|
|
|
|
|
|
&__console {
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px;
|
|
|
+ overflow-x: hidden;
|
|
|
+ overflow-y: scroll;
|
|
|
+ word-wrap: break-word;
|
|
|
background-color: white;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
border-radius: 5px;
|
|
|
+
|
|
|
+ &__message {
|
|
|
+ font-size: 14px;
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 10px;
|
|
|
+
|
|
|
+ & p {
|
|
|
+ white-space: pre-wrap;
|
|
|
+ margin: 5px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ & p:first-child {
|
|
|
+ color: #39b54a;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &__console::-webkit-scrollbar {
|
|
|
+ width: 7px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__console::-webkit-scrollbar-thumb {
|
|
|
+ background: #cfcdd1;
|
|
|
+ border-radius: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__console::-webkit-scrollbar-track-piece {
|
|
|
+ background: transparent;
|
|
|
}
|
|
|
}
|
|
|
}
|
yangxiaokun