This commit is contained in:
2025-11-26 17:48:27 +08:00
parent 1244226bde
commit 862bb8e84e
2 changed files with 65 additions and 44 deletions

View File

@@ -19,8 +19,8 @@ const service = axios.create({
// baseURL: 'https://submission.tmrjournals.com/', //正式 记得切换
// baseURL: 'http://www.tougao.com/', //测试本地 记得切换
// baseURL: 'http://192.168.110.110/tougao/public/index.php/',
// baseURL: '/api', //本地
baseURL: '/', //正式
baseURL: '/api', //本地
// baseURL: '/', //正式
});

View File

@@ -1,28 +1,42 @@
<template>
<div class="success-box" v-if="articleInfo&&(articleInfo.state==0||articleInfo.state==1)">
<div :class="{'payment-success': articleInfo.state==1, 'payment-failed': articleInfo.state==0}">
<div class="success-box" v-if="articleInfo && (articleInfo.state == 0 || articleInfo.state == 1)">
<div :class="{ 'payment-success': articleInfo.state == 1, 'payment-failed': articleInfo.state == 0 }">
<div style="display: flex; align-items: center; margin-bottom: 10px">
<h2 style="margin: 0 auto; display: flex; align-items: center">
<img v-if="articleInfo.state==1" src="@/assets/img/success.png" alt="" style="margin-right: 20px; width: 128px; height: 128px" />
<img v-if="articleInfo.state==0" src="@/assets/img/error.png" alt="" style="margin-right: 20px; width: 128px; height: 128px" />
{{ articleInfo.state==1 ? 'Payment Successful' : 'Payment Failed' }}
</h2>
<img
v-if="articleInfo.state == 1"
src="@/assets/img/success.png"
alt=""
style="margin-right: 20px; width: 128px; height: 128px"
/>
<img
v-if="articleInfo.state == 0"
src="@/assets/img/error.png"
alt=""
style="margin-right: 20px; width: 128px; height: 128px"
/>
{{ articleInfo.state == 1 ? 'Payment Successful' : 'Payment Failed' }}
</h2>
</div>
<p v-if="articleInfo.state==1">Thank you for your payment. Your order has been successfully processed.</p>
<p v-if="articleInfo.state == 1">Thank you for your payment. Your order has been successfully processed.</p>
<p v-else>We are sorry, but your payment has failed. Please try again.</p>
<!-- <p>
Article ID:
<span style="color: #333; font-weight: 600"> {{ articleInfo.order_sn }}</span>
</p> -->
<p v-if="articleInfo.state==1">
<p v-if="articleInfo.state == 1">
Total Amount: <span style="color: #ff5000"></span
><span style="color: #ff5000; font-size: 24px; line-height: 24px">{{ formatAmount(total) }} <span class="" style="font-size: 20px;">{{ articleInfo.paystation.currency }}</span></span>
><span style="color: #ff5000; font-size: 24px; line-height: 24px"
>{{ formatAmount(total) }} <span class="" style="font-size: 20px">{{ articleInfo.currency }}</span></span
>
</p>
<!-- <p>Payment Method: {{ paymentMethod }}</p> -->
<p v-if="articleInfo.state==1">You will receive an email confirmation shortly.</p>
<button @click="goBack" :class="articleInfo.state==1?'btn-success':'btn-danger'">Continue Operation</button>
<p :style="articleInfo.state==1?'color:#67c23a':'color:#F56C6C'" style="font-size: 13px; line-height: 40px">Automatically jump after {{ hideSec }} seconds</p>
<p v-if="articleInfo.state == 1">You will receive an email confirmation shortly.</p>
<button @click="goBack" :class="articleInfo.state == 1 ? 'btn-success' : 'btn-danger'">Continue Operation</button>
<p :style="articleInfo.state == 1 ? 'color:#67c23a' : 'color:#F56C6C'" style="font-size: 13px; line-height: 40px">
Automatically jump after {{ hideSec }} seconds
</p>
</div>
</div>
</template>
@@ -33,7 +47,7 @@ export default {
return {
alertShow: true,
urlList: {
detail: 'api/Preaccept/getPreacceptPayment',
detail: 'api/Order/PaystationLookup',
createdOrder: 'api/Order/creatArticleOrder'
},
articleInfo: {},
@@ -41,26 +55,25 @@ export default {
total: '',
articleId: this.$route.query.id,
dingshi: null,
hideSec: 5
hideSec: 10
};
},
created() {
this.getDetail();
},
mounted() {
this.hideAlert();
},
methods: {
hideAlert() {
this.dingshi = setInterval(() => {
this.dingshi = setInterval(() => {
this.hideSec -= 1;
if (this.hideSec == 1) {
this.goBack();
return false
return false;
}
// console.log(this.hideSec)
}, 1000);
},
formatAmount(amount) {
@@ -80,15 +93,24 @@ export default {
.then((res) => {
console.log('res at line 191:', res);
if (res.code == 0) {
this.hideAlert();
setTimeout(() => {
if (res.data.result == 'success') {
this.articleInfo = res.data.paystation;
this.articleInfo.state = 1;
this.total = Number(this.articleInfo.amount / 100);
} else if (res.data.result == 'fail') {
this.articleInfo.state = 0;
this.$forceUpdate();
}
loading.close();
this.articleInfo = res.data.order;
this.total = Number(res.data.order.paystation.amount / 100);
}, 1000);
} else {
loading.close();
this.$message.error(res.msg);
}
}).catch(() => {
})
.catch(() => {
loading.close();
});
},
@@ -112,9 +134,9 @@ export default {
this.$router.replace({ name: 'success' });
this.$router.push({
path: '/PreIngested',
query:{
id: id
}
query: {
id: id
}
});
// }
//
@@ -144,7 +166,7 @@ export default {
background-color: #fff;
border: 1px solid #fcc3c3;
border-radius: 16px;
color: #F56C6C;
color: #f56c6c;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
width: 600px;
}
@@ -159,7 +181,7 @@ p {
button {
padding: 10px 20px;
color: #fff;
border: none;
border-radius: 5px;
@@ -167,20 +189,19 @@ button {
margin-top: 20px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* 按钮添加阴影效果 */
}
.btn-success{
background-color: #00c286;
}
.btn-danger{
background-color: #F56C6C;
}
.btn-success:hover{
background-color: #00c286;
}
.btn-danger:hover{
background-color: #F56C6C;
}
.btn-success {
background-color: #00c286;
}
.btn-danger {
background-color: #f56c6c;
}
.btn-success:hover {
background-color: #00c286;
}
.btn-danger:hover {
background-color: #f56c6c;
}
button:hover {
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* 按钮悬停时的阴影效果 */
}
.success-box {