|
|
<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-jianshao" @tap="reduce"></text> <input type="number" v-model="num" class="text-center margin-lr-sm radius text-black lf-font-32" style="width: 60rpx; height: 50rpx;" /> <text class="lf-iconfont lf-icon-jia1" @tap="add"></text> </view> </view> <view class="flex justify-between margin-top-sm"> <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> <button v-if="true" class="cu-btn line-orange round margin-left-sm text-sm">申请退款</button> <button v-else class="cu-btn line-gray bg-gray round margin-left-sm text-sm">退款中</button> </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> <view class="text-red text-price lf-font-42 lf-font-bold"> {{Number(orderDetails.goods.specs[0].selling_price*num || 0)}} </view> </view> <button class="cu-btn block bg-orange round shadow" @tap="submit"> <text class="cuIcon-loading2 cuIconfont-spin margin-right-xs text-white" v-if="loading"></text> <text class="lf-font-32 text-white">{{ loading ? '支付中...' : '下单付款' }}</text> </button> </view> </view> </skeleton> </block> </view></template>
<script> export default { data() { return { num: 1, base64Img: '', //
skeletonLoading: true, loading: false, 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 } }, computed: { total(){ return this.num * this.price }, 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: { getConfirmOrder() { this.$http(this.API.API_COFIRMORDER_DETAILS, {goods_id: this.goods_id,goods_specs_id: this.goods_specs_id}).then(res => { if(res.code == 0) { this.orderDetails = res.data this.skeletonLoading = false this.ifCheck = false }else { this.$msg(res.msg) } }).catch(err => { console.log('code',res.code) if(res.code == 9997) { this.ifCheck = true }else { this.ifCheck = false } }); }, reduce() { if (this.num === 1) return this.num-- }, add() { this.num++ }, 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.ifCheck == true) { uni.showModal({ title: '提示', content: '是否同意前往手机授权？', success: e => { if (!e.confirm) return; this.$routerGo('/pages/login/index?type=phone') } }); }else { 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'}) }, }) }) } }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'}) }, }) }) }, //下拉刷新
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>
|
