323 lines
8.5 KiB
Vue
323 lines
8.5 KiB
Vue
<template>
|
|
<view v-if="istrue" class="contents" style="overflow: hidden">
|
|
<view class="flex_items flex_center mt30" style="width: 100%; height:160rpx">
|
|
<view class="flex_column flex_items">
|
|
<span class="bolder" style="font-size: 70rpx"> ￥{{ info.price }} </span>
|
|
<view class="flex_start flex_items f32 mt20">
|
|
<span>支付剩余时间</span>
|
|
<view style="color: red" class="flex_start flex_items ml5">
|
|
<view class="">{{ minutes }}</view>
|
|
<view class="">:</view>
|
|
<view class="">{{ secondsCom }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_column flex_items plr20 ptb10 mt30">
|
|
<!-- <view class="bgwhite plr20 ptb30 flex_column" style="border-radius: 20rpx; width: calc(100% - 60rpx)">
|
|
<span class="bold f40">支付方式</span>
|
|
<view class="mt30 flex_between flex_items f32">
|
|
<view class="flex_start flex_items">
|
|
<img :src="wwimg" mode="" style="width:70rpx; height: 70rpx" />
|
|
<span class="ml10 f132">微信支付</span>
|
|
</view>
|
|
<span class="chooseIcon" :class="payIndex == 0 ? 'active' : ''"></span>
|
|
</view>
|
|
</view> -->
|
|
<view class="bgwhite plr20 ptb30 flex_column" style="border-radius: 20rpx; width: calc(100% - 60rpx)">
|
|
<view class="flex_between flex_items f30">
|
|
<text class="f32">订单编号</text>
|
|
<text style="color: #a3a1a1e6;">{{orderno}}</text>
|
|
</view>
|
|
<view class="flex_between flex_items f30 mt30">
|
|
<text class="f32">支付方式</text>
|
|
<text style="color: #a3a1a1e6;">微信支付</text>
|
|
</view>
|
|
<view @click="goredm" class="flex_between flex_items f30 mt30">
|
|
<text class="f32">可用红包</text>
|
|
<text v-if="hbs.length==0" style="color: #a3a1a1e6;">暂无可用</text>
|
|
<view v-else class="f24" style="background: red;color: #fff;padding:8rpx;border-radius:6rpx;">
|
|
<text v-if="whoname==''">{{hbs.length}}张可用</text>
|
|
<text v-else>{{whoname}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_between flex_items bgwhite">
|
|
</view>
|
|
<view class="flex_items flex_center" style="width: 100%; position: fixed; left: 0; bottom:30rpx">
|
|
<view class="f30 ptb20 f-center que" style="background: #fde64f; border-radius: 18rpx" @click="goorder">
|
|
确认支付
|
|
</view>
|
|
</view>
|
|
<Ywatermark :info="'蓝色兄弟'"></Ywatermark>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
payIndex: 0,
|
|
paymoney: "",
|
|
minutes: null,
|
|
seconds: 0,
|
|
timeShow: true,
|
|
foods: [],
|
|
other: "",
|
|
wwimg: require('@/static/wxzf.png'),
|
|
info: {},
|
|
hbs: [],
|
|
istrue: false,
|
|
hbimg: require('@/static/hbt.png'),
|
|
orderno: "",
|
|
whoindex: '',
|
|
whoname: "",
|
|
packet_id: ""
|
|
};
|
|
},
|
|
onLoad() {
|
|
// this.foods = JSON.parse(this.$route.params.foods);
|
|
// this.other = this.$route.params.other.split("¥")[1];
|
|
// this.paymoney = Number(this.$route.params.price) + Number(this.other);
|
|
// this.add();
|
|
// this.getlogin()
|
|
// 获取参数
|
|
let params = this.getRequestParams();
|
|
let mobile = params['order_no'];
|
|
this.orderno = mobile
|
|
this.getinfo(mobile)
|
|
},
|
|
computed: {
|
|
secondsCom() {
|
|
return this.seconds < 10 ? "0" + this.seconds : this.seconds;
|
|
},
|
|
},
|
|
methods: {
|
|
add() {
|
|
var _this = this;
|
|
_this.istrue = true
|
|
uni.hideLoading()
|
|
var time = window.setInterval(function() {
|
|
if (_this.seconds === 0 && _this.minutes !== 0) {
|
|
_this.seconds = 59;
|
|
_this.minutes -= 1;
|
|
} else if (_this.minutes === 0 && _this.seconds === 0) {
|
|
_this.seconds = 0;
|
|
_this.timeShow = false;
|
|
window.clearInterval(time);
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '支付已超时！',
|
|
showCancel: false,
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定')
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
})
|
|
} else {
|
|
console.log('用户点击取消')
|
|
}
|
|
}
|
|
})
|
|
// alert("支付已超时");
|
|
// uni.navigateBack({
|
|
// delta: 1,
|
|
// })
|
|
} else {
|
|
_this.seconds -= 1;
|
|
}
|
|
}, 1000);
|
|
},
|
|
getinfo(mobile) {
|
|
uni.showLoading({
|
|
title: "加载中...",
|
|
icon: "none"
|
|
})
|
|
this.api.getinfoorder({
|
|
order_no: mobile,
|
|
}).then((res) => {
|
|
console.log(res)
|
|
if (res.data.code == 200) {
|
|
uni.hideLoading()
|
|
this.info = res.data.data.order
|
|
this.hbs = res.data.data.packet
|
|
this.changs(this.info.count_time)
|
|
this.info.price = Number(this.info.price) + Number(this.info.service_amount)
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
})
|
|
},
|
|
goorder() {
|
|
uni.showLoading({
|
|
title: "支付中..."
|
|
})
|
|
this.api.paym({
|
|
order_no: this.orderno,
|
|
packet_id: this.packet_id
|
|
}).then((res) => {
|
|
console.log(res)
|
|
if (res.data.code == 200) {
|
|
uni.hideLoading()
|
|
window.open(res.data.data.h5_url, '_self')
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
})
|
|
// this.$router.replace({
|
|
// name: "order",
|
|
// params: {
|
|
// paymoney: this.paymoney,
|
|
// foods: JSON.stringify(this.foods),
|
|
// other: this.other,
|
|
// },
|
|
// });
|
|
},
|
|
// 秒钟转分钟
|
|
changs(times) {
|
|
let durationMi = `${parseInt(times / 60)}`
|
|
this.minutes = durationMi
|
|
this.add()
|
|
console.log(durationMi)
|
|
},
|
|
// 联合登陆
|
|
getlogin() {
|
|
uni.showLoading({
|
|
title: "加载中...",
|
|
});
|
|
uni.request({
|
|
url: "http://139.9.58.213:8091/v1/union/a50482b7b61efcf3e272d27cb7d42d38",
|
|
method: "GET",
|
|
data: {
|
|
uid: "uid",
|
|
phone: "18048557688",
|
|
nickname: "啊啊",
|
|
},
|
|
success: (res) => {
|
|
console.log(res);
|
|
if (res.data.code == 200) {
|
|
uni.setStorageSync("token", res.data.data.token);
|
|
uni.navigateTo({
|
|
url: "../web/index?url=" + res.data.data.jump_url,
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.message,
|
|
duration: 2000,
|
|
icon: "none",
|
|
});
|
|
}
|
|
},
|
|
});
|
|
},
|
|
// 参数获取
|
|
getRequestParams() {
|
|
let url = location.href;
|
|
let requestParams = {};
|
|
if (url.indexOf("?") !== -1) {
|
|
let str = url.substr(url.indexOf("?") + 1); //截取?后面的内容作为字符串
|
|
// console.log(str, '?后面的内容');
|
|
let strs = str.split("&"); //将字符串内容以&分隔为一个数组
|
|
// console.log(strs, '以&切割的数组');
|
|
for (let i = 0; i < strs.length; i++) {
|
|
requestParams[strs[i].split("=")[0]] = decodeURI(
|
|
strs[i].split("=")[1]
|
|
);
|
|
// 将数组元素中'='左边的内容作为对象的属性名，'='右边的内容作为对象对应属性的属性值
|
|
}
|
|
}
|
|
return requestParams;
|
|
},
|
|
goredm() {
|
|
if (this.hbs.length == 0) {
|
|
return false
|
|
}
|
|
uni.navigateTo({
|
|
url: "/pages/mt/redm?hbs=" +
|
|
JSON.stringify(this.hbs) + "&&whoindex=" + this.whoindex
|
|
})
|
|
},
|
|
jian(arg2, arg1) {
|
|
var r1, r2, m, n;
|
|
try {
|
|
r1 = arg1.toString().split(".")[1].length
|
|
} catch (e) {
|
|
r1 = 0
|
|
}
|
|
try {
|
|
r2 = arg2.toString().split(".")[1].length
|
|
} catch (e) {
|
|
r2 = 0
|
|
}
|
|
m = Math.pow(10, Math.max(r1, r2));
|
|
//lastmodifybydeeka
|
|
//动态控制精度长度
|
|
n = (r1 >= r2) ? r1 : r2;
|
|
return ((arg2 * m - arg1 * m) / m).toFixed(n);
|
|
}
|
|
},
|
|
onShow() {
|
|
if (uni.getStorageSync('who')) {
|
|
this.whoindex = uni.getStorageSync('who')
|
|
this.packet_id = this.hbs[this.whoindex].id
|
|
this.whoname = '已使用红包 -￥' + this.hbs[this.whoindex].balance
|
|
// this.info.price = Number(info.price) - Number(this.hbs[this.whoindex].balance)
|
|
this.info.price = this.jian(this.info.price,this.hbs[this.whoindex].balance)
|
|
uni.removeStorageSync('who')
|
|
console.log(this.info.price)
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
.contents {
|
|
background: #f5f5f5 !important;
|
|
height: 100vh;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.que {
|
|
width: calc(100% - 50rpx);
|
|
}
|
|
|
|
/* @media screen and (max-width: 768px) {
|
|
.contents {
|
|
width: 100%;
|
|
}
|
|
.que {
|
|
width: calc(100% - 25px);
|
|
}
|
|
}
|
|
@media screen and (min-width: 769px) {
|
|
.contents {
|
|
width: 500px;
|
|
}
|
|
.que {
|
|
width:460px;
|
|
}
|
|
} */
|
|
.chooseIcon {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
display: inline-block;
|
|
background: url(~@/static/hasSelect1.png) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.active {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
display: inline-block;
|
|
background: url(~@/static/noselect.png) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
</style> |