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

1.携程火车票已出行状态 

2.解决和平精英，无畏锲约选择图片后为关闭选项问题
3.转账，支付成功页面优化导航
This commit is contained in:
tangxinyue 2026-07-16 16:30:19 +08:00
parent a215b9b263
commit 738f058281
8 changed files with 684 additions and 513 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
pages/balance/pay-successful/pay-successful.vue
View File

@ -226,86 +226,86 @@
</template>
<script setup>
import {
import {
ref,
onMounted,
reactive,
getCurrentInstance
} from 'vue';
import {
} from 'vue';
import {
onShow,
onLoad
} from '@dcloudio/uni-app';
import {
} from '@dcloudio/uni-app';
import {
util
} from '@/utils/common.js';
import {
} from '@/utils/common.js';
import {
defaultData
} from './data.json';
const {
} from './data.json';
const {
appContext,
proxy
} = getCurrentInstance();
} = getCurrentInstance();
const statusBarHeight = ref(0);
const PAY_STORAGE_KEY = 'alipay_pay_successful_data';
const payData = ref(defaultData);
const statusBarHeight = ref(0);
const PAY_STORAGE_KEY = 'alipay_pay_successful_data';
const payData = ref(defaultData);
const bannerImages = [
const bannerImages = [
'/static/image/balance/transfer/bottom-banner-1.png',
'/static/image/balance/transfer/bottom-banner-2.png'
];
];
// 从缓存加载数据
const loadStorageData = () => {
// 从缓存加载数据
const loadStorageData = () => {
const savedData = uni.getStorageSync(PAY_STORAGE_KEY);
if (savedData) {
payData.value = savedData;
}
};
loadStorageData();
};
loadStorageData();
const navBarRef = ref(null);
const buttonGroup = ref([{
const navBarRef = ref(null);
const buttonGroup = ref([{
name: '编辑支付数据',
action: 'edit'
}]);
const handleButtonClick = (button) => {
}]);
const handleButtonClick = (button) => {
if (button.action === 'edit') {
goEdit()
}
};
};
const goEdit = () => {
const goEdit = () => {
uni.navigateTo({
url: '/pages/balance/pay-successful/edit'
});
}
}
const toggleBanner = () => {
const toggleBanner = () => {
const currentIndex = bannerImages.indexOf(payData.value.style1.bannerUrl);
const nextIndex = (currentIndex + 1) % bannerImages.length;
payData.value.style1.bannerUrl = bannerImages[nextIndex];
uni.setStorageSync(PAY_STORAGE_KEY, payData.value);
};
};
onLoad(() => {
onLoad(() => {
// 进入支付成功页面埋点
proxy.$apiUserEvent('all', {
type: 'click',
key: 'pay-successful',
value: "支付成功"
})
})
})
onMounted(() => {
onMounted(() => {
const systemInfo = uni.getSystemInfoSync();
if (systemInfo.statusBarHeight) {
statusBarHeight.value = systemInfo.statusBarHeight;
}
});
});
onShow(() => {
onShow(() => {
loadStorageData();
// #ifdef APP-PLUS
util.setAndroidSystemBarColor('#F5F5F5')
@ -319,22 +319,22 @@
plus.navigator.setStatusBarStyle("light");
}, 500);
// #endif
})
})
const goBack = () => {
const goBack = () => {
uni.navigateBack();
};
};
</script>
<style lang="less" scoped>
@import "@/common/main.css";
@import "@/common/main.css";
.container {
.container {
min-height: 100vh;
background-color: #F5F5F5;
}
}
.header-section {
.header-section {
height: 860rpx;
background: linear-gradient(181deg, #3884FD 60%, rgba(30, 128, 253, 0.5) 81.75%, rgba(30, 128, 253, 0) 100%);
@ -350,31 +350,35 @@
::v-deep .tipLayer {
position: absolute;
}
}
.status-bar {
::v-deep .uni-navbar__header-btns {
width: 100px !important;
}
}
.status-bar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 40rpx;
}
}
.nav-link {
.nav-link {
padding: 0 30rpx;
text-align: right;
font-size: 28rpx;
line-height: 28rpx;
color: #fff;
}
}
.success-info {
.success-info {
display: flex;
flex-direction: column;
align-items: center;
}
}
.pay-success-card {
.pay-success-card {
margin: 24rpx;
margin-top: 16rpx;
background-color: #FFFFFF;
@ -412,9 +416,9 @@
line-height: 20rpx;
}
}
}
}
.status-box {
.status-box {
display: flex;
align-items: center;
margin-top: 10rpx;
@ -432,9 +436,9 @@
font-weight: 500;
line-height: 34rpx;
}
}
}
.amount-box {
.amount-box {
display: flex;
align-items: baseline;
color: #fff;
@ -451,9 +455,9 @@
line-height: 92rpx;
font-weight: 500;
}
}
}
.details-box {
.details-box {
width: 100%;
padding: 0 46rpx;
@ -472,23 +476,23 @@
}
}
}
}
.content-section {
.content-section {
padding: 24rpx;
padding-bottom: 16rpx;
// background-color: #F5F5F5;
border-radius: 30rpx 30rpx 0 0;
}
}
.card {
.card {
background-color: #fff;
border-radius: 20rpx;
margin-bottom: 24rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
}
}
.fliggy-card {
.fliggy-card {
overflow: hidden;
position: relative;
@ -532,9 +536,9 @@
}
}
}
}
.banner-footer {
.banner-footer {
padding: 24rpx;
position: relative;
display: flex;
@ -615,9 +619,9 @@
background-size: contain;
background-repeat: no-repeat;
}
}
}
.footer-section {
.footer-section {
padding: 0px 40rpx 0;
margin-top: 50rpx;
position: absolute;
@ -641,16 +645,16 @@
font-size: 32rpx;
background-color: transparent;
}
}
}
.main-content {
.main-content {
position: absolute;
left: 0;
top: 190px;
width: 100%;
}
}
.promo-card {
.promo-card {
// padding: 30rpx;
margin: 16rpx;
margin-bottom: 10rpx;
@ -758,5 +762,5 @@
border-radius: 26rpx;
}
}
}
}
</style>

