会员码和付款码输入框自动获取焦点

kmall-admin/src/main/webapp/WEB-INF/page/sale/sale.html

@@ -298,7 +298,7 @@
                             </div>
                         </div>
 
-                        <div class="modal fade" id="calculateOrderPriceDialog"  role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+                        <div class="modal fade" id="calculateOrderPriceDialog"  role="dialog" aria-hidden="true">
                             <div class="modal-dialog">
                                 <div class="modal-content">
                                     <div class="modal-header">
@@ -306,12 +306,10 @@
                                         <h4 class="modal-title" id="calculateOrderPriceModalLabel">录入会员码</h4>
                                     </div>
                                     <div class="modal-body">
-                                        <form>
-                                            <div class="form-group">
-                                                <label for="customPhone" class="control-label">会员码:</label>
-                                                <input autocomplete="off" type="text" class="form-control" ref="couponBarCode" id="couponBarCode" @blur="customPhoneBlur" />
-                                            </div>
-                                        </form>
+                                        <div>
+                                            <label for="customPhone" class="control-label">会员码:</label>
+                                            <i-input autocomplete="off" class="couponBarCodeInput" type="text" ref="couponBarCode" size="60%" id="couponBarCode" @on-enter="calculateOrderPriceSubmit" />
+                                        </div>
                                     </div>
                                     <div class="modal-footer">
                                         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
@@ -332,7 +330,7 @@
                                     <div class="modal-body">
                                         <form>
                                             <div class="form-group">
-                                                <i-input id="payCode" autofocus="true" @on-enter="submitOrder" ref="payCode" placeholder="请输入付款码"/>
+                                                <i-input id="payCode" class="payCodeInput" @on-enter="submitOrder" ref="payCode" size="60%" placeholder="请输入付款码"/>
                                             </div>
 
                                         </form>

kmall-admin/src/main/webapp/js/sale/sale.js

@@ -979,6 +979,7 @@ let vm = new Vue({
             }
             $("#calculateOrderPriceDialog").modal('show');
 
+            this.couponBarCodeChangeFocus();
         },
         // 计算优惠价格，返回订单详情数据
         calculateOrderPriceSubmit : function () {
@@ -1148,6 +1149,7 @@ let vm = new Vue({
 
             $("#Send").attr("data-dismiss","modal");
             $('#payModal').modal('show');
+            this.payCodeChangeFocus();
             $("#payCode").keydown(function(e){
                 if(e.keyCode==13){
                     $("#submitOrder").click();
@@ -1331,6 +1333,22 @@ let vm = new Vue({
                     toUrl('../logout?_' + $.now());
                 }, 500);
             });
+        },
+        couponBarCodeChangeFocus() {
+            this.$nextTick(() => {
+                setTimeout(() => {
+                    this.$refs.couponBarCode.focus();
+                    console.log("123");
+                }, 200);
+            })
+        },
+        payCodeChangeFocus() {
+            this.$nextTick(() => {
+                setTimeout(() => {
+                    this.$refs.payCode.focus();
+                    console.log("456");
+                }, 200);
+            })
         }
     }
 });