Skip to content

M
million
Commit 347ef034 authored by 罗超's avatar 罗超
Browse files
Options

优化样式

parent 65dc1fd3
Show whitespace changes
Inline Side-by-side
Showing with 272 additions and 177 deletions
src/boot/product.js
View file @ 347ef034
......@@ -12,13 +12,13 @@ const product = {
// 接送机，包车
url = "/detailCar/" + configId
} else if (t === 3) {
url = "/detailHotal/" + configId
url = "/detailHotal/" + configId + '/' + productInfo.b2CPrice
} else if (t === 2) {
url = "/detailsScenicSpotTicket/" + configId
} else if (t === 1) {
url = "/detail/" + encodeURIComponent(productInfo.id ? productInfo.id : productInfo.ID) + "/" + 0 + "/" + configId
} else if (t === 5) {
url = "/detailHotal/" + configId+'/'+productInfo.b2CPrice
url = "/detailHotal/" + configId + '/' + productInfo.b2CPrice
}
} else {
throw new Error("參數不合法");
......
src/boot/utils.js
View file @ 347ef034
......@@ -26,7 +26,7 @@ Vue.prototype.domainManager = function() {
domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) {
domainUrl = "http://reborn.oytour.com";
domainUrl = 'http://192.168.10.206:8015' //'http://192.168.10.206:8015' ''http://192.168.10.11:8083' '
//domainUrl = 'http://192.168.10.206:8015' //'http://192.168.10.206:8015' ''http://192.168.10.11:8083' '
}
var obj = {
//主地址
......@@ -41,7 +41,7 @@ Vue.prototype.domainManager = function() {
//获取当前域名
Vue.prototype.GetDomain = function() {
var domainNameUrl = window.location.hostname;
domainNameUrl = "t.oytour.com";
domainNameUrl = "www.oytour.com";
return domainNameUrl;
}
Vue.prototype.groupBy = function(array, f) {
......
src/components/label_other/photo.vue
View file @ 347ef034
<template>
<section class="photo1 section-block">
<div class="photo" v-if="plugData.ImageUrl">
<img :src="plugData.ImageUrl" :alt="plugData.Title" />
<div class="photo mobile-only rounded-borders" v-if="plugData.ImageUrl" style="overflow:hidden;margin-bottom: 0px;">
<img :src="plugData.ImageUrl" :alt="plugData.Title" style="height:20vh;width:auto;" />
</div>
<div class="photo desktop-only" v-if="plugData.ImageUrl">
<img :src="plugData.ImageUrl" :alt="plugData.Title"/>
</div>
</section>
</template>
......
src/components/label_picture/diy-img-five.vue
View file @ 347ef034
......@@ -39,7 +39,7 @@
:key="index"
class="relative-position"
style=" min-width: 200px;"
:class="{ 'col': current != index && $q.platform.is.desktop, 'col-4': current == index&& $q.platform.is.desktop }"
:class="{ 'col': ((current != index && $q.platform.is.desktop) || realCount!=5), 'col-4': current == index && $q.platform.is.desktop && realCount==5 }"
@mouseenter="hoverHandler(index)"
>
<q-img
......@@ -55,10 +55,10 @@
{{
item.TripTitle.split('|')[0]}}
</a>
<div class="q-mt-sm row items-center no-wrap overflow-hidden" v-if="current==index && plugData.Title.indexOf('|tag')!=-1">
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" >觀光行程</q-chip>
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" >熱門票券</q-chip>
<q-chip style="background:rgba(255,255,255,.3)" class="f12 cursor-pointer" text-color="grey-2" >更多在地體驗</q-chip>
<div class="q-mt-sm row items-center no-wrap overflow-hidden" v-if="current==index && plugData.Title.indexOf('|tag')!=-1 && realCount==5">
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" clickable @click="goProductListHandler(0,item.TripTitle.split('|')[1])">觀光行程</q-chip>
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" clickable @click="goProductListHandler(1,item.TripTitle.split('|')[1])">熱門票券</q-chip>
<q-chip style="background:rgba(255,255,255,.3)" clickable class="f12 cursor-pointer" text-color="grey-2" @click="CommonJump(`/city/${item.TripTitle.split('|')[1]}`,{},'blank')">更多在地體驗</q-chip>
</div>
</div>
</div>
......@@ -70,14 +70,20 @@
</template>
<script>
import {date} from 'quasar'
//圖片 - 6x1
export default {
props: ["plugData"],
data() {
return {
current: 0,
realCount: 0
};
},
created() {
//console.log(this.plugData.Details,this.plugData.Details.filter(x=> x.ImageUrl!=''))
this.realCount = this.plugData.Details.filter(x=> x.ImageUrl!='').length
},
methods: {
hoverHandler(i) {
this.current = i;
......@@ -89,6 +95,15 @@ export default {
arr=strs[1].split(',')
}
return arr
},
goProductListHandler(t,id){
let CategoryName=t==0?'观光行程':'景点门票'
this.CommonJump('/search',{
areaId:id,
qsearchDate:date.formatDate(new Date(),'YYYY-MM-DD'),
qsearchEndDate:date.formatDate(date.addToDate(new Date(),{month:2}),'YYYY-MM-DD'),
CategoryName
})
}
},
};
......
src/components/label_picture/diy-img-four.vue
View file @ 347ef034
......@@ -2,24 +2,31 @@
<!--圖片 - 4x4-->
<div class="q-mt-md">
<section class="pr1 section-block">
<div class="mobile-only">
<h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}</p>
</div>
<div class="pr-banner-block">
<ul class="pr-banner-list">
<li v-for="(item,index) in plugData.Details" :key="index">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle"
<li v-for="(item,index) in plugData.Details" :key="index" class="relative-position">
<a @click="OpenNewUrl(item.LinkUrl+'/0')" class="rounded-borders" :title="item.TripTitle"
:style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}"></a>
<div class="absolute absolute-bottom-left absolute-bottom-right rounded-borders q-pa-md text-shadow text-subtitle2 text-white" style=" background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5))">
{{ item.TripTitle }}
</div>
</li>
</ul>
</div>
<div class="pr-text-block">
<div class="pr-text-block light-shadow rounded-borders desktop-only">
<h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}</p>
<ul class="pr-text-list">
<li v-for="(item,index) in plugData.Details" :key="index">
<a @click="OpenNewUrl(item.LinkUrl)">
<h3 class="pd-title">{{item.TripTitle}}</h3>
<div class="price">
<small class="unit">NT$</small>{{item.Price}}
<small class="unit">元起</small>
<a @click="OpenNewUrl(item.LinkUrl+'/0')">
<h3 class="text-subtitle2">{{item.TripTitle}}</h3>
<div class="price text-dark">
<small class="text-subtitle2 q-mr-sm">CNY</small>
<span class="text-subtitle2 text-weight-bolder text-dark">{{ moneyFormat(item.Price,2) }}</span>
</div>
</a>
</li>
......@@ -162,7 +169,6 @@
color: #00afff;
font-size: 20px;
font-weight: 700;
font-family: "oswald";
}
.pr1 .pr-text-block .pr-text-list .price .unit {
......
src/components/label_picture/diy-img-one.vue
View file @ 347ef034
......@@ -2,66 +2,150 @@
<!--圖片 - 3x1-->
<div>
<section class="tour2 section-block">
<h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}
</p>
<ul class="pd-list">
<li class="pd-box" v-for="(item,index) in plugData.Details" :key="index" v-if="item.TripImageUrl||item.ImageUrl">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link">
<div class="pd-img"
:style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}">
<h2 class="block-title">{{ plugData.Title.split('|')[0] }}</h2>
<p class="title-teaser">{{ plugData.SubTitle }}</p>
<ul class="pd-list" v-if="showType == 1">
<li
class="pd-box"
v-for="(item, index) in plugData.Details"
:key="index"
v-if="item.TripImageUrl || item.ImageUrl"
>
<a
@click="OpenNewUrl(item.LinkUrl)"
:title="item.TripTitle"
class="pd-link"
>
<div
class="pd-img"
:style="{
backgroundImage: `url('${
item.TripImageUrl && item.TripImageUrl != ''
? item.TripImageUrl
: item.ImageUrl
}')`,
}"
>
<div class="pd-price">
<div class="price">
{{item.DayNum}}
<small class="unit">天</small> {{item.Price}}
{{ item.DayNum }}
<small class="unit">天</small> {{ item.Price }}
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">
{{item.TripTitle}}
{{ item.TripTitle }}
</h3>
</div>
</a>
</li>
</ul>
<div
class="q-col-gutter-md q-mt-md"
:class="{ row: $q.platform.is.desktop, '': $q.platform.is.mobile }"
v-else-if="showType == 2"
>
<template v-for="(item, index) in plugData.Details">
<div
class="relative-position"
:key="index"
:class="{ 'col-4 column': $q.platform.is.desktop }"
v-if="item.ImageUrl"
>
<div
class="absolute-top-left q-pa-sm"
style="background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0));top: 16px;left: 16px;right: 0;border-radius: 12px;z-index: 1;"
>
<div
class="text-grey-1"
style="text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5)"
>
<q-icon name="iconfont iconhongqi" size="16px" />
<span class="q-ml-sm">{{ item.DayNum }}天行程</span>
</div>
</div>
<q-img
:src="item.ImageUrl"
:ratio="16 / 9"
spinner-color="primary"
spinner-size="20px"
style="border-radius: 12px"
/>
<div class="col">
<div
class="q-mt-md text-subtitle1 text-dark ellipsis-2-lines cursor-pointer"
@click="OpenNewUrl(item.LinkUrl+'/0')"
>
<!-- -->
{{ item.TripTitle }}
</div>
<div class="row items-center q-col-gutter-sm q-mt-sm">
<q-chip
style="background: rgba(193, 0, 21, 0.1)"
size="sm"
class="f12 rounded-borders text-negative"
label="急速確認"
/>
</div>
</div>
<div class="q-mt-sm">
<div class="text-subtitle2 text-weight-bolder text-dark">
<span>CNY {{ item.Price }}</span>
<span class="text-grey-8 f12 q-ml-sm">起</span>
</div>
</div>
</div>
</template>
</div>
</section>
</div>
</template>
<script>
export default {
props: ["plugData"]
export default {
props: ["plugData"],
data() {
return {
showType: 1,
};
},
mounted() {
if (this.plugData) {
let t = this.plugData.Title.split("|");
this.showType = t.length > 1 ? parseInt(t[1]) : 1;
}
},
};
</script>
<style>
.tour2 {}
.tour2 {
}
.tour2 .block-title {
.tour2 .block-title {
font-size: 22px;
font-weight: 600;
padding: 0;
margin: 0;
line-height: unset;
}
}
.tour2 .title-teaser {
.tour2 .title-teaser {
margin-bottom: 10px;
font-size: 16px;
color: #999;
}
}
.tour2 .pd-list {
.tour2 .pd-list {
display: flex;
flex-flow: row wrap;
padding: 0;
margin: 0;
}
}
.tour2 .pd-list .pd-box {
.tour2 .pd-list .pd-box {
padding: 0;
margin: 0;
margin-right: 20px;
......@@ -79,19 +163,19 @@
list-style: none;
border-radius: 4px;
overflow: hidden;
}
}
.tour2 .pd-list .pd-box:last-child {
.tour2 .pd-list .pd-box:last-child {
margin-right: 0px;
}
}
a {
a {
cursor: pointer;
text-decoration: none;
color: var(--q-color-primary);
}
}
.tour2 .pd-box .pd-img {
.tour2 .pd-box .pd-img {
position: relative;
width: 100%;
padding-bottom: 66.237%;
......@@ -100,9 +184,9 @@
-o-background-size: cover;
background-size: cover;
background-position: center;
}
}
.tour2 .pd-box .pd-img .pd-price {
.tour2 .pd-box .pd-img .pd-price {
position: absolute;
right: 0;
bottom: 0;
......@@ -110,9 +194,9 @@
width: 100%;
border-bottom: 4px solid var(--q-color-primary);
text-align: right;
}
}
.tour2 .pd-box .pd-img .pd-price .price {
.tour2 .pd-box .pd-img .pd-price .price {
display: inline-block;
padding: 4px 12px 0;
color: #fff;
......@@ -125,25 +209,25 @@
-moz-background-clip: padding;
border-radius: 5px 0 0;
background-clip: padding-box;
}
}
.tour2 .pd-box .pd-img .pd-price .price small {
.tour2 .pd-box .pd-img .pd-price .price small {
padding: 0 4px;
font-size: 14px;
}
}
.tour2 .pd-box .pd-content {
.tour2 .pd-box .pd-content {
padding: 15px 15px 20px;
}
}
.tour2 .pd-box .pd-title {
.tour2 .pd-box .pd-title {
font-size: 15px;
line-height: 1.5;
font-weight: 400;
color: #333;
}
}
@media only screen and (max-width: 1200px) {
@media only screen and (max-width: 1200px) {
.tour2 .pd-list .pd-box {
flex-basis: calc(50% - 10px) !important;
}
......@@ -151,20 +235,19 @@
.tour2 .pd-list .pd-box:nth-child(even) {
margin-right: 0 !important;
}
}
}
@media only screen and (min-width: 768px) {
@media only screen and (min-width: 768px) {
.pd-box:hover {
transform: translate(0, -4px) !important;
box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.1) !important;
}
}
}
@media only screen and (max-width: 425px) {
@media only screen and (max-width: 425px) {
.tour2 .pd-list .pd-box {
flex-basis: 100% !important;
margin-right: 0 !important;
}
}
}
</style>
src/components/label_picture/diy-img-two.vue
View file @ 347ef034
......@@ -2,7 +2,7 @@
<!--圖片 - 4x1-->
<div :class="{'q-mt-md':plugData.Title.split('|')[0]=='','q-mt-xl':plugData.Title.split('|')[0]!=''}">
<section class="tour1 section-block" v-if="plugData">
<h2 class="block-title">{{ plugData.Title.split("|")[0] }}</h2>
<h2 class="block-title" style="line-height: normal !important;">{{ plugData.Title.split("|")[0] }}</h2>
<p class="title-teaser">{{ plugData.SubTitle }}</p>
<ul class="pd-list" v-if="showType == 1">
<li
......@@ -40,27 +40,17 @@
</a>
</li>
</ul>
<div class="row q-col-gutter-md" style="item" v-else-if="showType == 2">
<div class="q-col-gutter-md q-mt-md" :class="{'row':$q.platform.is.desktop,'':$q.platform.is.mobile}" v-else-if="showType == 2">
<template v-for="(item, index) in plugData.Details">
<div
class="col-3 relative-position column"
class="relative-position "
:key="index"
:class="{'col-3 column':$q.platform.is.desktop}"
v-if="item.TripImageUrl"
>
<div
class="absolute-top-left q-pa-sm"
style="
background: linear-gradient(
to bottom,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
top: 16px;
left: 16px;
right: 0;
border-radius: 12px;
z-index: 1;
"
style="background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0));top: 16px;left: 16px;right: 0;border-radius: 12px;z-index: 1;"
>
<div
class="text-grey-4"
......
src/components/navs/city-category.vue
View file @ 347ef034
......@@ -479,9 +479,7 @@ export default {
}
},
handleSelectArea(item) {
this.CommonJump("/city/" + item.Id, {
id: item.Id,
});
this.CommonJump("/city/" + item.Id);
},
handleCategoryChage(item) {
this.CommonJump("/search", {
......
src/pages/Index.vue
View file @ 347ef034
......@@ -266,7 +266,7 @@
></travelList>
</div>
</template>
<end-page v-if="isPic"></end-page>
<end-page v-if="isPic" class="desktop-only"></end-page>
</q-page>
</template>
......
src/utils/producttypeenum.js
View file @ 347ef034
......@@ -7,14 +7,14 @@ const ProductTypeEnum = Object.freeze({
*/
ONE_DAY: {
value: 1,
desc: '一日游产品'
desc: '當地遊产品'
},
/**
* 多日游
*/
TEAM_TRIP: {
value: 2,
desc: '多日游产品'
desc: '出境遊产品'
},
/**
* 小包团
......
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