Commit aaf94d58 authored by youjie's avatar youjie

Merge branch 'master' of http://gitlab.oytour.com/viitto/million

parents 52a6c477 6576f968
...@@ -20,8 +20,7 @@ Vue.prototype.domainManager = function() { ...@@ -20,8 +20,7 @@ Vue.prototype.domainManager = function() {
domainUrl = "http://testapi.oytour.com"; domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) { } else if (domainNameUrl.indexOf('oytour') !== -1) {
domainUrl = "http://reborn.oytour.com"; domainUrl = "http://reborn.oytour.com";
// domainUrl = 'http://192.168.10.11:8083' domainUrl = 'http://192.168.10.206:8015'
domainUrl = 'http://192.168.10.206:8015' // 吴春
} }
var obj = { var obj = {
//主地址 //主地址
......
<template>
<q-card flat class="q-pa-md q-mt-lg">
<div class="row items-center">
<div class="text-subtitle1 text-weight-bolder q-mb-md col">
<span>優惠券</span>
<span class="text-weight-regular q-ml-sm text-body2">(可用優惠券 0 張)</span>
</div>
<q-toggle v-model="showDisable" label="顯示不可用優惠券" style="zoom:0.8;margin-top: -24px;" v-if="isExplends"/>
<q-icon :name="isExplends?'keyboard_arrow_up':'keyboard_arrow_down'" @click="$event=>isExplends=!isExplends" size="32px" color="grey-9" class="q-ml-md cursor-pointer" style="margin-top:-10px;"/>
</div>
<div v-if="isExplends">
<div class="row q-col-gutter-md">
<div :class="filedWidth">
<div class="cursor-pointer">
<div class="coupon-head">
<div class="check-tools">
<q-checkbox v-model="chosenCouponId" :value="1" dense color="teal" />
</div>
<div class="q-pa-lg q-mt-lg">
<div class="row items-center">
<div class="text-h4 text-weight-bold text-white col">
{{ moneyFormat(500,2) }}
</div>
<div class=" f12 text-white">滿 2000 可用</div>
</div>
<div class="q-mt-sm f12" style="color:#195954">有效期至:2023.02.30</div>
</div>
</div>
<div class="q-px-lg q-py-md coupon-content">
<div class="row">
<div class="col-5">適用平台:</div>
<div class="">全平台通用</div>
</div>
<div class="row q-mt-sm">
<div class="col-5">使用品類:</div>
<div class="">多日遊行程適用</div>
</div>
</div>
</div>
</div>
<div :class="filedWidth">
<div class="unUsed">
<div class="coupon-head">
<div class="q-pa-lg q-mt-lg">
<div class="row items-center">
<div class="text-h4 text-weight-bold text-white col">
{{ moneyFormat(500,2) }}
</div>
<div class=" f12 text-white">滿 2000 可用</div>
</div>
<div class="q-mt-sm f12" style="color:#195954">有效期至:2023.02.30</div>
</div>
</div>
<div class="q-px-lg q-py-md coupon-content">
<div class="row">
<div class="col-5">適用平台:</div>
<div class="">全平台通用</div>
</div>
<div class="row q-mt-sm">
<div class="col-5">使用品類:</div>
<div class="">多日遊行程適用</div>
</div>
</div>
</div>
</div>
</div>
<div class="text-center q-mt-lg" v-if="1==2">
<p>
<img src="~assets/sad.svg" style="width: 50px" />
</p>
<p class="f12 text-grey-6">沒有找到可用優惠券</p>
</div>
</div>
</q-card>
</template>
<script>
export default {
props:["goodsInfo"],
computed: {
filedWidth() {
return {
"col-12": this.$q.screen.width < 1200,
"col-4": this.$q.screen.width >= 1200,
};
}
},
data() {
return {
showDisable:false,
isExplends:false,
chosenCouponId:false
};
},
methods: {
changeDiscountHandler(){
}
},
}
</script>
<style>
.coupon-item{
box-shadow: 0px 10px 20px 0px rgb(76 87 125 / 20%) !important;
}
.unUsed .coupon-head{
background: #DDD !important;
}
.unUsed .coupon-head *{
color:#AAA !important;
}
.coupon-head{
height: 138px;
background: #67CAC2;
position: relative;
overflow: hidden;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.coupon-head .check-tools{
position: absolute;
top:10px;
right: 10px;
}
.coupon-content{
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
background: #f9f9f9;
}
.coupon-head::before{
content: ' ';
display: inline-block;
width:30px;
height: 30px;
border-radius: 30px;
background: #FFF;
position: absolute;
top:-15px;
left: 50%;
margin-left: -15px;
}
.coupon-head::after{
content: ' ';
display: block;
position: absolute;
bottom: 0px;
left: 0;
right: 0;
height: 8px;
background-image: radial-gradient(circle, #f9f9f9, #f9f9f9 9px, #f9f9f9 9px, #f9f9f9 10px, transparent 10px, transparent);
background-size: 16px 20px;
}
</style>
\ No newline at end of file
...@@ -86,7 +86,7 @@ ...@@ -86,7 +86,7 @@
<q-input <q-input
style="width: 150px" style="width: 150px"
@input="changePeople" @input="changePeople"
v-model="chosenObj.etCount" v-model="chosenObj.etbzcCount"
class="col" class="col"
:class="{ :class="{
'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop, 'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop,
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
class="q-px-none" class="q-px-none"
flat flat
icon="remove" icon="remove"
@click="addPeople('etCount', -1)" @click="addPeople('etbzcCount', -1)"
/> />
</template> </template>
<template v-slot:append> <template v-slot:append>
...@@ -115,7 +115,7 @@ ...@@ -115,7 +115,7 @@
class="q-px-none" class="q-px-none"
flat flat
icon="add" icon="add"
@click="addPeople('etCount', 1)" @click="addPeople('etbzcCount', 1)"
/> />
</template> </template>
</q-input> </q-input>
...@@ -131,19 +131,19 @@ ...@@ -131,19 +131,19 @@
<div v-if="$q.platform.is.mobile"> <div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px"> <span class="text-grey-7 product-price" style="font-size: 13px">
CNY CNY
{{ moneyFormat(p.childNeedPrice, 0) }} /每人 {{ moneyFormat(p.childNeedPrice+p.originalB2CPrice, 0) }} /每人
</span> </span>
</div> </div>
</div> </div>
<div class="row items-end"> <div class="row items-end">
<span v-if="$q.platform.is.desktop" class="text-grey-7 product-price" style="font-size: 13px"> <span v-if="$q.platform.is.desktop" class="text-grey-7 product-price" style="font-size: 13px">
CNY CNY
{{ moneyFormat( p.childNeedPrice, 0) }} /每人 {{ moneyFormat( p.childNeedPrice+p.originalB2CPrice, 0) }} /每人
</span> </span>
<q-input <q-input
style="width: 150px" style="width: 150px"
@input="changePeople" @input="changePeople"
v-model="chosenObj.etCount" v-model="chosenObj.etzcCount"
class="col" class="col"
:class="{ :class="{
'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop, 'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop,
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
class="q-px-none" class="q-px-none"
flat flat
icon="remove" icon="remove"
@click="addPeople('etCount', -1)" @click="addPeople('etzcCount', -1)"
/> />
</template> </template>
<template v-slot:append> <template v-slot:append>
...@@ -172,7 +172,7 @@ ...@@ -172,7 +172,7 @@
class="q-px-none" class="q-px-none"
flat flat
icon="add" icon="add"
@click="addPeople('etCount', 1)" @click="addPeople('etzcCount', 1)"
/> />
</template> </template>
</q-input> </q-input>
...@@ -357,7 +357,7 @@ export default { ...@@ -357,7 +357,7 @@ export default {
yeCount: 0, yeCount: 0,
lrCount: 0, lrCount: 0,
etbzcCount: 0, etbzcCount: 0,
etzc: 0, etzcCount: 0,
df: 0, df: 0,
dcf: 0, dcf: 0,
srf: 0, srf: 0,
...@@ -392,14 +392,14 @@ export default { ...@@ -392,14 +392,14 @@ export default {
} }
if (!isDf) { if (!isDf) {
if ( if (
this.chosenObj.crCount + this.chosenObj.etCount > this.chosenObj.crCount + this.chosenObj.etzcCount >
this.p.remainNum this.p.remainNum
) { ) {
this.chosenObj[m] = this.chosenObj[m] - 1; this.chosenObj[m] = this.chosenObj[m] - 1;
} }
} else { } else {
if ( if (
this.chosenObj.crCount + this.chosenObj.etCount < this.chosenObj.crCount + this.chosenObj.etzcCount <
this.chosenObj.df this.chosenObj.df
) { ) {
this.chosenObj[m] = this.chosenObj[m] - 1; this.chosenObj[m] = this.chosenObj[m] - 1;
...@@ -412,7 +412,9 @@ export default { ...@@ -412,7 +412,9 @@ export default {
let money = let money =
this.p.originalB2CPrice * this.chosenObj.crCount; this.p.originalB2CPrice * this.chosenObj.crCount;
money += money +=
(this.p.originalB2CPrice-this.p.childNoNeedPrice+this.p.babyChargePrice) * this.chosenObj.etCount; (this.p.originalB2CPrice-this.p.childNoNeedPrice+this.p.babyChargePrice) * this.chosenObj.etbzcCount;
money +=
(this.p.originalB2CPrice+this.p.childNeedPrice+this.p.babyChargePrice) * this.chosenObj.etzcCount;
money += this.p.babyPrice * this.chosenObj.yeCount; money += this.p.babyPrice * this.chosenObj.yeCount;
money += this.p.singleRoomPrice * this.chosenObj.df; money += this.p.singleRoomPrice * this.chosenObj.df;
......
...@@ -34,69 +34,224 @@ ...@@ -34,69 +34,224 @@
class="row q-pa-md" class="row q-pa-md"
style="min-width: 375px; margin: 0 auto" style="min-width: 375px; margin: 0 auto"
:class="{ :class="{
'row': $q.screen.width >= 1200 && $q.platform.is.desktop, row: $q.screen.width >= 1200 && $q.platform.is.desktop,
'column': $q.screen.width < 1200 || $q.platform.is.mobile, column: $q.screen.width < 1200 || $q.platform.is.mobile,
}" }"
> >
<div class="col"> <div class="col">
<q-card flat class="q-pa-md"> <q-card flat class="q-pa-md">
<div class="text-subtitle1 text-weight-bolder">訂購人資訊</div> <div class="text-subtitle1 text-weight-bolder">訂購人資訊</div>
<q-separator color="grey-2" class="q-my-md"/> <q-separator color="grey-2" class="q-my-md" />
<div class="row q-col-gutter-md"> <div class="row q-col-gutter-md">
<div :class="filedWidth"> <div :class="filedWidth">
<q-input standout v-model="userInfo.lastName" label="名字" :rules="[val => !!val || '請輸入名字']"/> <q-input
</div> standout
<div :class="filedWidth"> v-model="userInfo.lastName"
<q-input standout v-model="userInfo.firstName" label="姓氏" :rules="[val => !!val || '請輸入姓氏']"/> label="名字"
</div> :rules="[(val) => !!val || '請輸入名字']"
<div :class="filedWidth"> />
<q-select v-model="userInfo.country" @input="changeCountry" :options="countrys" emit-value option-label="Name" option-value="ID" map-options label="國家/地區" standout />
</div>
<div :class="filedWidth">
<q-input standout v-model="userInfo.firstName" label="電話" :rules="[val => !!val || '請輸入行動電話']">
<template v-slot:prepend>
<div class="text-subtitle2">+{{ userInfo.areaCode }}</div>
</template>
</q-input>
</div>
<div :class="filedWidth">
<q-input standout v-model="userInfo.mail" label="郵箱地址" :rules="[val => !!val || '請輸入郵箱地址']" />
</div>
<div :class="filedWidth">
<q-toggle v-model="isUpdateUserInfo" label="同步更新會員資料" />
</div>
</div> </div>
<div :class="filedWidth">
<q-input
standout
v-model="userInfo.firstName"
label="姓氏"
:rules="[(val) => !!val || '請輸入姓氏']"
/>
</div>
<div :class="filedWidth">
<q-select
v-model="userInfo.country"
@input="changeCountry"
:options="countrys"
emit-value
option-label="Name"
option-value="ID"
map-options
label="國家/地區"
standout
/>
</div>
<div :class="filedWidth">
<q-input
standout
v-model="userInfo.firstName"
label="電話"
:rules="[(val) => !!val || '請輸入行動電話']"
>
<template v-slot:prepend>
<div class="text-subtitle2">+{{ userInfo.areaCode }}</div>
</template>
</q-input>
</div>
<div :class="filedWidth">
<q-input
standout
v-model="userInfo.mail"
label="郵箱地址"
:rules="[(val) => !!val || '請輸入郵箱地址']"
/>
</div>
<div :class="filedWidth">
<q-toggle v-model="isUpdateUserInfo" label="同步更新會員資料" />
</div>
</div>
</q-card> </q-card>
<q-card flat class="q-pa-md q-mt-lg"> <q-card flat class="q-pa-md q-mt-lg">
<div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div> <div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div>
<div class="row"> <div class="row">
<q-img src="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;" /> <q-img
<div class="q-ml-md col"> src="https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg"
<div class="text-subtitle1 ellipsis">【夏季限定】加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原 | 卡加利出发卡加利出发卡加利出发</div> class="rounded-borders"
<div class="text-caption text-grey-6 ellipsis q-mt-sm">加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原</div> spinner-color="grey-3"
</div> style="width: 80px"
/>
<div class="q-ml-md col">
<div class="text-subtitle1 ellipsis">
【夏季限定】加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原 |
卡加利出发卡加利出发卡加利出发
</div>
<div class="text-caption text-grey-6 ellipsis q-mt-sm">
加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原
</div>
</div> </div>
<div class="q-mt-md row"> </div>
<div class="text-grey-9"> <div class="q-mt-md row">
<q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" /> <div class="text-grey-9">
<span>2023-02-27</span> <q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" />
</div> <span>2023-02-27</span>
<div class="text-grey-9 q-ml-md"> </div>
<q-icon name="iconfont iconpeople" size="20px" class="q-mr-sm" /> <div class="text-grey-9 q-ml-md">
<span class="q-mr-sm" >成人 x 2</span> <q-icon name="iconfont iconpeople" size="20px" class="q-mr-sm" />
<span class="q-mr-sm" >兒童 x 2</span> <span class="q-mr-sm" v-if="chosenObj.crCount > 0"
>成人 x {{ chosenObj.crCount }}</span
>
<span class="q-mr-sm" v-if="chosenObj.etzcCount"
>兒童占床 x {{ chosenObj.etzcCount }}</span
>
<span class="q-mr-sm" v-if="chosenObj.etbzcCount"
>兒童不占床 x {{ chosenObj.etbzcCount }}</span
>
<span class="q-mr-sm" v-if="chosenObj.yeCount"
>婴儿 x {{ chosenObj.yeCount }}</span
>
<span class="q-mr-sm" v-if="chosenObj.df"
>单房间 x {{ chosenObj.df }}</span
>
</div>
</div>
<q-separator color="grey-2" class="q-mt-md" />
<div
class="bg-grey-1 rounded-borders q-pa-md q-mt-md guest-item"
v-for="(x, i) in guests"
:key="i"
>
<div class="text-subtitle1 q-pb-md text-weight-bold">{{ x.FormatTypeName }}</div>
<div class="row q-col-gutter-md">
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.FirstName"
label="本國姓"
placeholder="例:張"
:rules="[(val) => !!val || '請輸本國姓']"
/>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.LastName"
label="本國名"
placeholder="例:三"
:rules="[(val) => !!val || '請輸本國名']"
/>
</div>
<div :class="filedGuestWidth">
<div class="row items-center q-mt-md">
<span>選擇性別:</span>
<q-radio
v-model="x.Sex"
dense
:val="1"
label="男"
class="q-mr-lg"
/>
<q-radio v-model="x.Sex" dense :val="2" label="女" />
</div> </div>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.PassFirstName"
label="護照英文姓"
placeholder="例:ZHANG"
:rules="[(val) => !!val || '請輸護照英文姓']"
/>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.PassLastName"
label="護照英文名"
placeholder="例:SAN"
:rules="[(val) => !!val || '請輸護照英文名']"
/>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.Passport"
label="護照號"
:rules="[(val) => !!val || '請輸護照號']"
/>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.PassValidate"
label="護照有效期"
readonly
>
<template v-slot:append>
<q-icon name="event" class="cursor-pointer"></q-icon>
</template>
<q-popup-proxy :offset="[0, 0]" ref="qDateProxy7">
<q-date
mask="YYYY-MM-DD"
:title="$t('search_date_begin')"
subtitle="選擇"
v-model="x.PassValidate"
@input="() => $refs.qDateProxy7.hide()"
/>
</q-popup-proxy>
</q-input>
</div>
<div :class="filedGuestWidth" v-if="x.GuestType == 1">
<q-input
standout
v-model="x.PassFirstName"
label="聯絡電話"
placeholder="格式:國家區號+號碼,例如:+81 25xxxx"
/>
</div>
<div :class="filedGuestWidth" v-if="x.EnableSignRoom">
<q-toggle v-model="x.IsSignRoom" :disable="disableSign && !x.IsSignRoom" @input="changeRoomHandler" label="入住單房" />
</div>
</div> </div>
<q-separator color="grey-2" class="q-my-md"/> </div>
<div class="text-subtitle1 q-my-md text-weight-bold">特殊需求備註:</div>
<q-input standout v-model="chosenObj.remark" input-style="height:170px;" type="textarea" placeholder="此欄位僅限資料備註。不在商品規範內的個人需求,不保證提供" maxlength="200" counter />
</q-card> </q-card>
<coupon></coupon>
</div> </div>
<div <div class="relative-position"
:class="{ :class="{
'q-ml-lg': !($q.screen.width < 1200 || $q.platform.is.mobile), 'q-ml-lg': !($q.screen.width < 1200 || $q.platform.is.mobile),
'q-mt-lg': $q.screen.width < 1200 || $q.platform.is.mobile, 'q-mt-lg full-width': $q.screen.width < 1200 || $q.platform.is.mobile,
}" }"
> >
<div <div
...@@ -105,68 +260,230 @@ ...@@ -105,68 +260,230 @@
:style="{ :style="{
width: width:
$q.screen.width < 1200 || $q.platform.is.mobile $q.screen.width < 1200 || $q.platform.is.mobile
? '100%' ? 'unset'
: '300px', : '300px',
position:$q.platform.is.mobile?'unset':'sticky',
top:$q.platform.is.mobile?'unset':'50px',
}" }"
>222</div> >
<div class="text-subtitle1 text-weight-bolder">付款明細</div>
<div class="row q-mt-md">
<q-img
src="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">
【夏季限定】加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原 |
卡加利出发卡加利出发卡加利出发
</div>
<div class="text-caption text-grey-6 ellipsis q-mt-sm">
加拿大三日游 | 班夫&贾斯珀国家公园&哥伦比亚冰原
</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>
<div class="row">
<div style="width: 80px">出發日期:</div>
<div class="q-ml-md">2024-02-02</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.crCount>0">
<div class="col">成人佔床 x {{ chosenObj.crCount }}</div>
<div>CNY {{ moneyFormat(9999,2) }}</div>
</div>
<div class="row q-mb-sm" v-if="chosenObj.etzcCount>0">
<div class="col">兒童佔床 x {{ chosenObj.etzcCount }}</div>
<div>CNY {{ moneyFormat(9999,2) }}</div>
</div>
<div class="row q-mb-sm" v-if="chosenObj.etbzcCount>0">
<div class="col">兒童不佔床 x {{ chosenObj.etbzcCount }}</div>
<div>CNY {{ moneyFormat(9999,2) }}</div>
</div>
<div class="row q-mb-sm" v-if="chosenObj.yeCount>0">
<div class="col">嬰兒不佔床 x {{ chosenObj.yeCount }}</div>
<div>CNY {{ moneyFormat(9999,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" v-if="(chosenObj.etCount)>0">
<div class="col">兒童附加費 x {{ chosenObj.etCount }}</div>
<div>CNY {{ moneyFormat(9999,2) }}</div>
</div>
<div class="row q-mb-sm" v-if="(chosenObj.df)>0">
<div class="col">單房差價 x {{ chosenObj.df }}</div>
<div>CNY {{ moneyFormat(9999,2) }}</div>
</div>
<div class="row q-mb-sm items-center" v-if="(chosenObj.df)>0">
<div class="col">總金額</div>
<div class="text-subtitle2 text-weight-bolder text-primary">CNY {{ moneyFormat(9999,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="col">優惠金額</div>
<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="col">支付金額</div>
<div class="text-h6 text-weight-bolder text-primary product-price">CNY {{ moneyFormat(9999,2) }}</div>
</div>
</div>
<div class="text-right q-mt-md">
<q-btn unelevated color="primary" label="立即支付" />
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { json } from "body-parser";
import coupon from '../../components/common/coupon.vue'
export default { export default {
components:{
coupon
},
data() { data() {
return { return {
step: 1, step: 1,
userInfo:{ userInfo: {
lastName:'', lastName: "",
firstName:'', firstName: "",
country:0, country: 0,
phone:'', phone: "",
areaCode:'', areaCode: "",
mail:'' mail: "",
},
chosenObj: {
startDate: "",
crCount: 4,
etCount: 6,
yeCount: 0,
lrCount: 0,
etbzcCount: 4,
etzcCount: 2,
df: 1,
dcf: 0,
srf: 0,
isUnico: false,
unicoDep: {
city: null,
date: null,
price: 0,
isSup: -2,
},
unicoArr: {
city: null,
date: null,
price: 0,
isSup: -2,
},
remark: "",
},
isUpdateUserInfo: false,
countrys: [],
areaCodes: [],
guest: {
FirstName: "",
LastName: "",
Passport: "",
PassFirstName: "",
PassLastName: "",
GuestType: 0,
EnableSignRoom: false,
PassValidate: "",
FormatTypeName: "",
MobilePhone: "",
RoomType:0,
IsSignRoom:false,
Sex: 0,
}, },
isUpdateUserInfo:false, guests: [],
countrys:[], disableSign:false
areaCodes:[]
}; };
}, },
computed:{ computed: {
filedWidth(){ filedWidth() {
return { return {
'col-12': this.$q.screen.width < 1200, "col-12": this.$q.screen.width < 1200,
'col-6':this.$q.screen.width >= 1200 "col-6": this.$q.screen.width >= 1200,
} };
} },
}, filedGuestWidth() {
created() { return {
"col-12": this.$q.screen.width < 1200,
"col-4": this.$q.screen.width >= 1200,
};
},
}, },
created() {},
mounted() { mounted() {
this.initCountry() this.initCountry();
this.initGuestHandler();
}, },
methods: { methods: {
initCountry(){ changeRoomHandler(){
this.apipost( let currentSign = this.guests.filter(x=> x.IsSignRoom)
"GetCountryInfo_post", this.disableSign=currentSign==this.chosenObj.df
{}, },
(r) => { initGuestHandler() {
this.countrys = r.data.data.countList for (let i = 0; i < this.chosenObj.crCount; i++) {
this.userInfo.country = this.countrys[0].ID let obj = JSON.parse(JSON.stringify(this.guest));
obj.GuestType = 1;
this.areaCodes = r.data.data.phoneCountList obj.FormatTypeName = `成人 ${i + 1}:`;
this.changeCountry(this.userInfo.country) if (this.chosenObj.df > 0) {
this.areaCodes.forEach(x=>{ obj.EnableSignRoom = true;
let temp = this.countrys.find(y=>y.ID==x.ID) }
x.EnName=`${temp.EnName}(${x.PhoneCode})` this.guests.push(obj);
}) }
for (let i = 0; i < this.chosenObj.etzcCount; i++) {
let obj = JSON.parse(JSON.stringify(this.guest));
obj.GuestType = 2;
obj.FormatTypeName = `儿童占床 ${i + 1}:`;
if (this.chosenObj.df > 0) {
obj.EnableSignRoom = true;
}
this.guests.push(obj);
}
for (let i = 0; i < this.chosenObj.etbzcCount; i++) {
let obj = JSON.parse(JSON.stringify(this.guest));
obj.GuestType = 3;
obj.FormatTypeName = `儿童不占床 ${i + 1}:`;
this.guests.push(obj);
}
for (let i = 0; i < this.chosenObj.yeCount; i++) {
let obj = JSON.parse(JSON.stringify(this.guest));
obj.GuestType = 4;
obj.FormatTypeName = `婴儿 ${i + 1}:`;
this.guests.push(obj);
}
},
initCountry() {
this.apipost("GetCountryInfo_post", {}, (r) => {
this.countrys = r.data.data.countList;
this.userInfo.country = this.countrys[0].ID;
this.areaCodes = r.data.data.phoneCountList;
this.changeCountry(this.userInfo.country);
this.areaCodes.forEach((x) => {
let temp = this.countrys.find((y) => y.ID == x.ID);
x.EnName = `${temp.EnName}(${x.PhoneCode})`;
}); });
});
},
changeCountry(id) {
this.userInfo.areaCode = this.areaCodes.find((x) => x.ID == id).PhoneCode;
}, },
changeCountry(id){
this.userInfo.areaCode = this.areaCodes.find(x=>x.ID==id).PhoneCode
}
}, },
}; };
</script> </script>
...@@ -175,28 +492,31 @@ export default { ...@@ -175,28 +492,31 @@ export default {
.order-preview .q-stepper__content { .order-preview .q-stepper__content {
display: none !important; display: none !important;
} }
.order-preview .q-toggle__track{ .order-preview .q-toggle__track {
height: 0.7em; height: 0.7em;
border-radius: 0.35em; border-radius: 0.35em;
opacity: .38; opacity: 0.38;
width: 50px; width: 50px;
}
.order-preview .q-toggle__thumb {
top: 0.42em;
left: 0.45em;
width: 0.5em;
height: 0.5em;
transition: left 0.22s ease-in-out;
user-select: none;
z-index: 0;
} }
.order-preview .q-toggle__thumb{ .order-preview .q-toggle__inner--truthy .q-toggle__thumb {
top: 0.42em; left: 0.94em;
left: 0.45em;
width: 0.5em;
height: 0.5em;
transition: left 0.22s ease-in-out;
user-select: none;
z-index: 0;
} }
.order-preview .q-toggle__inner--truthy .q-toggle__thumb{ .order-preview .q-toggle__inner {
left: 0.94em; width: 1.9em;
} }
.order-preview .q-toggle__inner{ .order-preview .q-toggle__label {
width: 1.9em; margin-top: 12px;
} }
.order-preview .q-toggle__label{ .guest-item:hover{
margin-top: 12px; background: rgba(241,65,108,.04) !important;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment