优化代客下单扫码支付订单状态查询

src/views/tool/Instead/components/scan-pay.vue

@@ -2,12 +2,8 @@
   <el-dialog width="400px" :title="title" v-model="show" @close="reset">
     <div class="u-p-15">
       <div v-if="openSwitch" class="u-m-b-20">
-        <el-button
-          @click="changeKey('paysSel', index)"
-          v-for="(item, index) in pays"
-          :key="index"
-          :type="paysSel == index ? 'primary' : ''"
-        >
+        <el-button @click="changeKey('paysSel', index)" v-for="(item, index) in pays" :key="index"
+          :type="paysSel == index ? 'primary' : ''">
           {{ item.text }}
         </el-button>
       </div>
@@ -21,13 +17,8 @@
               <el-input :value="form.money" disabled></el-input>
             </el-form-item>
             <el-form-item label="付款码">
-              <el-input
-                v-model="form.code"
-                @change="codeInputChange"
-                autofocus
-                placeholder="请扫码或者输入付款码"
-                ref="refInputCode"
-              ></el-input>
+              <el-input v-model="form.code" @change="inputChange" autofocus placeholder="请扫码或者输入付款码"
+                ref="refInputCode"></el-input>
             </el-form-item>
             <div class="u-flex u-row-center u-m-t-50">
               <el-button @click="close">取消</el-button>
@@ -46,7 +37,9 @@
             </div>
             <div class="color-333 u-font-20 u-m-t-20">{{ form.money }}元</div>
             <div class="color-aaa u-font-12 u-m-t-10">
-              <el-icon class="loading-ani"><Loading /></el-icon>
+              <el-icon class="loading-ani">
+                <Loading />
+              </el-icon>
               <span>等待用户支付</span>
             </div>
           </div>
@@ -55,7 +48,8 @@
     </div>
   </el-dialog>
 </template>
-  <script>
+<script>
+import _ from 'lodash'
 import QRCode from "qrcode";
 import orderApi from "@/api/order/order";
 import payApi from "@/api/order/pay";
@@ -128,6 +122,9 @@ export default {
     },
   },
   methods: {
+    inputChange: _.debounce(function (e) {
+      this.confirm();
+    }, 100),
     to2(n) {
       return n.toFixed(2);
     },
@@ -175,7 +172,6 @@ export default {
     changeKey(key, val) {
       this[key] = val;
     },
-
     confirm() {
       if (!this.form.code) {
         return ElMessage.error("请输入或扫付款码");
@@ -239,14 +235,15 @@ export default {
   },
 };
 </script>
-  
-<style  lang="scss" scoped>
+
+<style lang="scss" scoped>
 .codeImg {
   width: 164px;
   border: 1px solid rgb(220, 223, 230);
   height: 164px;
   overflow: hidden;
 }
+
 @keyframes rotating {
   0% {
     -webkit-transform: rotate(0deg);
@@ -258,6 +255,7 @@ export default {
     transform: rotate(1turn);
   }
 }
+
 .loading-ani {
   animation: rotating 2s linear infinite;
 }