ソースを参照

优化5号板子UI细节

wzh 2 年 前
コミット
83bdbe6d92
1 ファイル変更61 行追加40 行削除
  1. 61 40
      pages/device/detail.vue

+ 61 - 40
pages/device/detail.vue

@@ -148,11 +148,21 @@
     left: 40rpx;width: 20px;height:15px;position: absolute;"/>
                 <view style="position: absolute;top:68rpx;left:40rpx;font-size: 12px;" :class="pressTurn == 1?'active_on':''">挤压</view>
               </view>
-              <view style="display: inline-block; position: absolute;top:30rpx;width: 150rpx" v-if="pressTurn == 1"  class="roate">	<u-line-progress :percentage="turnPercent" activeColor="#50ACFF" height="6" :showText="false"></u-line-progress>
+              <view style="display: inline-block; position: absolute;top:30rpx;width: 180rpx" v-if="pressTurn == 1"  class="roate">
+                <view style="width: 100%;height: 6px;background: white;border-radius: 10px;border:1px solid lightgray">
+                  <view :style="lineProgreeStyle"></view>
+                </view>
+
               </view>
-              <view style="display: inline-block; position: absolute;top:30rpx;width: 150rpx" v-if="resetTurn == 1">	<u-line-progress :percentage="turnPercent" activeColor="#50ACFF" height="6" :showText="false"></u-line-progress>
+              <view style="display: inline-block; position: absolute;top:30rpx;width: 180rpx" v-if="resetTurn == 1">
+                <view style="width: 100%;height: 6px;background: white;border-radius: 10px;border:1px solid lightgray">
+                  <view :style="lineProgreeStyle"></view>
+                </view>
               </view>
-              <view style="display: inline-block; position: absolute;top:30rpx;width: 150rpx" v-if="resetTurn == 0 && pressTurn == 0">	<u-line-progress :percentage="turnPercent" activeColor="#50ACFF" height="6" :showText="false"></u-line-progress>
+              <view style="display: inline-block; position: absolute;top:30rpx;width: 180rpx" v-if="resetTurn == 0 && pressTurn == 0">
+                <view style="width: 100%;height: 6px;background: white;border-radius: 10px;border:1px solid lightgray">
+                  <view :style="lineProgreeStyle"></view>
+                </view>
               </view>
               <view  style="width: 50px;height: 150rpx;display: inline-block">
                 <image @click="setResetTurn" :src="imgUrl+'/detail/right_on.png'" v-if="resetTurn == 1" style="top:20rpx;
@@ -497,21 +507,21 @@
       <scroll-view style="height: 88%;padding:20% 0%;" scroll-y="true">
         <view style="text-align:center">设置</view>
         <view>
-          <view class="prop-item">
-            <view class="prop-item-image">
-              <image :src="imgUrl+'/setting/net.png'" style="width: 100%;height:100%;"/>
-            </view>
-            <view class="prop-item-left">网络连接</view>
-            <view class="prop-item-right">
-              <view v-if="deviceInfo.status == 3">
-                  已连接
-              </view>
-              <view v-else>
-                未连接
-<!--                <uni-icons type="forward" size="16"></uni-icons>-->
-              </view>
-            </view>
-          </view>
+<!--          <view class="prop-item">-->
+<!--            <view class="prop-item-image">-->
+<!--              <image :src="imgUrl+'/setting/net.png'" style="width: 100%;height:100%;"/>-->
+<!--            </view>-->
+<!--            <view class="prop-item-left">网络连接</view>-->
+<!--            <view class="prop-item-right">-->
+<!--              <view v-if="deviceInfo.status == 3">-->
+<!--                  已连接-->
+<!--              </view>-->
+<!--              <view v-else>-->
+<!--                未连接-->
+<!--&lt;!&ndash;                <uni-icons type="forward" size="16"></uni-icons>&ndash;&gt;-->
+<!--              </view>-->
+<!--            </view>-->
+<!--          </view>-->
           <view class="prop-item" v-if="firstTab">
             <view class="prop-item-image">
               <image :src="imgUrl+'/setting/oper_temp.png'" style="width: 100%;height:100%;"/>
@@ -525,7 +535,7 @@
             <view class="prop-item-image">
               <image :src="imgUrl+'/setting/current_icon6.png'" style="width: 100%;height:100%;"/>
             </view>
-            <view class="prop-item-left">有效电流值</view>
+            <view class="prop-item-left">当前扭力</view>
             <view class="prop-item-right" >
               {{validCurrent}}MA
             </view>
@@ -534,7 +544,7 @@
             <view class="prop-item-image">
               <image :src="imgUrl+'/setting/current_icon5.png'" style="width: 100%;height:100%;"/>
             </view>
-            <view class="prop-item-left">扭力</view>
+            <view class="prop-item-left">扭力设置</view>
             <view class="prop-item-right" @click="showLiuProp">
               {{turnCurrent}}MA<uni-icons type="forward" size="16"></uni-icons>
             </view>
