Skip to content

J
jz_Travel
Commit 9ba7ce44 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 4844b6dc
Hide whitespace changes
Inline Side-by-side
Showing with 309 additions and 317 deletions
pages/airTicket/components/airTicketDetails.vue
View file @ 9ba7ce44
<template>
<view class="airTicketDetailsList column">
<view v-for="(items,i) in dataList">
<view class="airTicketDetailsCard bgFFF MB40">
<view class="row-sb-n MR50">
<view class="row-aic-n">
<view>
<view class="airTicketDetailsCard-qfc bgE1C278 fz30 color111 fontBold">
<template v-if="items.FlightSubType==1">去程</template>
<template v-if="items.FlightSubType==3">返程</template>
</view>
</view>
<view class="fz28 color111 ML20">
<text>{{items.time}}</text> <text class="ML10">周{{items.week}}</text>
</view>
<view class="fz28 color111 ML31">
总时长 {{items.duration}}
</view>
</view>
<view v-if="items.FlightList.length>1" class="fz28 colorE1C278 row-aic-n" @click="TicketDetails(items)">
<!-- <text>详情</text> -->
<uni-icons class="ML10" color="#DEBF7B" :type="items.show?'arrowdown':'arrowright'" size="14"></uni-icons>
<!-- <uni-icons class="ML10" color="#DEBF7B" type="arrowright" size="14"></uni-icons> -->
</view>
</view>
<view class="MT60 PX50" v-if="!items.show">
<view class="row relative" v-for="(item,index) in items.NewFlightList"
:class="[index==0?'MB50':'']">
<text v-if="index==1" class="fz18 fontWeight400 colorFF5858 absolute airTicketDetailsCard-timeT">
{{item.time}} 周{{item.week}}
</text>
<view class="airTicketDetailsCard-timeL column flexS MR20 textRight">
<view v-if="index==0" class="fz28 fontBold relative relativeFT10">{{item.Departure_time}} </view>
<view v-if="items.NewFlightList.length-1==index" class="MT25 fz28 fontBold">
{{item.Arrival_time}}
</view>
</view>
<view class="flexS MR30">
<view class="width-lineH49 bgE1C278 relative">
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinT"></view>
<template v-if="index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT2"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT3"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT4"></view>
</template>
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinB"></view>
<template v-if="index!=1">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinB2"></view>
</template>
</view>
</view>
<view class="column flexG relative">
<view v-if="items.frequency&&index!=0" class="airTicketDetailsCard-ZhuanNum bgE1C278 fz18 colorFFF absolute">
转
<template v-if="items.frequency>1">+{{items.frequency}}</template>
</view>
<view class="airTicketDetailsCard-title row-aic-n absolute" v-if="index==0">
<img class="inlineblock flexS" mode="widthFix" style="width: 20rpx;height: 17rpx;"
:src="item.AlImage"/>
<view class="flexG">
<text class="block width100One overflow fz20 ML5 color9999A5 fontWeight400">{{item.AlName}} {{item.Flight_number}} </text>
</view>
</view>
<view class="width436">
<view class="fz28 fontBold relative relativeFT8" v-if="index==0">
<text class="block width100One hidden ellipsis1">{{item.DepartureName?item.DepartureName:''}} {{item.dName}}</text>
</view>
<view class="fz28 fontBold MT25" v-if="index==1">
<text class="block width100One hidden ellipsis1">{{item.ArrivalCityName?item.ArrivalCityName:''}} {{item.aName}}</text>
</view>
</view>
</view>
</view>
</view>
<template v-if="items.show">
<view class="MT60 PX50" v-for="(item,index) in items.FlightList"
:class="[items.FlightList.length-1!=index?'MB50':'']">
<view class="row-aic-n relative"
:class="[items.FlightList.length-1!=index?'MB70':'']">
<text v-if="items.FlightList.length-1==index" class="fz18 fontWeight400 colorFF5858 absolute airTicketDetailsCard-timeT">
{{item.time}} 周{{item.week}}
</text>
<view class="airTicketDetailsCard-timeL column flexS MR20 textRight">
<view :class="[index?'fz24':'fz28 fontBold']">{{item.Departure_time}} </view>
<view class="MT35" :class="[items.FlightList.length-1!=index?'fz24':'fz28 fontBold']">
{{item.Arrival_time}}
</view>
</view>
<view class="flexS MR30">
<view class="width-lineH83 bgE1C278 relative">
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinT"></view>
<template v-if="index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT2"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT3"></view>
</template>
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinB"></view>
<template v-if="items.FlightList.length-1>index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinB2"></view>
<view class="bgE1C278 fz18 colorFFF absolute airTicketDetailsCard-LinText">
中转
</view>
</template>
</view>
</view>
<view class="column flexG relative">
<view class="airTicketDetailsCard-title row-aic-n absolute">
<img class="inlineblock flexS" mode="widthFix" style="width: 20rpx;height: 17rpx;"
:src="item.AlImage"/>
<view class="flexG">
<text class="block width100One overflow fz20 ML5 color9999A5 fontWeight400">{{item.AlName}} {{item.Flight_number}}</text>
</view>
</view>
<view class="width436">
<view class="fz28 fontBold relative relativeFT8">
<text class="block width100One hidden ellipsis1">{{item.DepartureName?item.DepartureName:''}} {{item.dName}} </text>
</view>
<view class="fz28 fontBold MT25">
<text class="block width100One hidden ellipsis1">{{item.ArrivalCityName?item.ArrivalCityName:''}} {{item.aName}} </text>
</view>
</view>
</view>
</view>
</view>
</template>
</view>
</view>
</view>
<view class="airTicketDetailsList column">
<view v-for="(items,i) in dataList">
<view class="airTicketDetailsCard bgFFF MB40">
<view class="row-sb-n MR50">
<view class="row-aic-n">
<view>
<view class="airTicketDetailsCard-qfc bgE1C278 fz30 color111 fontBold">
<template v-if="items.FlightSubType==1">去程</template>
<template v-if="items.FlightSubType==3">返程</template>
</view>
</view>
<view class="fz28 color111 ML20">
<text>{{items.time}}</text> <text class="ML10">周{{items.week}}</text>
</view>
<view class="fz28 color111 ML31">
<!-- 总时长 {{items.duration}} -->
</view>
</view>
<view v-if="items.FlightList.length>1" class="fz28 colorE1C278 row-aic-n" @click="TicketDetails(items)">
<uni-icons class="ML10" color="#DEBF7B" :type="items.show?'arrowdown':'arrowright'" size="14"></uni-icons>
</view>
</view>
<view class="MT60 PX50" v-if="!items.show">
<view class="row relative" v-for="(item,index) in items.NewFlightList" :class="[index==0?'MB50':'']">
<text v-if="index==1" class="fz18 fontWeight400 colorFF5858 absolute airTicketDetailsCard-timeT">
{{item.time}} 周{{item.week}}
</text>
<view class="airTicketDetailsCard-timeL column flexS MR20 textRight">
<view v-if="index==0" class="fz28 fontBold relative relativeFT10">{{item.Departure_time}} </view>
<view v-if="items.NewFlightList.length-1==index" class="MT25 fz28 fontBold">
{{item.Arrival_time}}
</view>
</view>
<view class="flexS MR30">
<view class="width-lineH49 bgE1C278 relative">
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinT"></view>
<template v-if="index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT2"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT3"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT4"></view>
</template>
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinB"></view>
<template v-if="index!=1">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinB2"></view>
</template>
</view>
</view>
<view class="column flexG relative">
<view v-if="items.frequency&&index!=0" class="airTicketDetailsCard-ZhuanNum bgE1C278 fz18 colorFFF absolute">
转
<template v-if="items.frequency>1">+{{items.frequency}}</template>
</view>
<view class="airTicketDetailsCard-title row-aic-n absolute" v-if="index==0">
<img class="inlineblock flexS" mode="widthFix" style="width: 20rpx;height: 17rpx;" :src="item.AlImage" />
<view class="flexG">
<text class="block width100One overflow fz20 ML5 color9999A5 fontWeight400">{{item.AlName}}
{{item.Flight_number}} </text>
</view>
</view>
<view class="width436">
<view class="fz28 fontBold relative relativeFT8" v-if="index==0">
<text class="block width100One hidden ellipsis1">{{item.DepartureName?item.DepartureName:''}} {{item.dName}}</text>
</view>
<view class="fz28 fontBold MT25" v-if="index==1">
<text class="block width100One hidden ellipsis1">{{item.ArrivalCityName?item.ArrivalCityName:''}} {{item.aName}}</text>
</view>
</view>
</view>
</view>
</view>
<template v-if="items.show">
<view class="MT60 PX50" v-for="(item,index) in items.FlightList" :class="[items.FlightList.length-1!=index?'MB50':'']">
<view class="row-aic-n relative" :class="[items.FlightList.length-1!=index?'MB70':'']">
<text v-if="items.FlightList.length-1==index" class="fz18 fontWeight400 colorFF5858 absolute airTicketDetailsCard-timeT">
{{item.time}} 周{{item.week}}
</text>
<view class="airTicketDetailsCard-timeL column flexS MR20 textRight">
<view :class="[index?'fz24':'fz28 fontBold']">{{item.Departure_time}} </view>
<view class="MT35" :class="[items.FlightList.length-1!=index?'fz24':'fz28 fontBold']">
{{item.Arrival_time}}
</view>
</view>
<view class="flexS MR30">
<view class="width-lineH83 bgE1C278 relative">
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinT"></view>
<template v-if="index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT2"></view>
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinT3"></view>
</template>
<view class="bgE1C278 absolute WH12R50 airTicketDetailsCard-LinB"></view>
<template v-if="items.FlightList.length-1>index">
<view class="bgE1C278 absolute WH6R50 airTicketDetailsCard-LinB2"></view>
<view class="bgE1C278 fz18 colorFFF absolute airTicketDetailsCard-LinText">
中转
</view>
</template>
</view>
</view>
<view class="column flexG relative">
<view class="airTicketDetailsCard-title row-aic-n absolute">
</view>
<view class="width436">
<view class="fz28 fontBold relative relativeFT8">
<text class="block width100One hidden ellipsis1">{{item.DepartureName?item.DepartureName:''}} {{item.dName}}
</text>
</view>
<view class="fz28 fontBold MT25">
<text class="block width100One hidden ellipsis1">{{item.ArrivalCityName?item.ArrivalCityName:''}}
{{item.aName}} </text>
</view>
</view>
</view>
</view>
</view>
</template>
</view>
</view>
</view>
</template>
<script>
export default {
props:['DetailsList'],
components: {
},
data() {
return {
dataList:[
{
show:true
},
{
show:false
},
],
}
},
onLoad(options){
},
watch: {
DetailsList:{
handler(newVal, oldval) {
this.dataList = JSON.parse(JSON.stringify(this.DetailsList))
},
deep: true,
immediate: true
}
},
created() {},
methods: {
TicketDetails(items){
items.show=!items.show
this.$forceUpdate();
},
}
}
export default {
props: ['DetailsList'],
components: {
},
data() {
return {
dataList: [{
show: true
},
{
show: false
},
],
}
},
onLoad(options) {
},
watch: {
DetailsList: {
handler(newVal, oldval) {
this.dataList = JSON.parse(JSON.stringify(this.DetailsList))
},
deep: true,
immediate: true
}
},
created() {},
methods: {
TicketDetails(items) {
items.show = !items.show
this.$forceUpdate();
},
}
}
</script>
<style scoped>
@import url("@/asset/css/flex.css");
@import url("../style.css");
.airTicketDetailsList{
margin: 0 54rpx;
}
.airTicketDetailsCard{
border-radius: 50rpx;
padding: 45rpx 0;
}
@import url("@/asset/css/flex.css");
@import url("../style.css");
.airTicketDetailsList {
margin: 0 54rpx;
}
</style>
\ No newline at end of file
.airTicketDetailsCard {
border-radius: 50rpx;
padding: 45rpx 0;
}
</style>
pages/airTicket/components/airTicketList.vue
View file @ 9ba7ce44
<template>
<view>
<view class="aviationCard bgFFF row-sbas-n relative"
v-for="(item,index) in dataList"
@click="getPriceDetail(item)">
<view v-if="item.FlightList.length>2" class="aviationCard-wf absolute bg111 colorFFF fz20 z-index2">异地往返</view>
<view class="column flexG">
<view
:class="[indexs?'':'MB10']"
v-for="(childs,indexs) in item.NewFlightList">
<view class="row-sb-n MT25">
<view class="flexS MR20">
<view class="FlightDirection-qc bgE1C278 fz24 color111 overflow textCenter">
<template v-if="childs.FlightSubType==1">去程</template>
<template v-if="childs.FlightSubType==3">返程</template>
</view>
</view>
<view class="column flexS">
<text class="fz36 fontBold">{{childs.Departure_time}} </text>
<text class="fz22 MT5 width100 ellipsis1">{{childs.dName}}</text>
</view>
<view class="FlightDirection-box relative">
<view class="FlightDirection-Title column">
<!-- :style="{'height':'90rpx'}" -->
<view class="row-ajc-n">
<text class="fz20 color9999A5">{{childs.duration}}</text>
<view class="FlightDirection-zhuan z-index2 ML10" v-if="childs.frequency">
<text class="block bgECF1F4 fz21 nowrap">
转<template v-if="childs.frequency>1">+{{childs.frequency}}</template>
</text>
</view>
</view>
<view>
<text class="fz19 textCenter width100 ellipsis1">
{{childs.DepartureName}} {{childs.ArrivalCityName}}
</text>
</view>
</view>
<view class="FlightDirection-line absolute row-aic-n">
<view class="FlightDirection-line-one bgECF1F4"></view>
<view class="FlightDirection-line-two">
<view class="height-line1"></view>
</view>
<view class="FlightDirection-line-one bgECF1F4"></view>
</view>
</view>
<view class="relative">
<view class="column">
<text class="fz36 fontBold">{{childs.Arrival_time}} </text>
<text class="fz22 MT5 width100 ellipsis1">{{childs.aName}}</text>
</view>
<view class="FlightDirection-time absolute colorFF5858 fz20 nowrap" v-if="childs.Days">
<text>+</text>
<text class="ML5">{{childs.Days}}</text>
<text class="ML5">天</text>
</view>
</view>
</view>
<view class="row-w MT15">
<view class="aviationTitle row-aic-n">
<view>
<img class="inlineblock flexS" mode="widthFix" style="width: 36rpx;height: 30rpx;"
:src="item.AirlineUrl"/>
</view>
<text class="fz22 ML10 color9999A5">{{item.AirLineName}}</text>
</view>
</view>
</view>
</view>
<view class="FlightDirection-Price flexS column">
<view class="colorC09D4F fontBold row-aic-n MT25">
<view class="FlightDirection-Price-symbol MR10">
<text class="fz20 relative" v-if="item.Price>0">¥</text>
</view>
<text :class="[item.Price>0?'fz36':'fz22 fontWeight400']">
<template v-if="item.Price>0">
{{item.Price}}
</template>
<template v-else>暂无报价</template>
</text>
</view>
<view class="textRight">
<text class="FlightDirection-zhang border1 borde fz18"
:class="[item.B2BSellNum>0?'borderFF5858 colorFF5858':'borderF5 color9999A5']">
<template v-if="item.B2BSellNum>0">剩{{item.B2BSellNum}}张</template>
<template v-if="item.Price>0&&item.B2BSellNum==0">售罄</template>
</text>
</view>
</view>
</view>
</view>
<view>
<view class="aviationCard bgFFF row-sbas-n relative" v-for="(item,index) in dataList" @click="getPriceDetail(item)">
<view v-if="item.FlightList.length>2" class="aviationCard-wf absolute bg111 colorFFF fz20 z-index2">异地往返</view>
<view class="column flexG">
<view :class="[indexs?'':'MB10']" v-for="(childs,indexs) in item.NewFlightList">
<view class="row-sb-n MT25">
<view class="flexS MR20">
<view class="FlightDirection-qc bgE1C278 fz24 color111 overflow textCenter">
<template v-if="childs.FlightSubType==1">去程</template>
<template v-if="childs.FlightSubType==3">返程</template>
</view>
</view>
<view class="column flexS">
<text class="fz36 fontBold">{{childs.Departure_time}} </text>
<text class="fz22 MT5 width100 ellipsis1">{{childs.dName}}</text>
</view>
<view class="FlightDirection-box relative">
<view class="FlightDirection-Title column">
<!-- :style="{'height':'90rpx'}" -->
<view class="row-ajc-n">
<!-- <text class="fz20 color9999A5">{{childs.duration}}</text> -->
<view class="FlightDirection-zhuan z-index2 ML10" v-if="childs.frequency">
<text class="block bgECF1F4 fz21 nowrap">
转<template v-if="childs.frequency>1">+{{childs.frequency}}</template>
</text>
</view>
</view>
<view>
<text class="fz19 textCenter width100 ellipsis1">
{{childs.DepartureName}} {{childs.ArrivalCityName}}
</text>
</view>
</view>
<view class="FlightDirection-line absolute row-aic-n">
<view class="FlightDirection-line-one bgECF1F4"></view>
<view class="FlightDirection-line-two">
<view class="height-line1"></view>
</view>
<view class="FlightDirection-line-one bgECF1F4"></view>
</view>
</view>
<view class="relative">
<view class="column">
<text class="fz36 fontBold">{{childs.Arrival_time}} </text>
<text class="fz22 MT5 width100 ellipsis1">{{childs.aName}}</text>
</view>
<view class="FlightDirection-time absolute colorFF5858 fz20 nowrap" v-if="childs.Days">
<text>+</text>
<text class="ML5">{{childs.Days}}</text>
<text class="ML5">天</text>
</view>
</view>
</view>
<view class="row-w MT15">
<view class="aviationTitle row-aic-n">
<view>
<img class="inlineblock flexS" mode="widthFix" style="width: 36rpx;height: 30rpx;" :src="item.AirlineUrl" />
</view>
<text class="fz22 ML10 color9999A5">{{item.AirLineName}}</text>
</view>
</view>
</view>
</view>
<view class="FlightDirection-Price flexS column">
<view class="colorC09D4F fontBold row-aic-n MT25">
<view class="FlightDirection-Price-symbol MR10">
<text class="fz20 relative" v-if="item.Price>0">¥</text>
</view>
<text :class="[item.Price>0?'fz36':'fz22 fontWeight400']">
<template v-if="item.Price>0">
{{item.Price}}
</template>
<template v-else>暂无报价</template>
</text>
</view>
<view class="textRight">
<text class="FlightDirection-zhang border1 borde fz18" :class="[item.B2BSellNum>0?'borderFF5858 colorFF5858':'borderF5 color9999A5']">
<template v-if="item.B2BSellNum>0">剩{{item.B2BSellNum}}张</template>
<template v-if="item.Price>0&&item.B2BSellNum==0">售罄</template>
</text>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props:['dataList'],
components: {},
data() {
return {
}
},
onLoad(options){
export default {
props: ['dataList'],
components: {},
data() {
return {}
},
onLoad(options) {
},
created() {},
methods: {
getPriceDetail(item){
uni.navigateTo({
},
created() {},
methods: {
getPriceDetail(item) {
uni.navigateTo({
url: `/pages/airTicket/airTicketDetails?TCID=${item.TCID}&Price=${item.Price}`
});
},
}
}
},
}
}
</script>
<style scoped>
@import url("@/asset/css/flex.css");
@import url("../style.css");
.aviationCard{
border-radius: 20rpx;
padding: 37rpx 34rpx 48rpx 37rpx;
margin: 0 30rpx 40rpx;
}
.aviationCard-wf{
left: 0;
top: 0;
border-top-left-radius: 50rpx;
border-bottom-right-radius: 50rpx;
padding: 7rpx 27rpx;
}
.aviationTitle{
margin-right: 31rpx;
}
.aviationTitle:last-child{
margin-right: 0;
}
.FlightDirection-time{
left: 0;
right: 0;
top: -33rpx;
}
.FlightDirection-Price{
margin-left: 45rpx;
}
.FlightDirection-Price>view{
}
.FlightDirection-Price-symbol text{
top: -3rpx;
}
</style>
\ No newline at end of file
@import url("@/asset/css/flex.css");
@import url("../style.css");
.aviationCard {
border-radius: 20rpx;
padding: 37rpx 34rpx 48rpx 37rpx;
margin: 0 30rpx 40rpx;
}
.aviationCard-wf {
left: 0;
top: 0;
border-top-left-radius: 50rpx;
border-bottom-right-radius: 50rpx;
padding: 7rpx 27rpx;
}
.aviationTitle {
margin-right: 31rpx;
}
.aviationTitle:last-child {
margin-right: 0;
}
.FlightDirection-time {
left: 0;
right: 0;
top: -33rpx;
}
.FlightDirection-Price {
margin-left: 45rpx;
}
.FlightDirection-Price>view {}
.FlightDirection-Price-symbol text {
top: -3rpx;
}
</style>
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