修改 wifi UI

src/common/bluetooth.ts

@@ -102,8 +102,20 @@ class Bluetooth {
       deviceId,
       state: true,
       serviceId: BLE_SERVICE_ID,
+      characteristicId: DEVICE_TOKEN_TOKEN
+    })
+    await bluetooth.notifyBLECharacteristicValueChange({
+      deviceId,
+      state: true,
+      serviceId: BLE_SERVICE_ID,
       characteristicId: WIFI_CHARACTERISTIC_ID
     })
+    // await bluetooth.writeBLECharacteristicValue({
+    //   deviceId,
+    //   serviceId: BLE_SERVICE_ID,
+    //   characteristicId: DEVICE_TOKEN_TOKEN,
+    //   value: new Uint8Array([2]).buffer
+    // })
     this.listenBleValueChange(deviceId)
   }
 
@@ -114,7 +126,7 @@ class Bluetooth {
 
   /** 蓝牙的监听队列 */
   listenBleValueChange(deviceId: string) {
-    console.log(deviceId, 'deviceId')
+    console.log(deviceId, 'my deviceId')
     // 来自设备端的通知
     bluetooth.onBLECharacteristicValueChange(async ({ value, characteristicId }) => {
       switch (characteristicId) {
@@ -128,10 +140,12 @@ class Bluetooth {
           break
         case DEVICE_TOKEN_ID:
           // 设备 token 信息回调
+          console.log('设备 token 信息回调', value, deviceId)
           this.formatToken(deviceId, value)
           break
         case DEVICE_TOKEN_TOKEN:
           // 设备 token 信息回调
+          console.log('设备 formatDeviceToken 信息回调', value, deviceId)
           this.formatDeviceToken(deviceId, value)
           break
         default:
@@ -145,7 +159,7 @@ class Bluetooth {
     try {
       const { page, advertisData } = await analysisPage(value)
       if (page === 0) {
-        // 数据传输完毕
+        // 数据传输完毕 :一条数据
         this.getWifiListCallBack && this.getWifiListCallBack(JSON.parse(advertisData))
       }
       bluetooth.writeBLECharacteristicValue({
@@ -193,8 +207,8 @@ class Bluetooth {
     console.log(await analysisPage(value), 'formatDeviceToken')
     bluetooth.writeBLECharacteristicValue({
       deviceId,
-      serviceId: BLE_DEVICE_SERVICE_ID,
-      characteristicId: DEVICE_TOKEN_ID,
+      serviceId: BLE_SERVICE_ID,
+      characteristicId: DEVICE_TOKEN_TOKEN,
       value: new Uint8Array([page]).buffer
     })
     page === 0 && console.log(token)
@@ -211,6 +225,12 @@ class Bluetooth {
     await bluetooth.notifyBLECharacteristicValueChange({
       deviceId,
       state: true,
+      serviceId: BLE_SERVICE_ID,
+      characteristicId: DEVICE_TOKEN_TOKEN
+    })
+    await bluetooth.notifyBLECharacteristicValueChange({
+      deviceId,
+      state: true,
       serviceId: BLE_DEVICE_SERVICE_ID,
       characteristicId: DEVICE_TOKEN_ID
     })

src/pages/home/film/schedule_add/components/device/index.tsx

@@ -329,7 +329,7 @@ class DeviceSelect extends Component {
                 {items[activeIndex]}
               </Text>
               <Image
-                src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/list-icon.png"
+                src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/down-icon.png"
                 className="triangle"
                 onClick={this.showModalView}
                 onBlur={() => {

src/pages/system/wifi_list/index.scss

@@ -5,6 +5,7 @@
   height: 100%;
   display: flex;
   flex-direction: column;
+  background-color: $bgColor;
 
   &-scroll {
     flex: 1;
@@ -17,7 +18,7 @@
   }
 
   &-content {
-    padding: 0 40px;
+    padding: 0 36px;
 
     @include eject(box-sizing, border-box);
   }
@@ -25,10 +26,12 @@
   &-title {
     width: 100%;
     padding: 20px 0;
-    font-size: 24px;
-    color: $text-color;
-    border: 0 solid $border-color;
-    border-bottom-width: 1px;
+    color: rgba(153, 153, 153, 1);
+    font-size: 28px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    margin-bottom: 10px;
+    margin-top: 17px;
 
     @include eject(display, block);
     @include eject(box-sizing, border-box);
@@ -37,9 +40,13 @@
   &-item {
     display: flex;
     flex-direction: row;
-    padding: 40px 0 40px 10px;
+    align-items: center;
+    padding: 22px 40px;
+    box-sizing: border-box;
+    background-color: #fff;
+    margin: 15px 0;
     border: 0 solid $border-color;
-    border-bottom-width: 1px;
+    border-radius: 6px;
 
     /* postcss-pxtransform rn eject enable */
     &:last-of-type {
@@ -50,15 +57,31 @@
 
     &-name {
       flex: 1;
+      font-size: 31px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: rgba(51, 51, 51, 1);
       margin-right: 40px;
 
       @include lamp-clamp(1);
     }
+
+    .lock {
+      width: 17px;
+      height: 23px;
+    }
+
+    .level {
+      margin-left: 26px;
+      width: 29px;
+      height: 23px;
+    }
   }
 
   &-bottom-bar {
     width: 100%;
     border-radius: 0;
+    background-color: #ff9110 !important;
     // height: 90px;
     // padding: 30px 0;
     // text-align: center;

src/pages/system/wifi_list/index.tsx

@@ -3,7 +3,7 @@ import Ble from '@/common/bluetooth'
 import Modal from '@/conpoments/modal'
 import { ComponentClass } from 'react'
 import Taro, { Component, Config } from '@tarojs/taro'
-import { View, Text, ScrollView, Input, Button } from '@tarojs/components'
+import { View, Text, ScrollView, Input, Button, Image } from '@tarojs/components'
 import { connect } from '@tarojs/redux'
 import { getFilmList } from '@/actions/asyncCounter'
 
@@ -109,6 +109,19 @@ class WifiList extends Component {
     }
   }
 
+  // 过滤信号强度 0 到 -100 绝对值越小越好
+  filterRssi(rssi: number) {
+    if (rssi >= -25) {
+      return '4-icon.png'
+    } else if (rssi >= -50) {
+      return '3-icon.png'
+    } else if (rssi >= -75) {
+      return '2-icon.png'
+    } else {
+      return '1-icon.png'
+    }
+  }
+
   // wifi 列表信息更新回调
   getWiFiListCallBack(wifiItem: IWifiListItem) {
     this.initLoading &&
@@ -205,6 +218,7 @@ class WifiList extends Component {
 
   render() {
     const { wifiList, openModal } = this.state
+    let url = 'https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/wifi'
     return (
       <View className="wifi">
         <View className="wifi-scroll">
@@ -214,7 +228,13 @@ class WifiList extends Component {
               {wifiList.map(item => (
                 <View className="wifi-item" key={item.id} onClick={() => this.openModal(item)}>
                   <Text className="wifi-item-name">{item.ssid}</Text>
-                  {item.type !== 'OPEN' && <Text>锁</Text>}
+                  {item.type !== 'OPEN' && (
+                    <Image
+                      className="lock"
+                      src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/lock-icon.png"
+                    />
+                  )}
+                  <Image className="level" src={url + this.filterRssi(item.rssi)} />
                 </View>
               ))}
             </View>