柜子管理

pages/cabinet/cell.wxml

@@ -4,7 +4,7 @@
       <view class="mod1">
         <view class="mod2">
           <image src="https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng859bb3e0470362547a96eee0c6b7548d76441bf15d63701f3c42bbbac2fe1d69" class="icon3"></image>
-          <text lines="1" decode="true" class="word2">创星汇科技园1号&nbsp;NO.18</text>
+          <text lines="1" decode="true" class="word2">{{taskInfo.title}}</text>
         </view>
         <view class="mod3">
           <view class="bd2" bindtap="goto">

pages/cabinet/index.wxml

@@ -33,9 +33,26 @@
       </view>
     </view>
    
-      <view class="mod7" wx:for="{{taskInfo}}" wx:key="index">
-        <navigator url="/pages/cabinet/cell?id={{item.id}}" >
-        <view class="group6">
+    <view class="item_view" wx:for="{{taskInfo}}" wx:key="index">
+    <navigator url="/pages/cabinet/cell?id={{item.id}}" >
+        <image src="{{'/image/home/pic.png'}}" class="item_image"></image>
+        <view class="item_right">
+          <view>
+            <view class="item_right_t">
+              <view>No.{{item.device_no}}{{item.title}}</view>
+              <view wx:if="{{index==0}}">距离最近</view>
+            </view>
+            <view class="item_right_b">
+              <view>
+                <view class="{{item.is_online==1?'bggree_pot':''}}"></view>
+                <view class="{{item.is_online==1?'colorgree':''}}">{{item.is_online==1?'在线':'离线'}}</view>
+              </view>
+              <view>{{item.address}}</view>
+            </view>
+          </view>
+          <view>{{item.distance}}m</view>
+        </view>
+        <!-- <view class="group6">
           <view class="bd1">
             <view class="mod8">
               <van-image width="80rpx" height="80rpx" lazy-load src="{{'/image/home/pic.png'}}" />
@@ -58,7 +75,7 @@
         </view>
         <view class="group8">
           <view class="group9"></view>
-        </view>
+        </view> -->
       </navigator>
       </view>
 

pages/cabinet/index.wxss

@@ -341,7 +341,7 @@
   flex-direction: row;
   display: flex;
   margin: 30rpx 0 0 20rpx;
-  justify-content: center;
+  /* justify-content: center; */
 }
 .bd1 {
   z-index: 66;
@@ -1147,4 +1147,107 @@
   background-size: 47rpx 24rpx;
   display: flex;
   flex-direction: column;
+}
+
+.item_view>navigator{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #fff;
+  padding: 0 0 0 30rpx;
+}
+.item_image{
+  width: 80rpx;
+  height: 80rpx;
+  display: inline-block;
+  margin-right: 20rpx;
+}
+.item_right{
+  display: flex;
+  justify-content: space-between;
+  padding: 30rpx 30rpx 30rpx 0;
+  flex: 1;
+  /* min-height: 80rpx; */
+  border-bottom: 1rpx solid #ededed;
+}
+.item_right>view:nth-child(1){
+  flex: 1;
+  height: 100%;
+  display: flex;
+  justify-content: space-between;
+  flex-direction: column;
+}
+.item_right>view:nth-child(1)>view{
+  display: flex;
+  align-items: center;
+}
+.item_right>view:nth-child(2){
+  width: 120rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  align-items: flex-end;
+  font-size: 26rpx;
+  color: #666;
+}
+
+.item_right_b>view:nth-child(1){
+  display: flex;
+  align-items: center;
+}
+.item_right_b>view:nth-child(1)>view:nth-child(1){
+  width: 12rpx;
+  height: 12rpx;
+  border-radius: 100rpx;
+  margin-right: 10rpx;
+  background: #BDBDBD;
+}
+.item_right_b>view:nth-child(1)>view:nth-child(2){
+  flex: 1;
+  font-size: 26rpx;
+  color: #BDBDBD;
+  margin-right: 36rpx;
+}
+.bggree_pot{
+  background: #55BE17 !important;
+}
+.colorgree{
+  color: #666 !important;
+}
+.item_right_b>view:nth-child(2){
+  max-width: 350rpx;
+  font-size: 26rpx;
+  color: #666;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  overflow: hidden;
+}
+.item_right_t{
+  margin-bottom: 12rpx;
+}
+.item_right_t>view:nth-child(1){
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #333;
+  max-width: 460rpx;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  overflow: hidden;
+}
+.box1>.item_view:nth-child(1)>navigator>.item_right>view:nth-child(1)>.item_right_t>view:nth-child(1){
+  max-width: 360rpx !important;
+}
+.item_right_t>view:nth-child(2){
+  font-size: 22rpx;
+  color: #FF7300;
+  width: 100rpx;
+  height: 30rpx;
+  background: #FFF3EA;
+  border-radius: 2rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
 }