feature: 添加固件升级进度条进度增长

pages/piano/firmware/firmware.js

@@ -22,7 +22,6 @@ Page({
     isUpdated: true,
     showModal: false, // 控制模态框显示隐藏
     progress: 0, // 进度条初始值
-    showInfo: true
   },
 
   /**
@@ -67,7 +66,7 @@ Page({
   },
 
   // 显示升级进度条模态框
-  showProgressModal: function () {
+  showUpgradeProgress: function () {
     var that = this;
     that.setData({
       showModal: true
@@ -79,7 +78,7 @@ Page({
       if (progress < 100) {
         console.log("gassdfadfasdfaf====" + progress);
         that.setData({
-          progress: progress + 1,
+          progress: progress + 0.1,
         });
       } else {
         clearInterval(interval);
@@ -89,7 +88,7 @@ Page({
           progress: 0
         });
       }
-    }, 100);
+    }, 10);
   },
 
   /**

pages/piano/firmware/firmware.wxml

@@ -15,29 +15,13 @@
     <view bindtap="toUpdate" class="{{isUpdated ? 'action' : ''}}">固件更新</view>
   </view>
 
-  <!-- <view class="container"> -->
-  <!-- 点击按钮显示升级进度条弹窗 -->
-  <!-- <button bindtap="showUpgradeProgress">升级应用</button> -->
-
-
-  <!-- </view> -->
-
-
-
-  <view class="container">
-    <!-- 点击按钮显示带背景黑蒙版的弹窗 -->
-    <button bindtap="showProgressModal">显示带背景黑蒙版的弹窗</button>
-
+  <view class="update_progress_public">
     <!-- 背景黑蒙版 -->
-    <view class="mask" wx:if="{{showModal}}"></view>
-
+    <view class="update_progress_mask" wx:if="{{showModal}}"></view>
     <!-- 自定义模态框，用于显示带进度条的弹窗 -->
-    <view class="modal" wx:if="{{showModal}}">
+    <view class="update_progress_modal" wx:if="{{showModal}}">
       <text>正在升级中</text>
-      <progress percent="{{progress}}" stroke-width="4" />
+      <progress percent="{{progress}}" style="width: 500rpx;" stroke-width="4" />
     </view>
   </view>
-
-
-
 </view>

pages/piano/firmware/firmware.wxss

@@ -35,15 +35,15 @@
   background: #6547A3;
 }
 
-
-.container {
+.update_progress_public {
   display: flex;
   justify-content: center;
   align-items: center;
+  width: 100%;
   height: 100vh;
 }
 
-.mask {
+.update_progress_mask {
   position: fixed;
   top: 0;
   left: 0;
@@ -53,17 +53,17 @@
   z-index: 999;
 }
 
-.modal {
+.update_progress_modal {
   position: fixed;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   background-color: #fff;
-  padding: 20rpx;
+  padding: 30rpx;
+  /* 置顶优先级 */
   z-index: 1000;
 }
 
-
 progress {
   width: 100%;
   margin: 10rpx auto;