Skip to content

B
bigwood
Commit d7adc8d3 authored by youjie's avatar youjie
Browse files
Options

no message

parent 31ff93ae
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 3177 additions and 71 deletions
src/assets/trip/block/index.css 0 → 100644
View file @ d7adc8d3
.trip-box{
/* width: 1000px; */
margin: 0 auto;
cursor: default;
}
.trip-block{
max-width: 100%;
padding-bottom: 40px;
padding-top: 40px;
border-bottom: #CCC 1px dotted;
}
.trip-block .trip-title {
min-height: 48px;
font-size: 20px;
/* background: #f3f3f3; */
padding:0 10px;
box-sizing: border-box;
color: #333;
font-family: 'PingFangR';
display: flex;
align-items: center;
}
.trip-block .trip-title .day{
width: 136px;
color: #4d4d4d;
font-size: 33px;
font-weight: normal;
letter-spacing: 3px;
}
.trip-block .trip-title p{
margin: 0;
}
.trip-block .trip-title p:nth-child(2){
color: #525252;
}
.trip-block .trip-title .desc{
color: #4d4d4d;
border-left: 1px solid #333;
padding-left: 25px;
height: 100%;
flex:1;
padding: 10px 10px 10px 20px;
}
.trip-block .trip-title .desc i{
font-size: 22px;
margin: 0 10px;
}
.trip-block .block-item{
margin-top: 20px;
}
.trip-block .block-item .item{
transition: box-shadow 250ms ease-out 0s;
font-size: 15px;
line-height: 1.5em;
color: #444;
background: rgba(23,23,23,.05);
box-sizing: border-box;
/* box-shadow: 0 0 12px rgba(0,0,0,0.1) inset; */
-webkit-transition: box-shadow 250ms ease-out 0s;
-moz-transition: box-shadow 250ms ease-out 0s;
-ms-transition: box-shadow 250ms ease-out 0s;
-o-transition: box-shadow 250ms ease-out 0s;
}
.trip-block .block-item .item:hover{
/* box-shadow: 0 0 12px rgba(0,0,0,0.1) inset; */
}
.trip-block .block-item .item h3{
/* margin: 18px 0; */
font-size: 18px;
font-family: 'PingFangR';
font-weight: 400;
color: #222;
position: relative;
z-index: 2;
}
.trip-block .block-item .item .playInfo{
margin-left: -5px;
height: 25px;
}
.playInfo .playInfo-item{
color: gray;
font-size: 12px;
margin-right: 20px;
}
.trip-block .block-item .item .playInfo .playInfo-item span{
display: inline;
}
.trip-block .block-item .item .playInfo .playInfo-item .iconfont{
font-size: 16px;
margin-right: 5px;
}
.trip-block .block-item .item h3 .iconfont{
font-size: 20px;
margin: 0 5px;
vertical-align: middle;
}
.trip-block .block-item .item h4{
position: relative;
width: 86px;
color: #EF4455;
font-size: 18px;
line-height: 20px;
margin: 0;
font-weight: 500;
}
.trip-block .block-item .item.big{
/* display: flex;
flex-direction: column; */
padding: 0px !important;
background: transparent;
}
.trip-block .block-item .item.big .left{
flex: 1;
}
.trip-block .block-item .item.big .left img{
width:100%;
height: 100%;
display: block;
}
.trip-block .block-item .item.big .right{
/* border: 1px solid #ccc; */
padding: 22px;
/* box-sizing: border-box; */
}
.trip-block .block-item .item.big .right .details{
height: 260px;
display: block;
margin-top: 15px;
/* font-size: 16px; */
line-height: 1.5em;
text-align: justify;
color: #444;
word-wrap: break-word;
word-break: break-all;
overflow: hidden;
}
.details span{
}
.trip-block .block-item .item .remark{
padding-left:15px;
font-size: 15px;
flex: 1;
color: #444;
list-style-position: outside;
list-style-type: decimal;
}
.trip-block .block-item .item .up{
padding: 22px;
margin: -22px;
}
.trip-block .block-item .item .up img{
width: 100%;
height: 100%;
}
.trip-block .block-item .item .down{
height: 260px;
overflow: hidden;
}
.trip-block .block-item .item.hor-box{
display: flex;
padding: 0px;
height: 246px;
overflow: hidden;
}
.trip-block .block-item .item.hor-box .remark{
transition: .4s;
padding: 22px;
overflow: hidden;
height: 173px;
}
.trip-block .block-item .item.hor-box .image{
flex: 1;
height: 100%;
}
.trip-block .block-item .item.hor-box .image img{
width: 100%;
/* height: 100%; */
flex: 1;
}
.trip-block .block-item .item .three-item{
height: 197px;
position: relative;
}
.trip-block .block-item .item .three-item:hover .image{
opacity: 1;
filter: alpha(opacity=100);
-moz-opacity: 1;
-webkit-transition: .3s;
transition: .3s;
}
.trip-block .block-item .item .three-item .image{
position: absolute;
-webkit-transition: .3s;
top: -40px;
left: -22px;
bottom: -22px;
right: -22px;
opacity: 0;
filter: alpha(opacity=0);
-moz-opacity: 0;
transition: .3s;
z-index: 0;
}
.trip-block .block-item .item .three-item .image img{
width: 100%;
height: 100%;
}
.trip-block .block-item .item .three-item:hover span {
opacity: 0;
filter: alpha(opacity=0);
-moz-opacity: 0;
transition: 200ms ease-out;
}
.trip-block .block-item .item .three-item span {
max-height: 151px;
display: inline-block;
overflow: hidden;
}
.trip-block .block-item .item .three-item:hover h3{
color:#f1f1f1;
}
.trip-block .block-item .restaurant{
margin:20px 0;
}
.trip-block .block-item .restaurant .restaurant-item{
display: flex;
}
.trip-block .block-item .restaurant .restaurant-item .key{
width:95px;
}
.trip-block .block-item .restaurant .restaurant-item .key img{
width:80px;
height: 28px;
}
.trip-block .block-item .restaurant .restaurant-item .val{
flex: 1;
font-size: 15px;
min-height: 28px;
color: #666;
line-height: 28px;
cursor: default;
vertical-align: top;
font-family: Roboto, Arial,微軟正黑體修正, 微軟正黑體, "Microsoft JhengHei", sans-serif;
}
.trip-block .flex{
display: flex;
}
.trip-block .block-item .five-box{
display: flex;
margin-bottom: 4px;
}
.trip-block .block-item .five-box .left{
position: relative;
width: 311px;
height: 497px;
overflow: hidden;
margin-right: 4px;
}
.trip-block .block-item .five-box .left .item{
height: 497px;
overflow: hidden;
}
.trip-block .block-item .five-box .left .image img{
width: 100%;
height: 100%;
}
.trip-block .block-item .five-box .left .item{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: transparent;
color: #f1f1f1;
}
.trip-block .block-item .five-box .left .item span{
opacity: 0;
transition: 0.3s;
}
.trip-block .block-item .five-box .left:hover .item{
transition: 0.3s;
background: rgba(0,0,0,0.2);
}
.trip-block .block-item .five-box .left:hover .item span{
opacity: 1;
transition: 0.3s;
color: #f1f1f1;
}
.trip-block .block-item .five-box .left .item h3{
color: #f1f1f1;
background: rgba(0,0,0,0.1)
}
.trip-block .block-item .five-box .right{
flex: 1;
height: 498px;
overflow: hidden;
}
.trip-block .block-item .five-box .right .item{
height: 247px;
overflow: hidden;
}
.trip-block .block-item .five-box .right .item .three-item{
height: 100%;
}
.trip-block .block-item .five-box .right .item .three-item span{
/* height: 137px;
overflow: hidden;
display: inline-block; */
}
.trip-block .block-item .item p{
margin: 0px !important;
padding: 0px !important;
}
.text-bold{
margin: 0;
font-size: 21px;
font-weight: bold;
letter-spacing: 1px;
line-height: 25px;
word-break: break-all;
word-wrap: break-word;
}
\ No newline at end of file
src/components/trip/block/allDay.vue 0 → 100644
View file @ d7adc8d3
<template>
<div class="block-item">
<!-- transition-prev="scale"
transition-next="scale" -->
<!-- transition-prev="slide-right"
transition-next="slide-left" -->
<q-carousel v-model="slide"
transition-prev="slide-right"
transition-next="slide-left"
swipeable animated
control-color="white" infinite height="100%"
class="my-bg-grey text-black shadow-1 no-shadow"
control-type="regular"
:arrows="day.details.length>0?true:false"
control-text-color="primary"
ref="carousel"
navigation
>
<template v-for="(x, i) in day.details">
<q-carousel-slide :name="i" class="column no-wrap">
<div class="bg-white row">
<template
v-if="x.fileType && x.fileType == '.mp4'">
<video
ref="myVideo"
width="100%"
height="246px"
:src="x.videoPath"
controls="controls"
></video>
</template>
<template v-else>
<q-img
v-if="x.img"
:src="x.img"
:ratio=" 16/9 "
style="width: 100%"
@click="showPreview(day.details,i)"
>
<template v-slot:error>
<div
class="absolute-full flex flex-center bg-blue-1 text-dark"
>
图片加载失败
</div>
</template>
</q-img>
<q-img
v-else
src="../../../assets/img/nll.jpg"
:ratio=" 16/9 "
fit="cover"
height="100%"
></q-img>
</template>
</div>
<div class="one-block q-px-md q-py-lg">
<div class="item big row">
<div class="row no-wrap">
<div class="right col">
<div class="details">
<div
v-if="x.title != ''"
class="text-h6 text-bold q-pb-sm"
v-html="x.title"
style="cursor: pointer"
></div>
<div
class="playInfo"
v-if="
x.playTimeHour || x.playTimeMinutes
"
>
<span
class="playInfo-item"
v-if="x.ticketName != ''"
>
</span>
<span
class="playInfo-item"
v-if="
x.playTimeHour ||
x.playTimeMinutes
"
>
<i class="iconfont icon-shijian1"></i>
约
<span v-if="x.playTimeHour"
>{{ x.playTimeHour }}小时
</span>
<span v-if="x.playTimeMinutes"
>{{ x.playTimeMinutes }}分钟</span
>
</span>
</div>
<span v-html="x.content"></span>
</div>
</div>
</div>
</div>
</div>
</q-carousel-slide>
</template>
<template v-slot:control>
<template v-if="day.details.length>1">
<q-carousel-control
position="top-right"
:offset="[10,188]"
class="q-gutter-xs"
>
<q-btn
push round dense color="primary" text-color="while" icon="arrow_left"
@click="$refs.carousel.previous()"
/>
<q-btn
push round dense color="primary" text-color="while" icon="arrow_right"
@click="$refs.carousel.next()"
/>
</q-carousel-control>
</template>
</template>
</q-carousel>
</div>
<q-dialog class="no-padding" v-model="showImagePriview" persistent>
<image-preview :current="currentImage" :images="images"></image-preview>
</q-dialog>
</template>
<script lang="ts">
import ImagePreview from "../../common/ImagePreview.vue";
import { date,useQuasar } from "quasar";
import { inject, reactive, toRefs, defineComponent,onMounted,ref,watch, getCurrentInstance } from 'vue';
import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { DirtionmaryHelper } from 'src/config/dictionary'
import scheduledTripService from 'src/api/scheduledTrip'
import { ApiResult } from 'src/@types/enumHelper'
import message from 'src/utils/message'
export default defineComponent({
components: { ImagePreview },
props: ['day','isDirect'],
setup(props) {
const $router = useRouter()
const { t } = useI18n()
const $q = useQuasar()
let {ctx:that, proxy} = getCurrentInstance()
const data= reactive({
showImagePriview:false,
currentImage:'',
images:[],
day: props.day,
isDirect: props.isDirect,
})
props.day.details.forEach(x=>{
if(x.img){
data.images.push(x.img)
}
})
const methods = {
showImageHandler(url: string) {
data.currentImage = url
data.showImagePriview = true
},
showPreview(imgs, index = 0) {
let timgs = [];
imgs.forEach((x) => {
timgs.push(x.img);
});
that.$viewerApi({
options: {
initialViewIndex: index,
},
images: timgs,
});
},
getHotelSuffix() {
let suffix = "";
if (props.day.jiu2.length > 1) {
if (props.isDirect === 1) {
suffix = "或同級";
}
} else {
if (
props.day.jiu2.length == 1 &&
props.day.jiu2[0].name != "温馨的家" &&
props.day.jiu2[0].name != "机场附近酒店"
) {
if (props.day.jiu2[0].status == 1) {
suffix = "【保证入住】";
} else {
if (props.isDirect === 1) {
suffix = "或同級";
}
}
}
}
return suffix;
},
goUrl(url) {
if (url != null && url.length > 0) {
window.open(url, "_blank");
}
},
}
return {
...toRefs(data),
...methods,
}
}
})
</script>
<style scoped>
.q-carousel__slide{
padding: 0 !important;
}
.q-img__image{
border-style: none !important;
}
</style>
\ No newline at end of file
src/components/trip/block/fiveday.vue 0 → 100644
View file @ d7adc8d3
This diff is collapsed.
src/components/trip/block/fourday.vue 0 → 100644
View file @ d7adc8d3
This diff is collapsed.
src/components/trip/block/index.vue 0 → 100644
View file @ d7adc8d3
This diff is collapsed.
src/components/trip/block/oneday.vue 0 → 100644
View file @ d7adc8d3
<style scoped>
@import url('../../../assets/trip/block/index.css');
</style>
<template>
<div class="block-item">
<div class="one-block">
<div class="item big row">
<div
class="row no-wrap"
:class="{
'col-8': day.details.length > 1,
col: day.details.length == 1,
}"
>
<div class="col-7">
<template
v-if="
day.details[0].fileType && day.details[0].fileType == '.mp4'
"
>
<video
ref="myVideo"
width="100%"
height="100%"
:src="day.details[0].videoPath"
controls="controls"
></video>
</template>
<template v-else>
<q-img @click="showImageHandler(day.details[0].img)"
v-if="day.details[0].img"
:src="day.details[0].img"
:ratio=" 16/9 "
fit="cover"
height="100%"
>
<template v-slot:error>
<div
class="absolute-full flex flex-center bg-blue-1 text-dark"
>
图片加载失败
</div>
</template>
</q-img>
<q-img @click="showImageHandler(day.details[0].img)"
v-else
src="../../../assets/img/nll.jpg"
:ratio=" 16/9 "
fit="cover"
height="100%"
></q-img>
</template>
</div>
<div class="right col" style="border: 1px solid #ccc; border-left: 0">
<div class="details">
<div
v-if="day.details[0].title != ''"
class="text-h6 text-bold q-pb-sm"
v-html="day.details[0].title"
@click.stop="goUrl(day.details[0].url)"
style="cursor: pointer"
></div>
<div
class="playInfo"
v-if="
day.details[0].playTimeHour || day.details[0].playTimeMinutes
"
>
<span
class="playInfo-item"
v-if="day.details[0].ticketName != ''"
>
</span>
<span
class="playInfo-item"
v-if="
day.details[0].playTimeHour ||
day.details[0].playTimeMinutes
"
>
<i class="iconfont icon-shijian1"></i>
约
<span v-if="day.details[0].playTimeHour"
>{{ day.details[0].playTimeHour }}小时
</span>
<span v-if="day.details[0].playTimeMinutes"
>{{ day.details[0].playTimeMinutes }}分钟</span
>
</span>
</div>
<span v-html="day.details[0].content"></span>
</div>
</div>
</div>
</div>
<div class="item flex q-mt-sm q-pa-lg" v-if="day.tips.length > 0">
<h4>温馨提示</h4>
<div class="remark">
<span v-for="(t, k) in day.tips" :key="k" v-html="t.content"></span>
</div>
</div>
<div
class="restaurant"
:class="{
'row justify-between wrap': $q.platform.is.desktop,
column: $q.platform.is.mobile,
}"
>
<div class="restaurant-item">
<div class="key">
<img src="../../../assets/img/daily_breakfast.png" />
</div>
<div class="val">{{ day.can.breakfirst }}</div>
</div>
<div class="restaurant-item">
<div class="key">
<img src="../../../assets/img/daily_lunch.png" />
</div>
<div class="val">{{ day.can.lanuch }}</div>
</div>
<div class="restaurant-item">
<div class="key">
<img src="../../../assets/img/daily_dinner.png" />
</div>
<div class="val">{{ day.can.dinner }}</div>
</div>
</div>
<div class="restaurant">
<div class="restaurant-item col-24 row">
<div class="key">
<img src="../../../assets/img/daily_hotel-1.png" />
</div>
<div class="val" v-if="day.jiu2.length > 0">
<span
v-for="(t, k) in day.jiu2"
@click.stop="goUrl(t.url)"
style="cursor: pointer"
:key="k"
>
{{ k == day.jiu2.length - 1 ? t.name : t.name + " / " }}
</span>
{{ getHotelSuffix() }}
</div>
<div class="val" v-else>本日无酒店安排</div>
</div>
</div>
</div>
</div>
<q-dialog class="no-padding" v-model="showImagePriview" persistent>
<image-preview :current="currentImage" :images="images"></image-preview>
</q-dialog>
</template>
<script lang="ts">
import ImagePreview from "../../common/ImagePreview.vue";
import { date,useQuasar } from "quasar";
import { inject, reactive, toRefs, defineComponent,onMounted,ref,watch, getCurrentInstance } from 'vue';
import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { DirtionmaryHelper } from 'src/config/dictionary'
import scheduledTripService from 'src/api/scheduledTrip'
import { ApiResult } from 'src/@types/enumHelper'
import message from 'src/utils/message'
export default defineComponent({
components: { ImagePreview },
props: ['day','isDirect'],
setup(props) {
const $router = useRouter()
const { t } = useI18n()
const $q = useQuasar()
let {ctx:that, proxy} = getCurrentInstance()
const data= reactive({
showImagePriview:false,
currentImage:'',
images:[],
day: props.day,
isDirect: props.isDirect,
})
props.day.details.forEach(x=>{
if(x.img){
data.images.push(x.img)
}
})
const methods = {
showImageHandler(url: string) {
data.currentImage = url
data.showImagePriview = true
},
showPreview(imgs, index = 0) {
let timgs = [];
imgs.forEach((x) => {
timgs.push(x.img);
});
that.$viewerApi({
options: {
initialViewIndex: index,
},
images: timgs,
});
},
getHotelSuffix() {
let suffix = "";
if (props.day.jiu2.length > 1) {
if (props.isDirect === 1) {
suffix = "或同級";
}
} else {
if (
props.day.jiu2.length == 1 &&
props.day.jiu2[0].name != "温馨的家" &&
props.day.jiu2[0].name != "机场附近酒店"
) {
if (props.day.jiu2[0].status == 1) {
suffix = "【保证入住】";
} else {
if (props.isDirect === 1) {
suffix = "或同級";
}
}
}
}
return suffix;
},
goUrl(url) {
if (url != null && url.length > 0) {
window.open(url, "_blank");
}
},
}
return {
...toRefs(data),
...methods,
}
}
})
</script>
src/components/trip/block/threeday.vue 0 → 100644
View file @ d7adc8d3
This diff is collapsed.
src/components/trip/block/twoday.vue 0 → 100644
View file @ d7adc8d3
This diff is collapsed.
src/components/trip/orderPreview.vue
View file @ d7adc8d3
...@@ -12,12 +12,19 @@ ...@@ -12,12 +12,19 @@
</div> </div>
<div class="text-grey-6 f12 q-my-md">選擇數量</div> <div class="text-grey-6 f12 q-my-md">選擇數量</div>
<div class="row items-end"> <div class="row items-end">
<div class="col"> <div class="col" :class="{'column':$q.platform.is.mobile}">
<span class="text-subtitle2 text-weight-bold">成人</span> <div>
<span class="text-grey-6 f12 q-ml-sm">(12-99歲)</span> <span class="text-subtitle2 text-weight-bold">成人</span>
<span class="text-grey-6 f12 q-ml-sm">(12-99歲)</span>
</div>
<div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px">
CNY {{ moneyFormat(p.originalB2CPrice, 0) }} /每人
</span>
</div>
</div> </div>
<div class="row items-end"> <div class="row items-end">
<span 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 {{ moneyFormat(p.originalB2CPrice, 0) }} /每人 CNY {{ moneyFormat(p.originalB2CPrice, 0) }} /每人
</span> </span>
<q-input <q-input
...@@ -59,12 +66,20 @@ ...@@ -59,12 +66,20 @@
</div> </div>
</div> </div>
<div class="row items-end q-mt-md" v-if="p.isSupportChildren == 1"> <div class="row items-end q-mt-md" v-if="p.isSupportChildren == 1">
<div class="col"> <div class="col" :class="{'column':$q.platform.is.mobile}">
<span class="text-subtitle2 text-weight-bold">儿童</span> <div>
<span class="text-subtitle2 text-weight-bold">儿童</span>
<span class="text-grey-6 f12 q-ml-sm">(2-11歲,不占床)</span> <span class="text-grey-6 f12 q-ml-sm">(2-11歲,不占床)</span>
</div>
<div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px">
CNY
{{ moneyFormat(p.originalB2CPrice - p.childNoNeedPrice, 0) }} /每人
</span>
</div>
</div> </div>
<div class="row items-end"> <div class="row items-end">
<span 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.originalB2CPrice - p.childNoNeedPrice, 0) }} /每人 {{ moneyFormat(p.originalB2CPrice - p.childNoNeedPrice, 0) }} /每人
</span> </span>
...@@ -108,12 +123,19 @@ ...@@ -108,12 +123,19 @@
</div> </div>
<div class="row items-end q-mt-md" v-if="p.isSupportChildren == 1"> <div class="row items-end q-mt-md" v-if="p.isSupportChildren == 1">
<div class="col"> <div class="col" :class="{'column':$q.platform.is.mobile}">
<span class="text-subtitle2 text-weight-bold">婴儿</span> <div>
<span class="text-grey-6 f12 q-ml-sm">(2歲以下)</span> <span class="text-subtitle2 text-weight-bold">婴儿</span>
<span class="text-grey-6 f12 q-ml-sm">(2歲以下)</span>
</div>
<div v-if="$q.platform.is.mobile">
<span v-if="$q.platform.is.desktop" class="text-grey-7 product-price" style="font-size: 13px">
CNY {{ moneyFormat(p.babyPrice, 0) }} /每人
</span>
</div>
</div> </div>
<div class="row items-end"> <div class="row items-end">
<span 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 {{ moneyFormat(p.babyPrice, 0) }} /每人 CNY {{ moneyFormat(p.babyPrice, 0) }} /每人
</span> </span>
<q-input <q-input
...@@ -164,12 +186,19 @@ ...@@ -164,12 +186,19 @@
> >
<div class="text-grey-6 f12">單房服務</div> <div class="text-grey-6 f12">單房服務</div>
<div class="row items-end"> <div class="row items-end">
<div class="col"> <div class="col" :class="{'column':$q.platform.is.mobile}">
<span class="text-subtitle2 text-weight-bold">單房服務</span> <div>
<span class="text-grey-6 f12 q-ml-sm">(獨立單間住宿)</span> <span class="text-subtitle2 text-weight-bold">單房服務</span>
<span class="text-grey-6 f12 q-ml-sm">(獨立單間住宿)</span>
</div>
<div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px">
CNY {{ moneyFormat(p.singleRoomPrice, 0) }} /每人
</span>
</div>
</div> </div>
<div class="row items-end"> <div class="row items-end">
<span 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 {{ moneyFormat(p.singleRoomPrice, 0) }} /每人 CNY {{ moneyFormat(p.singleRoomPrice, 0) }} /每人
</span> </span>
<q-input <q-input
...@@ -226,7 +255,7 @@ ...@@ -226,7 +255,7 @@
<span class="text-h6 text-primary product-price">CNY {{ moneyFormat(sumPrice,0) }}</span> <span class="text-h6 text-primary product-price">CNY {{ moneyFormat(sumPrice,0) }}</span>
</div> </div>
<div class="q-mt-md text-right"> <div class="q-mt-md text-right">
<span class="q-mr-lg f12 text-negative" v-if="!p.startDate" >請選擇左側的出行日期</span> <span class="q-mr-lg f12 text-negative" v-if="!p.startDate" >{{$q.platform.is.mobile?'請選擇上面的出行日期':'請選擇左側的出行日期'}} </span>
<q-btn color="primary" label="立即訂購" unelevated class="q-px-lg" :disable="sumPrice==0"/> <q-btn color="primary" label="立即訂購" unelevated class="q-px-lg" :disable="sumPrice==0"/>
</div> </div>
</div> </div>
......
src/components/trip/smaple.vue
View file @ d7adc8d3
...@@ -2,40 +2,49 @@ ...@@ -2,40 +2,49 @@
<div class="q-mt-md"> <div class="q-mt-md">
<div class="text-subtitle2 text-weight-bold">產品概要</div> <div class="text-subtitle2 text-weight-bold">產品概要</div>
<div class="row q-pt-md q-col-gutter-md"> <div class="row q-pt-md q-col-gutter-md">
<div class="row items-center q-pt-mb col-6" v-if="traffic!=''"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">往返交通：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" v-if="traffic!=''">
<div class="q-mr-md col-3">往返交通：</div>
<div class="col text-grey-6">{{ traffic }}</div> <div class="col text-grey-6">{{ traffic }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6" v-if="hotel!=''"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">酒店住宿：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" v-if="hotel!=''">
<div class="q-mr-md col-3">酒店住宿：</div>
<div class="col text-grey-6">{{ hotel }}</div> <div class="col text-grey-6">{{ hotel }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">購物：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}">
<div class="q-mr-md col-3">購物：</div>
<div class="col text-grey-6">{{ trip.shopList.length>0?`${trip.shopList.length}個購物點`:'無購物行程' }}</div> <div class="col text-grey-6">{{ trip.shopList.length>0?`${trip.shopList.length}個購物點`:'無購物行程' }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6" v-if="team!=''"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">團隊人數：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" v-if="team!=''">
<div class="q-mr-md col-3">團隊人數：</div>
<div class="col text-grey-6">{{ team }}</div> <div class="col text-grey-6">{{ team }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">景點：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" >
<div class="q-mr-md col-3">景點：</div>
<div class="col text-grey-6">{{ trip.scenicList.length }}個景點或場館</div> <div class="col text-grey-6">{{ trip.scenicList.length }}個景點或場館</div>
</div> </div>
<div class="row items-center q-pt-mb col-6"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">自費項目：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" >
<div class="q-mr-md col-3">自費項目：</div>
<div class="col text-grey-6">{{ trip.selfpayingList.length>0?`${trip.selfpayingList.length}個自費項目`:'無自費項目' }}</div> <div class="col text-grey-6">{{ trip.selfpayingList.length>0?`${trip.selfpayingList.length}個自費項目`:'無自費項目' }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6" v-if="trip.freedomList.length>0"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">自由活動：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" v-if="trip.freedomList.length>0">
<div class="q-mr-md col-3">自由活動：</div>
<div class="col text-grey-6">{{ trip.freedomList.length}} 次自由活動</div> <div class="col text-grey-6">{{ trip.freedomList.length}} 次自由活動</div>
</div> </div>
<div class="row items-center q-pt-mb col-6"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">餐食：</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" >
<div class="q-mr-md col-3">餐食：</div>
<div class="col text-grey-6">{{ dinner }}</div> <div class="col text-grey-6">{{ dinner }}</div>
</div> </div>
<div class="row items-center q-pt-mb col-6"> <div class="row items-center q-pt-mb"
<div class="col-3 q-mr-md">服務用語</div> :class="{'col-6':$q.platform.is.desktop,'col-12':$q.platform.is.mobile}" >
<div class="q-mr-md col-3">服務用語</div>
<div class="col text-grey-6">普通話/日本語</div> <div class="col text-grey-6">普通話/日本語</div>
</div> </div>
</div> </div>
......
src/pages/scheduledTrip/detailsNew.vue
View file @ d7adc8d3
This diff is collapsed.
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