Commit ba5b6011 authored by 罗超's avatar 罗超

优化城市主页

parent 4844a58a
......@@ -10,7 +10,7 @@ export default {
};
</script>
<style>
@import url("//at.alicdn.com/t/c/font_1890699_yrr2mh5n7ln.css");
@import url("//at.alicdn.com/t/c/font_1890699_gbysegbhucu.css");
@font-face {
font-family: "oswald";
src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
......@@ -19,7 +19,9 @@ export default {
font-family: 'FZDBSJW';
src: local('FZDaBiaoSong-B06S')
}
.text-shadow{
text-shadow: rgb(0 0 0 / 50%) 2px 2px 5px;
}
.text-subtitle1 {
font-size: 1.25rem !important;
}
......
<template>
<div class="rounded-borders overflow-hidden q-pb-md" :style="{'width':width,'background-color':bgColor}" v-if="product">
<q-img :src="product.ImgCover" spinner-color="white" :ratio="16/9" fit="cover">
<div class="absolute-top text-shadow" style="background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0));">
{{ formatEnum(product.ProductType) }}
</div>
</q-img>
<div class="ellipsis-2-lines text-body1 q-ma-md cursor-pointer" style="height: 74px;">{{ product.Title }}</div>
<div class="text-subtitle2 text-weight-bolder text-dark q-mx-md">
<span>CNY {{moneyFormat(product.B2CPrice,2)}}</span>
<span class="f12 q-ml-sm"></span>
</div>
</div>
</template>
<script>
import ListProductTypeEnum from 'src/utils/listProductType';
import EnumHelper from '../../utils/enumhelper'
export default {
props:{
product:{
type:Object,
required:true
},
width:{
type:String,
default:"250px"
},
bgColor:{
type:String,
default:'#fff'
}
},
data() {
return {
}
},
methods: {
formatEnum(t){
let temp = EnumHelper.ParseToEnum(ListProductTypeEnum,t,'value')
return temp.desc
}
},
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<!-- <div class="rounded-borders overflow-hidden q-pb-md" :style="{'width':width,'background-color':bgColor}" v-if="product">
<q-img :src="product.ImgCover" spinner-color="white" :ratio="16/9" fit="cover" />
<div class="ellipsis-2-lines text-body1 q-ma-md cursor-pointer">{{ product.Title }}{{ product.Title }}{{ product.Title }}{{ product.Title }}{{ product.Title }}</div>
<div class="text-subtitle2 text-weight-bolder text-dark q-mx-md">
<span>CNY {{moneyFormat(product.B2CPrice,2)}}</span>
<span class="f12 q-ml-sm"></span>
</div>
</div> -->
<div class="rounded-borders overflow-hidden" v-if="product">
<div class="row" :style="{'background-color':bgColor}" >
<q-img :src="product.ImgCover" spinner-color="dark" :ratio="4/3" fit="cover" class=" col-5" >
<div class="absolute-top text-shadow" style="background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0));">
{{ formatEnum(product.ProductType) }}
</div>
</q-img>
<div class="q-px-md col">
<div class="ellipsis-2-lines text-body1 q-ma-md cursor-pointer" style="height:50px;">{{ product.Title }}</div>
<div class="text-subtitle2 text-weight-bolder text-dark q-mx-md">
<span>CNY {{moneyFormat(product.B2CPrice,2)}}</span>
<span class="f12 q-ml-sm"></span>
</div>
</div>
</div>
</div>
</template>
<script>
import ListProductTypeEnum from 'src/utils/listProductType';
import EnumHelper from '../../utils/enumhelper'
export default {
props:{
product:{
type:Object,
required:true
},
width:{
type:String,
default:"250px"
},
bgColor:{
type:String,
default:'#fff'
}
},
methods: {
formatEnum(t){
let temp = EnumHelper.ParseToEnum(ListProductTypeEnum,t,'value')
return temp.desc
}
},
}
</script>
<style>
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<div class="q-mt-lg">
<div class="top-title">{{ cityInfo.AreaName }}旅遊指南</div>
<div class="q-mt-md rounded-borders q-pa-lg bg-white light-shadow">
<div class="text-h6 text-weight-bold">關於{{ cityInfo.AreaName }}</div>
<div class="q-my-md f12 text-grey-9" v-html="cityInfo.Introduction"></div>
<q-separator class="q-my-xl" color="grey-2" />
<div class="text-h6 q-my-md text-weight-bold">實用訊息</div>
<div class="q-mt-md" :class="{'row justify-between q-mr-lg':$q.platform.is.desktop,'column q-gutter-md':$q.platform.is.mobile}">
<div>
<div class="f12 text-grey-9">時區:</div>
<div class="q-my-md text-subtitle1">{{ cityInfo.TimeZones }}</div>
<div class="text-body2 text-grey-6">出行注意時差,安排好休息時間哦</div>
</div>
<div>
<div class="f12 text-grey-9">貨幣:</div>
<div class="q-my-md text-subtitle1">{{ cityInfo.CurrencyName }}</div>
<div class="text-body2 text-grey-6">建議您出行錢準備充足的當地貨幣</div>
</div>
<div>
<div class="f12 text-grey-9">电压:</div>
<div class="q-my-md text-subtitle1">{{ cityInfo.Voltage }}</div>
</div>
<div>
<div class="f12 text-grey-9">最佳出行月份</div>
<div class="q-mt-md" v-for="(x,i) in cityInfo.BestTravelTimeList" :key="i">
<div class="q-mb-sm text-subtitle1">{{ x.Month }}</div>
<div class="text-body2 text-grey-6">{{ x.Description }}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props:['city'],
data() {
return {
cityInfo:{}
}
},
created() {
this.cityInfo = this.city
this.cityInfo.Introduction=this.cityInfo.Introduction.replace(/\n/g,"<br>")
},
}
</script>
<style>
.top-title {
font-size: 26px;
font-weight: bold;
color: #000000;
line-height: 44px;
}
</style>
\ No newline at end of file
......@@ -37,20 +37,26 @@
<template>
<div>
<div class="title">附近的城市</div>
<div class="flex">
<div
@click="navToSearch(item)"
class="relative card"
v-for="item in cityList"
:key="item.Id"
>
<img class="card-img" :src="item.ImageList[0]" />
<div class="info">
<div>{{ item.AreaName }}</div>
<!-- <div>10Km</div> -->
<q-scroll-area
:thumb-style="thumbStyle"
style="height: 290px;width100%;"
>
<div class="row no-wrap">
<div
@click="navToSearch(item)"
class="relative card"
v-for="item in cityList"
:key="item.Id"
>
<img class="card-img" :src="item.ImageList[0]" />
<div class="info">
<div class="text-subtitle1 text-weight-bold text-shadow">{{ item.AreaName }}</div>
<!-- <div>10Km</div> -->
</div>
</div>
</div>
</div>
</div>
</q-scroll-area>
<div class="flex flex-center">
<q-btn
@click="navToSearch()"
......@@ -72,7 +78,15 @@ export default {
},
},
data() {
return {};
return {
thumbStyle: {
right: '2px',
borderRadius: '2px',
backgroundColor: '#027be3',
width: '2px',
opacity: '0'
}
};
},
methods: {
navToSearch(item) {
......
......@@ -19,8 +19,8 @@
}
.card-img {
width: 272px;
height: 162px;
border-radius: 10px;
height: 162px;
border-radius: 10px;
}
.title {
margin-top: 17px;
......@@ -40,7 +40,7 @@ color: #36A1FA;
</style>
<template>
<div class="card">
<div class="relative">
<!-- <div class="relative">
<div class="address">
<i
class="iconfont icondingweixiao q-icon notranslate"
......@@ -58,7 +58,8 @@ color: #36A1FA;
class="card-img"
:src="data.ImgCover"
/>
</div>
</div> -->
<div class="title ellipsis-2">{{data.Title}}</div>
<!-- <div>
<i
......
......@@ -155,9 +155,9 @@ export default {
},
goHomeHandler(){
this.loading=false
// setTimeout(() => {
// location.href = location.origin;
// }, 3000);
setTimeout(() => {
location.href = location.origin;
}, 3000);
},
cancelPayHandler(){
this.showPay=''
......
......@@ -131,9 +131,9 @@ export default {
},
goHomeHandler() {
this.loading = false
// setTimeout(() => {
// location.href = location.origin;
// }, 3000);
setTimeout(() => {
location.href = location.origin;
}, 3000);
}
},
}
......
......@@ -84,7 +84,7 @@
class="form-item"
placeholder="名字(需與旅遊證件一致)"
v-model="form.EnSurname"
outlined
standout
:rules="[(val) => !!val || '请输入名字(需與旅遊證件一致)']"
></q-input>
</div>
......
const ListProductTypeEnum = Object.freeze({
TRIP: {
value: 1,
desc: '線路旅遊'
},
SCENIC: {
value: 2,
desc: '景點門票'
},
HOTEL: {
value: 3,
desc: '酒店住宿'
},
CAR: {
value: 4,
desc: '目的地用車'
},
JALAN: {
value: 5,
desc: '酒店住宿'
},
})
export default ListProductTypeEnum
\ No newline at end of file
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