@@ -689,6 +699,7 @@ import config from '@/config'
 export default {
   data(){
     return {
+      lineProgreeStyle:"width:0%;background:#50ACFF;height: 100%;",
       liuzhuanPopDlg:false,
       turnPercent:1,
       onlineStatus:false,
@@ -808,11 +819,12 @@ export default {
       tempFengBianWendu:0,
       boardType:4,//板子类型
       lineTimer:null,
-      validCurrent:0,//有效电流值
+      validCurrent:0,//当前扭力
       turnCurrent:0,//堵转电流值
       setTurnCurrent:0,
       pressTurn:0,
       resetTurn:0,
+      canGetPrsValue:false,//可以接收挤压的动画
     }
   },
   onLoad: function(opt) {
@@ -831,6 +843,10 @@ export default {
     clearTimeout(this.checkTimer);
   },
   watch: {
+    turnPercent(newvalue){
+      // this.lineProgreeStyle = ""
+      this.lineProgreeStyle = "width:"+newvalue+"%;background:#50ACFF;height: 100%;";
+    },
     pressTurn(newVal,oldValue) {
       let self= this;
       if(newVal == 1){
@@ -872,6 +888,7 @@ export default {
       this.closeliuzhuanPop();
     },
     setPressTurn(){
+      let self = this;
       if(!this.decoctControlOnOffStatus){
         this.notifyError("请先开机后再进行操作")
         return;
@@ -898,6 +915,10 @@ export default {
 
       this.mqttPublish(2,this.deviceInfo,arr)
       this.$forceUpdate()
+      this.canGetPrsValue = true;
+      setTimeout(function(){
+        self.canGetPrsValue = false;
+      },3000);
     },
     startProgressTimer(type){
       let self = this;
@@ -909,27 +930,23 @@ export default {
           if(self.turnPercent >=100){
             self.turnPercent = 1;
             clearInterval(self.lineTimer);
-            setTimeout(function(){
-              self.startProgressTimer(1);
-            },500);
+            self.startProgressTimer(1);
           }
-          self.turnPercent +=5;
-        },200);
+          self.turnPercent +=2;
+        },100);
       }else{
         self.lineTimer = setInterval(function(){
           if(self.turnPercent >=100){
             self.turnPercent = 1;
             clearInterval(self.lineTimer);
-            setTimeout(function(){
-              self.startProgressTimer(2);
-            },500);
+            self.startProgressTimer(2);
           }
-          self.turnPercent +=5;
-        },200);
+          self.turnPercent +=2;
+        },100);
       }
     },
     setResetTurn(){
-      debugger;
+      let self = this;
       if(!this.decoctControlOnOffStatus){
         this.notifyError("请先开机后再进行操作")
         return;
@@ -954,10 +971,13 @@ export default {
         let self= this;
         arr.push(pressObj);
       }
-
-
       this.mqttPublish(2,this.deviceInfo,arr)
       this.$forceUpdate()
+      this.canGetPrsValue = true;
+      this.canGetPrsValue = true;
+      setTimeout(function(){
+        self.canGetPrsValue = false;
+      },3000);
     },
     fixImage(heng){
       let self = this;
@@ -1079,7 +1099,7 @@ export default {
 
       uni.showModal({
         title: "提示",
-        content: "该功能请在专业人士指导下使用,是否继续",
+        content: "非专业人员修改可能导致机器损坏",
         confirmText:"是",
         success: function (res) {
           if(res.confirm){
@@ -1223,7 +1243,7 @@ export default {
       let self = this;
       uni.showModal({
         title: "提示",
-        content: "该功能请在专业人士指导下使用,是否继续",
+        content: "非专业人员修改可能导致机器损坏",
         confirmText:"是",
         success: function (res) {
           if(res.confirm){
@@ -1236,7 +1256,7 @@ export default {
       let self = this;
       uni.showModal({
         title: "提示",
-        content: "该功能请在专业人士指导下使用,是否继续",
+        content: "“非专业人员修改可能导致机器损坏",
         confirmText:"是",
         success: function (res) {
           if(res.confirm){
@@ -2162,6 +2182,9 @@ export default {
           self.forthMachine = false;
           self.productImage = self.imgUrl+'/product/YJH20.png'
         }
+        if(self.deviceType == 10){
+          self.productImage = self.imgUrl+'/product/YJZ20.png'
+        }
         let typeArr = [7,8,9,10,11,12];
         for (let i = 0; i < typeArr.length; i++) {
           let typeMa = typeArr[i];
@@ -2268,7 +2291,7 @@ export default {
         this.formatValue(id,enumListElement,"PackageSwitch","baozhuangTurn");
 
         //pressTurn resetTurn
-        if(!flag){
+        if(!this.canGetPrsValue){
           if(id == 'PressTurn'){
             let shadow = enumListElement.shadow;
             if(!shadow){
@@ -2278,8 +2301,6 @@ export default {
               this.pressTurn = 1;
               this.resetTurn = 0;
             }
-
-
           }
 
           if(id == 'ResetTurn'){