优化体验

assets/css/tally/fixBox.scss

@@ -32,6 +32,13 @@
             font-size: 24rpx;
             font-size: 24rpx;
             color: #ffffff;
             color: #ffffff;
         }
         }
+        .icon-jinggao2 {
+            position: relative;
+            font-size: 30rpx;
+            color: #c6c7cc;
+            margin-right: 30rpx;
+            z-index: 22;
+        }
     }
     }
     .list {
     .list {
         height: calc(100% - 350rpx);
         height: calc(100% - 350rpx);

pages/tally/fixBox.vue

@@ -2,7 +2,9 @@
     <view class="tally-fixBox">
     <view class="tally-fixBox">
         <view class="input-box row bothSide verCenter">
         <view class="input-box row bothSide verCenter">
             <input class="uni-input" placeholder="输入或扫描箱号" placeholder-style="color:#000;font-weight: bold;" v-model="keyword" @input="handleInput($event)" :focus="is_focus" />
             <input class="uni-input" placeholder="输入或扫描箱号" placeholder-style="color:#000;font-weight: bold;" v-model="keyword" @input="handleInput($event)" :focus="is_focus" />
-            <view class="btn row rowCenter verCenter" @click="add()">添 加</view>
+            <view class="row verCenter">
+                <view class="btn row rowCenter verCenter" @click="add()">添 加</view>
+            </view>
         </view>
         </view>
         <view class="list" v-if="list.length > 0">
         <view class="list" v-if="list.length > 0">
             <scroll-view scroll-y="true" class="scroll-Y">
             <scroll-view scroll-y="true" class="scroll-Y">
@@ -69,7 +71,6 @@
                         showCancel: false
                         showCancel: false
                     });
                     });
                     return false;
                     return false;
-                    return false;
                 }
                 }
 
 
                 // 检查输入的箱号是否已经存在于列表中
                 // 检查输入的箱号是否已经存在于列表中

pages/tally/printBox.vue

@@ -2,7 +2,10 @@
     <view class="printBox">
     <view class="printBox">
         <view class="input-box row bothSide verCenter">
         <view class="input-box row bothSide verCenter">
             <input class="uni-input" placeholder="输入或扫描入箱号" placeholder-style="color:#000;font-weight: bold;" v-model="box_sn" :focus="is_focus" />
             <input class="uni-input" placeholder="输入或扫描入箱号" placeholder-style="color:#000;font-weight: bold;" v-model="box_sn" :focus="is_focus" />
-            <view class="btn row rowCenter verCenter" @click="print()">打印箱号</view>
+            <view class="row verCenter">
+                <text class="iconfont icon-jinggao2" @click="clearInput()" v-if="box_sn"></text>
+                <view class="btn row rowCenter verCenter" @click="print()">打印箱号</view>
+            </view>
         </view>
         </view>
     </view>
     </view>
 </template>
 </template>
@@ -47,6 +50,25 @@
                         });
                         });
                     }
                     }
                 });
                 });
+            },
+            /**
+             * 清空数据
+             */
+            clearInput() {
+                this.box_sn = '';
+                this.is_focus = false;
+                setTimeout(() => {
+                    this.is_focus = true;
+                }, 200);
+            },
+            /**
+             * 再次获取焦点
+             */
+            clearInputAndFocus() {
+                this.is_focus = false;
+                setTimeout(() => {
+                    this.is_focus = true;
+                }, 200);
             }
             }
         }
         }
     };
     };
@@ -79,6 +101,14 @@
                 font-size: 24rpx;
                 font-size: 24rpx;
                 color: #ffffff;
                 color: #ffffff;
             }
             }
+
+            .icon-jinggao2 {
+                position: relative;
+                font-size: 30rpx;
+                color: #c6c7cc;
+                margin-right: 30rpx;
+                z-index: 22;
+            }
         }
         }
     }
     }
 </style>
 </style>
\ No newline at end of file