<template>
<view>
<view class="center">
<view class="orderStat">
<uni-icons type="checkmarkempty" style="font-weight: bold;" size="30" color="#18bc37" />
</view>
<text class="state">xxxx</text>
<text class="num">{{(data.payerAmount / 100).toFixed(2)}}元</text>
<view class="orderInfo">
<view class="item">
<text>xxxx</text>
<text>{{data.xxx}}</text>
</view>
<view class="item">
<text>xxx</text>
<text>{{data.xxx}}</text>
</view>
<view class="item">
<text>xxxx</text>
</view>
<view class="item">
<text>xxxx</text>
</view>
<view class="item">
<text>xxxx</text>
</view>
</view>
<view class="isButton">
<view class="button" @click="toPage" :plain="true">返回首页</view>
</view>
<view class="time">
<uni-countdown :font-size="30" :day="1" :hour="2" :minute="30" :second="3700" color="#FFFFFF"
background-color="#18bc37" />
</view>
<view class="wweek">
{{getTime()}}
</view>
</view>
</view>
</template>
<script>
import tip from '@/utils/tip';
export default {
data() {
return {
data: null,
isUrl: "",
linkedSalesmanId:0,
data: {
oilName:"--",
orderNo:"--",
amount:0,
wholeDiscount:0,
payerAmount:0
},
};
},
onLoad(options) {
const script = document.createElement('script')
script.src = 'https://wx.gtimg.com/pay_h5/goldplan/js/jgoldplan-1.0.0.js'
document.head.appendChild(script)
this.getUrl(options)
},
mounted() {
const mchData = { action: "onIframeReady", displayStyle: "SHOW_CUSTOM_PAGE", height: 750 };
const postData = JSON.stringify(mchData);
window.parent.postMessage(postData, "*");
},
methods: {
getUrl(options){
window.addEventListener('message', (event) => {
try{
JSON.stringify(event.source)
}catch(err){
this.isUrl = JSON.stringify(err.stack.match(/"([^"]+)"/)[1])
uni.request({
url: (`${this.isUrl}/xxx/xxx`).replace(/"/g, ''),
method:"POST",
data: {orderNo: options.out_trade_no},
success: (req) => {
let res = req.data
console.log("参数",req.data);
if(res.code != 0 ) return
}
});
}
});
},
toPage() {
let url = (`${this.isUrl}/xxxx?xxxx=${this.linkedSalesmanId}`).replace(/"/g, '')
console.log(url);
const mchData = { action: "jumpOut", jumpOutUrl: url};
const postData = JSON.stringify(mchData);
window.parent.postMessage(postData, "*");
},
getTime() {
return tip.$Time()
},
}
};
</script>
<style lang="scss" scoped>
.center {
max-height: 900rpx;
display: flex;
flex-direction: column;
align-items: center;
background-color: #f6f6f6;
border-radius: 20rpx;
padding: 20rpx;
.orderStat {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
border: 10rpx solid #18bc37;
display: flex;
justify-content: center;
align-items: center;
}
.state {
margin-top: 10rpx;
font-size: 30rpx;
}
.num {
margin-top: 10rpx;
font-weight: bold;
color: #666666;
}
.orderInfo {
min-width: 500rpx;
max-width: 500rpx;
padding-bottom: 20rpx;
.item {
display: flex;
justify-content: space-between;
font-size: 30rpx;
}
}
.isButton {
min-width: 500rpx;
max-width: 500rpx;
display: flex;
justify-content: center;
align-items: center;
padding: 20rpx 0;
.button {
border: 2rpx #18bc37 solid;
border-radius: 10rpx;
padding: 5rpx 30rpx;
color: #18bc37;
}
}
.time {
display: flex;
justify-content: center;
align-items: center;
margin: 10rpx 40rpx;
border: 2rpx #ED6723 solid;
border-radius: 20rpx;
.uni-countdown {
padding: 10rpx;
font-size: 40px;
}
}
.wweek {
display: flex;
justify-content: center;
align-items: center;
margin-top: 10rpx;
font-weight: bold;
color: #666666;
}
}
</style>