no message

src/components/car/orderPreview.vue

@@ -14,7 +14,7 @@
         <div class="text-grey-6 f12 q-my-md">選擇機場</div>
         <div class="row wrap">
           <q-btn @click="handleSelectAirport(item)"
-            :color="item.Id === selectedAirport?'primary':'grey-5'"
+            :color="selectedAirportObj&&item.Id === selectedAirportObj.Id?'primary':'grey-5'"
             unelevated
             class="car-tag mr"
             v-for="item in AirportList"
@@ -27,7 +27,7 @@
       <div class="text-grey-6 f12 q-my-md">選擇車類型</div>
       <div class="row wrap">
         <q-btn @click="handleSelect(item)"
-          :color="item.Id === selectedCar?'primary':'grey-5'"
+          :color="selectedCarObj&&item.Id === selectedCarObj.Id?'primary':'grey-5'"
           unelevated
           class="car-tag mr"
           v-for="item in CarTypeList"
@@ -39,9 +39,9 @@
       <div class="text-grey-6 f12 q-my-md">選擇數量</div>
       <div class="row items-end">
         <div class="col" :class="{'column':$q.platform.is.mobile}">
-          <div v-if="selectedObj">
-            <span class="text-subtitle2 text-weight-bold">{{selectedObj.CarName}}</span>
-            <span class="text-grey-6 f12 q-ml-sm"></span>({{ selectedObj.PeopleNum }}人+{{ selectedObj.PeopleNum }}行李)</span>
+          <div v-if="selectedCarObj">
+            <span class="text-subtitle2 text-weight-bold">{{selectedCarObj.CarName}}</span>
+            <span class="text-grey-6 f12 q-ml-sm"></span>({{ selectedCarObj.PeopleNum }}人+{{ selectedCarObj.PeopleNum }}行李)</span>
           </div>
           <div v-if="$q.platform.is.mobile">
             <span class="text-grey-7 product-price" style="font-size: 13px">
@@ -112,7 +112,7 @@
           {{$q.platform.is.mobile?'請選擇上面的出行日期':'請選擇左側的出行日期'}} 
         </span>
         <span class="q-mr-lg f12 text-negative" 
-        v-if="(p.startDate&&!selectedCar)||(p.startDate&&dataList.CarType!=3&&!selectedAirportObj)" >
+        v-if="(p.startDate&&!selectedCarObj)||(p.startDate&&dataList.CarType!=3&&!selectedAirportObj)" >
           {{`請選擇上面的${dataList.CarType==3?'車類型':'機場、車類型'}`}} 
         </span>
         <q-btn color="primary" label="立即訂購" unelevated class="q-px-lg" :disable="sumPrice==0"
@@ -132,7 +132,7 @@ export default {
         if(n&&n.startDate){
           this.chosenObj.startDate = n.startDate;
           // this.selectedCar = this.CarTypeList[0].Id
-          // this.selectedObj = this.CarTypeList[0]
+          // this.selectedCarObj = this.CarTypeList[0]
         }
         this.calcMoney()
         
@@ -154,10 +154,8 @@ export default {
       p: {},
       chosenObj: null,
       sumPrice:0,
-      selectedCar: 0,
-      selectedObj: null,
+      selectedCarObj: null,
       priceList: [],
-      selectedAirport: 0,
       selectedAirportObj: null,
     };
   },
@@ -167,16 +165,30 @@ export default {
       this.chosenObj.startDate = this.p.startDate;
       this.calcMoney()
       this.getCarPriceData2()
-      // this.selectedCar = this.CarTypeList[0].Id
-      // this.selectedObj = this.CarTypeList[0]
     }
     
   },
   methods: {
     goUrl(){
+      let OrderDate = {
+        selectedCarObj: this.selectedCarObj,
+        selectedAirportObj: this.selectedAirportObj,
+        p: this.p,
+        chosenObj: this.chosenObj,
+        sumPrice: this.sumPrice,
+        dataList: this.dataList
+      }
       this.CommonJump(
         "/PickuporderForm",
-        {}
+        {
+          // OrderDate: JSON.stringify(OrderDate),
+          CarObj: JSON.stringify(this.selectedCarObj),
+          AirportObj: JSON.stringify(this.selectedAirportObj),
+          calculationAmount: JSON.stringify(this.p),
+          calculationNum: JSON.stringify(this.chosenObj),
+          sumPrice: JSON.stringify(this.sumPrice),
+          dataList: JSON.stringify(this.dataList)
+        }
       );
     },
     //  获取车的详情
@@ -188,7 +200,7 @@ export default {
           ProductId: this.configId, 
           Month: this.Month,
           AirportId: '',
-          CarTypeId: this.selectedCar
+          CarTypeId: this.selectedCarObj.Id
          },
         (r) => {
           if (r.data.resultCode == 1) {
@@ -212,7 +224,7 @@ export default {
             const temp= JSON.parse(JSON.stringify(r.data.data))
             let PriceArr = temp.filter(x=>{ return x.Price>0 })
             if(PriceArr.length>0){
-              this.$emit('getPriceList',JSON.stringify(arr),this.selectedCar)
+              this.$emit('getPriceList',JSON.stringify(arr),this.selectedCarObj.Id)
             }else{
               let dataObj = {
                   startDate: '',
@@ -223,7 +235,7 @@ export default {
                   safeMoney: 0,
               }
               this.priceList.push(dataObj)
-              this.$emit('getPriceList',JSON.stringify(this.priceList),this.selectedCar)
+              this.$emit('getPriceList',JSON.stringify(this.priceList),this.selectedCarObj.Id)
               this.p.originalB2CPrice = 0
               this.resetHandler()
             }
@@ -233,11 +245,9 @@ export default {
     },
     handleSelectAirport(item){
       this.selectedAirportObj = item
-      this.selectedAirport = item.Id
     },
     handleSelect(item){
-      this.selectedObj = item
-      this.selectedCar = item.Id
+      this.selectedCarObj = item
       this.getCarPriceData2()
     },
     initModel() {
@@ -250,10 +260,8 @@ export default {
     },
     resetHandler(type) {
       if(type&&type!=1){
-        this.selectedCar = 0
-        this.selectedObj = null
+        this.selectedCarObj = null
         this.selectedAirportObj = null
-        this.selectedAirport = 0
       }
       setTimeout(()=>{
         this.p = {};

src/pages/Pickuporder/orderForm.vue

@@ -98,38 +98,55 @@
             </div>
           </q-card>
   
-          <q-card flat class="q-pa-md q-mt-lg">
+          <q-card flat class="q-pa-md q-mt-lg" v-if="details">
             <div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div>
   
             <div class="row">
+              <vue-core-video-players
+                v-if="details.videoStr"
+                ref="video"
+                :src="details.videoStr"
+                :title="details.title"
+                :muted="true"
+                :autoplay="false"
+                @play="playHandler"
+                @pause="pauseHandler"
+                @seeked="seekedChangeHandler"
+                @timeupdate="timeChangeHandler"
+                logo="../statics/img/transparent_logo.png"
+                :loop="false"
+                id="trip_video"
+                class="rounded-borders"
+                style="width: 80px"
+              />
               <q-img
-                src="https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg"
+                v-else
+                :src="details?details.imgCover[0]:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
                 class="rounded-borders"
                 spinner-color="grey-3"
                 style="width: 80px"
               />
               <div class="q-ml-md col">
                 <div class="text-subtitle1 ellipsis">
-                  【夏季限定】加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原 |
-                  卡加利出发卡加利出发卡加利出发
+                  {{details.Name}}
                 </div>
                 <div class="text-caption text-grey-6 ellipsis q-mt-sm">
-                  加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原
+                  {{details.Description}}
                 </div>
               </div>
             </div>
             <div class="q-mt-md row">
               <div class="text-grey-9">
                 <q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" />
-                <span>2023-02-27</span>
+                <span>{{calculationAmount.startDate}}</span>
               </div>
               <div class="text-grey-9 q-ml-md">
                 <q-icon name="iconfont iconjiaotong" size="20px" class="q-mr-sm" />
                 <span class="q-mr-sm" v-if="chosenObj.Count > 0"
-                  >豪华车 x {{ chosenObj.Count }} (4人+{{chosenObj.Count}}行李)</span
+                  >{{CarObj.CarName}} x {{ chosenObj.Count }}辆 </span
                 >
                 <span class="q-mr-sm"
-                  ></span
+                  >({{CarObj.PeopleNum}}人+{{CarObj.PeopleNum}}行李)</span
                 >
               </div>
             </div>
@@ -427,7 +444,7 @@
   
           <coupon></coupon>
         </div>
-        <div class="relative-position"
+        <div class="relative-position" v-if="details"
           :class="{
             'q-ml-lg': !($q.screen.width < 1200 || $q.platform.is.mobile),
             'q-mt-lg  full-width': $q.screen.width < 1200 || $q.platform.is.mobile,
@@ -447,42 +464,59 @@
           >
             <div class="text-subtitle1 text-weight-bolder">付款明細</div>
             <div class="row q-mt-md">
+              <vue-core-video-players
+                v-if="details.videoStr"
+                ref="video"
+                :src="details.videoStr"
+                :title="details.title"
+                :muted="true"
+                :autoplay="false"
+                @play="playHandler"
+                @pause="pauseHandler"
+                @seeked="seekedChangeHandler"
+                @timeupdate="timeChangeHandler"
+                logo="../statics/img/transparent_logo.png"
+                :loop="false"
+                id="trip_video"
+                class="rounded-borders"
+                style="width: 80px"
+              />
               <q-img
-                src="https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg"
+                v-else
+                :src="details?details.imgCover[0]:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
                 class="rounded-borders"
                 spinner-color="grey-3"
                 style="width: 80px"
               />
               <div class="q-ml-md col">
                 <div class="text-subtitle1 ellipsis">
-                  【夏季限定】加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原 |
-                  卡加利出发卡加利出发卡加利出发
+                  {{details.Name}}
                 </div>
                 <div class="text-caption text-grey-6 ellipsis q-mt-sm">
-                  加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原
+                  {{details.Description}}
                 </div>
               </div>
             </div>
             <div class="q-mt-md text-grey-6">
               <div class="row">
-                <div style="width: 80px">出發城市：</div>
-                <div class="q-ml-md">武漢起止</div>
+                <div style="width: 80px">機場：</div>
+                <div class="q-ml-md">{{AirportObj.Name}}</div>
               </div>
               <div class="row">
                 <div style="width: 80px">出發日期：</div>
-                <div class="q-ml-md">2024-02-02</div>
+                <div class="q-ml-md">{{calculationAmount.startDate}}</div>
               </div>
             </div>
             <q-separator color="grey-2" class="q-my-md"/>
             <div class="text-grey-9">
               <div class="row q-mb-sm" v-if="chosenObj.Count>0">
-                <div class="col">豪华车 x {{ chosenObj.Count }}</div>
-                <div>CNY {{ moneyFormat(9999,2) }}</div>
+                <div class="col">{{CarObj.CarName}} x {{ chosenObj.Count }}</div>
+                <div>CNY {{ moneyFormat(sumPrice,2) }}</div>
               </div>
               <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
-              <div class="row q-mb-sm items-center" v-if="(chosenObj.df)>0">
+              <div class="row q-mb-sm items-center" v-if="(chosenObj.Count)>0">
                 <div class="col">總金額</div>
-                <div class="text-subtitle2 text-weight-bolder text-primary">CNY {{ moneyFormat(9999,2) }}</div>
+                <div class="text-subtitle2 text-weight-bolder text-primary">CNY {{ moneyFormat(sumPrice,2) }}</div>
               </div>
               <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
               <div class="row q-mb-sm items-center" v-if="(chosenObj.df)>0">
@@ -490,9 +524,9 @@
                 <div class="text-subtitle2 text-weight-bolder text-teal">CNY - {{ moneyFormat(9999,2) }}</div>
                 <div class="text-grey-5">暫無優惠</div>
               </div>
-              <div class="row q-mb-sm items-center" v-if="(chosenObj.df)>0">
+              <div class="row q-mb-sm items-center" v-if="(chosenObj.Count)>0">
                 <div class="col">支付金額</div>
-                <div class="text-h6 text-weight-bolder text-primary product-price">CNY {{ moneyFormat(9999,2) }}</div>
+                <div class="text-h6 text-weight-bolder text-primary product-price">CNY {{ moneyFormat(sumPrice,2) }}</div>
               </div>
             </div>
             <div class="text-right q-mt-md">
@@ -514,6 +548,24 @@
     },
     data() {
       return {
+        CarObj: null,
+        AirportObj: null,
+        calculationAmount: null,
+        calculationNum: null,
+        sumPrice: null,
+        details: null,
+        options: {
+          currentPage: 0,
+          speed: 300,
+          itemAnimation: true,
+          centeredSlides: true,
+          thresholdDistance: 100,
+          thresholdTime: 300,
+          loopedSlides: 2,
+          slidesToScroll: 1,
+          loop: true,
+        },
+        OrderDate: null,//接收产品相关信息
         step: 1,
         userInfo: {
           lastName: "",
@@ -621,10 +673,38 @@
     },
     created() {},
     mounted() {
+      this.CarObj = JSON.parse(this.$route.query.CarObj),//车型
+      this.AirportObj = JSON.parse(this.$route.query.AirportObj),//机场
+      this.calculationAmount = JSON.parse(this.$route.query.calculationAmount),//日期
+      this.chosenObj = JSON.parse(this.$route.query.calculationNum),//数量
+      this.sumPrice = JSON.parse(this.$route.query.sumPrice),//总金额
+      this.details = JSON.parse(this.$route.query.details),//产品详情
+      console.log(this.CarObj,'----')
+      
       this.initCountry();
       this.initGuestHandler();
     },
     methods: {
+      // 音频
+      slideHandler(e) {
+        this.options.currentPage = e.currentPage;
+        if (
+          e.currentPage != 0 &&
+          this.$refs.video &&
+          this.$refs.video.isPlaying
+        ) {
+          this.$refs.video.pause();
+        }
+      },
+      playHandler(e) {},
+      pauseHandler(e) {},
+      timeChangeHandler(e) {
+        //console.log(e)
+      },
+      //
+      seekedChangeHandler(e) {
+        //console.log(e)
+      },
       changeRoomHandler(){
         let currentSign = this.guests.filter(x=> x.IsSignRoom)
         this.disableSign=currentSign==this.chosenObj.df