Commit cb30b862 authored by 黄奎's avatar 黄奎

插件修改

parent 0766d4ec
...@@ -70,7 +70,7 @@ Vue.prototype.getLocalStorage = function () { ...@@ -70,7 +70,7 @@ Vue.prototype.getLocalStorage = function () {
//向外跳转 //向外跳转
Vue.prototype.OpenNewUrl = function (URL) { Vue.prototype.OpenNewUrl = function (URL) {
if (URL != '') { if (URL&&URL != '') {
if (URL.indexOf("https") != -1) { if (URL.indexOf("https") != -1) {
var str = 'http://' + URL.substring(8); var str = 'http://' + URL.substring(8);
window.open(str, '_blank'); window.open(str, '_blank');
......
...@@ -3,7 +3,8 @@ ...@@ -3,7 +3,8 @@
<div class="q-mt-lg"> <div class="q-mt-lg">
<section class="tour3 section-block"> <section class="tour3 section-block">
<div class="pd-img"> <div class="pd-img">
<a @click="OpenNewUrl(plugData.LinkUrl)" :title="plugData.TripTitle" :style="{backgroundImage:`url('${plugData.ImageUrl}')`}"></a> <a @click="OpenNewUrl(plugData.LinkUrl)" :title="plugData.TripTitle"
:style="{backgroundImage:`url('${(plugData.TripImage&&plugData.TripImage!=''?plugData.TripImage:plugData.ImageUrl)}')`}"></a>
</div> </div>
<div class="pd-content"> <div class="pd-content">
<h2 class="block-title">{{plugData.Title}}</h2> <h2 class="block-title">{{plugData.Title}}</h2>
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<a @click="OpenNewUrl(plugData.LinkUrl)" class="wl-btn wl-btn-radius pd-link">了解更多資訊</a> <a @click="OpenNewUrl(plugData.LinkUrl)" class="wl-btn wl-btn-radius pd-link">了解更多資訊</a>
</div> </div>
<div class="pd-img"> <div class="pd-img">
<a @click="OpenNewUrl(plugData.LinkUrl)" :title="plugData.TripTitle" :style="{backgroundImage:`url('${plugData.ImageUrl}')`}"></a> <a @click="OpenNewUrl(plugData.LinkUrl)" :title="plugData.TripTitle" :style="{backgroundImage:`url('${(plugData.TripImage&&plugData.TripImage!=''?plugData.TripImage:plugData.ImageUrl)}')`}"></a>
</div> </div>
</section> </section>
......
...@@ -3,9 +3,9 @@ ...@@ -3,9 +3,9 @@
<div class="q-mt-lg"> <div class="q-mt-lg">
<section class="tour5 section-block"> <section class="tour5 section-block">
<a @click="OpenNewUrl(plugData.LinkUrl1)" :title="plugData.TripTitle1" class="pd-img" <a @click="OpenNewUrl(plugData.LinkUrl1)" :title="plugData.TripTitle1" class="pd-img"
:style="{backgroundImage:`url('${plugData.ImageUrl1}')`}"></a> :style="{backgroundImage:`url('${(plugData.TripImage1&&plugData.TripImage1!=''?plugData.TripImage1:plugData.ImageUrl1)}')`}"></a>
<a @click="OpenNewUrl(plugData.LinkUrl2)" :title="plugData.TripTitle2" class="pd-img" <a @click="OpenNewUrl(plugData.LinkUrl2)" :title="plugData.TripTitle2" class="pd-img"
:style="{backgroundImage:`url('${plugData.ImageUrl2}')`}"></a> :style="{backgroundImage:`url('${(plugData.TripImage2&&plugData.TripImage2!=''?plugData.TripImage2:plugData.ImageUrl2)}')`}"></a>
<div class="pd-content"> <div class="pd-content">
<h2 class="block-title">{{plugData.Title}}</h2> <h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser"> <p class="title-teaser">
......
...@@ -9,9 +9,9 @@ ...@@ -9,9 +9,9 @@
</p> </p>
</div> </div>
<a @click="OpenNewUrl(plugData.LinkUrl1)" :title="plugData.TripTitle1" class="pd-img" <a @click="OpenNewUrl(plugData.LinkUrl1)" :title="plugData.TripTitle1" class="pd-img"
:style="{backgroundImage:`url('${plugData.ImageUrl1}')`}"></a> :style="{backgroundImage:`url('${(plugData.TripImage1&&plugData.TripImage1!=''?plugData.TripImage1:plugData.ImageUrl1)}')`}"></a>
<a @click="OpenNewUrl(plugData.LinkUrl2)" :title="plugData.TripTitle2" class="pd-img" <a @click="OpenNewUrl(plugData.LinkUrl2)" :title="plugData.TripTitle2" class="pd-img"
:style="{backgroundImage:`url('${plugData.ImageUrl2}')`}"></a> :style="{backgroundImage:`url('${(plugData.TripImage2&&plugData.TripImage2!=''?plugData.TripImage2:plugData.ImageUrl2)}')`}"></a>
</section> </section>
</div> </div>
</template> </template>
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<ul class="pr-banner-list"> <ul class="pr-banner-list">
<li v-for="(item,index) in plugData.Details" :key="index"> <li v-for="(item,index) in plugData.Details" :key="index">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" <a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle"
:style="{backgroundImage:`url('${item.ImageUrl}')`}"></a> :style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}"></a>
</li> </li>
</ul> </ul>
</div> </div>
......
...@@ -3,11 +3,13 @@ ...@@ -3,11 +3,13 @@
<div> <div>
<section class="tour2 section-block"> <section class="tour2 section-block">
<h2 class="block-title">{{plugData.Title}}</h2> <h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}</p> <p class="title-teaser">{{plugData.SubTitle}}
</p>
<ul class="pd-list"> <ul class="pd-list">
<li class="pd-box" v-for="(item,index) in plugData.Details" :key="index"> <li class="pd-box" v-for="(item,index) in plugData.Details" :key="index">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link"> <a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link">
<div class="pd-img" :style="{backgroundImage:`url('${item.ImageUrl}')`}"> <div class="pd-img"
:style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}">
<div class="pd-price"> <div class="pd-price">
<div class="price"> <div class="price">
{{item.DayNum}} {{item.DayNum}}
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<q-carousel-slide :name="i" :key="i" class="column no-wrap"> <q-carousel-slide :name="i" :key="i" class="column no-wrap">
<div class="row fit justify-start q-col-gutter no-wrap" :class="{'q-gutter-lg':x.length>1}"> <div class="row fit justify-start q-col-gutter no-wrap" :class="{'q-gutter-lg':x.length>1}">
<div style="flex:1" v-for="(y, yi) in x" :key="yi"> <div style="flex:1" v-for="(y, yi) in x" :key="yi">
<q-img :img-style="{borderRadius:'50%'}" :ratio="1/1" :src="y.ImageUrl" /> <q-img :img-style="{borderRadius:'50%'}" :ratio="1/1" :src="(y.TripImageUrl&&y.TripImageUrl!=''?y.TripImageUrl: y.ImageUrl)" />
<div class="q-mt-md" style="color: #666;text-align: center;font-weight: 400;"> <div class="q-mt-md" style="color: #666;text-align: center;font-weight: 400;">
{{y.TripTitle}} {{y.TripTitle}}
</div> </div>
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<ul class="pd-list"> <ul class="pd-list">
<li class="pd-box" v-for="(item,index) in plugData.Details" :key="index"> <li class="pd-box" v-for="(item,index) in plugData.Details" :key="index">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link"> <a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link">
<div class="pd-img" :style="{backgroundImage:`url('${item.ImageUrl}')`}"> <div class="pd-img" :style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}">
<div class="pd-price"> <div class="pd-price">
<div class="price"> <div class="price">
{{item.DayNum}} {{item.DayNum}}
......
<template> <template>
<q-carousel <!--輪播圖-大-->
v-model="slide" <q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="5000" swipeable
transition-prev="slide-right" animated control-color="white" padding arrows infinite height="470px"
transition-next="slide-left" class="bg-primary text-white shadow-1 q-mt-lg q-mb-xl">
:autoplay="5000" <q-carousel-slide v-for="(x, i) in plugData.Details" :key="i" @click="clickSlideHandler(x.LinkUrl)" :name="i"
swipeable :img-src="x.LinkImg" />
animated
control-color="white"
padding
arrows
infinite
height="470px"
class="bg-primary text-white shadow-1 q-mt-lg q-mb-xl"
>
<q-carousel-slide
v-for="(x, i) in swipers"
:key="i"
@click="clickSlideHandler(x.path)"
:name="i"
:img-src="x.pic_url"
/>
</q-carousel> </q-carousel>
</template> </template>
<script> <script>
export default { export default {
props: ["plugData"],
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500802_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500810_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500763_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500815_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500828_rsz.jpg",
path: "/"
}
]
}; };
}, },
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script>
</script>
<style> <style>
</style> </style>
<template> <template>
<q-carousel <!--輪播圖-小-->
v-model="slide" <q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="5000" swipeable
transition-prev="slide-right" animated control-color="white" padding arrows infinite height="235px"
transition-next="slide-left" class="bg-primary text-white shadow-1 q-mt-lg q-mb-xl">
:autoplay="5000" <q-carousel-slide v-for="(x, i) in plugData.Details" :key="i" @click="clickSlideHandler(x.LinkUrl)" :name="i"
swipeable :img-src="x.LinkImg" />
animated
control-color="white"
padding
arrows
infinite
height="235px"
class="bg-primary text-white shadow-1 q-mt-lg q-mb-xl"
>
<q-carousel-slide
v-for="(x, i) in swipers"
:key="i"
@click="clickSlideHandler(x.path)"
:name="i"
:img-src="x.pic_url"
/>
</q-carousel> </q-carousel>
</template> </template>
<script> <script>
export default { export default {
props: ["plugData"],
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500802_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500810_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500763_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500815_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500828_rsz.jpg",
path: "/"
}
]
}; };
}, },
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script> </script>
<style> <style>
</style> </style>
<template> <template>
<!--搜索区块(Banner)-轮播淡出-->
<div style="margin-top:-60px"> <div style="margin-top:-60px">
<q-carousel <q-carousel v-model="slide" :autoplay="5000" swipeable animated control-color="white" padding infinite
v-model="slide" height="550px" class="bg-primary text-white shadow-1">
:autoplay="5000" <q-carousel-slide v-for="(x, i) in plugData.Details" :key="i" @click="clickSlideHandler(x.LinkUrl)" :name="i"
swipeable :img-src="x.ImageUrl" />
animated
control-color="white"
padding
infinite
height="550px"
class="bg-primary text-white shadow-1"
>
<q-carousel-slide
v-for="(x, i) in swipers"
:key="i"
@click="clickSlideHandler(x.path)"
:name="i"
:img-src="x.pic_url"
/>
</q-carousel> </q-carousel>
</div> </div>
</template> </template>
<script> <script>
import popup from "../props/index";
export default {
//搜索区块(Banner)-轮播淡出 //搜索区块(Banner)-轮播淡出
import popup from "../props/index";
export default {
props: ["plugData"],
components: { components: {
popup popup
}, },
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500802_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500810_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500763_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500815_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500828_rsz.jpg",
path: "/"
}
]
}; };
}, },
mounted() { mounted() {
...@@ -73,15 +28,16 @@ export default { ...@@ -73,15 +28,16 @@ export default {
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script> </script>
<style> <style>
.showbox { .showbox {
position: absolute; position: absolute;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
...@@ -90,8 +46,9 @@ export default { ...@@ -90,8 +46,9 @@ export default {
left: 0; left: 0;
top: 56px; top: 56px;
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);
} }
.showspbox {
.showspbox {
position: absolute; position: absolute;
box-sizing: border-box; box-sizing: border-box;
width: calc(41.6667% - 22px); width: calc(41.6667% - 22px);
...@@ -100,11 +57,13 @@ export default { ...@@ -100,11 +57,13 @@ export default {
left: 0; left: 0;
top: 56px; top: 56px;
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);
} }
.my-menu-link {
.my-menu-link {
background-color: rgb(237, 237, 237) !important; background-color: rgb(237, 237, 237) !important;
} }
.area-box .h3 {
.area-box .h3 {
font-size: 22px; font-size: 22px;
color: #333; color: #333;
font-weight: 600; font-weight: 600;
...@@ -113,8 +72,9 @@ export default { ...@@ -113,8 +72,9 @@ export default {
list-style: unset; list-style: unset;
margin: 0; margin: 0;
cursor: pointer; cursor: pointer;
} }
.area-box .h4 {
.area-box .h4 {
font-size: 18px; font-size: 18px;
color: #424242; color: #424242;
padding: 0; padding: 0;
...@@ -124,8 +84,9 @@ export default { ...@@ -124,8 +84,9 @@ export default {
margin-right: 20px; margin-right: 20px;
font-weight: 600; font-weight: 600;
cursor: pointer; cursor: pointer;
} }
.area-box .h5 {
.area-box .h5 {
font-size: 16px; font-size: 16px;
color: #636363; color: #636363;
padding: 0; padding: 0;
...@@ -134,8 +95,9 @@ export default { ...@@ -134,8 +95,9 @@ export default {
margin: 0; margin: 0;
margin-right: 12px; margin-right: 12px;
cursor: pointer; cursor: pointer;
} }
.area-box .h6 {
.area-box .h6 {
font-size: 14px; font-size: 14px;
color: gray; color: gray;
padding: 0; padding: 0;
...@@ -144,29 +106,35 @@ export default { ...@@ -144,29 +106,35 @@ export default {
margin: 0; margin: 0;
text-align: right; text-align: right;
cursor: pointer; cursor: pointer;
} }
.area-box .h6:hover,
.area-box .h5:hover, .area-box .h6:hover,
.area-box .h4:hover, .area-box .h5:hover,
.area-box .h3:hover { .area-box .h4:hover,
.area-box .h3:hover {
color: var(--q-color-primary); color: var(--q-color-primary);
} }
.area-box .to-end {
.area-box .to-end {
align-items: flex-end; align-items: flex-end;
} }
.chosen-box {
.chosen-box {
padding: 15px; padding: 15px;
min-height: 30vh; min-height: 30vh;
} }
.chosen-box .title {
.chosen-box .title {
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: #111; color: #111;
margin-bottom: 5px; margin-bottom: 5px;
} }
.chosen-box .split-word{
font-size:15px; .chosen-box .split-word {
color:#333; font-size: 15px;
line-height:56px; color: #333;
} line-height: 56px;
}
</style> </style>
<template> <template>
<!--搜索区块(Banner)-轮播横-->
<div style="margin-top:-60px"> <div style="margin-top:-60px">
<q-carousel <q-carousel v-model="slide" :autoplay="5000" swipeable animated control-color="white" padding arrows navigation
v-model="slide" transition-prev="slide-right" transition-next="slide-left" infinite height="666px"
:autoplay="5000" class="bg-primary text-white shadow-1">
swipeable <q-carousel-slide v-for="(x, i) in plugData.Details" :key="i" @click="clickSlideHandler(x.LinkUrl)" :name="i"
animated :img-src="x.ImageUrl" />
control-color="white"
padding
arrows
navigation
transition-prev="slide-right"
transition-next="slide-left"
infinite
height="666px"
class="bg-primary text-white shadow-1"
>
<q-carousel-slide
v-for="(x, i) in swipers"
:key="i"
@click="clickSlideHandler(x.path)"
:name="i"
:img-src="x.pic_url"
/>
</q-carousel> </q-carousel>
</div> </div>
</template> </template>
<script> <script>
import popup from "../props/index";
export default {
//搜索区块(Banner)-轮播横 //搜索区块(Banner)-轮播横
import popup from "../props/index";
export default {
props: ["plugData"],
components: { components: {
popup popup
}, },
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500802_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500810_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500763_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500815_rsz.jpg",
path: "/"
},
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500828_rsz.jpg",
path: "/"
}
]
}; };
}, },
mounted() { mounted() {
...@@ -77,15 +28,16 @@ export default { ...@@ -77,15 +28,16 @@ export default {
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script> </script>
<style> <style>
.showbox { .showbox {
position: absolute; position: absolute;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
...@@ -94,8 +46,9 @@ export default { ...@@ -94,8 +46,9 @@ export default {
left: 0; left: 0;
top: 56px; top: 56px;
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);
} }
.showspbox {
.showspbox {
position: absolute; position: absolute;
box-sizing: border-box; box-sizing: border-box;
width: calc(41.6667% - 22px); width: calc(41.6667% - 22px);
...@@ -104,11 +57,13 @@ export default { ...@@ -104,11 +57,13 @@ export default {
left: 0; left: 0;
top: 56px; top: 56px;
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 0px 20px rgba(0, 0, 0, 0.1);
} }
.my-menu-link {
.my-menu-link {
background-color: rgb(237, 237, 237) !important; background-color: rgb(237, 237, 237) !important;
} }
.area-box .h3 {
.area-box .h3 {
font-size: 22px; font-size: 22px;
color: #333; color: #333;
font-weight: 600; font-weight: 600;
...@@ -117,8 +72,9 @@ export default { ...@@ -117,8 +72,9 @@ export default {
list-style: unset; list-style: unset;
margin: 0; margin: 0;
cursor: pointer; cursor: pointer;
} }
.area-box .h4 {
.area-box .h4 {
font-size: 18px; font-size: 18px;
color: #424242; color: #424242;
padding: 0; padding: 0;
...@@ -128,8 +84,9 @@ export default { ...@@ -128,8 +84,9 @@ export default {
margin-right: 20px; margin-right: 20px;
font-weight: 600; font-weight: 600;
cursor: pointer; cursor: pointer;
} }
.area-box .h5 {
.area-box .h5 {
font-size: 16px; font-size: 16px;
color: #636363; color: #636363;
padding: 0; padding: 0;
...@@ -138,8 +95,9 @@ export default { ...@@ -138,8 +95,9 @@ export default {
margin: 0; margin: 0;
margin-right: 12px; margin-right: 12px;
cursor: pointer; cursor: pointer;
} }
.area-box .h6 {
.area-box .h6 {
font-size: 14px; font-size: 14px;
color: gray; color: gray;
padding: 0; padding: 0;
...@@ -148,29 +106,35 @@ export default { ...@@ -148,29 +106,35 @@ export default {
margin: 0; margin: 0;
text-align: right; text-align: right;
cursor: pointer; cursor: pointer;
} }
.area-box .h6:hover,
.area-box .h5:hover, .area-box .h6:hover,
.area-box .h4:hover, .area-box .h5:hover,
.area-box .h3:hover { .area-box .h4:hover,
.area-box .h3:hover {
color: var(--q-color-primary); color: var(--q-color-primary);
} }
.area-box .to-end {
.area-box .to-end {
align-items: flex-end; align-items: flex-end;
} }
.chosen-box {
.chosen-box {
padding: 15px; padding: 15px;
min-height: 30vh; min-height: 30vh;
} }
.chosen-box .title {
.chosen-box .title {
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: #111; color: #111;
margin-bottom: 5px; margin-bottom: 5px;
} }
.chosen-box .split-word{
font-size:15px; .chosen-box .split-word {
color:#333; font-size: 15px;
line-height:56px; color: #333;
} line-height: 56px;
}
</style> </style>
<template> <template>
<!--搜索区块(Banner)-无轮播(大)-->
<div> <div>
<div <div class="banner-style6 desktop-only" :style="{backgroundImage:`url('${plugData.Details[0].ImageUrl}')`}"
class="banner-style6 desktop-only" @click="clickSlideHandler(plugData.Details[0].LinkUrl)"></div>
:style="{backgroundImage:`url('${swipers[0].pic_url}')`}" <div class="banner-style6 mobile-only"
@click="clickSlideHandler(swipers[0].path)" :style="{paddingBottom:'80%',backgroundImage:`url('${plugData.Details[0].ImageUrl}')`}"
></div> @click="clickSlideHandler(plugData.Details[0].LinkUrl)"></div>
<div
class="banner-style6 mobile-only"
:style="{paddingBottom:'80%',backgroundImage:`url('${swipers[0].pic_url}')`}"
@click="clickSlideHandler(swipers[0].path)"
></div>
</div> </div>
</template> </template>
<script> <script>
import popup from "../props/index";
export default {
//搜索区块(Banner)-无轮播(大) //搜索区块(Banner)-无轮播(大)
import popup from "../props/index";
export default {
props: ["plugData"],
components: { components: {
popup popup
}, },
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
}
]
}; };
}, },
mounted() { mounted() {
...@@ -39,21 +28,22 @@ export default { ...@@ -39,21 +28,22 @@ export default {
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script> </script>
<style> <style>
.banner-style6 { .banner-style6 {
margin-top: -60px; margin-top: -60px;
width: 100%; width: 100%;
background-color: #f1f1f1; background-color: #f1f1f1;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
padding-bottom:30%; padding-bottom: 30%;
} }
</style> </style>
<template> <template>
<!--搜索区块(Banner)-无轮播(中)-->
<div> <div>
<div <div class="banner-style6 desktop-only" :style="{backgroundImage:`url('${plugData.Details[0].ImageUrl}')`}"
class="banner-style6 desktop-only" @click="clickSlideHandler(plugData.Details[0].LinkUrl)"></div>
:style="{backgroundImage:`url('${swipers[0].pic_url}')`}" <div class="banner-style6 mobile-only"
@click="clickSlideHandler(swipers[0].path)" :style="{paddingBottom:'80%',backgroundImage:`url('${plugData.Details[0].ImageUrl}')`}"
></div> @click="clickSlideHandler(plugData.Details[0].LinkUrl)"></div>
<div
class="banner-style6 mobile-only"
:style="{paddingBottom:'80%',backgroundImage:`url('${swipers[0].pic_url}')`}"
@click="clickSlideHandler(swipers[0].path)"
></div>
</div> </div>
</template> </template>
<script> <script>
import popup from "../props/index";
export default {
//搜索区块(Banner)-无轮播(中) //搜索区块(Banner)-无轮播(中)
import popup from "../props/index";
export default {
props: ["plugData"],
components: { components: {
popup popup
}, },
data() { data() {
return { return {
slide: 0, slide: 0,
swipers: [
{
pic_url:
"https://de0s2vtm6rzpn.cloudfront.net/b2b/event_block/9841/search6/9841search61583500796_rsz.jpg",
path:
"https://yvonne.tripsaas.com/tour/detail/LIFE-TSN0514BRT01?type=c&group_code=TSN05BR9D01A"
}
]
}; };
}, },
mounted() { mounted() {
...@@ -39,21 +28,23 @@ export default { ...@@ -39,21 +28,23 @@ export default {
methods: { methods: {
clickSlideHandler(url) { clickSlideHandler(url) {
if (url && url.length > 1) { if (url && url.length > 1) {
location.href = url; this.OpenNewUrl(url);
} }
} }
} }
}; };
</script> </script>
<style> <style>
.banner-style6 { .banner-style6 {
margin-top: -60px; margin-top: -60px;
width: 100%; width: 100%;
background-color: #f1f1f1; background-color: #f1f1f1;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
padding-bottom:25%; padding-bottom: 25%;
} }
</style> </style>
...@@ -61,6 +61,25 @@ ...@@ -61,6 +61,25 @@
:plugData="item.plugData"></ilinkLeft> :plugData="item.plugData"></ilinkLeft>
<ilinkRight v-if="(item.Id=='white_label_link_picture'||item.Id=='b2b_LinkPicture')&&item.plugData.Type==2" <ilinkRight v-if="(item.Id=='white_label_link_picture'||item.Id=='b2b_LinkPicture')&&item.plugData.Type==2"
:plugData="item.plugData"></ilinkRight> :plugData="item.plugData"></ilinkRight>
<!--自訂版型(輪播圖)white_label_slider-->
<sliderBig v-if="item.Id=='white_label_slider'&&item.plugData.Type==1" :plugData="item.plugData"></sliderBig>
<sliderSmall v-if="item.Id=='white_label_slider'&&item.plugData.Type==2" :plugData="item.plugData">
</sliderSmall>
<!--出团表-->
<!--挑选自有行程(图片)b2b -->
<diyImgOne v-if="item.Id=='b2b'&&item.plugData.Type==1" :plugData="item.plugData"></diyImgOne>
<diyImgTwo v-if="item.Id=='b2b'&&item.plugData.Type==2" :plugData="item.plugData"></diyImgTwo>
<diyImgFour v-if="item.Id=='b2b'&&item.plugData.Type==3" :plugData="item.plugData"></diyImgFour>
<diyImgSix v-if="item.Id=='b2b'&&item.plugData.Type==4" :plugData="item.plugData"></diyImgSix>
<!--搜尋區塊(Banner)search_b -->
<searchb1 v-if="item.Id=='search_b'&&item.plugData.Type==1" :plugData="item.plugData"></searchb1>
<searchb2 v-if="item.Id=='search_b'&&item.plugData.Type==2" :plugData="item.plugData"></searchb2>
<searchb3 v-if="item.Id=='search_b'&&item.plugData.Type==3" :plugData="item.plugData"></searchb3>
<searchb4 v-if="item.Id=='search_b'&&item.plugData.Type==4" :plugData="item.plugData"></searchb4>
</div> </div>
</template> </template>
......
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