no message

src/pages/Pickuporder/orderForm.vue

@@ -37,10 +37,11 @@
         row: $q.screen.width >= 1200 && $q.platform.is.desktop,
         column: $q.screen.width < 1200 || $q.platform.is.mobile,
       }"
-    >
+    > 
       <div class="col">
+        <q-form ref="baseUserInfo">
         <q-card flat class="q-pa-md">
-          <div class="text-subtitle1 text-weight-bolder" ref="baseUserInfoTitle">訂購人資訊</div>
+          <div class="text-subtitle1 text-weight-bolder">訂購人資訊</div>
           <q-separator color="grey-2" class="q-my-md" />
           <div class="row q-col-gutter-md">
             <div :class="filedWidth">
@@ -69,8 +70,7 @@
         </q-card>
 
         <q-card flat class="q-pa-md q-mt-lg" v-if="details">
-          <div class="text-subtitle1 text-weight-bolder q-mb-md" ref="passengerInformation">旅客資料</div>
-
+          <div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div>
           <div class="row">
             <vue-core-video-players
               v-if="details.videoStr"
@@ -407,7 +407,9 @@
           <div class="text-subtitle1 q-my-md text-weight-bold">特殊需求備註：</div>
           <q-input standout v-model="parameters.Remark" input-style="height:170px;" type="textarea"  placeholder="此欄位僅限資料備註。不在商品規範內的個人需求，不保證提供" maxlength="200" counter />
         </q-card>
+        </q-form>
       </div>
+      
       <div class="relative-position" v-if="details"
         :class="{
           'q-ml-lg': !($q.screen.width < 1200 || $q.platform.is.mobile),
@@ -549,6 +551,8 @@ export default {
   },
   data() {
     return {
+      validateIndex: 0,
+      submiting: true,
       order: null,//订单信息
       orderKey: "",
       isRangeClick: true,
@@ -706,52 +710,24 @@ export default {
       }
       return this.orderKey != "";
     },
-    
-    submit(){
-      let flag = false
-
-      this.$refs.mail.validate()
-
-      this.$refs.SurName.validate()
-      this.$refs.Name.validate()
-      this.$refs.ContactWay.validate()
-      this.$refs.Mobile.validate()
-      this.$refs.OrderDate.validate()
-      this.$refs.ManNum.validate()
-      
-      if(this.details.CarType!=3){
-        this.$refs.AirportTerminal.validate()
-        this.$refs.AirLine.validate()
-        this.$refs.FlightNumber.validate()
-        this.$refs.FlightTime.validate()
-        if(this.details.CarType!=1){
-          this.$refs.GetonAddress.validate()
-          flag = !this.$refs.SurName.hasError&& !this.$refs.Name.hasError&& !this.$refs.ContactWay.hasError
-          && !this.$refs.Mobile.hasError&& !this.$refs.OrderDate.hasError&& !this.$refs.ManNum.hasError
-          && !this.$refs.AirportTerminal.hasError&& !this.$refs.AirLine.hasError&& !this.$refs.FlightNumber.hasError
-          && !this.$refs.FlightTime.hasError&& !this.$refs.GetonAddress.hasError&& !this.$refs.mail.hasError
-        }else{
-          this.$refs.GetoffAddress.validate()
-          flag = !this.$refs.SurName.hasError&& !this.$refs.Name.hasError&& !this.$refs.ContactWay.hasError
-          && !this.$refs.Mobile.hasError&& !this.$refs.OrderDate.hasError&& !this.$refs.ManNum.hasError
-          && !this.$refs.AirportTerminal.hasError&& !this.$refs.AirLine.hasError&& !this.$refs.FlightNumber.hasError
-          && !this.$refs.FlightTime.hasError&& !this.$refs.GetoffAddress.hasError&& !this.$refs.mail.hasError
-        }
-      }else{
-        this.$refs.GetonAddress.validate()
-        this.$refs.GetoffAddress.validate()
-        flag = !this.$refs.SurName.hasError&& !this.$refs.Name.hasError&& !this.$refs.ContactWay.hasError
-          && !this.$refs.Mobile.hasError&& !this.$refs.OrderDate.hasError&& !this.$refs.ManNum.hasError
-          && !this.$refs.GetonAddress.hasError&& !this.$refs.GetoffAddress.hasError&& !this.$refs.mail.hasError
+    async submit() {
+      this.submiting=true
+      let flag = true
+      flag = await this.formValidateHandler('baseUserInfo')
+      if(!flag){
+        let errorObj = this.$refs.baseUserInfo.getValidationComponents().find(x=>x.innerError)
+        window.scrollTo(0,errorObj.$el.offsetTop)
       }
-      if(!flag) return this.goScrollToForm('baseUserInfoTitle')
-      
-      this.SetCarOrder()
+      if(flag){
+        this.SetCarOrder()
+        return;
+      }
+      this.submiting=false
     },
-    goScrollToForm(formName){
+    async formValidateHandler(formName){
       let temp=this.$refs[formName]
       let formObj = temp instanceof Array ? temp[0] : temp
-      window.scrollTo(0,formObj.offsetTop)
+      return formObj.validate()
     },
     SetCarOrder(){
       this.loading = true
@@ -765,12 +741,7 @@ export default {
             let ErpOrderId = r.data.data.Id
             this.AddOrderInfo(ErpOrderId)
           }else{
-            this.$q.notify({
-              type: "negative",
-              message: r.data.message,
-              position: "top",
-              timeout: 2000,
-            });
+            this.$message.error(r.data.message)
             this.loading = false
           }
       })
@@ -804,27 +775,14 @@ export default {
           PlatformTax: 0,//平台税金默认0
           Income: 0,//已收默认0
           Refund: 0,//退款金额默认0
-          OrderSource: this.parameters.pType
         },
         (r) => {
           if (r.data.resultCode == 1) {
             this.step = 3
-            this.$q.notify({
-              color: "green-4",
-              textColor: "white",
-              icon: "check",
-              message: "訂單提交成功",
-              position:'center',
-            });
-            return
+            this.$message.success("訂單創建成功")
             this.goPayHandler(r.data.data)
           }else{
-            this.$q.notify({
-              type: "negative",
-              message: r.data.message,
-              position: "top",
-              timeout: 2000,
-            });
+            this.$message.error(r.data.message)
           }
           this.loading = false
       })