|
|
@@ -1,370 +1,429 @@
|
|
|
-<template>
|
|
|
- <view class="page" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
|
|
|
- <cus-header title='配置网络'></cus-header>
|
|
|
- <div class="title">设置Wi-Fi信息</div>
|
|
|
- <div class="items">
|
|
|
- <div class="item adfacjb">
|
|
|
- <div class="il">
|
|
|
- <input type="text" v-model="wifiSSID" placeholder="网络名称" placeholder-class="ph">
|
|
|
- </div>
|
|
|
- <div class="ir" @tap="toSelectWifi">选择Wi-Fi</div>
|
|
|
- </div>
|
|
|
- <div class="item adfacjb">
|
|
|
- <div class="il">
|
|
|
- <input :password="isPwd" v-model="wifiPWD" placeholder="请输入Wi-Fi密码" placeholder-class="ph">
|
|
|
- </div>
|
|
|
- <div class="iimgs">
|
|
|
- <image @tap="changePwd" src="@/static/pwd_hide.png" v-if="isPwd"></image>
|
|
|
- <image @tap="changePwd" src="@/static/pwd_show.png" v-else></image>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="zt_btn" @tap="connectWifi">连接</div>
|
|
|
- <div class="memo">
|
|
|
- <div class="m_title">配网说明</div>
|
|
|
- <div class="m_p">
|
|
|
- 1、请注意设备仅支持2.4G的WiFi<br>
|
|
|
- 2、不支持无密码的WiFi连接<br>
|
|
|
- 3、不支持二次授权或者需要网页二次登录的WiFi<br>
|
|
|
- 4、如果使用手机热点连接，请确保手机热点正常开启<br>
|
|
|
- 5、如果使用iPhone热点，请确保热点开启了最大兼容模式<br>
|
|
|
- 6、iPhone热点因为低功耗，一段时间不使用，热点将会自动关闭，如果无法连接，请重新打开热点
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <u-popup :show="show" :round="56" mode="center" @close="show=false">
|
|
|
- <div class="wifis">
|
|
|
- <div class="top adfacjb">
|
|
|
- <div class="tl">选择WiFi</div>
|
|
|
- <div class="tr adfac" @tap="initWiFi">
|
|
|
- <!-- <image src="@/static/refreash.png"></image>
|
|
|
- <text>刷新</text> -->
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="list" v-if="wifiList.length">
|
|
|
- <div class="item adfacjb" v-for="(item,index) in wifiList" :key="index">
|
|
|
- <div class="il adfac">
|
|
|
- <image src="@/static/wifi.png"></image>
|
|
|
- <text>{{item}}</text>
|
|
|
- </div>
|
|
|
- <div class="ir" @tap="selectWifi(item)">选择</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <template v-else>
|
|
|
- <page-empty></page-empty>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </u-popup>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- var xBlufi = require("@/utils/blufi/xBlufi.js");
|
|
|
- import pageEmpty from '@/components/pageEmpty/index.vue'
|
|
|
- export default {
|
|
|
- components:{pageEmpty},
|
|
|
- data(){
|
|
|
- return {
|
|
|
- name: '',
|
|
|
- connectedDeviceId: '',
|
|
|
- connected: true,
|
|
|
- isInitOK: false,
|
|
|
- wifiSSID:'',
|
|
|
- wifiPWD:'',
|
|
|
- isPwd:true,
|
|
|
- show:false,
|
|
|
- wifiList:[],
|
|
|
- type:'', // 配网类型
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad: function(options) {
|
|
|
- this.type = options.type || '';
|
|
|
- var that = this
|
|
|
- this.name = options.name;
|
|
|
- this.connectedDeviceId = options.deviceId;
|
|
|
- xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvent);
|
|
|
- xBlufi.notifyInitBleEsp32({
|
|
|
- deviceId: options.deviceId,
|
|
|
- })
|
|
|
- wx.showLoading({
|
|
|
- title: '设备初始化中',
|
|
|
- })
|
|
|
- },
|
|
|
- // onUnload: function() {
|
|
|
- // let that = this
|
|
|
- // xBlufi.notifyConnectBle({
|
|
|
- // isStart: false,
|
|
|
- // deviceId: that.connectedDeviceId,
|
|
|
- // name: that.name,
|
|
|
- // });
|
|
|
- // xBlufi.listenDeviceMsgEvent(false, this.funListenDeviceMsgEvent);
|
|
|
- // },
|
|
|
- methods:{
|
|
|
- funListenDeviceMsgEvent: function(options) {
|
|
|
- let that = this
|
|
|
- let ssid_arry = this.wifiList;
|
|
|
- switch (options.type) {
|
|
|
- // case xBlufi.XBLUFI_TYPE.TYPE_STATUS_CONNECTED:
|
|
|
- // that.connected = options.result
|
|
|
- // if (!options.result) {
|
|
|
- // wx.showModal({
|
|
|
- // title: '很抱歉提醒你！',
|
|
|
- // content: '小程序与设备异常断开',
|
|
|
- // showCancel: false, //是否显示取消按钮
|
|
|
- // })
|
|
|
- // }
|
|
|
- // break;
|
|
|
- case xBlufi.XBLUFI_TYPE.TYPE_CONNECT_ROUTER_RESULT:
|
|
|
- wx.hideLoading();
|
|
|
- if (!options.result)
|
|
|
- wx.showModal({
|
|
|
- title: '温馨提示',
|
|
|
- content: '配网失败，请重试',
|
|
|
- showCancel: false,
|
|
|
- })
|
|
|
- else {
|
|
|
- if (options.data.progress == 100) {
|
|
|
- uni.setStorageSync(that.wifiSSID,that.wifiPWD)
|
|
|
- uni.navigateTo({
|
|
|
- url:'/pagesMy/wifiSuccess?pwtype='+this.type
|
|
|
- })
|
|
|
-
|
|
|
- // let result = {
|
|
|
- // "macAddress": this.connectedDeviceId||'',
|
|
|
- // "board": this.name||"cx-mxb-wifi",
|
|
|
- // "appVersion": "1.8.2" ,
|
|
|
- // };
|
|
|
- // console.log(result,'配网成功')
|
|
|
- // uni.navigateTo({
|
|
|
- // url:'/pagesMy/scanResult?scanParams='+JSON.stringify(result)+'&type=lanya'+'&pwtype='+this.type
|
|
|
- // })
|
|
|
- }
|
|
|
- }
|
|
|
- break;
|
|
|
- // case xBlufi.XBLUFI_TYPE.TYPE_RECIEVE_CUSTON_DATA:
|
|
|
- // wx.showModal({
|
|
|
- // title: '收到自定义设备数据',
|
|
|
- // content: `【${options.data}】`,
|
|
|
- // showCancel: false,
|
|
|
- // })
|
|
|
- // break;
|
|
|
- case xBlufi.XBLUFI_TYPE.TYPE_CONNECT_NEAR_ROUTER_LISTS:
|
|
|
- wx.hideLoading();
|
|
|
- if ('' === options.data.SSID) break;
|
|
|
- if(!ssid_arry.includes(options.data.SSID)) ssid_arry.push(options.data.SSID)
|
|
|
- that.wifiList = ssid_arry;
|
|
|
- that.wifiSSID = that.wifiList[0];
|
|
|
- that.wifiPWD = uni.getStorageSync(that.wifiSSID)||'';
|
|
|
- that.isInitOK = true
|
|
|
- break;
|
|
|
- case xBlufi.XBLUFI_TYPE.TYPE_INIT_ESP32_RESULT:
|
|
|
- wx.hideLoading();
|
|
|
- if (options.result) {
|
|
|
- xBlufi.notifySendGetNearRouterSsid()
|
|
|
- wx.showLoading({
|
|
|
- title: '获取周围WiFi列表...',
|
|
|
- })
|
|
|
- } else {
|
|
|
- that.connected = false
|
|
|
- wx.showModal({
|
|
|
- title: '温馨提示',
|
|
|
- content: `设备初始化失败`,
|
|
|
- showCancel: false, //是否显示取消按钮
|
|
|
- })
|
|
|
- }
|
|
|
- break;
|
|
|
- }
|
|
|
- },
|
|
|
- changePwd(){
|
|
|
- this.isPwd = !this.isPwd;
|
|
|
- },
|
|
|
- initWiFi(){
|
|
|
- // let that = this;
|
|
|
- // xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvent);
|
|
|
- // xBlufi.notifyInitBleEsp32({
|
|
|
- // deviceId: that.connectedDeviceId
|
|
|
- // })
|
|
|
- },
|
|
|
- connectWifi(){
|
|
|
- let that = this;
|
|
|
- if(!this.wifiSSID) return this.$showToast('请选择Wi-Fi')
|
|
|
- if(!this.wifiPWD) return this.$showToast('请输入Wi-Fi密码')
|
|
|
- wx.showLoading({
|
|
|
- title: '正在配网...',
|
|
|
- mask: true
|
|
|
- })
|
|
|
- xBlufi.notifySendRouterSsidAndPassword({
|
|
|
- ssid: that.wifiSSID,
|
|
|
- password: that.wifiPWD
|
|
|
- })
|
|
|
- },
|
|
|
- toSelectWifi(){
|
|
|
- this.show = true;
|
|
|
- },
|
|
|
- selectWifi(item){
|
|
|
- this.wifiSSID = item;
|
|
|
- this.wifiPWD = uni.getStorageSync(item) || '';
|
|
|
- this.show = false;
|
|
|
- this.isInitOK = true
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="less">
|
|
|
- .page{
|
|
|
- padding: 0 40rpx 250rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- background: #FFFFFF;
|
|
|
- &>.title{
|
|
|
- font-family: PingFang-SC, PingFang-SC;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 36rpx;
|
|
|
- color: #111111;
|
|
|
- line-height: 36rpx;
|
|
|
- margin-top: 64rpx;
|
|
|
- }
|
|
|
- .items{
|
|
|
- margin-top: 188rpx;
|
|
|
- .item{
|
|
|
- margin-top: 80rpx;
|
|
|
- padding-bottom: 30rpx;
|
|
|
- border-bottom: 1rpx solid #E2E2E2;
|
|
|
- .il{
|
|
|
- width: calc(100% - 180rpx);
|
|
|
- input{
|
|
|
- border: none;
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #333333;
|
|
|
- line-height: 42rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .ir{
|
|
|
- width: 160rpx;
|
|
|
- height: 64rpx;
|
|
|
- background: #D9F159;
|
|
|
- border-radius: 32rpx;
|
|
|
- font-family: PingFang-SC, PingFang-SC;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #252525;
|
|
|
- line-height: 64rpx;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .iimgs{
|
|
|
- image{
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .zt_btn{
|
|
|
- margin-top: 100rpx;
|
|
|
- }
|
|
|
- .memo{
|
|
|
- margin-top: 100rpx;
|
|
|
- .m_title{
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #111111;
|
|
|
- line-height: 40rpx;
|
|
|
- }
|
|
|
- .m_p{
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #7C8592;
|
|
|
- line-height: 54rpx;
|
|
|
- margin-top: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .ph{
|
|
|
- color: #7C8592;
|
|
|
- }
|
|
|
-
|
|
|
- .wifis{
|
|
|
- width: 670rpx;
|
|
|
- max-height: 720rpx;
|
|
|
- overflow: hidden;
|
|
|
- padding-bottom: 20rpx;
|
|
|
- .top{
|
|
|
- margin-top: 14rpx;
|
|
|
- padding: 40rpx;
|
|
|
- border-bottom: 1rpx solid #E2E2E2;
|
|
|
- .tl{
|
|
|
- font-family: PingFang-SC, PingFang-SC;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 36rpx;
|
|
|
- color: #111111;
|
|
|
- line-height: 36rpx;
|
|
|
- }
|
|
|
- .tr{
|
|
|
- image{
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- }
|
|
|
- text{
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #7C8592;
|
|
|
- line-height: 36rpx;
|
|
|
- margin-left: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .list{
|
|
|
- height: 609rpx;
|
|
|
- overflow-y: auto;
|
|
|
- padding: 30rpx 40rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- .item{
|
|
|
- width: 100%;
|
|
|
- height: 120rpx;
|
|
|
- border-radius: 16rpx;
|
|
|
- border: 1rpx solid #E2E2E2;
|
|
|
- margin-top: 20rpx;
|
|
|
- padding: 0 24rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- &:first-child{
|
|
|
- margin-top: 0;
|
|
|
- }
|
|
|
- .il{
|
|
|
- width: calc(100% - 134rpx);
|
|
|
- image{
|
|
|
- width: 42rpx;
|
|
|
- height: 42rpx;
|
|
|
- }
|
|
|
- text{
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 30rpx;
|
|
|
- color: #252525;
|
|
|
- line-height: 30rpx;
|
|
|
- margin-left: 20rpx;
|
|
|
- width: calc(100% - 62rpx);
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- }
|
|
|
- }
|
|
|
- .ir{
|
|
|
- width: 114rpx;
|
|
|
- height: 60rpx;
|
|
|
- background: #D9F159;
|
|
|
- border-radius: 32rpx;
|
|
|
- font-family: PingFangSC, PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #252525;
|
|
|
- line-height: 60rpx;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+<template>
|
|
|
+ <view class="page" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
|
|
|
+ <cus-header title='配置网络'></cus-header>
|
|
|
+ <div class="title">设置Wi-Fi信息</div>
|
|
|
+ <div class="items">
|
|
|
+ <div class="item adfacjb">
|
|
|
+ <div class="il">
|
|
|
+ <input type="text" v-model="wifiSSID" placeholder="网络名称" placeholder-class="ph">
|
|
|
+ </div>
|
|
|
+ <div class="ir" @tap="toSelectWifi">选择Wi-Fi</div>
|
|
|
+ </div>
|
|
|
+ <div class="item adfacjb">
|
|
|
+ <div class="il">
|
|
|
+ <input :password="isPwd" v-model="wifiPWD" placeholder="请输入Wi-Fi密码" placeholder-class="ph">
|
|
|
+ </div>
|
|
|
+ <div class="iimgs">
|
|
|
+ <image @tap="changePwd" src="@/static/pwd_hide.png" v-if="isPwd"></image>
|
|
|
+ <image @tap="changePwd" src="@/static/pwd_show.png" v-else></image>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="zt_btn" @tap="connectWifi">连接</div>
|
|
|
+ <div class="memo">
|
|
|
+ <div class="m_title">配网说明</div>
|
|
|
+ <div class="m_p">
|
|
|
+ 1、请注意设备仅支持2.4G的WiFi<br>
|
|
|
+ 2、不支持无密码的WiFi连接<br>
|
|
|
+ 3、不支持二次授权或者需要网页二次登录的WiFi<br>
|
|
|
+ 4、如果使用手机热点连接，请确保手机热点正常开启<br>
|
|
|
+ 5、如果使用iPhone热点，请确保热点开启了最大兼容模式<br>
|
|
|
+ 6、iPhone热点因为低功耗，一段时间不使用，热点将会自动关闭，如果无法连接，请重新打开热点
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <u-popup :show="show" :round="56" mode="center" @close="show=false">
|
|
|
+ <div class="wifis">
|
|
|
+ <div class="top adfacjb">
|
|
|
+ <div class="tl">选择WiFi</div>
|
|
|
+ <div class="tr adfac" @tap="initWiFi">
|
|
|
+ <!-- <image src="@/static/refreash.png"></image>
|
|
|
+ <text>刷新</text> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list" v-if="wifiList.length">
|
|
|
+ <div class="item adfacjb" v-for="(item,index) in wifiList" :key="index">
|
|
|
+ <div class="il adfac">
|
|
|
+ <image src="@/static/wifi.png"></image>
|
|
|
+ <text>{{item}}</text>
|
|
|
+ </div>
|
|
|
+ <div class="ir" @tap="selectWifi(item)">选择</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <template v-else>
|
|
|
+ <page-empty></page-empty>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ var xBlufi = require("@/utils/blufi/xBlufi.js");
|
|
|
+ import pageEmpty from '@/components/pageEmpty/index.vue'
|
|
|
+ export default {
|
|
|
+ components:{pageEmpty},
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ name: '',
|
|
|
+ connectedDeviceId: '',
|
|
|
+ connected: true,
|
|
|
+ isInitOK: false,
|
|
|
+ wifiSSID:'',
|
|
|
+ wifiPWD:'',
|
|
|
+ isPwd:true,
|
|
|
+ show:false,
|
|
|
+ wifiList:[],
|
|
|
+ type:'', // 配网类型
|
|
|
+ wifiListCache: [], // 缓存 Wi-Fi 列表
|
|
|
+ initTimeout: null, // 初始化超时定时器
|
|
|
+ wifiListFetchTimeout: null, // 获取Wi-Fi列表超时定时器
|
|
|
+ connectTimeout: null, // 配网超时定时器
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad: function(options) {
|
|
|
+ this.type = options.type || '';
|
|
|
+ var that = this
|
|
|
+ this.name = options.name;
|
|
|
+ this.connectedDeviceId = options.deviceId;
|
|
|
+
|
|
|
+ xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvent);
|
|
|
+
|
|
|
+ wx.showLoading({title:'设备初始化...'})
|
|
|
+
|
|
|
+ // 初始化超时处理
|
|
|
+ this.initTimeout = setTimeout(() => {
|
|
|
+ wx.hideLoading();
|
|
|
+ wx.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '设备初始化超时，请重试',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ }, 10000); // 10秒超时
|
|
|
+
|
|
|
+ xBlufi.notifyInitBleEsp32({
|
|
|
+ deviceId: options.deviceId,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ // 页面卸载时清除所有定时器
|
|
|
+ if (this.initTimeout) clearTimeout(this.initTimeout);
|
|
|
+ if (this.wifiListFetchTimeout) clearTimeout(this.wifiListFetchTimeout);
|
|
|
+ if (this.connectTimeout) clearTimeout(this.connectTimeout);
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ funListenDeviceMsgEvent: function(options) {
|
|
|
+ let that = this
|
|
|
+ let ssid_arry = this.wifiList;
|
|
|
+ switch (options.type) {
|
|
|
+ case xBlufi.XBLUFI_TYPE.TYPE_STATUS_CONNECTED:
|
|
|
+ console.log(options,'TYPE_STATUS_CONNECTED')
|
|
|
+ that.connected = options.result
|
|
|
+ if (!options.result) {
|
|
|
+ console.log('小程序与设备异常断开')
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case xBlufi.XBLUFI_TYPE.TYPE_CONNECT_ROUTER_RESULT:
|
|
|
+ console.log(options,'TYPE_CONNECT_ROUTER_RESULT')
|
|
|
+ wx.hideLoading();
|
|
|
+ if (this.connectTimeout) {
|
|
|
+ clearTimeout(this.connectTimeout);
|
|
|
+ this.connectTimeout = null;
|
|
|
+ }
|
|
|
+ if (!options.result)
|
|
|
+ wx.showModal({
|
|
|
+ title: '配网失败',
|
|
|
+ content: '请检查WiFi和密码是否正确',
|
|
|
+ showCancel: false,
|
|
|
+ })
|
|
|
+ else {
|
|
|
+ if (options.data.progress == 100) {
|
|
|
+ uni.setStorageSync(that.wifiSSID,that.wifiPWD)
|
|
|
+ uni.navigateTo({
|
|
|
+ url:'/pagesMy/wifiSuccess?pwtype='+this.type
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case xBlufi.XBLUFI_TYPE.TYPE_RECIEVE_CUSTON_DATA:
|
|
|
+ console.log(options.data,'收到自定义设备数据')
|
|
|
+ break;
|
|
|
+ case xBlufi.XBLUFI_TYPE.TYPE_CONNECT_NEAR_ROUTER_LISTS:
|
|
|
+ if (this.wifiListFetchTimeout) {
|
|
|
+ clearTimeout(this.wifiListFetchTimeout);
|
|
|
+ this.wifiListFetchTimeout = null;
|
|
|
+ }
|
|
|
+ wx.hideLoading();
|
|
|
+ if ('' === options.data.SSID) break;
|
|
|
+ if(!ssid_arry.includes(options.data.SSID)) ssid_arry.push(options.data.SSID)
|
|
|
+ that.wifiList = ssid_arry;
|
|
|
+ that.wifiListCache = [...ssid_arry]; // 缓存
|
|
|
+ that.wifiSSID = that.wifiList[0];
|
|
|
+ that.wifiPWD = uni.getStorageSync(that.wifiSSID)||'';
|
|
|
+ that.isInitOK = true
|
|
|
+ break;
|
|
|
+ case xBlufi.XBLUFI_TYPE.TYPE_INIT_ESP32_RESULT:
|
|
|
+ if (this.initTimeout) {
|
|
|
+ clearTimeout(this.initTimeout);
|
|
|
+ this.initTimeout = null;
|
|
|
+ }
|
|
|
+ wx.hideLoading();
|
|
|
+ if (options.result) {
|
|
|
+ // 检查是否有缓存的Wi-Fi列表
|
|
|
+ if (this.wifiListCache.length > 0) {
|
|
|
+ this.wifiList = [...this.wifiListCache];
|
|
|
+ this.wifiSSID = this.wifiList[0];
|
|
|
+ this.wifiPWD = uni.getStorageSync(this.wifiSSID) || '';
|
|
|
+ this.isInitOK = true;
|
|
|
+ } else {
|
|
|
+ xBlufi.notifySendGetNearRouterSsid()
|
|
|
+ wx.showLoading({
|
|
|
+ title: '获取周围WiFi列表...',
|
|
|
+ })
|
|
|
+
|
|
|
+ // 获取Wi-Fi列表超时处理
|
|
|
+ this.wifiListFetchTimeout = setTimeout(() => {
|
|
|
+ wx.hideLoading();
|
|
|
+ wx.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '获取Wi-Fi列表超时，请重试',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ }, 10000);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ that.connected = false
|
|
|
+ wx.showModal({
|
|
|
+ title: '温馨提示',
|
|
|
+ content: `设备初始化失败`,
|
|
|
+ showCancel: false, //是否显示取消按钮
|
|
|
+ })
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changePwd(){
|
|
|
+ this.isPwd = !this.isPwd;
|
|
|
+ },
|
|
|
+ initWiFi(){
|
|
|
+ // 如果有缓存直接使用
|
|
|
+ if (this.wifiListCache.length > 0) {
|
|
|
+ this.wifiList = [...this.wifiListCache];
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ wx.showLoading({ title: '获取周围WiFi列表...' });
|
|
|
+
|
|
|
+ // 获取Wi-Fi列表超时处理
|
|
|
+ this.wifiListFetchTimeout = setTimeout(() => {
|
|
|
+ wx.hideLoading();
|
|
|
+ wx.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '获取Wi-Fi列表超时，请重试',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ }, 10000);
|
|
|
+
|
|
|
+ xBlufi.notifySendGetNearRouterSsid()
|
|
|
+ },
|
|
|
+ connectWifi(){
|
|
|
+ let that = this;
|
|
|
+ if(!this.wifiSSID) return this.$showToast('请选择Wi-Fi')
|
|
|
+ if(!this.wifiPWD) return this.$showToast('请输入Wi-Fi密码')
|
|
|
+ wx.showLoading({
|
|
|
+ title: '正在配网...',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+
|
|
|
+ // 配网超时处理
|
|
|
+ this.connectTimeout = setTimeout(() => {
|
|
|
+ wx.hideLoading();
|
|
|
+ wx.showModal({
|
|
|
+ title: '配网超时',
|
|
|
+ content: '请检查WiFi密码或设备状态',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ }, 10000);
|
|
|
+
|
|
|
+ xBlufi.notifySendRouterSsidAndPassword({
|
|
|
+ ssid: that.wifiSSID,
|
|
|
+ password: that.wifiPWD
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toSelectWifi(){
|
|
|
+ this.show = true;
|
|
|
+ // 打开弹窗时自动获取Wi-Fi列表（如果没有缓存）
|
|
|
+ if (this.wifiList.length === 0 && this.wifiListCache.length === 0) {
|
|
|
+ this.initWiFi();
|
|
|
+ } else if (this.wifiListCache.length > 0 && this.wifiList.length === 0) {
|
|
|
+ // 使用缓存
|
|
|
+ this.wifiList = [...this.wifiListCache];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectWifi(item){
|
|
|
+ this.wifiSSID = item;
|
|
|
+ this.wifiPWD = uni.getStorageSync(item) || '';
|
|
|
+ this.show = false;
|
|
|
+ this.isInitOK = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+ .page{
|
|
|
+ padding: 0 40rpx 250rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ &>.title{
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #111111;
|
|
|
+ line-height: 36rpx;
|
|
|
+ margin-top: 64rpx;
|
|
|
+ }
|
|
|
+ .items{
|
|
|
+ margin-top: 188rpx;
|
|
|
+ .item{
|
|
|
+ margin-top: 80rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ border-bottom: 1rpx solid #E2E2E2;
|
|
|
+ .il{
|
|
|
+ width: calc(100% - 180rpx);
|
|
|
+ input{
|
|
|
+ border: none;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 42rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ir{
|
|
|
+ width: 160rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ background: #D9F159;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #252525;
|
|
|
+ line-height: 64rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .iimgs{
|
|
|
+ image{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .zt_btn{
|
|
|
+ margin-top: 100rpx;
|
|
|
+ }
|
|
|
+ .memo{
|
|
|
+ margin-top: 100rpx;
|
|
|
+ .m_title{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #111111;
|
|
|
+ line-height: 40rpx;
|
|
|
+ }
|
|
|
+ .m_p{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #7C8592;
|
|
|
+ line-height: 54rpx;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ph{
|
|
|
+ color: #7C8592;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wifis{
|
|
|
+ width: 670rpx;
|
|
|
+ max-height: 720rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ .top{
|
|
|
+ margin-top: 14rpx;
|
|
|
+ padding: 40rpx;
|
|
|
+ border-bottom: 1rpx solid #E2E2E2;
|
|
|
+ .tl{
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #111111;
|
|
|
+ line-height: 36rpx;
|
|
|
+ }
|
|
|
+ .tr{
|
|
|
+ image{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ }
|
|
|
+ text{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #7C8592;
|
|
|
+ line-height: 36rpx;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .list{
|
|
|
+ height: 609rpx;
|
|
|
+ overflow-y: auto;
|
|
|
+ padding: 30rpx 40rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .item{
|
|
|
+ width: 100%;
|
|
|
+ height: 120rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ border: 1rpx solid #E2E2E2;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ &:first-child{
|
|
|
+ margin-top: 0;
|
|
|
+ }
|
|
|
+ .il{
|
|
|
+ width: calc(100% - 134rpx);
|
|
|
+ image{
|
|
|
+ width: 42rpx;
|
|
|
+ height: 42rpx;
|
|
|
+ }
|
|
|
+ text{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #252525;
|
|
|
+ line-height: 30rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ width: calc(100% - 62rpx);
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ir{
|
|
|
+ width: 114rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background: #D9F159;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #252525;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
