<template>
|
<div class="lora-gateway">
|
<el-form :model="loraForm" ref="loraForm">
|
<div class="title form-item">网络设置</div>
|
|
<el-form-item class="form-item">
|
<div class="item-title">设备ID</div>
|
<div class="inputContain">
|
<el-input
|
v-model="loraForm.devId"
|
placeholder="请输入设备ID"
|
size="small"
|
></el-input>
|
</div>
|
</el-form-item>
|
|
<el-form-item class="form-item">
|
<div class="item-title">APPID</div>
|
<div class="inputContain">
|
<el-input
|
v-model="loraForm.appId"
|
placeholder="请输入APPID"
|
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="loraForm.password"
|
placeholder="请输入密码"
|
size="small"
|
show-password
|
auto-complete="new-password"
|
></el-input>
|
</div>
|
</el-form-item>
|
|
<div class="block">
|
<el-form-item class="form-item channel-sele">
|
<div class="item-title">频道</div>
|
<el-select
|
v-model="loraForm.channel"
|
placeholder="请选择"
|
size="small"
|
:popper-append-to-body="false"
|
>
|
<el-option
|
v-for="item in channel_option"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
<div class="channel">
|
当前连接通道：<span class="channelCount">{{ channelCount }}</span>
|
</div>
|
</el-form-item>
|
|
<el-form-item class="form-item">
|
<div class="item-title">工作频率</div>
|
<el-radio-group v-model="loraForm.hz">
|
<el-radio :label="0">475.5MHz</el-radio>
|
<el-radio :label="1">868.5MHz</el-radio>
|
<el-radio :label="2">915.5MHz</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<el-form-item class="form-item">
|
<div class="item-title">通信模式</div>
|
<div class="inputContain">
|
<el-input
|
v-model="loraForm.netMode"
|
placeholder="全双工"
|
size="small"
|
></el-input>
|
</div>
|
</el-form-item>
|
|
<el-form-item class="form-item">
|
<div class="item-title">工作模式</div>
|
<el-radio-group v-model="loraForm.workMode">
|
<el-radio :label="0">是</el-radio>
|
<el-radio :label="1">否</el-radio>
|
<el-radio :label="2">空闲不工作模式</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<el-form-item class="form-item">
|
<div class="item-title">发射功率调整</div>
|
<el-slider
|
v-model="loraForm.powerRate"
|
id="loraForm_frequency"
|
:min="0"
|
:max="100"
|
:show-tooltip="false"
|
></el-slider>
|
<div class="slider-info">节能</div>
|
</el-form-item>
|
|
<div class="ok" @click="saveList">保存</div>
|
</div>
|
</el-form>
|
</div>
|
</template>
|
|
<script>
|
import { getLora, saveLora } from "@/api/system";
|
export default {
|
name: "loraGateway",
|
created() {
|
this.getList();
|
},
|
data() {
|
return {
|
channel_option: [
|
{ label: "频道1", value: "频道1" },
|
{ label: "频道2", value: "频道2" },
|
],
|
channelCount: 20,
|
loraForm: {
|
devId: "",
|
appId: "",
|
password: "",
|
hz: "",
|
netMode: "",
|
workMode: "",
|
powerRate: 20,
|
},
|
};
|
},
|
methods: {
|
async getList() {
|
const res = await getLora();
|
console.log(res);
|
this.loraForm = res.data;
|
},
|
async saveList() {
|
// this.loraForm.powerRate = `${this.loraForm.powerRate}`;
|
this.loraForm.hz = `${this.loraForm.hz}`;
|
// this.loraForm.workMode = `${this.loraForm.workMode}`;
|
const res = await saveLora(this.loraForm);
|
console.log(res);
|
},
|
},
|
};
|
</script>
|
|
<style scoped lang="scss">
|
@import "../asset/common.scss";
|
.lora-gateway {
|
display: flex;
|
flex-direction: column;
|
.block {
|
margin-top: 16px;
|
}
|
.channel-sele {
|
.el-select {
|
flex: 1;
|
margin-left: 88px;
|
}
|
}
|
}
|
</style>
|
