310 lines
8.4 KiB
Vue
310 lines
8.4 KiB
Vue
<template>
|
||
<view>
|
||
<form class="content" @submit="toPay" >
|
||
<view class="content-top">
|
||
<view>
|
||
<view class="hs-box" v-if="useraddress && useraddress.id" @click="goAddress">
|
||
<view class="hs-row " style=" justify-content: left;">
|
||
<view class="dizhi">
|
||
<view class="person flex">
|
||
<view>收货人：{{ useraddress.name || '' }}</view>
|
||
<view >{{ useraddress.mobile || '' }}</view>
|
||
</view>
|
||
<view class="address">
|
||
{{ useraddress.address || '' }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="" v-else>
|
||
|
||
<view @click="goAddress()" class="addressrow">
|
||
<view style="color:#fe4038" >添加收货地址</view>
|
||
<uni-icons type="right" size="22" style="display: block;float: right;margin-top: -1px;"></uni-icons>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="top-line"></view>
|
||
</view>
|
||
|
||
<view class="tupian_box mr10">
|
||
<view class="goods-li flex" >
|
||
<image :src="info.thumb" mode="aspectFill" style="width:80px;height:80px"></image>
|
||
<view class="fr">
|
||
<view class="flex fr-t">
|
||
<view class="info size28 overflow" style="height: 20px;">
|
||
{{info.name || ''}}
|
||
</view>
|
||
</view>
|
||
<view class="price size28 c9 flex">
|
||
<view class="red-price overflow" >
|
||
{{info.point|| ''}}积分+{{info.price|| ''}}元
|
||
</view>
|
||
<view>× {{ number || '' }}</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="hs-box">
|
||
<view class="hs-row" >
|
||
<view >
|
||
所需积分
|
||
</view>
|
||
<view class="red-price">
|
||
{{order_point|| ''}}积分
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="hs-box mr10">
|
||
<view class="hs-row">
|
||
备注
|
||
</view>
|
||
<view class="hs-textarea ">
|
||
<textarea v-model="remark" placeholder="选填" maxlength="20" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="tj ">
|
||
<view class="w96 auto flex">
|
||
<view class="lr">
|
||
<view class="zj" >
|
||
合计：
|
||
<text class=" price">{{order_point || '0' }}积分+{{order_amount|| '0'}}元</text>
|
||
</view>
|
||
</view>
|
||
<button class=" submitorder" form-type="submit" :disabled="submitStatus" :loading="submitStatus">立即下单</button>
|
||
|
||
</view>
|
||
</view>
|
||
|
||
|
||
</form>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
submitStatus: false,
|
||
info:{},
|
||
goods_id:'',
|
||
order_point:0,
|
||
order_amount:0,
|
||
number:1,
|
||
list:[],
|
||
totalmoney:0,
|
||
useraddress:'',
|
||
address_id:0
|
||
}
|
||
},
|
||
onShow() {
|
||
let user_address = uni.getStorageSync('user_address');
|
||
if (user_address) {
|
||
this.useraddress = user_address;
|
||
this.address_id = user_address.id;
|
||
uni.removeStorageSync('user_address');
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
this.goods_id = options.goods_id
|
||
this.number = options.number
|
||
this.getdata()
|
||
this.userDefaultaddress();
|
||
},
|
||
methods: {
|
||
toPay(){
|
||
if (this.submitStatus) {
|
||
return false;
|
||
}
|
||
this.submitStatus = true;
|
||
let data = {
|
||
act:"add",
|
||
goods_id:this.goods_id,
|
||
number:this.number,
|
||
remark:this.remark,
|
||
address_id:this.address_id
|
||
}
|
||
var _this =this;
|
||
this.$api.createorderExchange(data,res=>{
|
||
if(res.code == '1'){
|
||
if (res.data.pay_status == 2) {
|
||
uni.showToast({ title: res.msg , icon: 'success' })
|
||
setTimeout(function() {
|
||
uni.redirectTo({url:'/pages/exchange/orderlist'});
|
||
},2000);
|
||
} else {
|
||
if(res.data.pay_status ==1){
|
||
let data = {
|
||
payment_code: 'wechatpay',
|
||
payment_type: 1,
|
||
}
|
||
data['order_id'] = res.data.order_id ;
|
||
this.$api.exchangePay(data, res => {
|
||
if (res.code ==1 ) {
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.package,
|
||
signType: res.data.signType,
|
||
paySign: res.data.paySign,
|
||
success: function(e) {
|
||
if (e.errMsg === 'requestPayment:ok') {
|
||
uni.showToast({ title: "支付成功" , icon: 'success' })
|
||
setTimeout(function() {
|
||
uni.redirectTo({url:'/pages/exchange/orderlist'});
|
||
},2000);
|
||
}
|
||
},
|
||
fail() {
|
||
uni.redirectTo({url:'/pages/exchange/orderlist'});
|
||
}
|
||
});
|
||
} else {
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
this.submitStatus = false;
|
||
}
|
||
},res => {
|
||
this.submitStatus = false;
|
||
}
|
||
)
|
||
},
|
||
getdata(){
|
||
let data = {
|
||
goods_id:this.goods_id,
|
||
number:this.number
|
||
}
|
||
this.$api.createorderExchange(data,res=>{
|
||
if(res.code == '1'){
|
||
this.info = res.data.goods
|
||
this.order_point = res.data.order_point
|
||
this.order_amount = res.data.order_amount
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
},
|
||
goAddress() {
|
||
var token = uni.getStorageSync('userToken');
|
||
if (!token) {
|
||
uni.navigateTo({
|
||
url: '/pages/login/authorize'
|
||
});
|
||
}else{
|
||
uni.navigateTo({
|
||
url: '/pages/address/list?type=order'
|
||
});
|
||
}
|
||
},
|
||
userDefaultaddress() {
|
||
this.$api.userDefaultAddress({}, res => {
|
||
if (res.code ==1) {
|
||
if(res.data){
|
||
this.useraddress = res.data;
|
||
this.address_id = this.useraddress.id;
|
||
}
|
||
|
||
}
|
||
});
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
|
||
|
||
.dizhi{ margin-left: 10px;
|
||
min-height: 15px;
|
||
overflow: hidden;
|
||
align-items: center;
|
||
padding-right: 25px;}
|
||
.person{justify-content: space-between;margin-bottom:5px}
|
||
.address{font-size: 12px;}
|
||
.addressrow{background-color:#fff;justify-content: space-between;display:flex;padding:40rpx 26rpx 40rpx 20rpx}
|
||
.shop-row{ margin-left: 10px;
|
||
min-height: 15px;
|
||
overflow: hidden;
|
||
align-items: center;
|
||
padding-right: 25px;}
|
||
.goods-li{
|
||
background-color: #fff;
|
||
padding: 10px 12px;
|
||
box-sizing: border-box; }
|
||
.goods-li image{
|
||
width: 70px ! important;
|
||
height: 70px;
|
||
}
|
||
.goods-li .fr{ flex: 0 0 calc(100% - 110px);
|
||
margin-left:10px;
|
||
justify-content: space-between;}
|
||
.fr-t{justify-content: space-between;}
|
||
.info{
|
||
line-height: 40rpx;
|
||
height: 80rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
.goods-li .price{display: flex;
|
||
justify-content: space-between;}
|
||
.goods-li .rowbox {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
position: relative; }
|
||
.buy_g_num {
|
||
position: absolute;
|
||
background-color: #ffffff;
|
||
border: 1px solid #fe5047;
|
||
color: #fe5047;
|
||
font-size: 24rpx;
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
border-radius: 50%;
|
||
right: -12rpx;
|
||
top: -18rpx;
|
||
}
|
||
|
||
.tj{position: fixed;width: 100%;left: 0;background: #fff;height: 90rpx;bottom: 0;}
|
||
.tj .lr{width:100%}
|
||
.tj .w96{height:120rpx ;justify-content: space-between;}
|
||
.tj .zj{
|
||
padding-right: 20px;
|
||
line-height: 45px;
|
||
text-align: right;}
|
||
.tj .fsz28 {color: #e31712;}
|
||
.tj .price {color: #e31712;font-size:16px}
|
||
.submitorder{width:300rpx;height: 90rpx;font-size:14px;color:#fff;border-radius: 0px;background: #fe4038;text-align: center;line-height: 90rpx;color: #fff;}
|
||
.hs-textarea {
|
||
padding: 0 26upx 20upx;
|
||
}
|
||
|
||
/* #ifndef MP-WEIXIN */
|
||
.hs-textarea textarea {
|
||
width: 100%;
|
||
height: 100upx;
|
||
font-size: 26upx;
|
||
color: #333;
|
||
}
|
||
/* #endif */
|
||
|
||
|
||
.top-line{ width: 100%;
|
||
height: 6rpx;
|
||
background-color: #fff;
|
||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAWMAAAADCAYAAABGQW4PAAAAAXNSR0IArs4c6QAAASRJREFUWEftVEFOAkEQrN5lhYS46h8MeoEzNy58wJBNkH9I4j5gN4F/EBKiL/AiR4+cwE+IJCasuDSZmxoz05G9bNJzm6Sma6qruimL6k3iyhyEcxx9eHUy21xLysSTrAV4z4XwMlbJIBDxmr9lvXqLqFIMN1SzzW/1WTINFoxm29nAMs4zA4/pbdD7Lo62UXjpgV4AXDhVOwAEjIPZ+1BSJ57mI/D+ToJ1YsgbJ31fxGtq7aKzEQOFcKtmuzvqszO9doBm29nAEs7zG1PeTvu11x/L2Fy2N6cN3/dSJnQBhE71fwEYa+avTvXhYyF5H092SxCuJFgrhrEG9p1kUBXxmlqfUbgEqBBu1exYxurz/yOu2Rb1rkTzvGHgCZTf/17ERugB65wHE+XzDfAAAAAASUVORK5CYII=);
|
||
background-repeat: repeat-x;
|
||
display: block;}
|
||
</style>
|
||
|