设备展示优化

src/pages/recycleDevice/recycleDevice.vue

@@ -199,76 +199,63 @@ const fnPostDeviceCommandSnapshot = (bucketCode: any) => {
       @clickLeft="fnGoDevCodeHome"
     />
     <scroll-view enable-back-to-top class="scroll-view" scroll-y>
-      <view v-if="!isControlled">
-        <uni-card class="stypage-warn">
-          <button
-            size="default"
-            type="default"
-            class="btn1"
-            hover-class="btn1-is-hover"
-            @click="fnApply"
-          >
-            申请控制设备
-          </button>
-        </uni-card>
-      </view>
-      <view v-else>
-        <template v-for="(bucketItem, index1) in devConf.bucketList">
-          <uni-card v-if="bucketItem.isShow == 1" :key="index1">
-            <uni-row class="demo-row">
-              <uni-col :span="8">
-                <view class="demo-col" style="padding: 15px 5px">
-                  <image
-                    v-for="(bucketImgItem, index2) in bucketItem.bucketImg"
-                    :key="index2"
-                    style="width: 100%; height: 150px; background-color: #eeeeee"
-                    mode="aspectFit"
-                    :src="'http://222.71.165.188:8808' + bucketImgItem.url"
+      <template v-for="(bucketItem, index1) in devConf.bucketList">
+        <uni-card v-if="bucketItem.isShow == 1" :key="index1">
+          <uni-row class="demo-row">
+            <uni-col :span="8">
+              <view class="demo-col" style="padding: 15px 5px">
+                <image
+                  v-for="(bucketImgItem, index2) in bucketItem.bucketImg"
+                  :key="index2"
+                  style="width: 100%; height: 150px; background-color: #eeeeee"
+                  mode="aspectFit"
+                  :src="'http://222.71.165.188:8808' + bucketImgItem.url"
+                >
+                </image>
+              </view>
+            </uni-col>
+            <uni-col :span="16">
+              <view style="padding: 15px 15px">
+                <view>
+                  <text style="color: #433c16; font-size: 40rpx">{{ bucketItem.showName }}</text>
+                </view>
+                <view>
+                  <text style="color: blue; font-size: 30rpx"
+                    >当前重量：{{ bucketItem.currentWeight }}</text
+                  >
+                </view>
+                <view>
+                  <text style="color: red; font-size: 30rpx"
+                    >预警重量：{{ bucketItem.warningWeight }} KG</text
                   >
-                  </image>
                 </view>
-              </uni-col>
-              <uni-col :span="16">
-                <view style="padding: 15px 45px">
-                  <view>
-                    <text style="color: #433c16; font-size: 40rpx">{{ bucketItem.showName }}</text>
-                  </view>
-                  <view>
-                    <text style="color: blue; font-size: 30rpx"
-                      >当前重量：{{ bucketItem.currentWeight }}</text
-                    >
-                  </view>
-                  <view>
-                    <text style="color: red; font-size: 30rpx"
-                      >预警重量：{{ bucketItem.warningWeight }} KG</text
-                    >
-                  </view>
-                  <view>
-                    <text style="color: green; font-size: 30rpx">
-                      占比：{{
-                        Math.round((bucketItem.currentWeight / bucketItem.warningWeight) * 100)
-                      }}
-                      %</text
-                    >
-                  </view>
+                <view>
+                  <text style="color: green; font-size: 30rpx">
+                    占比：{{
+                      Math.round((bucketItem.currentWeight / bucketItem.warningWeight) * 100)
+                    }}
+                    %</text
+                  >
                 </view>
-              </uni-col>
-            </uni-row>
-            <view style="text-align: center">
-              <button
-                :disabled="bucketItem.status == 1 ? false : true"
-                size="mini"
-                type="default"
-                class="btn-sty1"
-                hover-class="is-hover"
-                @click="fnDoorOpen(bucketItem.bucketCode, bucketItem.closeDelay, bucketItem.price)"
-              >
-                开门
-              </button>
-            </view>
-          </uni-card>
-        </template>
-      </view>
+              </view>
+              <view style="text-align: center">
+                <button
+                  :disabled="(bucketItem.status == 1 ? false : true) || !isControlled"
+                  size="mini"
+                  type="default"
+                  class="btn-sty1"
+                  hover-class="is-hover"
+                  @click="
+                    fnDoorOpen(bucketItem.bucketCode, bucketItem.closeDelay, bucketItem.price)
+                  "
+                >
+                  开门
+                </button>
+              </view>
+            </uni-col>
+          </uni-row>
+        </uni-card>
+      </template>
       <uni-popup ref="refMsgA" type="center" :mask-click="false">
         <uni-card>
           <template v-slot:header>
@@ -297,8 +284,9 @@ page {
   padding: 5rpx;
 
   .btn-sty1 {
-    width: 60%;
-    margin: 12rpx 0rpx;
+    width: 80%;
+    margin: 30rpx auto;
+    border-radius: 30px;
     color: #ffffff;
     background-color: #51b6ff;
     border-color: #51b6ff;