|
|
@@ -5,7 +5,7 @@
|
|
|
<view class="timer-text">请在<text style="color: #FB5B5B;">{{ downTime }}</text>内支付</view>
|
|
|
<view class="timer-btn">
|
|
|
<view class="cancel-btn" @click="cancelOrder(orderDetailInfo?.id)">取消订单</view>
|
|
|
- <view class="pay-btn">立即支付¥119</view>
|
|
|
+ <view class="pay-btn" @click="submitPay(orderDetailInfo?.id)">立即支付¥{{ orderDetailInfo?.price }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="t-header" v-else>
|
|
|
@@ -71,21 +71,21 @@
|
|
|
orderDetailInfo?.proInfoList?.length }}</text></view>
|
|
|
<!-- refundType:退款类型;0可退/到期自动退 1限时退 2不可退" -->
|
|
|
<view class="shoping-refund" v-if="orderDetailInfo?.runType == 0">全天</view>
|
|
|
- <view class="shoping-refund" v-else>
|
|
|
- <!-- {{ DateUtils.formatDateToHHmm(orderDetailInfo?.createTime) + '-' +DateUtils.formatDateToHHmm(orderDetailInfo?.endTime) }} -->
|
|
|
+ <view class="shoping-refund"
|
|
|
+ v-if="orderDetailInfo?.runType != null && orderDetailInfo?.runType != 0">
|
|
|
{{ orderDetailInfo?.startTime }}-{{ orderDetailInfo?.endTime }}
|
|
|
</view>
|
|
|
<view class="shoping-refund" style="display: flex;align-items: center;"
|
|
|
v-if="orderDetailInfo?.gameScheduleNum"
|
|
|
@click="RouterUtils.to_page(`/pages/index/gamePlan/index?orderId=${orderDetailInfo?.id}`)">
|
|
|
- <text>篮球赛</text>
|
|
|
+ <text>{{ orderDetailInfo?.appGameScheduleVOList[0].name }}</text>
|
|
|
<text>{{ orderDetailInfo?.gameScheduleNum }}场</text>
|
|
|
<zzx-icon name="ashRight" size="10"></zzx-icon>
|
|
|
</view>
|
|
|
<view class="shoping-refund">
|
|
|
<!-- 退款类型;0可退/到期自动退 1限时退 2不可退-->
|
|
|
- <text v-if="orderDetailInfo?.refundType == 0|| orderDetailInfo?.refundType == 1">随时退·过期退</text>
|
|
|
- <text v-if="orderDetailInfo?.refundType == 2">不支持退款</text>
|
|
|
+ <text v-if="orderDetailInfo?.refundType == 0 || orderDetailInfo?.refundType == 1">随时退·过期退</text>
|
|
|
+ <text v-if="orderDetailInfo?.refundType == 2">不支持退款</text>
|
|
|
</view>
|
|
|
<view class="shoping-price" @click="pricePopup.open()">
|
|
|
<view class="price">¥{{ orderDetailInfo?.totalPrice.toFixed(2) }}</view>
|
|
|
@@ -113,11 +113,21 @@
|
|
|
<button class="g-share-btn" open-type="share"></button>
|
|
|
邀请好友报名
|
|
|
</view>
|
|
|
+ <view class="t-shoping-address-eventInfo" v-if="countdownVisible&&orderDetailInfo?.orderType==3||orderDetailInfo?.orderType==4">
|
|
|
+ <view class="time">{{ days }}</view>
|
|
|
+ <view class="unit">天</view>
|
|
|
+ <view class="time">{{ hours }}</view>
|
|
|
+ <view class="unit">:</view>
|
|
|
+ <view class="time">{{ minutes }}</view>
|
|
|
+ <view class="unit">:</view>
|
|
|
+ <view class="time">{{ seconds }}</view>
|
|
|
+ <view class="">后比赛开始</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 待使用展示 -->
|
|
|
<view class="t-qrcode-card"
|
|
|
- v-if="orderPageInfo?.orderType == 2 || orderPageInfo?.orderType == 5 || orderPageInfo?.orderType == 1 || orderPageInfo?.orderType == 3 || orderPageInfo?.orderType == 4&&orderDetailInfo?.orderStatus!=0">
|
|
|
- <block v-if="orderDetailInfo?.orSchoolCourse != 1">
|
|
|
+ v-if="orderPageInfo?.orderType == 0 || orderPageInfo?.orderType == 2 || orderPageInfo?.orderType == 5 || orderPageInfo?.orderType == 1 || orderPageInfo?.orderType == 3 || orderPageInfo?.orderType == 4 && orderDetailInfo?.orderStatus != 0">
|
|
|
+ <block v-if="orderDetailInfo?.orSchoolCourse != 1 && hasPendingUsageItems && orderPageInfo?.orderType != 0">
|
|
|
<view class="qrcode-box">
|
|
|
<view class="item-qrcode">
|
|
|
<uv-qrcode ref="qrcode" size="100px" :value="orderDetailInfo?.id"></uv-qrcode>
|
|
|
@@ -125,7 +135,7 @@
|
|
|
</view>
|
|
|
<view class="download-qrcode" @click="download_qrcode">下载到手机</view>
|
|
|
</block>
|
|
|
- <view v-else style="color: #222;font-size: 26rpx;">通过学校门口闸机时,通过人脸自动核验</view>
|
|
|
+ <view v-if="orderDetailInfo?.orderType == 0" style="color: #222;font-size: 26rpx;">通过学校门口闸机时,通过人脸自动核验</view>
|
|
|
<view class="t-todeused">
|
|
|
<view class="todeused">
|
|
|
<view class="text">{{ orderDetailInfo?.orderStatus }}</view>
|
|
|
@@ -137,12 +147,12 @@
|
|
|
</view>
|
|
|
<!-- orderStatus:0-待付款 1-待使用 2-已使用 3-已到期 4-已取消 5-退款中 6已退款 -->
|
|
|
<!-- type:0-学校 1-包场 2-无固定场 3-个人赛 4-团队赛 5-课程 6-保险 -->
|
|
|
- <view class="order-num" v-for="item in orderDetailInfo?.proInfoList" :key="item.id">
|
|
|
+ <view class="order-num" v-for="(item, index) in orderDetailInfo?.proInfoList" :key="item.id"
|
|
|
+ @click="RouterUtils.to_page(`/pages/index/tryUseRecord/index?ticketNo=${item.ticketNo}&proInfoList=${JSON.stringify(orderDetailInfo?.proInfoList)}&selectValue=${index}`)">
|
|
|
<text v-if="item.type != 6">{{ item.ticketNo }} {{ item.userName }}</text>
|
|
|
<zzx-icon v-if="item.type != 6" name="ashRight" size="12"></zzx-icon>
|
|
|
<!-- <view v-if="item.type != 6" class="t-use-status">{{ getStatusText(item.orderStatus) }}</view> -->
|
|
|
- <text v-if="item.type != 6&&orderPageInfo?.orderType == 1">{{ item.expireTime }}到期</text>
|
|
|
- <!-- 体育馆包场和无固定场 -->
|
|
|
+ <text v-if="item.type != 6 && orderPageInfo?.orderType == 1">{{ item.expireTime }}到期</text>
|
|
|
<!-- <view>申请退款</view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -188,7 +198,8 @@
|
|
|
<view class="t-address-card">
|
|
|
<view class="address">
|
|
|
<zzx-icon name="location"></zzx-icon>
|
|
|
- <view class="">{{ orderDetailInfo?.courseSiteAddress || orderDetailInfo?.schoolAddress||orderDetailInfo?.gameAddress }}</view>
|
|
|
+ <view class="">{{ orderDetailInfo?.courseSiteAddress ||
|
|
|
+ orderDetailInfo?.schoolAddress || orderDetailInfo?.gameAddress }}</view>
|
|
|
</view>
|
|
|
<view class="nav-info">
|
|
|
<view class="nav" @click="open_map">
|
|
|
@@ -224,7 +235,8 @@
|
|
|
<view class="insureOrder-title">被保人</view>
|
|
|
<view class="insureOrder-text" v-if="orderDetailInfo?.insureOrderInfoList">
|
|
|
{{ orderDetailInfo?.insureOrderInfoList.length }}人(<text
|
|
|
- v-for="(name,index) in orderDetailInfo?.insureOrderInfoList" :key="name.id">{{ name.familyUserName
|
|
|
+ v-for="(name, index) in orderDetailInfo?.insureOrderInfoList" :key="name.id">{{
|
|
|
+ name.familyUserName
|
|
|
}}{{ index < orderDetailInfo?.insureOrderInfoList.length - 1 ? ',' : '' }}</text>)</view>
|
|
|
</view>
|
|
|
<view class="t-use-insureOrder">
|
|
|
@@ -242,7 +254,8 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="t-use-card" v-if="orderPageInfo?.orderType == 5 && queryWaitSignList?.length > 0&&orderDetailInfo?.orderStatus!=0">
|
|
|
+ <view class="t-use-card"
|
|
|
+ v-if="orderPageInfo?.orderType == 5 && queryWaitSignList?.length > 0 && orderDetailInfo?.orderStatus != 0">
|
|
|
<view class="use-tips t-contract-list">
|
|
|
<view class="title">电子合同</view>
|
|
|
<view class="text contract-list">
|
|
|
@@ -315,8 +328,9 @@
|
|
|
@click="RouterUtils.to_page(`/pages/index/gameResult/index?orderId=${orderDetailInfo?.id}`)">查看成绩</view>
|
|
|
</view>
|
|
|
<!-- 已使用展示 -->
|
|
|
- <view class="appraise-btn" v-if="orderPageInfo?.orderType != 3 && orderDetailInfo?.orderStatus == '已使用'"
|
|
|
- @click="RouterUtils.to_page(`/pages/index/writeComments/index?siteId=${orderDetailInfo?.addressSiteId}&orderId=${orderDetailInfo?.id}`)">
|
|
|
+ <view class="appraise-btn"
|
|
|
+ v-if="orderPageInfo?.orderType != 3 && orderDetailInfo?.orderStatus == '已使用' && orderDetailInfo?.orEvaluate == 0 && orderDetailInfo?.type != 3 && orderDetailInfo?.type != 4"
|
|
|
+ @click="RouterUtils.to_page(`/pages/index/writeComments/index?siteId=${orderDetailInfo?.addressSiteId}&orderId=${orderDetailInfo?.id}&siteName=${orderDetailInfo?.siteName}`)">
|
|
|
写评价
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -406,9 +420,9 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { ref, onMounted } from 'vue';
|
|
|
+import { ref, onMounted, computed } from 'vue';
|
|
|
import { TipsUtils, RouterUtils, DateUtils, _previewImage, fixImgStyle } from '@/utils/util'
|
|
|
-import { onLoad, onShow, onShareAppMessage } from '@dcloudio/uni-app';
|
|
|
+import { onLoad, onShow, onShareAppMessage, onUnload } from '@dcloudio/uni-app';
|
|
|
import { http } from '@/utils/http'
|
|
|
import zsLoading from '@/components/zzx-loading/zzx-loading.vue'
|
|
|
const qrcode = ref();
|
|
|
@@ -423,6 +437,15 @@ onLoad((option) => {
|
|
|
onShow(() => {
|
|
|
getOrderDetailInfo()
|
|
|
})
|
|
|
+onUnload(() => {
|
|
|
+ console.log('点击了返回按钮');
|
|
|
+ if (orderPageInfo.value.isPayOrder != 1) {
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/index/index'
|
|
|
+ });
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+});
|
|
|
onShareAppMessage((res) => {
|
|
|
if (res.from === 'button') {// 来自页面内分享按钮
|
|
|
console.log(res.target)
|
|
|
@@ -447,6 +470,15 @@ const statusMap = {
|
|
|
5: '退款中'
|
|
|
}
|
|
|
|
|
|
+// 判断是否有待使用的项目
|
|
|
+const hasPendingUsageItems = computed(() => {
|
|
|
+ if (!orderDetailInfo.value?.proInfoList || !Array.isArray(orderDetailInfo.value.proInfoList)) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ // 检查是否有任意一项的orderStatus为1(待使用)
|
|
|
+ return orderDetailInfo.value.proInfoList.some(item => item.orderStatus === 1);
|
|
|
+});
|
|
|
+
|
|
|
// 获取状态文本的函数
|
|
|
const getStatusText = (status: number): string => {
|
|
|
return statusMap[status as keyof typeof statusMap] || ''
|
|
|
@@ -565,6 +597,13 @@ const getOrderDetailInfo = (() => {
|
|
|
gameCertificationList.value = JSON.parse(res.result.gameCertification || '{}')
|
|
|
loading.value = false
|
|
|
getQueryWaitSignList(res.result.id)
|
|
|
+ // 初始化倒计时(如果订单类型是比赛相关)
|
|
|
+ if ((res.result.orderType == 3 || res.result.orderType == 4) && res.result.appGameScheduleVOList?.length > 0) {
|
|
|
+ const gameStartTime = res.result.gameStartTime;
|
|
|
+ if (gameStartTime) {
|
|
|
+ startCountdown(gameStartTime);
|
|
|
+ }
|
|
|
+ }
|
|
|
})
|
|
|
})
|
|
|
|
|
|
@@ -602,6 +641,116 @@ const downTimeFun = () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+// ==================赛事倒计时start==================
|
|
|
+// 添加倒计时相关响应式数据
|
|
|
+const countdownVisible = ref(false);
|
|
|
+const days = ref('00');
|
|
|
+const hours = ref('00');
|
|
|
+const minutes = ref('00');
|
|
|
+const seconds = ref('00');
|
|
|
+let countdownTimer: any = null;
|
|
|
+// 添加倒计时函数
|
|
|
+const startCountdown = (startTime: string) => {
|
|
|
+ const startDate = new Date(startTime);
|
|
|
+ startDate.setHours(0, 0, 0, 0);
|
|
|
+ const now = new Date();
|
|
|
+ let timeDifference = startDate.getTime() - now.getTime();
|
|
|
+ if (timeDifference <= 0) {
|
|
|
+ countdownVisible.value = false;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ countdownVisible.value = true;
|
|
|
+ // 清除之前的定时器
|
|
|
+ if (countdownTimer) {
|
|
|
+ clearInterval(countdownTimer);
|
|
|
+ }
|
|
|
+ // 立即更新一次显示
|
|
|
+ updateCountdown(timeDifference);
|
|
|
+ countdownTimer = setInterval(() => {
|
|
|
+ timeDifference = startDate.getTime() - new Date().getTime();
|
|
|
+
|
|
|
+ if (timeDifference <= 0) {
|
|
|
+ clearInterval(countdownTimer);
|
|
|
+ countdownVisible.value = false;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ updateCountdown(timeDifference);
|
|
|
+ }, 1000);
|
|
|
+};
|
|
|
+// ==================赛事倒计时end==================
|
|
|
+// 更新倒计时显示
|
|
|
+const updateCountdown = (timeDifference: number) => {
|
|
|
+ // 计算天、小时、分钟、秒
|
|
|
+ const totalSeconds = Math.floor(timeDifference / 1000);
|
|
|
+ const totalMinutes = Math.floor(totalSeconds / 60);
|
|
|
+ const totalHours = Math.floor(totalMinutes / 60);
|
|
|
+ const totalDays = Math.floor(totalHours / 24);
|
|
|
+
|
|
|
+ days.value = totalDays.toString().padStart(2, '0');
|
|
|
+ hours.value = (totalHours % 24).toString().padStart(2, '0');
|
|
|
+ minutes.value = (totalMinutes % 60).toString().padStart(2, '0');
|
|
|
+ seconds.value = (totalSeconds % 60).toString().padStart(2, '0');
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+// ==================提交支付start==================
|
|
|
+const orderCode = ref()
|
|
|
+const orderId = ref()
|
|
|
+const submitPay = (e: any) => {
|
|
|
+ http.put(`/order/payOrder?appOrderId=${e}`, {}, { loading: true }).then((res) => {
|
|
|
+ orderCode.value = res.result.orderCode
|
|
|
+ orderId.value = res.result.orderId
|
|
|
+ paymentOrder(res.result.params)
|
|
|
+ })
|
|
|
+}
|
|
|
+const paymentOrder = (payInfo: object) => {
|
|
|
+ // getOrderQuery(orderCode.value, orderId.value)
|
|
|
+ console.log(payInfo, '支付参数');
|
|
|
+ uni.requestPayment({
|
|
|
+ provider: 'wxpay',
|
|
|
+ ...payInfo,
|
|
|
+ success: function (res) {
|
|
|
+ console.log('支付成功', res);
|
|
|
+ getOrderQuery(orderCode.value, orderId.value)
|
|
|
+ },
|
|
|
+ fail: function (err) {
|
|
|
+ console.log('支付失败', err);
|
|
|
+ // TipsUtils.tips_toast('支付失败,请稍后重试');
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+const getOrderQuery = (orderCode: string, orderId: string, retryCount = 0) => {
|
|
|
+ http.get('/order/orderQuery', { data: { orderCode: orderCode }, loading: true }).then((res) => {
|
|
|
+ if (res.result == '100001') {
|
|
|
+ TipsUtils.tips_toast('支付成功');
|
|
|
+ getOrderDetailInfo()
|
|
|
+ } else if (retryCount <= 3) {
|
|
|
+ setTimeout(() => {
|
|
|
+ getOrderQuery(orderCode, orderId, retryCount + 1)
|
|
|
+ }, 1000)
|
|
|
+ } else {
|
|
|
+ if (res.result == '100003') {
|
|
|
+ console.log('查询中,但已达到最大查询次数')
|
|
|
+ } else if (res.result == '100002') {
|
|
|
+ console.log('查询失败')
|
|
|
+ } else if (res.result == '100004') {
|
|
|
+ console.log('支付失败')
|
|
|
+ TipsUtils.tips_toast('支付失败')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ console.error('查询订单失败:', error)
|
|
|
+ if (retryCount < 2) {
|
|
|
+ setTimeout(() => {
|
|
|
+ getOrderQuery(orderCode, orderId, retryCount + 1)
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+// ==================提交支付end==================
|
|
|
+
|
|
|
// 取消订单
|
|
|
const cancelOrder = async (e: any) => {
|
|
|
let res: any = await TipsUtils.tips_alert('确定取消订单吗?', true)
|
|
|
@@ -980,6 +1129,28 @@ const getSignUrl = (signFlowId: string) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .t-shoping-address-eventInfo {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 8rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ border-top: 1rpx solid #F0F0F0;
|
|
|
+ height: 80rpx;
|
|
|
+
|
|
|
+ .time {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background: rgba(200, 255, 12, 0.5);
|
|
|
+ border-radius: 16rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 60rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.t-invite {
|
|
|
margin-top: 24rpx;
|
|
|
font-size: 28rpx;
|