You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
274 lines
8.2 KiB
274 lines
8.2 KiB
<template>
|
|
<view>
|
|
<!-- 商品信息 -->
|
|
<block v-if="isRight(orderDetails)">
|
|
<view class="bg-white padding-tb-sm">
|
|
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
|
|
|
|
<view class="flex justify-between align-start padding-top-sm padding-lr">
|
|
<image :src="orderDetails.goods.cover" mode="aspectFill" style="width: 240rpx; height: 240rpx;border-radius: 10rpx;"></image>
|
|
<view class="flex-sub padding-left-sm">
|
|
<view class="bref-box margin-top-xs lf-font-32 lf-font-bold" style="height: 88rpx;line-height: 44rpx;color: #222;">
|
|
{{orderDetails.goods.name}}
|
|
</view>
|
|
<view class="flex justify-between align-center text-center">
|
|
<text class="block margin-top-sm text-gray lf-font-28" style="margin-top: 20rpx;line-height: 40rpx;">数量</text>
|
|
<view class="flex align-center margin-top-sm">
|
|
<text class="lf-iconfont lf-icon-jianhao lf-font-40" style="color: #999;" @tap="reduce"></text>
|
|
<input @blur="changeNum(num)" type="number" v-model="num" class="text-center margin-lr-sm radius text-black lf-font-32" style="width: 60rpx; height: 50rpx;background-color: #f1f1f1;color: #222;" />
|
|
<text class="lf-iconfont lf-icon-jiahao lf-font-40" style="color: #999;" @tap="add"></text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="flex justify-between margin-top-sm">
|
|
<lf-price :price="orderDetails.goods.specs[0].selling_price" />
|
|
|
|
|
|
<!-- <view class="text-red text-price lf-font-42 lf-font-bold" style="margin-top: 12rpx;">
|
|
{{Number(orderDetails.goods.specs[0].selling_price || 0)}}
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</skeleton>
|
|
</view>
|
|
|
|
<self-line/>
|
|
<skeleton :loading="skeletonLoading" :row="1" :showAvatar="false" :showTitle="true">
|
|
<view class="bg-white">
|
|
<view class="cu-bar padding-lr">
|
|
<text class="text-gray lf-font-32">优惠</text>
|
|
<text class="lf-font-32 text-black1">暂无优惠</text>
|
|
</view>
|
|
</view>
|
|
</skeleton>
|
|
<self-line/>
|
|
|
|
<skeleton :loading="skeletonLoading" :row="13" :showAvatar="false" :showTitle="true">
|
|
<view class="btn-bottom">
|
|
<view class="padding flex justify-around align-center bg-gray1" v-if="orderDetails.agreement.title">
|
|
<checkbox-group class="block" @change="CheckboxChange">
|
|
<view class="margin-right">
|
|
<checkbox @change="CheckboxChange" :class="checkbox[0].checked?'checked':''" :checked="checkbox[0].checked?true:false" value="A"></checkbox>
|
|
</view>
|
|
</checkbox-group>
|
|
<view class="lf-font-24 text-gray">
|
|
请认真阅读并同意<text @tap="$routerGo('/pages/agreement/agreement?id='+orderDetails.agreement.article_id)">《{{orderDetails.agreement.title}}》</text>，在小程序下单购买即表示您已默认同意<text @tap="$routerGo('/pages/agreement/agreement?id='+orderDetails.agreement.article_id)">《{{orderDetails.agreement.title}}》</text>的所有条款。
|
|
</view>
|
|
</view>
|
|
<view class="padding-lr padding-tb-sm bg-white flex justify-between align-center shadow">
|
|
<view class="flex align-center">
|
|
<text class="lf-font-28 text-gray">应付款：</text>
|
|
|
|
<lf-price :price="total(num, orderDetails.goods.specs[0].selling_price)" />
|
|
<!-- <view class="text-red text-price lf-font-42 lf-font-bold">
|
|
{{ total(num, orderDetails.goods.specs[0].selling_price) }}
|
|
</view> -->
|
|
</view>
|
|
<button class="cu-btn block bg-orange round shadow" @tap="submit">
|
|
<text class="lf-font-32 text-white" v-if="type == 1">立即付款</text>
|
|
<text class="lf-font-32 text-white" v-else>下单付款</text>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</skeleton>
|
|
</block>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import bigc from '@/common/bigc.js';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
num: 1,
|
|
skeletonLoading: true,
|
|
checkbox: [{
|
|
value: 'A',
|
|
checked: true
|
|
}],
|
|
goods_id: 1,
|
|
goods_specs_id: 1,
|
|
orderDetails: {},
|
|
ifchoose: true,
|
|
ifCheck: true,
|
|
type: 0,
|
|
order_id: 0,
|
|
ifDo: 1,
|
|
ifPay: true,
|
|
limit: 1
|
|
}
|
|
},
|
|
computed: {
|
|
total(){
|
|
return function(num, price){
|
|
let new_num = Number(num);
|
|
if(Object.is(new_num, NaN)){
|
|
return 0;
|
|
};
|
|
let big_price = new bigc(Number(price));
|
|
big_price = big_price.times(new_num);
|
|
return big_price.round(2, 0).toString();
|
|
}
|
|
},
|
|
isRight(){
|
|
return function(val){
|
|
return this.$shared.isRight(val);
|
|
}
|
|
}
|
|
},
|
|
onLoad(e) {
|
|
this.type = e.type;
|
|
this.goods_id = e.goods_id;
|
|
this.order_id = e.order_id;
|
|
this.goods_specs_id = e.goods_specs_id
|
|
if(this.goods_id && this.goods_specs_id) {
|
|
this.getConfirmOrder()
|
|
}
|
|
},
|
|
methods: {
|
|
changeNum(num) {
|
|
if(num > this.limit) {
|
|
this.$msg('该商品限购数量'+this.limit)
|
|
this.num = this.limit
|
|
return
|
|
}else if(num < 1) {
|
|
this.num = 1
|
|
}
|
|
},
|
|
getConfirmOrder() {
|
|
this.$http(this.API.API_COFIRMORDER_DETAILS, {goods_id: this.goods_id,goods_specs_id: this.goods_specs_id}).then(res => {
|
|
this.orderDetails = res.data
|
|
this.limit = res.data.goods.specs[0].limit
|
|
// this.limit = 10
|
|
this.skeletonLoading = false
|
|
})
|
|
},
|
|
reduce() {
|
|
if (this.num === 1) return
|
|
this.num--
|
|
},
|
|
add() {
|
|
if(this.num < this.limit) {
|
|
this.num++
|
|
}else {
|
|
this.$msg('该商品限购数量'+this.limit)
|
|
this.num = this.limit
|
|
return
|
|
}
|
|
|
|
},
|
|
CheckboxChange(e) {
|
|
if(e.detail.value != '') {
|
|
this.ifchoose = true
|
|
}else {
|
|
this.ifchoose = false
|
|
}
|
|
},
|
|
// 点击复制
|
|
copy(text) {
|
|
uni.setClipboardData({
|
|
data: text
|
|
});
|
|
},
|
|
submit(){
|
|
if(this.ifchoose == true) {
|
|
if(!this.ifPay) return;
|
|
this.ifPay = false;
|
|
if(this.type == 1){
|
|
this.pay();
|
|
return;
|
|
}
|
|
this.$http(this.API.API_PRPAID, {
|
|
goods_id: this.goods_id,
|
|
goods_specs_id: this.goods_specs_id,
|
|
number: this.num,
|
|
}).then(res => {
|
|
this.order_id = res.data.order_id
|
|
uni.requestPayment({
|
|
orderInfo: res.data.order_num,
|
|
timeStamp: res.data.timeStamp,
|
|
nonceStr: res.data.nonceStr,
|
|
package: res.data.package,
|
|
signType: res.data.signType,
|
|
paySign: res.data.paySign,
|
|
success: (res) => {
|
|
this.ifPay = true
|
|
this.$url('/pages/order/pay-success?ifSuccess=1&order_id='+this.order_id,{type: 'redirect'})
|
|
},
|
|
fail: (err) => {
|
|
this.ifPay = true
|
|
this.$url('/pages/order/pay-success?ifSuccess=2&order_id='+this.order_id,{type: 'redirect'})
|
|
},
|
|
})
|
|
|
|
}).catch(err => {
|
|
this.ifPay = true
|
|
if(err.code == 9997) {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '是否同意前往手机授权？',
|
|
success: e => {
|
|
if (!e.confirm) return;
|
|
this.$routerGo('/pages/login/index?type=phone')
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
}else {
|
|
this.$msg('请认真阅读并同意协议!')
|
|
return
|
|
}
|
|
},
|
|
pay(){
|
|
console.log("this.order_id", this.order_id)
|
|
this.$http(this.API.API_PAYMENT_DIRECT, {order_id: this.order_id}).then(res => {
|
|
this.order_id = res.data.order_id
|
|
uni.requestPayment({
|
|
orderInfo: res.data.order_num,
|
|
timeStamp: res.data.timeStamp,
|
|
nonceStr: res.data.nonceStr,
|
|
package: res.data.package,
|
|
signType: res.data.signType,
|
|
paySign: res.data.paySign,
|
|
success: (res) => {
|
|
this.$url('/pages/order/pay-success?ifSuccess=1&order_id='+this.order_id,{type: 'redirect'})
|
|
},
|
|
fail: (err) => {
|
|
this.$url('/pages/order/pay-success?ifSuccess=2&order_id='+this.order_id,{type: 'redirect'})
|
|
},
|
|
})
|
|
}).catch(err => {
|
|
setTimeout(() => {
|
|
this.$toBack()
|
|
},1000)
|
|
});
|
|
},
|
|
//下拉刷新
|
|
downCallback() {
|
|
this.getConfirmOrder()
|
|
},
|
|
},
|
|
onShow() {
|
|
if(this.ifDo > 1) {
|
|
this.getConfirmOrder()
|
|
}
|
|
this.ifDo++
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bref-box {
|
|
text-overflow: -o-ellipsis-lastline;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
</style>
|