feat: 上位机远程控制完成
This commit is contained in:
pengqiao1993
@ -1,36 +1,40 @@
|
||||
<template>
|
||||
<view style="height: 100vh">
|
||||
<view class="">
|
||||
<u-navbar title="策略下发" :is-back="true" :background="background" :border-bottom="false"
|
||||
:custom-back="toback">
|
||||
<u-navbar :title="$t('homePage.policy.policyTitle')" :is-back="true" title-color="#FFF"
|
||||
:background="background" :border-bottom="false" :custom-back="toback">
|
||||
</u-navbar>
|
||||
</view>
|
||||
<view class="policeForm">
|
||||
<view class="" v-for="(item, index) in smallArr" :key="index">
|
||||
<view class="" v-if="item.type == 'Input'">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<u-input :min="item.min" :max="item.max" v-model.number="item.value" type="number"
|
||||
:placeholder="item[`place_${lang}`]" @input="handleInput(item, $event)" />
|
||||
</u-form-item>
|
||||
<u-form ref="form" labelPosition="top">
|
||||
<view class="" v-for="(item, index) in smallArr" :key="index">
|
||||
<view class="" v-if="item.type == 'Input'">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<u-input :key="'input_' + item.prop + '_' + item.inputKey" :min="item.min" :max="item.max"
|
||||
:value="item.value" type="number" :placeholder="item[`place_${lang}`]"
|
||||
@input="handleInput(item, $event)" />
|
||||
</u-form-item>
|
||||
</view>
|
||||
<view class="" v-if="item.type == 'Switch'">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<u-switch :size="40" v-model="item.value"></u-switch>
|
||||
</u-form-item>
|
||||
</view>
|
||||
<view class="" v-if="item.type == 'Select'" @click="selectShow(item, index)">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<view class="" v-show="false">
|
||||
<u-input v-model="item.value" disabled @click="selectShow(item, index)" />
|
||||
</view>
|
||||
<view class="">
|
||||
{{ item.selectLabel || $t("homePage.alarm.placeSelect") }}
|
||||
</view>
|
||||
<u-select :key="item.prop" @confirm="confirm($event, item)" v-model="item.isShow"
|
||||
:list="getSelectList(item)"></u-select>
|
||||
</u-form-item>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" v-if="item.type == 'Switch'">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<u-switch :size="40" v-model="item.value"></u-switch>
|
||||
</u-form-item>
|
||||
</view>
|
||||
<view class="" v-if="item.type == 'Select'" @click="selectShow(item, index)">
|
||||
<u-form-item :label="item[`label_${lang}`]" :prop="item.prop">
|
||||
<view class="" v-show="false">
|
||||
<u-input v-model="item.value" disabled @click="selectShow(item, index)" />
|
||||
</view>
|
||||
<view class="">
|
||||
{{ item.selectLabel || $t("homePage.alarm.placeSelect") }}
|
||||
</view>
|
||||
<u-select :key="item.prop" @confirm="confirm($event, item)" v-model="item.isShow"
|
||||
:list="getSelectList(item)"></u-select>
|
||||
</u-form-item>
|
||||
</view>
|
||||
</view>
|
||||
</u-form>
|
||||
|
||||
|
||||
<button @click="submitDevice" type="success" size="mini" style="
|
||||
background-color: #009458;
|
||||
@ -42,6 +46,7 @@
|
||||
{{ $t("homePage.mine.submit") }}
|
||||
</button>
|
||||
</view>
|
||||
<u-toast ref="uToast" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -53,6 +58,7 @@
|
||||
Langlist
|
||||
} from "@/common/lang";
|
||||
import mqtt from "@/uni_modules/leliven-mqtt/index.js";
|
||||
import pako from "pako";
|
||||
export default {
|
||||
|
||||
data() {
|
||||
@ -61,7 +67,7 @@
|
||||
background: {
|
||||
backgroundColor: "#0EA17E",
|
||||
},
|
||||
lang: 'en',
|
||||
|
||||
mqttClient: null,
|
||||
backData: {},
|
||||
smallArr: [],
|
||||
@ -73,12 +79,11 @@
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
language() {
|
||||
return this.$store.state.vuex_language
|
||||
lang() {
|
||||
return Langlist.find(v => v.value == this.$store.state.vuex_language).prop || 'en'
|
||||
},
|
||||
currentStation() {
|
||||
console.log(this.vuex_currentStation)
|
||||
return this.vuex_currentStation;
|
||||
return this.$store.state.vuex_currentStation;
|
||||
},
|
||||
},
|
||||
|
||||
@ -88,30 +93,31 @@
|
||||
|
||||
methods: {
|
||||
initmqttClient() {
|
||||
|
||||
// 初始化客户端连接地址
|
||||
// #ifdef H5
|
||||
let mqttClient = mqtt.connect('ws://13.39.200.14:8083/mqtt', {
|
||||
let mqttClient = mqtt.connect('ws://1.95.170.86:8083/mqtt', {
|
||||
...this.user
|
||||
})
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN||APP-PLUS
|
||||
let mqttClient = mqtt.connect('wx://13.39.200.14:8083/mqtt', {
|
||||
let mqttClient = mqtt.connect('wx://1.95.170.86:8083/mqtt', {
|
||||
...this.user
|
||||
})
|
||||
// #endif
|
||||
console.log(mqttClient,'888')
|
||||
this.mqttClient = mqttClient
|
||||
// 连接MQ服务
|
||||
mqttClient.on('connect', function(res) {
|
||||
console.log('连接成功')
|
||||
console.log(res)
|
||||
|
||||
|
||||
// 订阅主题
|
||||
mqttClient.subscribe('presence', function(err) {
|
||||
mqttClient.subscribe(`1/ems/zzkj0002/control/response`, function(err) {
|
||||
if (!err) {
|
||||
// 订阅成功
|
||||
mqttClient.publish('presence', 'hello mqtt')
|
||||
mqttClient.publish('1/app/zzkj0002/control/request', JSON.stringify({
|
||||
fun: 'GET',
|
||||
type: 'WJ_Get_NewControlSystem',
|
||||
content: 0
|
||||
}))
|
||||
}
|
||||
})
|
||||
}).on('reconnect', function() {
|
||||
@ -120,15 +126,28 @@
|
||||
console.log('连接失败')
|
||||
}).on('end', function() {
|
||||
console.log('连接End')
|
||||
}).on('message', function(topic, message) {
|
||||
// 收到MQ消息
|
||||
console.log(message.toString())
|
||||
}).on('message', (topic, message) => {
|
||||
console.log(this.decodeGzipBase64(message.toString()))
|
||||
let data = this.decodeGzipBase64(message.toString())
|
||||
if (data.content && data.content.params) {
|
||||
this.control(data.content)
|
||||
} else
|
||||
if (data.content == 1) {
|
||||
this.$refs.uToast.show({
|
||||
title: this.$t('homePage.mine.operateSuccess'),
|
||||
type: 'success',
|
||||
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: this.$t('homePage.mine.operateFail'),
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
decodeGzipBase64(base64Str) {
|
||||
// 1. base64 → Uint8Array
|
||||
const binaryStr = atob(base64Str);
|
||||
@ -156,12 +175,16 @@
|
||||
return []
|
||||
},
|
||||
control(NewControlSystemShow_data) {
|
||||
console.log(NewControlSystemShow_data)
|
||||
this.formList.forEach(item => {
|
||||
if (item.type == "Switch") {
|
||||
item.value = NewControlSystemShow_data?.params[item.prop] ? true : false
|
||||
} else {
|
||||
}
|
||||
if (item.type == "Input") {
|
||||
|
||||
item.value = NewControlSystemShow_data?.params[item.prop] || item.default
|
||||
}
|
||||
|
||||
if (item.type == 'Select') {
|
||||
item.selectLabel = item.selectArr.find(v => v.value == item.value)?.[`label_${this.lang}`]
|
||||
}
|
||||
@ -177,10 +200,10 @@
|
||||
}
|
||||
item.isShow = false
|
||||
},
|
||||
handleInput(item, event) {
|
||||
handleInput(item, value) {
|
||||
try {
|
||||
let inputValue = event.detail.value;
|
||||
let iptval = String(inputValue).replace(/[^0-9.]/g, '');
|
||||
// u-input 组件 @input 事件直接传递 value 值，不是 event 对象
|
||||
let iptval = String(value || '').replace(/[^0-9.]/g, '');
|
||||
const parts = iptval.split('.');
|
||||
if (parts.length > 2) {
|
||||
iptval = parts[0] + '.' + parts.slice(1).join('');
|
||||
@ -190,14 +213,25 @@
|
||||
return;
|
||||
}
|
||||
let numVal = Number(iptval);
|
||||
if (item.min !== undefined && item.min !== null) {
|
||||
numVal = Math.max(numVal, item.min);
|
||||
}
|
||||
if (item.max !== undefined && item.max !== null) {
|
||||
numVal = Math.min(numVal, item.max);
|
||||
}
|
||||
numVal = isNaN(numVal) ? 0 : numVal;
|
||||
|
||||
// 检查是否需要强制更新（值被限制）
|
||||
let needForceUpdate = false;
|
||||
if (item.min !== undefined && item.min !== null && numVal < item.min) {
|
||||
numVal = item.min;
|
||||
needForceUpdate = true;
|
||||
}
|
||||
if (item.max !== undefined && item.max !== null && numVal > item.max) {
|
||||
numVal = item.max;
|
||||
needForceUpdate = true;
|
||||
}
|
||||
|
||||
item.value = numVal;
|
||||
|
||||
// 如果值被限制，强制重新渲染输入框
|
||||
if (needForceUpdate) {
|
||||
this.$set(item, 'inputKey', (item.inputKey || 0) + 1);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log('handleInput方法错误:', error);
|
||||
}
|
||||
@ -215,8 +249,8 @@
|
||||
pre[cur.prop] = Number(pre[cur.prop])
|
||||
return pre
|
||||
}, {})
|
||||
console.log(this.mqttClient)
|
||||
this.mqttClient.publish('presence', JSON.stringify({
|
||||
|
||||
this.mqttClient.publish(`1/app/zzkj0002/control/request`, JSON.stringify({
|
||||
fun: 'SET',
|
||||
type: 'WJ_Set_NewControlSystem',
|
||||
content: {
|
||||
|
||||
Reference in New Issue
Block a user