feature: 增加列表，增加添加设备等

pages/index/index.js

@@ -41,7 +41,6 @@ Page({
     MenuButtonheight: app.globalData.MenuButtonheight,
     MenuButtonTop: app.globalData.MenuButtonTop,
     actionIndex: null,
-    isShowDevicelist: false,
     luoma: ["Ⅰ", "Ⅱ", "Ⅲ", "Ⅳ", "Ⅴ", "Ⅵ", " Ⅶ", "Ⅷ", "Ⅸ", "Ⅹ", "Ⅺ", "Ⅻ"],
     channelData: [],
     deviceList: [],
@@ -49,7 +48,6 @@ Page({
     showLogin: false,
     isOneLoading: true,
     uid: null,
-    showDelete: false,
     isSetWake: false,
     thisDeviceMac: null,
     battery: 4, // 0≤电量<20，0格
@@ -376,6 +374,7 @@ Page({
     _this.subscribeDevicesStatus();
   },
 
+  // [{"deviceId":"BLUFI_7cdfa1fcbb24","name":"BLUFI_7cdfa1fcbb24","state":"online","ProdModel":"MW-2AX(WIFI-N)","devName":"猫王小王子OTR-X"}]
   online(payloads) {
     // 设置在线状态
     _this.data.deviceList.map((v, index) => {
@@ -383,6 +382,7 @@ Page({
         _this.data.deviceList[index].state = payloads.state;
       }
     });
+
     _this.setData({
       deviceList: _this.data.deviceList,
     });
@@ -449,12 +449,6 @@ Page({
     });
   },
 
-  isShowDevicelistFun() {
-    this.setData({
-      isShowDevicelist: !_this.data.isShowDevicelist
-    })
-  },
-
   actionMusic(e) {
     if (e.currentTarget.dataset.index === this.data.actionIndex) {
       return;
@@ -520,24 +514,6 @@ Page({
     return `AIrSMArT_${this.data.deviceList[this.data.deviceListIndex].name.split("BLUFI_")[1]}`
   },
 
-  goLogin() {
-    wx.navigateTo({
-      url: './../login/login',
-    });
-  },
-
-  goDeviceConnect() {
-    routeUtil.jump(route_constant.deviceList)
-    this.setData({
-      isShowDevicelist: false
-    })
-    return;
-    wx.navigateTo({
-      url: './../deviceConnect0/deviceConnect0',
-    });
-
-  },
-
   getchannelData(clientType) {
     let _this = this;
     if (this.data.deviceListIndex === null) {
@@ -590,73 +566,69 @@ Page({
     })
   },
 
-  showDelete() {
-    // wx.navigateTo({
-    //   url: './../deviceRoter3/deviceRoter3',
-    // })
-    this.setData({
-      showDelete: !this.data.showDelete
-    });
-  },
   deleteDevice(e) {
-
-    const id = this.data.deviceList[e.currentTarget.dataset.index].deviceId;
-    let name = _this.data.deviceListIndex !== null ? this.data.deviceList[_this.data.deviceListIndex].name : null;
-    const deviceList = this.data.deviceList.filter((v, i) => {
-      return id !== v.deviceId
-    });
-    // 取消订阅
-    app.unsubscribe(`/AIrSMArT_${_this.data.deviceList[e.currentTarget.dataset.index].name.split("BLUFI_")[1]}/user/pub_response`);
-
-    wx.setStorage({
-      key: "devicelist",
-      data: JSON.stringify(deviceList),
-      success() {
-
-        _this.setData({
-          deviceList,
-          thisDeviceMac: null
-        });
-
-        // 当前没有设备
-        if (deviceList.length === 0) {
-          _this.setData({
-            showDelete: false,
-            actionIndex: null,
-            deviceListIndex: null,
-            isShowDevicelist: false,
+    wx.showModal({
+      title: '确定删除？',
+      success: function (res) {
+        if (res.confirm) {
+          const id = this.data.deviceList[e.currentTarget.dataset.index].deviceId;
+          let name = _this.data.deviceListIndex !== null ? this.data.deviceList[_this.data.deviceListIndex].name : null;
+          const deviceList = this.data.deviceList.filter((v, i) => {
+            return id !== v.deviceId
           });
-        }
+          // 取消订阅
+          app.unsubscribe(`/AIrSMArT_${_this.data.deviceList[e.currentTarget.dataset.index].name.split("BLUFI_")[1]}/user/pub_response`);
+
+          wx.setStorage({
+            key: "devicelist",
+            data: JSON.stringify(deviceList),
+            success() {
 
-        if (_this.data.deviceListIndex === null) {
-          return
-        };
-        if (e.currentTarget.dataset.index === _this.data.deviceListIndex) {
-          let index_ = null;
-          deviceList.map((v, index) => {
-            if (v.state === "online" && index_ === null) {
-              index_ = index;
-            }
-          });
-          if (index_ !== null) {
-            _this.actionDevice(index_);
-          } else {
-            _this.setData({
-              actionIndex: null,
-              deviceListIndex: null,
-            });
-          };
-        } else {
-          deviceList.map((v, index) => {
-            if (v.name === name) {
               _this.setData({
-                deviceListIndex: index,
+                deviceList,
+                thisDeviceMac: null
               });
+
+              // 当前没有设备
+              if (deviceList.length === 0) {
+                _this.setData({
+                  actionIndex: null,
+                  deviceListIndex: null,
+                });
+              }
+
+              if (_this.data.deviceListIndex === null) {
+                return
+              };
+              if (e.currentTarget.dataset.index === _this.data.deviceListIndex) {
+                let index_ = null;
+                deviceList.map((v, index) => {
+                  if (v.state === "online" && index_ === null) {
+                    index_ = index;
+                  }
+                });
+                if (index_ !== null) {
+                  _this.actionDevice(index_);
+                } else {
+                  _this.setData({
+                    actionIndex: null,
+                    deviceListIndex: null,
+                  });
+                };
+              } else {
+                deviceList.map((v, index) => {
+                  if (v.name === name) {
+                    _this.setData({
+                      deviceListIndex: index,
+                    });
+                  }
+                });
+              }
             }
           });
         }
       }
-    })
+    });
 
   },
   goWake() {
@@ -742,4 +714,29 @@ Page({
       });
     }
   },
+
+  addDevice() {
+    var that = this;
+    var showLogin = that.data.showLogin;
+    if (!showLogin) {
+      wx.navigateTo({
+        url: './../login/login'
+      });
+      return;
+    }
+
+    if (deviceList && deviceList.length === 0) {
+      that.goDeviceConnect();
+      return;
+    }
+  },
+
+  goDeviceConnect() {
+    wx.navigateTo({
+      url: './../deviceConnect0/deviceConnect0',
+    });
+  },
+
+  onTapIem() {},
+
 })

pages/index/index.json

@@ -1,4 +1,5 @@
 {
+  "enablePullDownRefresh": false,
   "usingComponents": {
     "nav-bar": "./../components/navbar/navbar"
   }

pages/index/index.wxml

@@ -4,7 +4,7 @@
 </nav-bar>
 
 <view class="container">
-  <view wx:if="{{indexPage==0}}" class="mair" style="height: calc(100vh - 118rpx - {{navBarHeight}}px);">
+  <view wx:if="{{indexPage==0}}" class="mair" style="height: calc(100vh - 120rpx - {{navBarHeight}}px);">
 
     <view style="font-size: 32rpx; color: #333333; margin-top: 14rpx;">下午好，Demon</view>
 
@@ -18,48 +18,34 @@
         </block>
       </swiper>
     </view>
-    <!-- <swiper wx:if="{{banner.length>0}}" class="banner_container" indicator-dots="{{banner.length>1}}" autoplay="true" interval="2000" duration="500" circular="true">
-      <block wx:for="{{banner}}" wx:key="index">
-        <swiper-item>
-          <image class="banner_item" src="{{item.image}}" mode="aspectFill" bindtap="clickActivity" data-item="{{item}}" lazy-load="true"></image>
-        </swiper-item>
-      </block>
-    </swiper> -->
 
-    <view class='nav-wrap' style='height: calc({{navBarHeight}}px - {{MenuButtonTop}}px); padding-top: {{MenuButtonTop}}px;'>
-      <view wx:if="{{deviceList && deviceList.length > 0 && !showLogin}}" bindtap="isShowDevicelistFun" class="nav-info" style="height: {{ MenuButtonheight }}px;">
-        <image class="device-pic" mode="heightFix" src="./../../img/min.png"></image>
-        <text>{{deviceList[deviceListIndex].devName}}</text>
-        <image class="j" mode="heightFix" src="./../../img/{{isShowDevicelist ? 'j_top' : 'j_bottom'}}.png"></image>
-      </view>
-
-      <view style="height: {{ MenuButtonheight }}px;" bindtap="goDeviceConnect" class="nav-info" wx:elif="{{deviceList && deviceList.length === 0 && !showLogin}}">
-        <image class="z" mode="heightFix" src="./../../img/z.png"></image>
-        <text>连接设备</text>
-      </view>
-
-      <view style="height: {{ MenuButtonheight }}px;" wx:elif="{{showLogin}}" class="nav-info">
-        <image class="z" mode="heightFix" src="./../../img/z.png"></image>
-        <text bindtap="goLogin">点击登录</text>
-      </view>
+    <view class="add_device_public" bind:tap="addDevice">
+      <image mode="heightFix" src="./../../img/add_device.png" style="width: 48rxp;height: 48rpx;"></image>
+      <view style="color: white; margin-left: 8rpx; font-size: 32rpx;">添加设备</view>
     </view>
 
-    <!--播放信息-->
-    <view wx:if="{{isShowDevicelist}}" class="deviceList" catchtap="isShowDevicelistFun">
-      <view class="mz">
-        <view class="li-view" wx:for="{{deviceList}}">
-          <view bindtap="actionDeviceIndex" style="opacity: {{item.state && item.state === 'online' ? '1' : '0.6'}};" data-index="{{index}}" class="li {{deviceListIndex === index ? 'action' : ''}}">
-            <image mode="widthFix" src="./../../img/min.png"></image>
-            <text class="deviceName">{{item.devName}}</text>
-            <text class="onli">{{item.state && item.state === "online" ? "在线" : "离线"}}</text>
-            <image data-index="{{index}}" catchtap="deleteDevice" wx:if="{{showDelete}}" class="delete" mode="widthFix" src="./../../img/l.png"></image>
+    <view style="height: calc(100vh - 118rpx - 14rpx - 20rpx - 32rpx - 264rpx - 88rpx - 64rpx - 58rpx -  {{navBarHeight}}px);margin-top: 10rpx;padding-top: 22rpx; ">
+
+      <view wx:if="{{deviceList}}">
+        <block wx:key="key" wx:for-item="item" wx:for-index="index" wx:for="{{deviceList}}">
+          <view class="item_public" style="border: {{item.state && item.state === 'online' ? '2rpx solid #6546A3' : '2rpx solid #F2F5F7'}};" bind:tap="{{item.state && item.state === 'online' ? 'onTapIem' : ''}}">
+            <image class="item_public_image" mode="heightFix" src="./../../img/min.png" style="opacity: {{item.state && item.state === 'online' ? '1' : '0.5'}};"></image>
+            <view class="item_public_right" style="margin-right: 26rpx; opacity: {{item.state && item.state === 'online' ? '1' : '0.5'}};">
+              <view style="height: 190rpx; margin-top: 37rpx; margin-left: 32rpx; flex-direction: column; display: flex;">
+                <view style="flex: 1;">
+                  <view style="display: flex;">
+                    <view style="color: #333333; font-size: 28rpx; flex: 1;padding-right: 5rpx;">{{item.devName}}</view>
+                    <image mode="heightFix" src="./../../img/add_device_arrow.png" style="width: 48rxp;height: 48rpx;"></image>
+                  </view>
+                  <view style="color: #666666; font-size: 24rpx;">{{item.state && item.state === "online" ? "在线" : "离线"}}</view>
+                </view>
+                <view style="align-items: center; justify-content: center; vertical-align: middle;width: 280rpx;height: 64rpx;background-color: #F2F5F7;  border-radius: 52rpx; text-align: center; justify-content: center;  display: flex;" data-index="{{index}}" catchtap="deleteDevice">
+                  <view style="color: #666666; font-size: 28rpx; ">删除</view>
+                </view>
+              </view>
+            </view>
           </view>
-        </view>
-        <view class="but" style="width: 100%; float: left;">
-          <view wx:if="{{!showDelete}}"><text style="background-color: #999;" catchtap="showDelete">删除</text></view>
-          <view wx:if="{{!showDelete}}"><text bindtap="goDeviceConnect">新增</text></view>
-          <view wx:else><text catchtap="showDelete">完成</text></view>
-        </view>
+        </block>
       </view>
     </view>
   </view>

pages/index/index.wxss

@@ -771,4 +771,36 @@
    /* 当前选中指示点的宽度（可以比未选中时稍大） */
    height: 12px;
    /* 当前选中指示点的高度（可以比未选中时稍大） */
+ }
+
+
+ .add_device_public {
+   background-color: #6546A3;
+   width: 90%;
+   height: 88rpx;
+   margin-top: 64rpx;
+   margin-left: 5%;
+   border-radius: 72rpx;
+   display: flex;
+   text-align: center;
+   justify-content: center;
+   align-items: center;
+ }
+
+ .item_public {
+   width: 100%;
+   height: 264rpx;
+   border: 2rpx solid #6546A3;
+   border-radius: 24rpx;
+   display: flex;
+ }
+
+ .item_public_image {
+   height: 200rpx;
+   margin-left: 32rpx;
+   margin-top: 32rpx;
+ }
+
+ .item_public_right {
+   flex: 1;
  }