6
pages/balance/transfer/transfer.vue
View File

@ -83,7 +83,7 @@
mode="aspectFill"></image>
</view>
<view class="promo-right">
<view class="promo-content" >
<view class="promo-content">
<text class="promo-title">{{ transferData.promoTitle }}</text>
<view class="promo-tags">
<text class="tag">{{ transferData.promoTag }}</text>
@ -677,6 +677,10 @@ const goBack = () => {
::v-deep .tipLayer {
position: absolute;
}
::v-deep .uni-navbar__header-btns {
width: 100px !important;
}
}
.status-bar {

23
pages/other/game/hepingjingying.vue
View File

@ -15,8 +15,7 @@
<l-painter-image :src="bgImage" css="width: 822px; display: block;"></l-painter-image>
<!-- 人物图片 -->
<l-painter-image :src="hePingData.imgUrl" :css="characterStyle"
mode="heightFix"></l-painter-image>
<l-painter-image :src="hePingData.imgUrl" :css="characterStyle"></l-painter-image>
<template v-if="hePingData.type == 2">
<!-- 头像 -->
<l-painter-image :src="hePingData.avatar"
@ -78,7 +77,7 @@
<text>×</text>
</view>
</view>
<view class="upload-btn" v-else @click="handleChooseImgUrl">
<view class="upload-btn" v-else>
<text class="plus">+</text>
</view>
</view>
@ -121,6 +120,7 @@
import { ref, reactive, computed, watch, onMounted, getCurrentInstance } from 'vue'
import { onLoad, onReady, onUnload } from '@dcloudio/uni-app'
import { imgLocal } from '@/utils/common.js';
import NavBar from '@/components/nav-bar/nav-bar.vue';
const instance = getCurrentInstance();
const { proxy } = getCurrentInstance();
@ -177,7 +177,13 @@ onLoad(async () => {
uni.setStorageSync('hePingData', hePingData);
}
}
bgImage.value = await imgLocal.getLocalImage(`other/game/heping/bg-${hePingData.type}.jpg`)
try {
bgImage.value = await imgLocal.getLocalImage(`other/game/heping/bg-${hePingData.type}.jpg`);
} catch (e) {
console.error('获取背景图失败:', e);
uni.showToast({ title: '背景图加载失败', icon: 'none' });
}
uni.$on('editFormPhoto', (info) => {
if (currentEditImgField.value) {
tempData[currentEditImgField.value] = info;
@ -190,12 +196,14 @@ onLoad(async () => {
});
// 进入页面埋点
if (proxy && proxy.$apiUserEvent) {
proxy.$apiUserEvent('all', {
type: 'click',
key: 'heping',
prefix: '.uni.other.',
value: "和平精英"
})
});
}
})
onUnload(() => {
@ -297,7 +305,12 @@ async function handleChangeTheme(typeIndex) {
bgImage.value = ''; // 强制卸载旧画板，确保能重新渲染和生成新海报
hePingData.type = typeIndex;
uni.setStorageSync('hePingData', hePingData);
try {
bgImage.value = await imgLocal.getLocalImage(`other/game/heping/bg-${typeIndex}.jpg`);
} catch (e) {
console.error('切换主题加载背景图失败:', e);
uni.showToast({ title: '背景加载失败', icon: 'none' });
}
}
// 点击画布触发横向预览

23
pages/other/game/wuweiqiyue.vue
View File

@ -15,8 +15,7 @@
<l-painter-image :src="bgImage" css="width: 822px; display: block;"></l-painter-image>
<!-- 人物图片 -->
<l-painter-image :src="wuweiData.imgUrl" :css="characterStyle"
mode="widthFix"></l-painter-image>
<l-painter-image :src="wuweiData.imgUrl" :css="characterStyle"></l-painter-image>
<!-- 击败 -->
<l-painter-text :text="wuweiData.killCount" :css="killCountStyle"></l-painter-text>
<template v-if="wuweiData.type == 1">
@ -99,7 +98,7 @@
<text>×</text>
</view>
</view>
<view class="upload-btn" v-else @click="handleChooseImgUrl">
<view class="upload-btn" v-else>
<text class="plus">+</text>
</view>
</view>
@ -174,6 +173,7 @@
import { ref, reactive, computed, watch, onMounted, getCurrentInstance } from 'vue'
import { onLoad, onReady, onUnload } from '@dcloudio/uni-app'
import { imgLocal } from '@/utils/common.js';
import NavBar from '@/components/nav-bar/nav-bar.vue';
const instance = getCurrentInstance();
const { proxy } = getCurrentInstance();
@ -270,7 +270,13 @@ onLoad(async () => {
uni.setStorageSync('wuweiData', wuweiData);
}
}
bgImage.value = await imgLocal.getLocalImage(`other/game/wuwei/bg-${wuweiData.type}.jpg`)
try {
bgImage.value = await imgLocal.getLocalImage(`other/game/wuwei/bg-${wuweiData.type}.jpg`);
} catch (e) {
console.error('获取背景图失败:', e);
uni.showToast({ title: '背景图加载失败', icon: 'none' });
}
uni.$on('editFormPhoto', (info) => {
if (currentEditImgField.value) {
tempData[currentEditImgField.value] = info;
@ -283,12 +289,14 @@ onLoad(async () => {
});
// 进入页面埋点
if (proxy && proxy.$apiUserEvent) {
proxy.$apiUserEvent('all', {
type: 'click',
key: 'wuwei',
prefix: '.uni.other.',
value: "无畏契约"
})
});
}
})
onUnload(() => {
@ -391,7 +399,12 @@ async function handleChangeTheme(typeIndex) {
bgImage.value = ''; // 强制卸载旧画板，确保能重新渲染和生成新海报
wuweiData.type = typeIndex;
uni.setStorageSync('wuweiData', wuweiData);
try {
bgImage.value = await imgLocal.getLocalImage(`other/game/wuwei/bg-${typeIndex}.jpg`);
} catch (e) {
console.error('切换主题加载背景图失败:', e);
uni.showToast({ title: '背景加载失败', icon: 'none' });
}
}
// 点击画布触发横向预览

177
pages/other/train-tickets/ctrip-train-tickets/ctrip-train-tickets.vue
View File

@ -20,22 +20,26 @@
<template v-slot:center>
<view class="codefun-flex-row">
<text class="text">订单</text>
<text class="text_2 ml-15">行程服务</text>
<text class="text_2 ml-15">{{ ticketsInfo.status == '已出行' ? '推荐' : '行程服务' }}</text>
</view>
</template>
<template v-slot:right>
<view class="codefun-flex-col pos_2">
<view class="codefun-flex-row">
<view class="codefun-flex-row" style="margin-right: 10px;">
<view class="codefun-flex-col codefun-items-center">
<image class="image_5" src="/static/image/other/train-tickets/ctrip/customer-sevice.png" />
<text class="font text_3">客服</text>
</view>
<view class="codefun-flex-col codefun-items-center"
style="margin-left: 16rpx;margin-right: 10px;">
<view class="codefun-flex-col codefun-items-center" style="margin-left: 16rpx;">
<image class="image_5"
src="/static/image/other/train-tickets/ctrip/refund-instructions.png" />
<text class="font text_3">退改说明</text>
</view>
<view v-if="ticketsInfo.status == '已出行'" class="codefun-flex-col codefun-items-center"
style="margin-left: 16rpx;">
<image class="image_5" src="/static/image/other/train-tickets/ctrip/fenxiang.png" />
<text class="font text_3">分享</text>
</view>
</view>
</view>
</template>
@ -47,8 +51,10 @@
<view class="codefun-flex-row group_5">
<image class="image_8" src="/static/image/other/train-tickets/ctrip/success.png" />
<view class="codefun-flex-col codefun-items-start group_33 codefun-ml-10">
<text class="text_5">抢票成功</text>
<text class="font_2 text_6 codefun-mt-8">携程祝您出行愉快</text>
<text class="text_5">{{ ticketsInfo.status || '抢票成功' }}</text>
<text class="font_2 text_6 codefun-mt-8">{{ ticketsInfo.status == '已出行' ? '携程已为您完成本次预定' :
'携程祝您出行愉快'
}}</text>
</view>
</view>
<image class="image_7" src="/static/image/other/train-tickets/ctrip/buy-return-trip.png" />
@ -66,9 +72,13 @@
<view class="main-container">
<view class="codefun-flex-col codefun-justify-start section_3">
<view class="codefun-flex-row codefun-justify-between codefun-items-center section_4">
<text class="text_8">注意确认行程信息</text>
<text v-if="ticketsInfo.status == '抢票成功'" class="text_8">注意确认行程信息</text>
<view v-else class="codefun-flex-col codefun-items-start">
<text class="text_8">行程已结束</text>
<text class="text_8" style="font-size: 14px;font-weight: 400;margin-top: 6px;">感谢您使用携程火车票</text>
</view>
<view class="codefun-flex-col">
<view class="codefun-flex-row group_6">
<view v-if="ticketsInfo.status == '抢票成功'" class="codefun-flex-row group_6">
<view class="item-box codefun-flex-col codefun-items-center">
<image class="image_6" src="/static/image/other/train-tickets/ctrip/zaixianhuanzuo.png" />
<text class="font_3 text_9 mt-5">在线换座</text>
@ -84,6 +94,18 @@
<text class="font_3 text_11 ml-11 mt-5">分享行程</text>
</view>
</view>
<view v-if="ticketsInfo.status == '已出行'" class="codefun-flex-row group_6">
<view class="item-box codefun-flex-col codefun-items-center">
<image class="image_6 ml-11"
src="/static/image/other/train-tickets/ctrip/jiesongzhan.png" />
<text class="font_3 text_10 ml-11 mt-5">接送站</text>
</view>
<view class="item-box codefun-flex-col codefun-items-center">
<image class="image_6 ml-11"
src="/static/image/other/train-tickets/ctrip/fapiaobaoxiao-yichuxing.png" />
<text class="font_3 text_11 ml-11 mt-5">发票报销</text>
</view>
</view>
</view>
</view>
</view>
@ -92,7 +114,8 @@
<view class="codefun-flex-col group_8">
<view class="codefun-flex-row codefun-justify-between" style="width: 100%;">
<text class="font_6 text_12">取票号：{{ ticketsInfo.orderInfo.orderNo }}</text>
<text class="font_5 text_13">{{ ticketsInfo.ticketInfo.gate }}</text>
<text v-if="ticketsInfo.status == '抢票成功'" class="font_5 text_13">
{{ ticketsInfo.ticketInfo.gate }}</text>
</view>
<view class="codefun-flex-row codefun-justify-between codefun-self-stretch group_9">
<view class="codefun-flex-col">
@ -122,7 +145,7 @@
</view>
<view class="codefun-flex-row codefun-items-center">
<text class="font_9 text_19">{{ ticketsInfo.ticketInfo.trainNo }}</text>
<view v-if="ticketsInfo.ticketInfo.trainName"
<view v-if="ticketsInfo.ticketInfo.trainName && ticketsInfo.status == '抢票成功'"
class="codefun-flex-row codefun-items-center train-name">
<text class="font_6">{{ ticketsInfo.ticketInfo.trainName }}</text>
<uni-icons type="right" size="10" color="#767676"></uni-icons>
@ -162,15 +185,16 @@
</view>
<view class="codefun-flex-row codefun-justify-between codefun-mt-8">
<view class="codefun-flex-row codefun-items-center">
<image class="image_15"
<image v-show="Number(item.points) > 0" class="image_15"
src="/static/image/other/train-tickets/ctrip/jifen.png" />
<view class="group_17">
<view v-show="Number(item.points) > 0" class="group_17">
<text class="font_13">铁路会员积分+{{ item.points }}(价值</text>
<text class="font_14 text_24">¥{{ (item.points *
0.01).toFixed(2) }}</text>
<text class="font_13 text_24 text_25">)</text>
</view>
<image class="image_16"
<image v-show="Number(item.points) > 0" class="image_16"
style="margin-top: 2px;"
src="/static/image/other/train-tickets/ctrip/help.png" />
</view>
<view class="codefun-flex-row codefun-items-center">
@ -182,8 +206,10 @@
</view>
</view>
<view class="codefun-flex-row codefun-justify-between codefun-items-center">
<text class="success-text">购票成功</text>
<view class="codefun-flex-row codefun-justify-end group_18">
<text class="success-text"
:style="{ 'margin-top': Number(item.points) > 0 ? '0px' : '-60px' }">购票成功</text>
<view class="codefun-flex-row codefun-justify-end group_18 "
:class="{ yichuxing: ticketsInfo.status == '已出行' }">
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2">
<text class="font_16 text_28">改签</text>
@ -192,7 +218,7 @@
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3 ml-7">
<text class="font_16 text_29">退票</text>
</view>
<view v-if="item.isMe"
<view v-if="item.isMe && ticketsInfo.status == '抢票成功'"
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_1 ml-7">
<text class="font_17 text_30">扫码检票</text>
</view>
@ -278,27 +304,64 @@
</view>
</view>
<!-- 样式选择弹窗 -->
<uni-popup ref="stylePopup" type="center">
<view class="style-popup-container">
<view class="popup-title">选择展示样式</view>
<view class="popup-list">
<view class="popup-item" @click="selectStyle('抢票成功')">
<text class="item-text">抢票成功 (默认)</text>
<uni-icons v-if="ticketsInfo.status === '抢票成功' || !ticketsInfo.status" type="checkmarkempty"
color="#3B82F6" size="20"></uni-icons>
</view>
<view class="popup-item" @click="selectStyle('已出行')">
<text class="item-text">已出行</text>
<uni-icons v-if="ticketsInfo.status === '已出行'" type="checkmarkempty" color="#3B82F6"
size="20"></uni-icons>
</view>
</view>
<view class="popup-cancel" @click="closeStylePopup">取消</view>
</view>
</uni-popup>
</template>
<script setup>
import NavBar from '@/components/nav-bar/nav-bar.vue';
import { reactive, toRefs } from 'vue';
import { reactive, toRefs, ref } from 'vue';
import { onShow, onPageScroll } from '@dcloudio/uni-app';
import { util } from '@/utils/common.js';
const buttonGroup = [{
const buttonGroup = [
{
name: "编辑车票信息",
click: () => {
goEdit()
}
}]
}, {
name: "切换样式",
click: () => {
stylePopup.value.open();
}
}
]
const stylePopup = ref(null);
function goEdit() {
util.goPage(`/pages/other/train-tickets/edit/edit?app=ctrip&storageKey=${data.STORAGE_KEY}`)
}
const selectStyle = (status) => {
data.ticketsInfo.status = status;
uni.setStorageSync(data.STORAGE_KEY, data.ticketsInfo);
stylePopup.value.close();
}
const closeStylePopup = () => {
stylePopup.value.close();
}
const data = reactive({
navBar: {
bgColor: 'transparent'
@ -312,6 +375,7 @@ const data = reactive({
],
STORAGE_KEY: 'ctripTrainTicketsInfo',
ticketsInfo: {
"status": "抢票成功",
"orderInfo": {
"orderNo": "EJ66223536",
"price": "4440"
@ -961,6 +1025,33 @@ const formatMMDD = (mdStr) => {
}
}
&.yichuxing {
.text-wrapper_2 {
background-color: #FFFFFF;
border-radius: 6px;
width: 45px;
height: 28px;
border: solid 0.5px #e0e4e3;
}
.text-wrapper_3 {
background-color: #ffffff;
border-radius: 6px;
width: 45px;
height: 28px;
border: solid 0.5px #e0e4e3;
}
.font_16 {
font-size: 13px;
line-height: 28px;
font-weight: 500;
color: #D0D0D0;
}
}
}
}
}
@ -1227,4 +1318,50 @@ const formatMMDD = (mdStr) => {
}
}
}
.style-popup-container {
width: 300px;
background-color: #ffffff;
border-radius: 12px;
padding-bottom: 1px;
.popup-title {
text-align: center;
font-size: 16px;
font-weight: bold;
color: #333333;
padding: 20px 0 10px;
}
.popup-list {
padding: 0 20px;
.popup-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 0;
border-bottom: 1px solid #f0f0f0;
&:last-child {
border-bottom: none;
}
.item-text {
font-size: 15px;
color: #333333;
}
}
}
.popup-cancel {
margin: 15px 20px 20px;
background-color: #f5f5f5;
border-radius: 8px;
text-align: center;
padding: 12px 0;
font-size: 15px;
color: #666666;
}
}
</style>

BIN
static/image/other/train-tickets/ctrip/fapiaobaoxiao-yichuxing.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/ctrip/fenxiang.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
static/image/other/train-tickets/ctrip/jiesongzhan.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB