init
This commit is contained in:
198
src/components/DebugView.vue
Normal file
198
src/components/DebugView.vue
Normal file
@ -0,0 +1,198 @@
|
||||
<script>
|
||||
import TitleBlock from "@/components/TitleBlock.vue";
|
||||
import $ from "jquery";
|
||||
|
||||
export default {
|
||||
name: "DebugView",
|
||||
components: {TitleBlock},
|
||||
created() {
|
||||
this.getStatusData();
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Label_button1: "待机",
|
||||
Label_button2: "重启",
|
||||
Label_button3: "启动加湿",
|
||||
Label_button4: "关闭屏幕",
|
||||
button1: false,
|
||||
button2: false,
|
||||
button3: false,
|
||||
button4: false,
|
||||
data: {
|
||||
standby: 0,
|
||||
reboot: 0,
|
||||
humidifier: 0,
|
||||
screen: 1,
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
button1_click() {
|
||||
console.log("待机");
|
||||
this.button1 = true;
|
||||
setTimeout(() => {
|
||||
this.button1 = false;
|
||||
}, 5000);
|
||||
if (this.Label_button1 === "待机") {
|
||||
this.Label_button1 = "工作";
|
||||
this.button2 = true;
|
||||
this.button3 = true;
|
||||
this.button4 = true;
|
||||
this.data.standby = 1;
|
||||
} else {
|
||||
this.Label_button1 = "待机";
|
||||
this.button2 = false;
|
||||
this.button3 = false;
|
||||
this.button4 = false;
|
||||
this.data.standby = 0;
|
||||
}
|
||||
this.updateData();
|
||||
},
|
||||
button2_click() {
|
||||
console.log("重启");
|
||||
this.button1 = true;
|
||||
this.button2 = true;
|
||||
this.button3 = true;
|
||||
this.button4 = true;
|
||||
setTimeout(() => {
|
||||
this.button1 = false;
|
||||
this.button2 = false;
|
||||
this.button3 = false;
|
||||
this.button4 = false;
|
||||
}, 5000);
|
||||
|
||||
|
||||
this.data.reboot = 1;
|
||||
this.updateData();
|
||||
this.data.reboot = 0;
|
||||
},
|
||||
button3_click() {
|
||||
console.log("启动加湿");
|
||||
this.button3 = true;
|
||||
setTimeout(() => {
|
||||
this.button3 = false;
|
||||
}, 1000);
|
||||
if (this.Label_button3 === "启动加湿") {
|
||||
this.Label_button3 = "停止加湿";
|
||||
this.data.humidifier = 1;
|
||||
} else {
|
||||
this.Label_button3 = "启动加湿";
|
||||
this.data.humidifier = 0;
|
||||
}
|
||||
this.updateData();
|
||||
},
|
||||
button4_click() {
|
||||
console.log("关闭屏幕");
|
||||
this.button4 = true;
|
||||
setTimeout(() => {
|
||||
this.button4 = false;
|
||||
}, 1000);
|
||||
if (this.Label_button4 === "关闭屏幕") {
|
||||
this.Label_button4 = "打开屏幕";
|
||||
this.data.screen = 0;
|
||||
} else {
|
||||
this.Label_button4 = "关闭屏幕";
|
||||
this.data.screen = 1;
|
||||
}
|
||||
this.updateData();
|
||||
},
|
||||
updateData() {
|
||||
$.ajax({
|
||||
url: "http://localhost/debug.php",
|
||||
type: "POST",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(this.data),
|
||||
success: (response) => {
|
||||
console.log(response);
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
console.log(error);
|
||||
console.log(xhr.responseText);
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
getStatusData(){
|
||||
$.ajax({
|
||||
url: "http://localhost/debug.php",
|
||||
type: "GET",
|
||||
contentType: "application/json",
|
||||
success: (response) => {
|
||||
console.log(response);
|
||||
this.data.standby = parseInt(JSON.parse(response).standby);
|
||||
this.data.reboot = parseInt(JSON.parse(response).reboot);
|
||||
this.data.humidifier = parseInt(JSON.parse(response).humidifier);
|
||||
this.data.screen = parseInt(JSON.parse(response).screen);
|
||||
if (this.data.standby) {
|
||||
this.Label_button1 = "工作";
|
||||
} else {
|
||||
this.Label_button1 = "待机";
|
||||
}
|
||||
if (this.data.reboot) {
|
||||
this.Label_button2 = "重启中";
|
||||
} else {
|
||||
this.Label_button2 = "重启";
|
||||
}
|
||||
if (this.data.humidifier) {
|
||||
this.Label_button3 = "停止加湿";
|
||||
} else {
|
||||
this.Label_button3 = "启动加湿";
|
||||
}
|
||||
if (this.data.screen) {
|
||||
this.Label_button4 = "关闭屏幕";
|
||||
} else {
|
||||
this.Label_button4 = "打开屏幕";
|
||||
}
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
console.log(error);
|
||||
console.log(xhr.responseText);
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<TitleBlock class="mb-4" title="调试" /><br>
|
||||
|
||||
<div class="text-center me-1 pe-5 ps-5">
|
||||
<table class="table table-sm w-25">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>功能</th>
|
||||
<th>状态</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-group-divider">
|
||||
<tr>
|
||||
<td>在线状态</td>
|
||||
<td>{{ data.standby? "离线" : data.reboot? "重启中": "在线" }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>启动加湿</td>
|
||||
<td>{{ data.humidifier? "启动中" : "已停止" }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>关闭屏幕</td>
|
||||
<td>{{ data.screen? "打开" : "关闭" }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="ms-5 mt-4 btn-group">
|
||||
<button class="btn btn-outline-secondary" v-bind:disabled="button1" @click="button1_click" hidden>{{ Label_button1 }}</button>
|
||||
<button class="btn btn-outline-secondary" v-bind:disabled="button2" @click="button2_click">{{ Label_button2 }}</button>
|
||||
<button class="btn btn-outline-secondary" v-bind:disabled="button3" @click="button3_click">{{ Label_button3 }}</button>
|
||||
<button class="btn btn-outline-secondary" v-bind:disabled="button4" @click="button4_click">{{ Label_button4 }}</button>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
Reference in New Issue
Block a user