Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
M
million
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
viitto
million
Commits
5be9222f
Commit
5be9222f
authored
Feb 15, 2023
by
youjie
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
no message
parent
f0416393
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
474 additions
and
321 deletions
+474
-321
quasar.conf.js
quasar.conf.js
+2
-1
index.css
src/assets/trip/block/index.css
+4
-4
fiveday.vue
src/components/trip/block/fiveday.vue
+173
-125
fourday.vue
src/components/trip/block/fourday.vue
+94
-88
index.vue
src/components/trip/block/index.vue
+1
-1
oneday.vue
src/components/trip/block/oneday.vue
+5
-10
threeday.vue
src/components/trip/block/threeday.vue
+11
-14
twoday.vue
src/components/trip/block/twoday.vue
+10
-13
orderPreview.vue
src/components/trip/orderPreview.vue
+45
-16
smaple.vue
src/components/trip/smaple.vue
+27
-18
detailsNew.vue
src/pages/detailsNew.vue
+102
-31
No files found.
quasar.conf.js
View file @
5be9222f
...
...
@@ -162,7 +162,8 @@ module.exports = function( /* ctx */ ) {
'QResponsive'
,
'QTooltip'
,
'QBadge'
,
'QParallax'
'QParallax'
,
'QField'
,
],
directives
:
[
...
...
src/assets/trip/block/index.css
View file @
5be9222f
...
...
@@ -74,7 +74,6 @@
z-index
:
2
;
}
.trip-block
.block-item
.item
.playInfo
{
margin-top
:
5px
;
margin-left
:
-5px
;
height
:
25px
;
}
...
...
@@ -126,9 +125,10 @@
/* box-sizing: border-box; */
}
.trip-block
.block-item
.item.big
.right
.details
{
height
:
260px
;
display
:
block
;
margin-top
:
15px
;
font-size
:
16px
;
/* font-size: 16px; */
line-height
:
1.5em
;
text-align
:
justify
;
color
:
#444
;
...
...
@@ -137,7 +137,7 @@
overflow
:
hidden
;
}
.details
span
{
}
.trip-block
.block-item
.item
.remark
{
padding-left
:
15px
;
...
...
@@ -157,7 +157,7 @@
height
:
100%
;
}
.trip-block
.block-item
.item
.down
{
/* height: 150px; */
height
:
260px
;
overflow
:
hidden
;
}
.trip-block
.block-item
.item.hor-box
{
...
...
src/components/trip/block/fiveday.vue
View file @
5be9222f
This diff is collapsed.
Click to expand it.
src/components/trip/block/fourday.vue
View file @
5be9222f
This diff is collapsed.
Click to expand it.
src/components/trip/block/index.vue
View file @
5be9222f
...
...
@@ -45,7 +45,7 @@
this
.
daysClass
.
forEach
((
x
,
i
)
=>
{
var
object
=
document
.
getElementById
(
`days_
${
i
}
`
);
x
.
top
=
object
.
getBoundingClientRect
().
top
-
1
00
x
.
top
=
object
.
getBoundingClientRect
().
top
+
3
00
})
}
catch
(
error
)
{
console
.
log
(
'----异常'
)
...
...
src/components/trip/block/oneday.vue
View file @
5be9222f
...
...
@@ -21,9 +21,9 @@
</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"
v-html=
"day.details[0].title"
@
click
.
stop=
"goUrl(day.details[0].url)"
<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"
>
<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'
>
...
...
@@ -46,29 +46,25 @@
<span
v-for=
"(t,k) in day.tips"
:key=
"k"
v-html=
"t.content"
></span>
</div>
</div>
<div
class=
"restaurant
row justify-between wrap
"
>
<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
q-pl-sm
"
>
<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
q-pl-sm
"
>
<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"
>
<div
class=
"key"
>
<img
src=
'../../../assets/img/daily_hotel-1.png'
/>
...
...
@@ -81,7 +77,6 @@
</div>
<div
class=
"val"
v-else
>
本日无酒店安排
</div>
</div>
</div>
</div>
</div>
...
...
src/components/trip/block/threeday.vue
View file @
5be9222f
...
...
@@ -2,7 +2,7 @@
<div
class=
"block-item"
>
<div
class=
"two-block"
>
<div
class=
"column"
>
<div
class=
"itemcol row no-wrap"
style=
"background: #F6F6F6;"
>
<div
class=
"item
col row no-wrap"
style=
"background: #F6F6F6;"
>
<div
class=
"up col-8"
>
<template
v-if=
"day.details[0].fileType&&day.details[0].fileType=='.mp4'"
>
<video
ref=
"myVideo"
width=
"100%"
height=
"100%"
:src=
"item.videoPath"
...
...
@@ -23,9 +23,9 @@
<div
class=
"row items-end"
style=
"border:1px solid #ccc;left: 0;"
>
<div
class=
"q-pb-lg"
>
<div
class=
"down q-pa-lg col"
>
<div
v-if=
"day.details[0].title!=''"
class=
"text-h6 text-bold"
v-html=
"day.details[0].title"
@
click
.
stop=
"goUrl(day.details[0].url)"
<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;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;"
></div>
<div
class=
"playInfo"
>
<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'
>
...
...
@@ -44,10 +44,10 @@
<div
class=
"item q-mt-sm col row no-wrap"
style=
"background: #F6F6F6;"
>
<div
class=
"up row"
>
<div
class=
"col"
style=
"border:1px solid #ccc;right: 0;"
>
<div
class=
"down q-
p
a-lg col"
>
<div
v-if=
"day.details[1].title!=''"
class=
"text-h6 text-bold"
v-html=
"day.details[1].title"
@
click
.
stop=
"goUrl(day.details[1].url)"
<div
class=
"down q-
m
a-lg col"
>
<div
v-if=
"day.details[1].title!=''"
class=
"text-h6 text-bold
q-pb-sm
"
v-html=
"day.details[1].title"
@
click
.
stop=
"goUrl(day.details[1].url)"
style=
"cursor: pointer;"
></div>
<div
class=
"playInfo"
>
<div
class=
"playInfo"
v-if=
'day.details[1].playTimeHour || day.details[1].playTimeMinutes'
>
<span
class=
"playInfo-item"
v-if=
'day.details[1].ticketName!=""'
>
</span>
<span
class=
"playInfo-item"
v-if=
'day.details[1].playTimeHour || day.details[1].playTimeMinutes'
>
...
...
@@ -101,9 +101,9 @@
<div
class=
"row items-end"
style=
"border:1px solid #ccc;left: 0;"
>
<div
class=
"q-pb-lg"
>
<div
class=
"down q-pa-lg col"
>
<div
v-if=
"day.details[2].title!=''"
class=
"text-h6 text-bold"
v-html=
"day.details[2].title"
@
click
.
stop=
"goUrl(day.details[2].url)"
<div
v-if=
"day.details[2].title!=''"
class=
"text-h6 text-bold
q-pb-sm
"
v-html=
"day.details[2].title"
@
click
.
stop=
"goUrl(day.details[2].url)"
style=
"cursor: pointer;"
></div>
<div
class=
"playInfo"
>
<div
class=
"playInfo"
v-if=
'day.details[2].playTimeHour || day.details[2].playTimeMinutes'
>
<span
class=
"playInfo-item"
v-if=
'day.details[2].ticketName!=""'
>
</span>
<span
class=
"playInfo-item"
v-if=
'day.details[2].playTimeHour || day.details[2].playTimeMinutes'
>
...
...
@@ -128,28 +128,25 @@
<span
v-for=
"(t,k) in day.tips"
:key=
"k"
v-html=
"t.content"
></span>
</div>
</div>
<div
class=
"restaurant
row justify-between wrap
"
>
<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
q-pl-sm
"
>
<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
q-pl-sm
"
>
<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"
>
<div
class=
"key"
>
<img
src=
'../../../assets/img/daily_hotel-1.png'
/>
...
...
src/components/trip/block/twoday.vue
View file @
5be9222f
...
...
@@ -15,7 +15,7 @@
</
template
>
<
template
v-else
>
<q-img
v-if=
"item.img"
:src=
'item.img'
:ratio=
"1"
fit=
"cover"
height=
"100%"
>
<q-img
v-if=
"item.img"
:src=
'item.img'
:ratio=
"1
2/4
"
fit=
"cover"
height=
"100%"
>
<template
v-slot:error
>
<div
class=
"absolute-full flex flex-center bg-blue-1 text-dark"
>
图片加载失败
...
...
@@ -28,9 +28,9 @@
<div
class=
"row items-end"
style=
"border:1px solid #ccc;left: 0;"
>
<div
class=
"q-pb-lg"
>
<div
class=
"down q-pa-lg"
:class=
"{'col':index==0}"
>
<div
v-if=
"item.title!=''"
class=
"text-h6 text-bold"
v-html=
"item.title"
@
click
.
stop=
"goUrl(item.url)"
<div
v-if=
"item.title!=''"
class=
"text-h6 text-bold
q-pb-sm
"
v-html=
"item.title"
@
click
.
stop=
"goUrl(item.url)"
style=
"cursor: pointer;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;"
></div>
<div
class=
"playInfo"
>
<div
class=
"playInfo"
v-if=
'item.playTimeHour || item.playTimeMinutes'
>
<span
class=
"playInfo-item"
v-if=
'item.ticketName!=""'
>
</span>
<span
class=
"playInfo-item"
v-if=
'item.playTimeHour || item.playTimeMinutes'
>
...
...
@@ -49,11 +49,11 @@
</template>
<
template
v-for=
"(item,index) in day.details"
>
<div
v-if=
"index==1"
class=
"item up q-mt-sm row no-wrap col"
:key=
"item.dayNum"
style=
"background: #F6F6F6;"
>
<div
class=
"col"
style=
"border:1px solid #ccc;right: 0;"
>
<div
class=
"down
q-pa-lg
"
:class=
"
{'col':index==0}">
<div
v-if=
"item.title!=''"
class=
"text-h6 text-bold"
v-html=
"item.title"
@
click
.
stop=
"goUrl(item.url)"
<div
class=
"col
q-pa-lg
"
style=
"border:1px solid #ccc;right: 0;"
>
<div
class=
"down"
:class=
"
{'col':index==0}">
<div
v-if=
"item.title!=''"
class=
"text-h6 text-bold
q-pb-sm
"
v-html=
"item.title"
@
click
.
stop=
"goUrl(item.url)"
style=
"cursor: pointer;"
></div>
<div
class=
"playInfo"
>
<div
class=
"playInfo"
v-if=
'item.playTimeHour || item.playTimeMinutes'
>
<span
class=
"playInfo-item"
v-if=
'item.ticketName!=""'
>
</span>
<span
class=
"playInfo-item"
v-if=
'item.playTimeHour || item.playTimeMinutes'
>
...
...
@@ -95,28 +95,25 @@
<span
v-for=
"(t,k) in day.tips"
:key=
"k"
v-html=
"t.content"
></span>
</div>
</div>
<div
class=
"restaurant
row justify-between wrap
"
>
<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
q-pl-sm
"
>
<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
q-pl-sm
"
>
<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"
>
<div
class=
"key"
>
<img
src=
'../../../assets/img/daily_hotel-1.png'
/>
...
...
src/components/trip/orderPreview.vue
View file @
5be9222f
...
...
@@ -12,12 +12,19 @@
</div>
<div
class=
"text-grey-6 f12 q-my-md"
>
選擇數量
</div>
<div
class=
"row items-end"
>
<div
class=
"col"
>
<span
class=
"text-subtitle2 text-weight-bold"
>
成人
</span>
<span
class=
"text-grey-6 f12 q-ml-sm"
>
(12-99歲)
</span>
<div
class=
"col"
:class=
"
{'column':$q.platform.is.mobile}">
<div>
<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
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
)
}}
/每人
</span>
<q-input
...
...
@@ -59,12 +66,20 @@
</div>
</div>
<div
class=
"row items-end q-mt-md"
v-if=
"p.isSupportChildren == 1"
>
<div
class=
"col"
>
<span
class=
"text-subtitle2 text-weight-bold"
>
儿童
</span>
<div
class=
"col"
:class=
"{'column':$q.platform.is.mobile}"
>
<div>
<span
class=
"text-subtitle2 text-weight-bold"
>
儿童
</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
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 - p.childNoNeedPrice, 0) }} /每人
</span>
...
...
@@ -108,12 +123,19 @@
</div>
<div
class=
"row items-end q-mt-md"
v-if=
"p.isSupportChildren == 1"
>
<div
class=
"col"
>
<span
class=
"text-subtitle2 text-weight-bold"
>
婴儿
</span>
<span
class=
"text-grey-6 f12 q-ml-sm"
>
(2歲以下)
</span>
<div
class=
"col"
:class=
"{'column':$q.platform.is.mobile}"
>
<div>
<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
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) }} /每人
</span>
<q-input
...
...
@@ -164,12 +186,19 @@
>
<div
class=
"text-grey-6 f12"
>
單房服務
</div>
<div
class=
"row items-end"
>
<div
class=
"col"
>
<span
class=
"text-subtitle2 text-weight-bold"
>
單房服務
</span>
<span
class=
"text-grey-6 f12 q-ml-sm"
>
(獨立單間住宿)
</span>
<div
class=
"col"
:class=
"{'column':$q.platform.is.mobile}"
>
<div>
<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
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) }} /每人
</span>
<q-input
...
...
@@ -226,7 +255,7 @@
<span
class=
"text-h6 text-primary product-price"
>
CNY {{ moneyFormat(sumPrice,0) }}
</span>
</div>
<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"
/>
</div>
</div>
...
...
src/components/trip/smaple.vue
View file @
5be9222f
...
...
@@ -2,40 +2,49 @@
<div
class=
"q-mt-md"
>
<div
class=
"text-subtitle2 text-weight-bold"
>
產品概要
</div>
<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=
"col-3 q-mr-md"
>
往返交通:
</div>
<div
class=
"row items-center q-pt-mb"
: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>
<div
class=
"row items-center q-pt-mb col-6"
v-if=
"hotel!=''"
>
<div
class=
"col-3 q-mr-md"
>
酒店住宿:
</div>
<div
class=
"row items-center q-pt-mb"
: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>
<div
class=
"row items-center q-pt-mb col-6"
>
<div
class=
"col-3 q-mr-md"
>
購物:
</div>
<div
class=
"row items-center q-pt-mb"
: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
>
<
div
class
=
"row items-center q-pt-mb col-6"
v
-
if
=
"team!=''"
>
<
div
class
=
"col-3 q-mr-md"
>
團隊人數:
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
div
class
=
"row items-center q-pt-mb col-6"
>
<
div
class
=
"col-3 q-mr-md"
>
景點:
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
div
class
=
"row items-center q-pt-mb col-6"
>
<
div
class
=
"col-3 q-mr-md"
>
自費項目:
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
div
class
=
"row items-center q-pt-mb col-6"
v
-
if
=
"trip.freedomList.length>0"
>
<
div
class
=
"col-3 q-mr-md"
>
自由活動:
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
div
class
=
"row items-center q-pt-mb col-6"
>
<
div
class
=
"col-3 q-mr-md"
>
餐食:
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
div
class
=
"row items-center q-pt-mb col-6"
>
<
div
class
=
"col-3 q-mr-md"
>
服務用語
<
/div
>
<
div
class
=
"row items-center q-pt-mb"
:
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
>
<
/div
>
...
...
src/pages/detailsNew.vue
View file @
5be9222f
...
...
@@ -11,7 +11,8 @@
z-index: 999;
"
class=
"bg-white"
v-if=
"currentHeight > navs[0].top + 100"
v-if=
"(currentHeight > navs[0].top + 100&&$q.platform.is.desktop)||
(currentHeight>priceListHeight&¤tHeight
<
navs
[
0
].
top
&&$
q
.
platform
.
is
.
mobile
)"
:style=
"
{ transform: stickyHeight }"
>
<div
...
...
@@ -19,6 +20,7 @@
:class=
"
{ 'q-px-md': $q.screen.width
<
1220
}"
class=
"q-py-sm row items-center"
>
<span
class=
"col product-price text-subtitle1 text-weight-bold"
style=
"text-align: left"
...
...
@@ -114,7 +116,7 @@
</slider>
</div>
</div>
<div
class=
"q-py-lg
row
"
style=
"border-bottom: 1px solid #eee"
>
<div
class=
"q-py-lg
"
:class=
"
{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}
" style="border-bottom: 1px solid #eee">
<div
class=
"col q-mr-lg"
>
<div
class=
"text-h6 ellipsis-2-lines"
>
{{
dataList
.
title
}}
</div>
<div
class=
"q-mt-md f12 text-grey-6"
>
...
...
@@ -160,8 +162,10 @@
</div>
</div>
<div
style=
"width: 293px"
class=
"bg-grey-3 rounded-borders q-px-md q-py-lg"
:style=
"
{'width': $q.platform.is.mobile?'100%':'293px'}"
class="bg-grey-3 rounded-borders q-px-md"
:class="{'q-py-lg':$q.platform.is.desktop,
'row justify-between items-center q-mt-sm q-py-sm':$q.platform.is.mobile}"
>
<div
class=
"product-price text-h6"
...
...
@@ -177,7 +181,7 @@
label=
"選擇方案"
unelevated
@
click=
"goScrollHandler(priceListHeight)"
class=
"q-mt-md full-width
"
:class=
"
{'q-mt-md full-width':$q.platform.is.desktop}
"
/>
</div>
</div>
...
...
@@ -197,6 +201,31 @@
</div>
</div>
</div>
<div
class=
"bg-white"
style=
"
position: fixed;
left: 0;
right: 0;
top: -1px;
border-top: 1px solid #eee;
box-shadow: 0 2px 8px rgb(0 0 0 / 20%);
z-index: 999;"
v-if=
"currentHeight > priceListHeight+800&&$q.platform.is.mobile"
:style=
"
{ transform: stickyHeight }">
<q-tabs
v-model=
"tab"
dense
class=
"text-grey"
active-color=
"primary"
indicator-color=
"primary"
align=
"left"
narrow-indicator
>
<q-tab
v-for=
"(x, i) in navs"
:key=
"i"
@
click=
"goScrollHandler(x.top + 20)"
:name=
"x.display"
:label=
"x.display"
></q-tab>
</q-tabs>
</div>
<div
v-if=
"dataList"
class=
"q-pa-lg bg-grey-3 q-mt-lg text-grey-9"
...
...
@@ -204,13 +233,31 @@
>
<div
style=
"max-width: 1200px; margin-left: auto; margin-right: auto"
>
<div
class=
"text-h6"
>
選擇方案
</div>
<div
class=
"rounded-borders bg-white q-pa-md q-mt-md"
v-if=
"$q.platform.is.mobile"
>
<q-field
class=
"q-my-md"
stack-label
label=
"選擇日期、選項"
standout
dense
>
<div
class=
"self-center full-width no-outline"
tabindex=
"0"
>
{{
currentPrice
.
startDate
}}
</div>
<q-popup-proxy
ref=
"qDateProxy"
>
<calendar
class=
"bg-white q-pa-md"
:priceList=
"dataList.priceList"
@
change=
"changeChosenDateHandler"
ref=
"calendar"
></calendar>
</q-popup-proxy>
</q-field>
<order-preview
class=
"q-pa-md"
:price=
"currentPrice"
@
reset=
"resetHandler"
></order-preview>
</div>
<div
class=
"text-h6 q-pt-lg"
v-if=
"$q.platform.is.mobile"
>
所選方案詳情
</div>
<div
class=
"bg-white rounded-borders q-mt-md"
v-if=
"dataList.priceList.length > 0"
>
<div
class=
"q-pa-md row"
>
<div
class=
"col"
>
<div
class=
"text-subtitle1 text-weight-bold row items-center"
>
<div
class=
"text-subtitle1 text-weight-bold row items-center"
v-if=
"$q.platform.is.desktop"
>
<span
class=
"q-mr-md"
>
行程標準出行方案
</span>
<q-chip
square
...
...
@@ -229,7 +276,7 @@
</ul>
</div>
</div>
<div
class=
""
>
<div
class=
""
v-if=
"$q.platform.is.desktop"
>
<div
class=
"row items-center"
>
<span
class=
"product-price text-h6 q-mr-md"
>
CNY
...
...
@@ -272,8 +319,8 @@
label=
"6個工作日內(不含例休假)確認"
/>
</div>
<div
class=
"q-mt-lg row"
>
<div
class=
"col"
>
<div
class=
"q-mt-lg row"
v-if=
"$q.platform.is.desktop"
>
<div
class=
"col"
>
<calendar
:priceList=
"dataList.priceList"
@
change=
"changeChosenDateHandler"
...
...
@@ -299,7 +346,8 @@
class=
"q-mt-xl row"
:class=
"
{ 'q-px-md': $q.screen.width
<
1220
}"
>
<div
class=
"col q-ml-xl position-relative"
v-if=
"dayList.length>3&¤tHeight > days[0].top-60&¤tHeight
<
navs
[
2
].
top
"
>
<div
class=
"col q-ml-xl position-relative"
v-if=
"dayList.length>3&¤tHeight > days[0].top-60&¤tHeight
<
navs
[
2
].
top
&&$
q
.
platform
.
is
.
desktop
"
>
<div
style=
"position: sticky; top: 100px"
>
<div
class=
"trip-module text-subtitle2 cursor-pointer q-mb-lg"
...
...
@@ -316,7 +364,7 @@
</div>
</div>
</div>
<div
class=
"col-8
"
>
<div
:class=
"
{'col-8':$q.platform.is.desktop,'col':$q.platform.is.mobile}
">
<div
class=
"text-h5 text-weight-bold text-left"
ref=
"feature"
>
行程特色
</div>
...
...
@@ -399,24 +447,27 @@
</div>
</div>
<div
class=
"col-1"
></div>
<div
class=
"col q-ml-xl position-relative"
>
<div
style=
"position: sticky; top: 100px"
>
<div
class=
"text-subtitle2 text-grey-6 cursor-pointer q-mb-md"
v-for=
"(x, i) in navs"
:key=
"i"
@
click=
"goScrollHandler(x.top + 20)"
:class=
"{
'active-trip-module':
currentHeight >= x.top &&
(i == navs.length - 1 || currentHeight < navs[i + 1].top),
}"
>
{{ x.display }}
<
template
v-if=
"$q.platform.is.desktop"
>
<div
class=
"col-1"
></div>
<div
class=
"col q-ml-xl position-relative"
>
<div
style=
"position: sticky; top: 100px"
>
<div
class=
"text-subtitle2 text-grey-6 cursor-pointer q-mb-md"
v-for=
"(x, i) in navs"
:key=
"i"
@
click=
"goScrollHandler(x.top + 20)"
:class=
"
{
'active-trip-module':
currentHeight >= x.top
&&
(i == navs.length - 1 || currentHeight
<
navs
[
i
+
1
].
top
),
}"
>
{{
x
.
display
}}
</div>
</div>
</div>
</div>
</
template
>
</div>
</div>
</template>
...
...
@@ -434,6 +485,8 @@ export default {
props
:
[],
data
()
{
return
{
tab
:
''
,
searchDate
:
''
,
clickDate
:
''
,
slide
:
1
,
msg
:
{
...
...
@@ -553,7 +606,22 @@ export default {
immediate
:
true
,
deep
:
true
},
currentHeight
:
{
handler
:
function
(
val
,
oldval
)
{
this
.
navs
.
forEach
((
x
,
i
)
=>
{
if
(
x
.
top
&&
(
this
.
currentHeight
>=
x
.
top
&&
(
i
==
(
this
.
navs
.
length
-
1
)
||
this
.
currentHeight
<
this
.
navs
[
i
+
1
].
top
))){
if
(
this
.
tab
!=
x
.
display
){
this
.
tab
=
x
.
display
return
}
else
{
return
}
}
})
},
immediate
:
false
,
deep
:
true
},
},
created
()
{
try
{
...
...
@@ -647,7 +715,7 @@ export default {
},
slideHandler
(
e
)
{
this
.
options
.
currentPage
=
e
.
currentPage
;
if
(
e
.
currentPage
!=
0
&&
this
.
$refs
.
video
.
isPlaying
)
{
if
(
e
.
currentPage
!=
0
&&
this
.
$refs
.
video
&&
this
.
$refs
.
video
.
isPlaying
)
{
this
.
$refs
.
video
.
pause
();
}
},
...
...
@@ -666,6 +734,7 @@ export default {
changeChosenDateHandler
(
val
)
{
val
.
price
.
version
=
new
Date
().
getTime
();
this
.
currentPrice
=
JSON
.
parse
(
JSON
.
stringify
(
val
.
price
));
this
.
$refs
.
qDateProxy
.
hide
()
},
showDialog
()
{
this
.
isShowDialog
=
true
;
...
...
@@ -716,9 +785,11 @@ export default {
this
.
$nextTick
(()
=>
{
if
(
this
.
dataList
.
feature
.
featureHtml
!=
''
){
let
tw
=
parseFloat
(
this
.
$q
.
platform
.
is
.
desktop
?
parseFloat
(
this
.
$refs
.
diyContext
.
getBoundingClientRect
().
width
)
/
1123.0
:
parseFloat
(
this
.
$refs
.
diyContext
.
getBoundingClientRect
().
width
)
/
1
123
.0
;
)
/
1
000
.0
;
this
.
zoomDiyContext
=
tw
>
1
?
1
:
tw
.
toFixed
(
2
);
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment