<template>
    <view class="TicketOrderListCard bgFFF relative">
        <view class="TicketOrderListCard-wf absolute bg111 colorFFF fz24 z-index2">异地</view>
        <view class="row-sb-n">
            <view class="flexG"></view>
            <view class="fz24 color111 flexS">
                <text>09-28</text>
                <text class="ML5 MR10">周六</text>
                <text>10:39</text>
            </view>
        </view>
        <view class="MB55" v-for="(item,index) in 2">
            <view class="row-sb-n MT10">
                <view class="flexS MR20">
                    <view class="TicketOrderListCard-qc bgE1C278 fz24 color111 overflow textCenter relative relativeFT8">
                        {{index?'返':'去'}}
                        <!-- 往返 -->
                    </view>
                </view>
                <view class="column flexS">
                    <text class="fz30 fontBold">09:00 </text>
                    <text class="fz22 MT5 width100 ellipsis1">天府T2</text>
                </view>
                <view class="FlightDirection-box relative">
                    <view class="FlightDirection-Title column">
                        <!-- :style="{'height':'90rpx'}" -->
                        <view class="row-ajc-n">
                            <view class="FlightDirection-zhuan z-index2 MB10">
                                <text class="block bgECF1F4 fz21 nowrap">转+2</text>
                            </view>
                        </view>
                        <view>
                            <text class="fz19 textCenter width100 ellipsis1 relative relativeFT8">
                                武汉 北京
                            </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-line2"></view>
                        </view>
                        <view class="FlightDirection-line-one bgECF1F4"></view>
                    </view>
                </view>
                <view class="column">
                    <text class="fz36 fontBold">11:30 </text>
                    <text class="fz22 MT5 width100 ellipsis1">许家坪</text>
                </view>
                <view class="ML20 TicketOrderListCard-Pr textRight">
                    <text v-if="index==1" class="color9999A5 fz32 relative TicketOrderListCard-PrQx">取消</text>
                    <text v-else class="fz34 fontBold">¥ 5,800</text>
                </view>
            </view>
            <view class="row-w">
                <view class="aviationTitle row-aic-n">
                    <img class="inlineblock flexS" mode="widthFix" style="width: 36rpx;height: 30rpx;"
                    src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1696749257000_469.png"/>
                    <view class="flexG">
                        <text class="fz22 ML5 color9999A5 width100One ellipsis1">东航CA1852...</text>
                    </view>
                </view>
            </view>
        </view>
        <view class="row-sb-n MT30">
            <view class="fz324 color9999A5 MR30 flexG">
                <txet class="block TicketOrderListCard-title width100One ellipsis1">陈伟霆、郑中基等4人</txet>
            </view>
            <view class="flexS">
                <!-- colorDEBF7B -->
                <view class="TicketOrderListCard-buttom overflow fz32 fontBold textCenter border1 bgDEBF7B borderDEBF7B"
                @click="getDetail">
                    待付款
                </view>
                <!-- <view class="TicketOrderListCard-buttom overflow fz32 fontBold textCenter border1 bgF5 borderF5 color9999A5">
                    已取消
                </view>
                <view class="TicketOrderListCard-buttom overflow fz32 fontBold textCenter border1 bgFFF borderDEBF7B colorDEBF7B">
                    已支付
                </view> -->
            </view>
        </view>
    </view>
</template>
<script>
    export default {
        components: {
            
        },
        data() {
            return {
                
            }
        },
        onLoad(options){
            
        },
        created() {},
        mounted() {
            
        },
        methods: {
            getDetail(item){
                uni.navigateTo({
					url: '/pages/airTicket/TicketOrderDetails'
				});
            },
        }
    }
</script>
<style scoped>
@import url("@/asset/css/flex.css");
@import url("../style.css");
.TicketOrderListCard{
    border-radius: 50rpx;
    padding: 27rpx 39rpx 34rpx 50rpx;
    margin-bottom: 40rpx;
}
.TicketOrderListCard-wf{
    left: 0;
    top: 0;
    border-top-left-radius: 50rpx;
    border-bottom-right-radius: 50rpx;
    padding: 7rpx 27rpx;
}
.TicketOrderListCard-dashed{
    margin-top: 25rpx;
    margin-bottom: 25rpx;
}
.TicketOrderListCard-R{
    margin-left: 80rpx;
}
.TicketOrderListCard-R>view:last-child{
    padding-top: 37rpx;
}
.TicketOrderListCard-buttom{
    width: 170rpx;
    padding: 18rpx 0;
    border-radius: 35rpx;
}
.TicketOrderListCard-qc{
    padding: 2rpx 3rpx;
    border-radius: 8rpx;
}
.TicketOrderListCard-Pr{
    width: 150rpx;
}
.TicketOrderListCard-PrQx{
    padding: 10rpx;
    top: 34rpx;
}
</style>