From ddb4dda6ed6069253afb8b1e05fe52b56c681f35 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期五, 19 十一月 2021 18:58:38 +0800
Subject: [PATCH] 暂存
---
src/pages/settings/components/MqttGateway.vue | 144 +++++++++++++++++++++++++++---------------------
1 files changed, 81 insertions(+), 63 deletions(-)
diff --git a/src/pages/settings/components/MqttGateway.vue b/src/pages/settings/components/MqttGateway.vue
index 8ec8f31..5cc4ad5 100644
--- a/src/pages/settings/components/MqttGateway.vue
+++ b/src/pages/settings/components/MqttGateway.vue
@@ -4,104 +4,122 @@
<div class="title form-item">缃戠粶璁剧疆</div>
<el-form-item class="form-item">
- <switchBar
- :barName="`MOTT缃戝叧`"
- :value="accessible"
- ></switchBar>
+ <switchBar
+ :barName="`MOTT缃戝叧`"
+ :value="mqttForm.enable"
+ @switchChange="switchChange('enable', arguments)"
+ ></switchBar>
</el-form-item>
<div class="block">
<el-form-item class="form-item">
- <div class="item-title">IP鍦板潃</div>
- <div class="inputContain">
- <ipInput
- :ip="mqttForm.ip"
- @on-blur="mqttForm.ip = arguments[0]"
- ></ipInput>
- </div>
+ <div class="item-title">IP鍦板潃</div>
+ <div class="inputContain">
+ <ipInput
+ :ip="mqttForm.ip"
+ @on-blur="mqttForm.ip = arguments[0]"
+ ></ipInput>
+ </div>
</el-form-item>
<el-form-item class="form-item">
- <div class="item-title">绔彛鍙�</div>
- <div class="inputContain">
- <ipInput
- :ip="mqttForm.port"
- @on-blur="mqttForm.port = arguments[0]"
- ></ipInput>
- </div>
+ <div class="item-title">绔彛鍙�</div>
+ <div class="inputContain">
+ <el-input
+ v-model="mqttForm.port"
+ placeholder="璇疯緭鍏ョ敤鎴峰悕"
+ size="small"
+ ></el-input>
+ </div>
</el-form-item>
</div>
<div class="block">
<el-form-item class="form-item">
- <div class="item-title">鍚嶇О</div>
- <div class="inputContain">
- <el-input
- v-model="mqttForm.name"
- placeholder="璇疯緭鍏ョ敤鎴峰悕"
- size="small"
- ></el-input>
- </div>
- </el-form-item>
+ <div class="item-title">鍚嶇О</div>
+ <div class="inputContain">
+ <el-input
+ v-model="mqttForm.username"
+ placeholder="璇疯緭鍏ョ敤鎴峰悕"
+ size="small"
+ ></el-input>
+ </div>
+ </el-form-item>
- <el-form-item class="form-item">
- <div class="item-title">瀵嗙爜</div>
- <div class="inputContain">
- <el-input
- v-model="mqttForm.password"
- placeholder="璇疯緭鍏ュ瘑鐮�"
- size="small"
- show-password
- auto-complete="new-password"
- ></el-input>
- </div>
- </el-form-item>
+ <el-form-item class="form-item">
+ <div class="item-title">瀵嗙爜</div>
+ <div class="inputContain">
+ <el-input
+ v-model="mqttForm.password"
+ placeholder="璇疯緭鍏ュ瘑鐮�"
+ size="small"
+ show-password
+ auto-complete="new-password"
+ ></el-input>
+ </div>
+ </el-form-item>
</div>
<div class="block">
<el-form-item class="form-item">
<switchBar
- :barName="`MOTT缃戝叧`"
- :value="accessible"
+ :barName="`鍖垮悕鐢ㄦ埛`"
+ :value="mqttForm.anonymousEnable"
+ @switchChange="switchChange('anonymousEnable', arguments)"
></switchBar>
</el-form-item>
</div>
</el-form>
- <div class="ok">淇濆瓨</div>
+ <div class="ok" @click="saveList">淇濆瓨</div>
</div>
</template>
<script>
import ipInput from "../components/IPInput";
import switchBar from "../components/switchBar";
+import { getMqtt, saveMqtt } from "@/api/system";
export default {
- name:"mqttGateway",
- data(){
+ name: "mqttGateway",
+ created() {
+ this.getList();
+ },
+ data() {
return {
accessible: false,
- mqttForm:{
- ip:"",
- port:"",
- name:"",
- password:""
- }
- }
+ mqttForm: {
+ enable: "",
+ anonymousEnable: "",
+ },
+ };
},
- components :{
- switchBar,
- ipInput
- }
-}
+ components: {
+ switchBar,
+ ipInput,
+ },
+ methods: {
+ async getList() {
+ const res = await getMqtt();
+ this.mqttForm = { ...res.data };
+ },
+ async saveList() {
+ const res = await saveMqtt(this.mqttForm);
+ console.log(res);
+ },
+ switchChange(tar, arr) {
+ this.mqttForm[tar] = arr[0];
+ },
+ },
+};
</script>
<style scoped lang="scss">
-@import '../asset/common.scss';
- .mqtt-gateway {
- display: flex;
- flex-direction: column;
- .block {
- margin-top: 16px;
- }
+@import "../asset/common.scss";
+.mqtt-gateway {
+ display: flex;
+ flex-direction: column;
+ .block {
+ margin-top: 16px;
}
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0