tangxinyue
/
alipay-emulator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完成去哪儿火车票

This commit is contained in:
tangxinyue 2026-03-06 14:19:05 +08:00
parent 0e43722c8e
commit 46de3cbd57
17 changed files with 473 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
main.js
View File

@ -27,7 +27,7 @@ export function createApp() {
const systemInfo = uni.getStorageSync('systemInfo') || {} const systemInfo = uni.getStorageSync('systemInfo') || {}
app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android' app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android'
app.config.globalProperties.$systemInfo = systemInfo app.config.globalProperties.$systemInfo = systemInfo
uni.setStorageSync('version', '1.0.2.sp9') uni.setStorageSync('version', '1.0.3')
app.config.globalProperties.$version = uni.getStorageSync('version') app.config.globalProperties.$version = uni.getStorageSync('version')
app.use(globalMethods); app.use(globalMethods);

2
pages/index/index.nvue
View File

@ -21,7 +21,7 @@
@scroll="handleScroll"> @scroll="handleScroll">
<view> <view>
<!-- iOS专用：透明点击区域覆盖导航栏左上角 --> <!-- iOS专用：透明点击区域覆盖导航栏左上角 -->
<view @click="exit" @tap="exit" :style="{ <view @click="exit" :style="{
position: 'fixed', position: 'fixed',
top: statusBarHeight + 'px', top: statusBarHeight + 'px',
left: '0px', left: '0px',

4
pages/other/air-tickets/fliggy-air-tickets/fliggy-air-tickets.vue
View File

@ -204,8 +204,8 @@
<text class="label" :class="{ 'empty': index !== 0 }">乘机人</text> <text class="label" :class="{ 'empty': index !== 0 }">乘机人</text>
<view class="info" @click="goEdit"> <view class="info" @click="goEdit">
<text class="name">{{ item.name }}</text> <text class="name">{{ item.name }}</text>
<text class="id-card">{{ item.idType }}：{{ item.idType === '身份证' ? <text class="id-card">{{ item.idType }}：{{ item.idType.includes('身份证') ?
showFristAndLastNumber(item.idNumber) : (item.idType === '护照' ? showFristAndLastNumber(item.idNumber) : (item.idType.includes('护照') ?
stringUtil.maskPassport(item.idNumber) : item.idNumber) }}</text> stringUtil.maskPassport(item.idNumber) : item.idNumber) }}</text>
<view class="ticket-row"> <view class="ticket-row">
<text class="ticket-no">票号：{{ item.ticketNo }}</text> <text class="ticket-no">票号：{{ item.ticketNo }}</text>

4
pages/other/air-tickets/qunar-air-tickets/qunar-air-tickets.vue
View File

@ -198,8 +198,8 @@
<view class="row-content" <view class="row-content"
@click="util.goPage('/pages/other/air-tickets/edit/edit')"> @click="util.goPage('/pages/other/air-tickets/edit/edit')">
<view class="p-name">{{ p.name }}</view> <view class="p-name">{{ p.name }}</view>
<view class="p-sub">{{ p.idType }}: {{ p.idType === '身份证' ? <view class="p-sub">{{ p.idType }}: {{ p.idType.includes('身份证') ?
stringUtil.maskIdCard(p.idNumber) : (p.idType === '护照' ? stringUtil.maskIdCard(p.idNumber) : (p.idType.includes('护照') ?
stringUtil.maskPassport(p.idNumber) : p.idNumber) }}</view> stringUtil.maskPassport(p.idNumber) : p.idNumber) }}</view>
<view class="p-sub"> <view class="p-sub">
<text>票号:{{ p.ticketNo }}</text> <text>票号:{{ p.ticketNo }}</text>

2
pages/other/tickets-app/index.vue
View File

@ -72,7 +72,7 @@ const appList = [
logo: '/static/image/other/tickets-app/qvnar-logo.png', logo: '/static/image/other/tickets-app/qvnar-logo.png',
bgImage: '/static/image/other/tickets-app/qvnar-bg.png', bgImage: '/static/image/other/tickets-app/qvnar-bg.png',
airPath: '/pages/other/air-tickets/qunar-air-tickets/qunar-air-tickets', airPath: '/pages/other/air-tickets/qunar-air-tickets/qunar-air-tickets',
trainPath: "开发中", trainPath: "/pages/other/train-tickets/qunar-train-tickets/qunar-train-tickets",
isHot: false isHot: false
}, },
{ {

6
pages/other/train-tickets/edit/edit.vue
View File

@ -21,7 +21,7 @@
<view class="input">{{ ticketsInfo.orderInfo.orderTime }}</view> <view class="input">{{ ticketsInfo.orderInfo.orderTime }}</view>
</view> </view>
</picker> </picker>
<view v-if="app == 'ctrip'" class="form-item"> <view v-if="app != '12306'" class="form-item">
<text class="label">订单总价</text> <text class="label">订单总价</text>
<input class="input" type="number" v-model="ticketsInfo.orderInfo.price" /> <input class="input" type="number" v-model="ticketsInfo.orderInfo.price" />
</view> </view>
@ -126,7 +126,7 @@
<text class="label">票价</text> <text class="label">票价</text>
<input class="input" type="number" v-model="passenger.price" @input="onPriceInput" /> <input class="input" type="number" v-model="passenger.price" @input="onPriceInput" />
</view> </view>
<view class="form-item"> <view v-if="app == 'ctrip'" class="form-item">
<text class="label">积分</text> <text class="label">积分</text>
<input class="input" type="number" v-model="passenger.points" /> <input class="input" type="number" v-model="passenger.points" />
</view> </view>
@ -134,7 +134,7 @@
<text class="label">证件类型</text> <text class="label">证件类型</text>
<input class="input" v-model="passenger.idType" /> <input class="input" v-model="passenger.idType" />
</view> </view>
<view class="form-item"> <view v-if="app != 'qunar'" class="form-item">
<text class="label">是否本人</text> <text class="label">是否本人</text>
<switch :checked="passenger.isMe" @change="(e) => passenger.isMe = e.detail.value" /> <switch :checked="passenger.isMe" @change="(e) => passenger.isMe = e.detail.value" />
</view> </view>

278
pages/other/train-tickets/qunar-train-tickets/components/box.vue Normal file
View File

@ -0,0 +1,278 @@
<template>
<view class="box">
<view class="codefun-flex-row codefun-justify-between codefun-items-center section_5 codefun-mt-8">
<view class="codefun-flex-row codefun-items-center">
<image class="codefun-shrink-0 image_11" src="/static/image/other/train-tickets/qunar/plan.png" />
<text class="font_3 text_31 codefun-ml-4">抢票方案详情</text>
</view>
<image class="image_4 image_12" src="/static/image/other/train-tickets/qunar/right.png" />
</view>
<view class="codefun-flex-row codefun-items-center section_6 codefun-mt-8">
<view class="codefun-flex-row codefun-flex-1">
<image class="codefun-shrink-0 image_13" src="/static/image/other/train-tickets/qunar/child.png" />
<view class="codefun-flex-col codefun-items-start codefun-flex-1 group_14 codefun-ml-10">
<text class="font_9 text_32">免费携带儿童申报</text>
<text class="font_5 text_34 codefun-mt-8">每名成人可免费携带1名6岁以下儿童</text>
</view>
</view>
<view
class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper_4 ml-15 codefun-justify-center">
<text class="font_9 text_33">去申报</text>
</view>
</view>
<view class="codefun-flex-col codefun-justify-start section_7 codefun-mt-8">
<view class="codefun-flex-col group_15">
<text class="codefun-self-start text_35">专属服务</text>
<view
class="codefun-flex-row codefun-justify-between codefun-items-center codefun-self-stretch group_16">
<view class="codefun-flex-row codefun-items-baseline">
<text class="codefun-shrink-0 font_3 text_36">全能抢票套餐</text>
<text class="font_19 codefun-ml-24">20元接送站代金券 x2份</text>
</view>
<image class="image_7" src="/static/image/other/train-tickets/qunar/right.png" />
</view>
<view v-for="(item, index) in services" :key="index"
class="codefun-flex-row codefun-justify-between codefun-items-center codefun-self-end service-item-right">
<text class="font_19">{{ item }}</text>
<image class="image_7" src="/static/image/other/train-tickets/qunar/right.png" />
</view>
</view>
</view>
<view class="codefun-flex-col section_8 codefun-mt-8">
<text class="codefun-self-start font_12 text_41">你可能遇到的问题</text>
<view class="codefun-flex-col codefun-self-stretch mt-25">
<view v-for="(question, index) in questions" :key="index"
class="codefun-flex-row codefun-justify-between codefun-items-center faq-item"
:class="{ 'mt-34': index > 0 }">
<view class="codefun-flex-row codefun-items-center codefun-flex-1">
<view class="codefun-flex-col codefun-items-center indicator-wrap">
<view class="codefun-shrink-0 section_9"></view>
</view>
<text class="font_3" style="margin-left: 14rpx;">{{ question.text }}</text>
</view>
<image class="image_7 faq-arrow" src="/static/image/other/train-tickets/qunar/right.png" />
</view>
</view>
</view>
</view>
</template>
<script setup>
import { ref } from 'vue';
const services = ref([
'腾讯视频vip月卡 x2份',
'加速包 x2份',
'24小时专人抢票 x2份'
]);
const questions = ref([
{ text: '为什么会退票失败' },
{ text: '退款什么时候到账' },
{ text: '已在车站或12306办理退票，退款何时到账' },
{ text: '如何退票' }
]);
</script>
<style>
@import '/common/global.css';
page {
background-color: #F2F5F9;
}
</style>
<style lang="less" scoped>
.mt-25 {
margin-top: 50rpx;
}
.box {
// padding: 0 16rpx;
.section_5 {
padding: 24rpx 28rpx 23.5rpx;
overflow: hidden;
border-radius: 20rpx;
background-color: #ffffff;
.image_11 {
width: 32rpx;
height: 32rpx;
}
.font_3 {
font-size: 26rpx;
line-height: 25.92rpx;
color: #363636;
}
.text_31 {
font-size: 28rpx;
line-height: 26.04rpx;
}
.image_4 {
width: 28rpx;
height: 28rpx;
}
.image_12 {
margin-right: 8rpx;
}
}
.section_6 {
padding: 24rpx 32rpx;
background-image: url('https://ide.code.fun/api/image?token=69aa2b4a9a40b800116f8c00&name=c0f80a6a5d1e928f0eebbb1c141f11c9.png');
background-size: 100% 100%;
background-repeat: no-repeat;
.image_13 {
width: 72rpx;
height: 72rpx;
}
.group_14 {
margin-top: 6.4rpx;
.text_32 {
font-size: 28rpx;
line-height: 26.12rpx;
}
.font_5 {
font-size: 26rpx;
line-height: 21.14rpx;
color: #666666;
}
.text_34 {
color: #999999;
font-size: 24rpx;
line-height: 22.48rpx;
}
}
.text-wrapper_4 {
background-image: linear-gradient(106.4deg, #ff912b -19.9%, #fc6a11 100.3%);
border-radius: 32rpx;
width: 140rpx;
height: 64rpx;
.text_33 {
color: #ffffff;
}
}
.font_9 {
font-size: 26rpx;
line-height: 25.92rpx;
font-weight: 700;
color: #363636;
}
}
.section_7 {
padding: 46rpx 0 48rpx;
background-color: #ffffff;
border-radius: 20rpx;
.group_15 {
margin-left: 30rpx;
margin-right: 36rpx;
overflow: hidden;
.text_35 {
color: #363636;
font-size: 30rpx;
font-weight: 700;
line-height: 27.7rpx;
}
.group_16 {
margin-top: 34.76rpx;
.font_3 {
font-size: 26rpx;
line-height: 25.92rpx;
color: #363636;
}
.text_36 {
line-height: 24.24rpx;
}
}
.font_19 {
font-size: 26rpx;
line-height: 28rpx;
color: #666666;
}
.image_7 {
width: 20rpx;
height: 20rpx;
}
.service-item-right {
margin-top: 24rpx;
width: 450rpx;
}
}
}
.section_8 {
padding: 36.12rpx 20.54rpx 46.56rpx 28.54rpx;
background-image: linear-gradient(180deg, #f1fbfb -21.5%, #ffffff 67.4%);
border-radius: 20rpx;
border: solid 4rpx #ffffff;
.font_12 {
font-size: 32rpx;
line-height: 29.6rpx;
color: #363636;
}
.text_41 {
font-size: 34rpx;
font-weight: 700;
line-height: 31.44rpx;
}
.section_9 {
background-color: #02c8e7;
border-radius: 50%;
width: 8rpx;
height: 8rpx;
}
.indicator-wrap {
width: 20rpx;
display: flex;
align-items: center;
}
.font_3 {
font-size: 26rpx;
line-height: 25.92rpx;
color: #363636;
}
.image_7 {
width: 20rpx;
height: 20rpx;
}
.faq-arrow {
margin-right: 15rpx;
}
.mt-34 {
margin-top: 34rpx;
}
.group_21 {
line-height: 24.62rpx;
}
}
}
</style>

348
pages/other/train-tickets/qunar-train-tickets/qunar-train-tickets.vue
View File

@ -1,27 +1,31 @@
<template> <template>
<!-- 水印 -->
<view v-if="$isVip()">
<watermark dark="light" />
<liu-drag-button :canDocking="false" @clickBtn="$goRechargePage('watermark')">
<c-lottie ref="cLottieRef" :src='$watermark()' width="94px" height='74px' :loop="true"></c-lottie>
</liu-drag-button>
</view>
<view class="codefun-flex-col section"> <view class="codefun-flex-col section">
<NavBar :bgColor="data.navBar.bgColor" :buttonGroup="buttonGroup" @button-click="util.clickTitlePopupButton"
<view class="codefun-flex-col"> tipLayerType="qunar-train-tickets-tip" isTipLayer tipLayerText="修改车票信息">
<NavBar :bgColor="data.navBar.bgColor"> <template v-slot:right>
<template v-slot:right> <view class="codefun-flex-col group_2">
<view class="codefun-flex-col group_2"> <view class="codefun-flex-row group_3">
<view class="codefun-flex-row group_3"> <image class="image_4" src="/static/image/other/train-tickets/qunar/tuigaishuoming.png" />
<image class="image_4" <image class="image_4 ml-25" src="/static/image/other/train-tickets/qunar/kefu.png" />
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=44fab7ee90c95b87261af4a7daf16baa.png" />
<image class="image_4 ml-25"
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=65cb30e87fa83964e97ff8fca353aae5.png" />
</view>
<view class="codefun-flex-row codefun-mt-4">
<text class="font text">退改说明</text>
<text class="font text_2 ml-11">客服</text>
</view>
</view> </view>
</template> <view class="codefun-flex-row codefun-mt-4">
</NavBar> <text class="font text">退改说明</text>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_4 codefun-mt-10"> <text class="font text_2 ml-11">客服</text>
</view>
</view>
</template>
</NavBar>
<view class="codefun-flex-col">
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_4">
<view class="codefun-flex-row codefun-items-center"> <view class="codefun-flex-row codefun-items-center">
<image class="codefun-shrink-0 image_5" <image class="codefun-shrink-0 image_5" src="/static/image/other/train-tickets/qunar/success.png" />
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=9eb41daef3c005e12021a9e662213233.png" />
<text class="text_5 ml-7">出票完成</text> <text class="text_5 ml-7">出票完成</text>
<view <view
class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper ml-7 codefun-justify-center"> class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper ml-7 codefun-justify-center">
@ -31,112 +35,221 @@
<view class="codefun-flex-col section_2"> <view class="codefun-flex-col section_2">
<view class="codefun-self-start group_5"> <view class="codefun-self-start group_5">
<text class="font_2 text_3">¥</text> <text class="font_2 text_3">¥</text>
<text class="font_2 text_4">411.3</text> <text class="font_2 text_4">{{ trainTickets.orderInfo.price }}</text>
</view> </view>
<image class="codefun-shrink-0 codefun-self-end image_7 image_8" <image class="codefun-shrink-0 codefun-self-end image_7 image_8"
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=57cd551df6c3f5bf9e1926e61e44b652.png" /> src="/static/image/other/train-tickets/qunar/right.png" />
<text class="codefun-self-start text_7">支付明细</text> <text class="codefun-self-start text_7">支付明细</text>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="main-box"> <view class="main-box">
<view class="codefun-flex-col section_3"> <view class="codefun-flex-col section_3">
<view class="codefun-flex-col view"> <view class="codefun-flex-col view">
<view class="codefun-flex-row codefun-items-baseline codefun-self-stretch codefun-justify-between"> <view class="codefun-flex-row codefun-items-baseline codefun-self-stretch codefun-justify-between">
<text class="font_5 text_8">取票号:E452364128</text> <text class="font_5 text_8">取票号:{{ trainTickets.orderInfo.orderNo }}</text>
<view class="group_9 ml-25"> <view class="group_9 ml-25">
<text class="font_6">6A、7A进站检票口,6B、7B进站检票 6A、7A进站检票口,6B、7B进站检票</text> <text class="font_6">{{ trainTickets.ticketInfo.gate }}</text>
</view> </view>
</view> </view>
<view class="codefun-flex-row equal-division codefun-justify-between"> <view class="codefun-flex-row equal-division codefun-justify-between">
<view class="codefun-flex-col group_10 group_28"> <view class="codefun-flex-col group_10 group_28">
<text class="codefun-self-stretch font_3 text_16">10月07日 周二</text> <text class="codefun-self-stretch font_3 text_16">{{
<text class="codefun-self-start font_8 mt-7">12:06</text> formatDateTime(trainTickets.ticketInfo.departureTime,
trainTickets.ticketInfo.date) }}</text>
<text class="codefun-self-start font_8 mt-7">{{
trainTickets.ticketInfo.departureTime.split(' ')[1]
}}</text>
</view> </view>
<view class="codefun-flex-col codefun-items-center group_10 group_29"> <view class="codefun-flex-col codefun-items-center group_10 group_29">
<text class="font_5 text_17">3小时2分</text> <text class="font_5 text_17">{{ trainTickets.ticketInfo.duration }}</text>
<image class="image_9 mt-11" <image class="image_9 mt-11" src="/static/image/other/train-tickets/qunar/jingtingzhan.png" />
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=04cc1a57adb212e81d9636e2ccf62d52.png" />
</view> </view>
<view class="codefun-flex-col group_10 group_26"> <view class="codefun-flex-col group_10 group_26">
<text class="codefun-self-start font_3 text_18">10月07日 周二</text> <text class="codefun-self-start font_3 text_18">{{
<text class="codefun-self-end font_8 mt-7">12:06</text> formatDateTime(trainTickets.ticketInfo.arrivalTime,
trainTickets.ticketInfo.date) }}</text>
<text class="codefun-self-end font_8 mt-7">{{ trainTickets.ticketInfo.arrivalTime.split(' ')[1]
}}</text>
</view> </view>
</view> </view>
<view class="codefun-flex-row codefun-justify-center codefun-self-stretch codefun-relative group_11"> <view class="codefun-flex-row codefun-justify-center codefun-self-stretch codefun-relative group_11">
<view class="codefun-flex-row codefun-items-center pos"> <view class="codefun-flex-row codefun-items-center pos">
<text class="font_9 text_19">长沙南</text> <text class="font_9 text_19">{{ trainTickets.ticketInfo.departureStation }}</text>
<image class="codefun-shrink-0 image_4 ml-3" <image class="codefun-shrink-0 image_4 ml-3"
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=d359b87761ae865350a6df0242beabf4.png" /> src="/static/image/other/train-tickets/qunar/location.png" />
</view> </view>
<view class="codefun-flex-row codefun-items-center"> <view class="codefun-flex-row codefun-items-center">
<text class="font_19 text_21">G5267</text> <text class="font_19 text_21">{{ trainTickets.ticketInfo.trainNo }}</text>
<image class="codefun-shrink-0 image_10 codefun-ml-2" <image class="codefun-shrink-0 image_10 codefun-ml-2"
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=81fda3cc1109a351855d1057b2ba5637.png" /> src="/static/image/other/train-tickets/qunar/info.png" />
</view> </view>
<view class="codefun-flex-row codefun-items-center pos_2"> <view class="codefun-flex-row codefun-items-center pos_2">
<image class="codefun-shrink-0 image_4" <image class="codefun-shrink-0 image_4"
src="https://ide.code.fun/api/image?token=69a8ecc59a40b800116f659f&name=d359b87761ae865350a6df0242beabf4.png" /> src="/static/image/other/train-tickets/qunar/location.png" />
<text class="font_9 text_20 codefun-ml-4">虎门</text> <text class="font_9 text_20 codefun-ml-4">{{ trainTickets.ticketInfo.arrivalStation }}</text>
</view> </view>
</view> </view>
</view> </view>
<view class="codefun-flex-col group_12"> <view class="codefun-flex-col group_12">
<view class="codefun-flex-col section_1"> <view class="codefun-flex-col section_1" v-for="item in trainTickets.passengerList" :key="item.id">
<view class="codefun-flex-col"> <view class="codefun-flex-col">
<view class="codefun-flex-row codefun-justify-between codefun-items-center"> <view class="codefun-flex-row codefun-justify-between codefun-items-center">
<view class="codefun-flex-row codefun-items-baseline"> <view class="codefun-flex-row codefun-items-baseline">
<text class="font_10">汪鱼</text> <text class="font_10">{{ item.name }}</text>
<text class="font_11 text_22 codefun-ml-10">成人票</text> <text class="font_11 text_22 codefun-ml-10">{{ item.idType }}</text>
</view> </view>
<view class="codefun-flex-row"> <view class="codefun-flex-row">
<view <view
class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper_8"> class="codefun-flex-col codefun-justify-start codefun-items-center codefun-shrink-0 text-wrapper_8">
<text class="font_4 text_23">靠窗</text> <text v-if="computeSeatNo(item.seatNo)" class="font_4 text_23">{{
computeSeatNo(item.seatNo) }}</text>
</view> </view>
<text class="font_12 text_51 codefun-ml-6">14车11F号</text> <text class="font_12 text_51 codefun-ml-6">{{ item.carriage }}车{{ item.seatNo }}号</text>
</view> </view>
</view> </view>
<view class="codefun-flex-row codefun-justify-between codefun-mt-8"> <view class="codefun-flex-row codefun-justify-between codefun-mt-8">
<text class="codefun-self-start font_13">5102**********553</text> <text class="codefun-self-start font_13">{{ item.idType.includes('身份证') ?
<text class="codefun-self-center font_14 text_25">二等座</text> stringUtil.maskIdCard(item.idNumber) : (item.idType.includes('护照') ?
stringUtil.maskPassport(item.idNumber) : item.idNumber) }}</text>
<text class="codefun-self-center font_14 text_25">{{ item.seatType }}</text>
</view> </view>
</view> </view>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_27 mt-19"> <view class="codefun-flex-row codefun-justify-between codefun-items-center group_27 mt-19">
<text class="font_15 text_50">出票成功</text> <text class="font_15 text_50">出票成功</text>
<view class="codefun-flex-row"> <view class="codefun-flex-row">
<view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3"> <view class="codefun-flex-col codefun-justify-center codefun-items-center action-btn">
<text class="font_16 text_27">分享</text> <text class="font_16">分享</text>
</view> </view>
<view <view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_1 codefun-ml-6"> class="codefun-flex-col codefun-justify-center codefun-items-center action-btn codefun-ml-6">
<text class="font_16 text_28">改签</text> <text class="font_16">改签</text>
</view> </view>
<view <view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_5 codefun-ml-6"> class="codefun-flex-col codefun-justify-center codefun-items-center action-btn codefun-ml-6">
<text class="font_16 text_29">退票</text> <text class="font_16">退票</text>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<Box />
</view> </view>
</template> </template>
<script setup> <script setup>
import NavBar from '@/components/nav-bar/nav-bar.vue'; import NavBar from '@/components/nav-bar/nav-bar.vue';
import Box from './components/box.vue';
import { reactive, ref, computed, toRefs } from 'vue';
import { onShow, onPageScroll } from '@dcloudio/uni-app';
import { util, stringUtil } from '@/utils/common.js';
import CtripTrainTickets from '../ctrip-train-tickets/ctrip-train-tickets.vue';
import { reactive } from 'vue' const buttonGroup = [{
name: "编辑机票信息",
click: () => {
goEdit()
}
}]
function goEdit() {
util.goPage(`/pages/other/train-tickets/edit/edit?app=qunar&storageKey=${data.STORAGE_KEY}`)
}
const data = reactive({ const data = reactive({
navBar: { navBar: {
bgColor: 'transparent' bgColor: 'transparent'
},
trainTickets: {
"orderInfo": {
"orderNo": "EJ66223536",
"price": "4440"
},
"ticketInfo": {
"departureTime": "01-01 09:19",
"departureStation": "北京南",
"arrivalTime": "01-01 14:04",
"arrivalStation": "上海虹桥",
"trainNo": "G905",
"duration": "4时45分",
"date": "2026.01.01",
"weekDay": "星期四",
"gate": "6A、7A进站检票口,6B、7B进站检票",
"trainName": "复兴号"
},
"passengerList": [
{
"name": "张元英",
"type": "成人票",
"seatType": "商务座",
"carriage": "01",
"seatNo": "03C",
"idType": "外国护照（KR）",
"idNumber": "KR123456789",
"price": "2110",
"status": "已支付",
"isMe": true,
"points": 9632
}
]
},
STORAGE_KEY: 'qunarTrainTickets'
})
let { trainTickets } = toRefs(data)
onShow(() => {
const stored = uni.getStorageSync(data.STORAGE_KEY)
if (stored) {
Object.assign(data.trainTickets, stored)
} }
}) })
onPageScroll((e) => {
data.navBar.bgColor = e.scrollTop > 40 ? '#F2F5F9' : 'transparent';
})
const computeSeatNo = (seatNo) => {
if (seatNo.includes('C') || seatNo.includes('F')) {
return '靠窗';
} else if (seatNo.includes('A') || seatNo.includes('D')) {
return '过道';
}
return '';
}
const formatDateTime = (timeStr, dateStr) => {
if (!timeStr) return '';
const parts = timeStr.split(' ');
const md = parts[0];
if (!md) return '';
const mdParts = md.split('-');
let year, month, day;
if (mdParts.length === 3) {
year = mdParts[0];
month = mdParts[1];
day = mdParts[2];
} else if (mdParts.length === 2) {
month = mdParts[0];
day = mdParts[1];
year = new Date().getFullYear();
if (dateStr) {
year = dateStr.split('.')[0];
}
} else {
return '';
}
const dateObj = new Date(Number(year), Number(month) - 1, Number(day));
const weekDays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
const week = isNaN(dateObj.getTime()) ? '' : weekDays[dateObj.getDay()];
return `${month}月${day}日 ${week}`;
}
</script> </script>
<style> <style>
@ -147,8 +260,8 @@ page {
} }
</style> </style>
<style lang="less" scoped> <style lang="less" scoped>
.ml-5 { ::v-deep .uni-navbar__header-btns-right {
margin-left: 10rpx; width: auto !important;
} }
.ml-11 { .ml-11 {
@ -182,34 +295,11 @@ page {
.section { .section {
background: linear-gradient(180deg, #CDF2F6 0%, #F2F5F9 100%); background: linear-gradient(180deg, #CDF2F6 0%, #F2F5F9 100%);
.group {
padding: 0 29.34rpx;
.image {
width: 34rpx;
height: 22rpx;
}
.image_2 {
width: 30rpx;
height: 22rpx;
}
.image_3 {
width: 48rpx;
height: 22.66rpx;
}
}
.image_5 { .image_5 {
width: 44rpx; width: 44rpx;
height: 44rpx; height: 44rpx;
} }
.image_6 {
margin: 4rpx 0 3.92rpx;
}
.group_2 { .group_2 {
.group_3 { .group_3 {
padding-left: 23.26rpx; padding-left: 23.26rpx;
@ -243,7 +333,7 @@ page {
.text_5 { .text_5 {
color: #363636; color: #363636;
font-size: 44rpx; font-size: 44rpx;
font-weight: 800; font-weight: 700;
line-height: 41.18rpx; line-height: 41.18rpx;
} }
@ -251,24 +341,18 @@ page {
border-radius: 25rpx; border-radius: 25rpx;
width: 106rpx; width: 106rpx;
height: 50rpx; height: 50rpx;
border: solid 1rpx #28c2dd; border: solid 0.5px #28c2dd;
.font_5 {
font-size: 26rpx;
line-height: 21.14rpx;
color: #666666;
}
.text_6 { .text_6 {
color: #28c2dd; color: #28c2dd;
font-size: 24rpx; font-size: 24rpx;
line-height: 21.7rpx; line-height: 50rpx;
} }
} }
.section_2 { .section_2 {
padding: 19.76rpx 16.2rpx 13.54rpx; padding: 19.76rpx 16.2rpx 13.54rpx;
background-image: linear-gradient(270deg, #ffffff00 -64.3%, #ffffff 91.7%); background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
border-radius: 16rpx 0rpx 0rpx 16rpx; border-radius: 16rpx 0rpx 0rpx 16rpx;
width: 160rpx; width: 160rpx;
height: 94rpx; height: 94rpx;
@ -315,6 +399,9 @@ page {
.main-box { .main-box {
padding: 10rpx 16rpx; padding: 10rpx 16rpx;
padding-bottom: 10rpx;
padding-bottom: calc(10rpx + constant(safe-area-inset-bottom));
padding-bottom: calc(10rpx + env(safe-area-inset-bottom));
.ml-25 { .ml-25 {
margin-left: 50rpx; margin-left: 50rpx;
@ -345,6 +432,7 @@ page {
overflow: hidden; overflow: hidden;
overflow-x: auto; overflow-x: auto;
flex: 1; flex: 1;
text-align: right;
/* 隐藏横向滚动条，但保留滑动效果 */ /* 隐藏横向滚动条，但保留滑动效果 */
scrollbar-width: none; scrollbar-width: none;
@ -470,19 +558,20 @@ page {
.font_9 { .font_9 {
font-size: 26rpx; font-size: 26rpx;
line-height: 25.92rpx; line-height: 25.92rpx;
font-weight: 800; font-weight: 700;
color: #363636; color: #363636;
} }
} }
} }
.group_12 { .group_12 {
padding: 38rpx 0 24rpx; padding: 38rpx 0 0;
.section_1 { .section_1 {
padding: 28rpx 10.58rpx 22rpx 19.1rpx; padding: 28rpx 10.58rpx 22rpx 19.1rpx;
background-color: #f9fbfc; background-color: #f9fbfc;
border-radius: 16rpx; border-radius: 16rpx;
margin-bottom: 24rpx;
.text_22 { .text_22 {
font-size: 24rpx; font-size: 24rpx;
@ -518,47 +607,6 @@ page {
} }
} }
.section_4 {
padding: 28rpx 12.64rpx 22rpx 19.1rpx;
background-color: #f9fbfc;
border-radius: 16rpx;
.text_52 {
font-size: 24rpx;
line-height: 22.22rpx;
}
.text-wrapper_2 {
padding: 7.84rpx 0 5.92rpx;
background-color: #9db2bd;
border-radius: 8rpx;
width: 56rpx;
height: 32rpx;
.text_30 {
line-height: 18.24rpx;
}
}
.text_1 {
margin-top: 2.92rpx;
}
.text_49 {
margin-right: 2.32rpx;
font-size: 28rpx;
}
.group_1 {
padding-left: 8.98rpx;
padding-right: 7.36rpx;
.text_26 {
font-size: 28rpx;
}
}
}
.font_10 { .font_10 {
font-size: 26rpx; font-size: 26rpx;
line-height: 23.74rpx; line-height: 23.74rpx;
@ -582,6 +630,7 @@ page {
font-size: 32rpx; font-size: 32rpx;
line-height: 29.6rpx; line-height: 29.6rpx;
color: #363636; color: #363636;
font-weight: 500;
} }
.font_13 { .font_13 {
@ -600,24 +649,10 @@ page {
.font_15 { .font_15 {
font-size: 26rpx; font-size: 26rpx;
line-height: 25.92rpx; line-height: 25.92rpx;
font-weight: 800; font-weight: 700;
color: #f5882c; color: #f5882c;
} }
.text-wrapper_3 {
padding: 18.14rpx 0 17.54rpx;
background-color: #ffffff;
border-radius: 30rpx;
width: 104rpx;
height: 60rpx;
border: solid 1rpx #e0e4e3;
.text_27 {
font-size: 24rpx;
line-height: 22.32rpx;
}
}
.font_16 { .font_16 {
font-size: 26rpx; font-size: 26rpx;
line-height: 21.14rpx; line-height: 21.14rpx;
@ -625,33 +660,20 @@ page {
color: #363636; color: #363636;
} }
.text-wrapper_1 { .action-btn {
padding: 18.18rpx 0 17.52rpx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 30rpx; border-radius: 30rpx;
width: 104rpx; width: 104rpx;
height: 60rpx; height: 60rpx;
border: solid 1rpx #e0e4e3; border: solid 1rpx #e0e4e3;
.text_28 { text {
font-size: 24rpx;
line-height: 22.3rpx;
}
}
.text-wrapper_5 {
padding: 19.26rpx 0 17.6rpx;
background-color: #ffffff;
border-radius: 30rpx;
width: 104rpx;
height: 60rpx;
border: solid 1rpx #e0e4e3;
.text_29 {
font-size: 24rpx; font-size: 24rpx;
} }
} }
} }
} }
} }
</style> </style>

BIN
static/image/other/train-tickets/qunar/child.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
static/image/other/train-tickets/qunar/info.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
static/image/other/train-tickets/qunar/jingtingzhan.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
static/image/other/train-tickets/qunar/kefu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/image/other/train-tickets/qunar/location.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
static/image/other/train-tickets/qunar/plan.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 886 B

BIN
static/image/other/train-tickets/qunar/right.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 240 B

BIN
static/image/other/train-tickets/qunar/success.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/image/other/train-tickets/qunar/tuigaishuoming.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 362 B