|
|
<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 big_price = new bigc(Number(price)); big_price = big_price.times(Number(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>
|
