Commit 77dd57b7 authored by 沈良进's avatar 沈良进

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

parents 8d7211d9 d33c2887
<template> <template>
<div class="block-item"> <div class="block-item">
<!-- transition-prev="scale" <q-carousel
transition-next="scale" --> swipeable
<!-- transition-prev="slide-right" animated
transition-next="slide-left" --> v-model="slide"
<q-carousel v-model="slide" infinite
transition-prev="slide-right" :autoplay="autoplay"
transition-next="slide-left" transition-prev="slide-right"
swipeable animated transition-next="slide-left"
control-color="white" infinite arrows height="100%" ref="carousel">
class="my-bg-grey text-black shadow-1 no-shadow"
control-type="regular"
:arrows="day.details.length>0?false:false"
control-text-color="primary"
ref="carousel"
>
<template v-for="(x, i) in day.details"> <template v-for="(x, i) in day.details">
<q-carousel-slide :name="i" class="column no-wrap"> <q-carousel-slide :name="i" class="column no-wrap">
<div class="bg-white row"> <div class="bg-white row">
...@@ -29,12 +23,11 @@ ...@@ -29,12 +23,11 @@
></video> ></video>
</template> </template>
<template v-else> <template v-else>
<q-img <q-img @click="showPreview(day.details,i)"
v-if="x.img" v-if="x.img"
:src="x.img" :src="x.img"
:ratio=" 16/9 " :ratio=" 16/9 "
style="width: 100%" style="width: 100%"
@click="showPreview(day.details,i)"
> >
<template v-slot:error> <template v-slot:error>
<div <div
...@@ -44,7 +37,7 @@ ...@@ -44,7 +37,7 @@
</div> </div>
</template> </template>
</q-img> </q-img>
<q-img <q-img @click="showPreview(day.details,i)"
v-else v-else
src="../../../assets/img/nll.jpg" src="../../../assets/img/nll.jpg"
:ratio=" 16/9 " :ratio=" 16/9 "
...@@ -179,6 +172,9 @@ ...@@ -179,6 +172,9 @@
}; };
</script> </script>
<style scoped> <style scoped>
.q-carousel{
height: auto !important;
}
.q-carousel__slide{ .q-carousel__slide{
padding: 0 !important; padding: 0 !important;
} }
......
...@@ -9,10 +9,10 @@ ...@@ -9,10 +9,10 @@
</style> </style>
<template> <template>
<div class="trip-box"> <div class="trip-box">
<div :class="{'trip-block':$q.platform.is.desktop,'q-pb-lg':$q.platform.is.mobile,'q-pt-lg':$q.platform.is.mobile&&i==0}"
<div :class="{'trip-block':$q.platform.is.desktop,'q-pb-lg':$q.platform.is.mobile,'q-pt-lg':$q.platform.is.mobile&&i==0}" v-for="(item,i) in trips" :key="i"> v-for="(item,i) in trips" :key="i" :id="`days_${i}`">
<template v-if="$q.platform.is.desktop"> <template v-if="$q.platform.is.desktop">
<div class="trip-title" :id="`days_${i}`"> <div class="trip-title">
<div> <div>
<p class="day"><span v-if='item.dayNum<10'>0</span>{{item.dayNum}}</p> <p class="day"><span v-if='item.dayNum<10'>0</span>{{item.dayNum}}</p>
<!-- <p>{{item.dateTime}}</p> --> <!-- <p>{{item.dateTime}}</p> -->
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<fiveday v-if="item.details && item.details.length>=5" :day='item' :isDirect="isDirect"></fiveday> <fiveday v-if="item.details && item.details.length>=5" :day='item' :isDirect="isDirect"></fiveday>
</template> </template>
<template v-else> <template v-else>
<div :id="`days_${i}`"> <div>
<div class="bg-grey-3 q-px-lg q-py-md"> <div class="bg-grey-3 q-px-lg q-py-md">
<div> <div>
<div class="fz28 text-red"><span class="fz28" style="font-weight: bold;"><span v-if='item.dayNum<10'>0</span>{{item.dayNum}}</span></div> <div class="fz28 text-red"><span class="fz28" style="font-weight: bold;"><span v-if='item.dayNum<10'>0</span>{{item.dayNum}}</span></div>
...@@ -69,8 +69,7 @@ ...@@ -69,8 +69,7 @@
try{ try{
this.daysClass.forEach((x,i)=>{ this.daysClass.forEach((x,i)=>{
var object=document.getElementById(`days_${i}`); var object=document.getElementById(`days_${i}`);
x.top = object.getBoundingClientRect().top+60
x.top = object.getBoundingClientRect().top+100
}) })
} catch (error) { } catch (error) {
console.log('----异常') console.log('----异常')
......
...@@ -244,10 +244,12 @@ ...@@ -244,10 +244,12 @@
></calendar> ></calendar>
</q-popup-proxy> </q-popup-proxy>
</q-field> </q-field>
<order-preview class="q-pa-md" <template v-if="currentPrice&&currentPrice.startDate">
:price="currentPrice" <order-preview class="q-pa-md"
@reset="resetHandler" :price="currentPrice"
></order-preview> @reset="resetHandler"
></order-preview>
</template>
</div> </div>
<div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">所選方案詳情</div> <div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">所選方案詳情</div>
...@@ -353,7 +355,7 @@ ...@@ -353,7 +355,7 @@
class="trip-module text-subtitle2 cursor-pointer q-mb-lg" class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
v-for="(x, i) in days" v-for="(x, i) in days"
:key="i" :key="i"
@click="goScrollHandler(x.top + 20)" @click="goScrollHandler(x.top + 100)"
:class="{ :class="{
'active-trip-moduleDay text-red active': 'active-trip-moduleDay text-red active':
currentHeight >= x.top && currentHeight >= x.top &&
...@@ -384,7 +386,7 @@ ...@@ -384,7 +386,7 @@
行程介紹 行程介紹
</div> </div>
<div class="q-pb-xl" > <div class="q-pb-xl" >
<smaple :trip="dataList" :class="{'q-px-md': $q.screen.width < 1220&&$q.platform.is.mobile}"></smaple> <smaple :trip="dataList" :class="{'q-px-md': $q.screen.width < 1220&&$q.platform.is.desktop}"></smaple>
<template v-if="dataList.dayList.length<=3"> <template v-if="dataList.dayList.length<=3">
<trip :trip="dataList" @change="changeTripShowHandler"></trip> <trip :trip="dataList" @change="changeTripShowHandler"></trip>
</template> </template>
...@@ -584,8 +586,6 @@ export default { ...@@ -584,8 +586,6 @@ export default {
priceListHeight: 0, priceListHeight: 0,
stickyHeight: 0, stickyHeight: 0,
zoomDiyContext: 1, zoomDiyContext: 1,
currentHeightDay: 0,
stickyHeightDay: 0
}; };
}, },
components: { components: {
...@@ -598,12 +598,6 @@ export default { ...@@ -598,12 +598,6 @@ export default {
block block
}, },
watch: { watch: {
currentHeightDay:{
handler: function (val, oldval) {
this.currentHeightDay = val
},
deep: true
},
days: { days: {
handler: function (val, oldval) { handler: function (val, oldval) {
this.days = val this.days = val
...@@ -670,7 +664,7 @@ export default { ...@@ -670,7 +664,7 @@ export default {
// } // }
this.stickyHeight = document.querySelector(".q-header--hidden") this.stickyHeight = document.querySelector(".q-header--hidden")
? "translateY(0px)" ? "translateY(0px)"
: "translateY(60px)"; : "translateY(85px)";
this.currentHeight = temp; this.currentHeight = temp;
if ( if (
this.videoPosition > 0 && this.videoPosition > 0 &&
...@@ -734,6 +728,7 @@ export default { ...@@ -734,6 +728,7 @@ export default {
//console.log(e) //console.log(e)
}, },
resetHandler() { resetHandler() {
this.currentPrice.startDate = ''
this.$refs.calendar.reset(); this.$refs.calendar.reset();
}, },
changeChosenDateHandler(val) { changeChosenDateHandler(val) {
...@@ -789,12 +784,16 @@ export default { ...@@ -789,12 +784,16 @@ export default {
} }
this.$nextTick(() => { this.$nextTick(() => {
if(this.dataList.feature.featureHtml!=''){ if(this.dataList.feature.featureHtml!=''){
let tw = let tw = parseFloat(
this.$q.platform.is.desktop?parseFloat(
this.$refs.diyContext.getBoundingClientRect().width
) / 1123.0 :parseFloat(
this.$refs.diyContext.getBoundingClientRect().width this.$refs.diyContext.getBoundingClientRect().width
) / 975.0; ) / 1123.0
if(this.$q.platform.is.mobile){
let divArr = document.querySelectorAll("#setZoom>div")
for(let i=0;i<divArr.length;i++){
let div = divArr[i]
div.style.zoom = div.offsetWidth>1000?0.999:document.documentElement.clientWidth/1123.0
}
}
this.zoomDiyContext = tw > 1 ? 1 : tw.toFixed(2); this.zoomDiyContext = tw > 1 ? 1 : tw.toFixed(2);
} }
...@@ -894,7 +893,8 @@ export default { ...@@ -894,7 +893,8 @@ export default {
background: var(--q-color-primary); background: var(--q-color-primary);
} }
.trip-module{ .trip-module{
color: #9E9E9E;
transition: all .3s;
font-weight: 100; font-weight: 100;
text-align: center; text-align: center;
line-height: 38px; line-height: 38px;
...@@ -905,10 +905,6 @@ export default { ...@@ -905,10 +905,6 @@ export default {
border-radius: 50%; border-radius: 50%;
font-family: lettergothicstd; font-family: lettergothicstd;
} }
.trip-module{
color: #9E9E9E;
transition: all .3s;
}
.active-trip-moduleDay { .active-trip-moduleDay {
position: relative; position: relative;
border: 0; border: 0;
...@@ -929,4 +925,7 @@ export default { ...@@ -929,4 +925,7 @@ export default {
line-height: 58px; line-height: 58px;
opacity: 0; opacity: 0;
} }
#setZoom>div{
zoom: calc(100 / 1000)
}
</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