shop-applet/pages/payment/settlement.vue

1919 lines
43 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view :style="viewColor">
<view class='order-submission'>
<!-- 商品信息 -->
<view class="storeinfo-wrapper">
<view class="store-item">
<view class="store-title">
<text class="iconfont icon-shangjiadingdan"></text>
<view class="txt" @click="goStore(item.mer_id)">{{payForm.merName}}</view>
<text class="iconfont icon-xiangyou"></text>
</view>
<view class="product-item">
<view class="img-box">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/89ad3202402292014108303.jpg"
width="170rpx" height="180rpx" />
</view>
<view class="content event_content">
<view class="name line1">
{{payForm.money}}元实物提货券
</view>
<view style="margin-top: 30rpx;color: #FF5C2D;">
{{payForm.money}}
</view>
</view>
</view>
</view>
</view>
<view class="settlementAgreement" v-if="showProtocol">
<view class="setAgCount">
<i class="icon iconfont icon-cha" @click="showProtocol = false"></i>
<div class="title">{{agrementTtile}}</div>
<view class="content">
<jyf-parser :html="protocol" ref="article" :tag-style="tagStyle"></jyf-parser>
</view>
</view>
</view>
<view class='wrapper'>
<view class='item'>
<view style="font-weight: bold;">支付方式</view>
<view class='list'>
<!-- #ifdef H5 -->
<view class='payItem acea-row row-middle' :class='active==index ?"on":""' @tap='payItem(index)'
v-for="(item,index) in cartArr" :key='index' v-if="item.payStatus==1">
<view class='name acea-row row-center-wrapper'>
<view class='iconfont animated'
:class='(item.icon) + " " + (animated==true&&active==index ?"bounceIn":"")'></view>
{{item.name}}
</view>
<view class='tip'>
{{item.title}}
<block v-if="item.value == 'balance'">
{{userInfo.now_money}}
</block>
</view>
</view>
<!-- #endif -->
<!-- #ifdef MP || APP-PLUS -->
<view class='payItem acea-row row-middle' :class='active==index ?"on":""' @tap='payItem(index)'
v-for="(item,index) in cartArr" :key='index' v-if="item.payStatus==1">
<view class='name acea-row row-center-wrapper'>
<view class='iconfont animated'
:class='(item.icon) + " " + (animated==true&&active==index ?"bounceIn":"")'></view>
{{item.name}}
</view>
<view class='tip'>
{{item.title}}
<block v-if="item.value == 'balance'">
{{userInfo.now_money}}
</block>
</view>
</view>
<!-- #endif -->
</view>
</view>
</view>
<view class='moneyList'>
<view class='item acea-row row-between-wrapper'>
<view>商品总价:</view>
<view class='money'>¥{{payForm.money}}</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>补贴抵扣</view>
<block v-if="platformConsumption.length > 0">
<view class='discount money red_packet' @tap='couponTap3()'>
<text v-if="consumption_id">-¥{{consumption_money||'0.00'}}</text>
<text v-else>有补贴补贴未选</text>
<text class='iconfont icon-jiantou'></text>
</view>
</block>
<block v-else>
<view class='discount'>暂无抵扣红包</view>
</block>
</view>
</view>
<view style='height:140rpx;'></view>
<view class='footer acea-row row-between-wrapper'>
<view class="footer_count">
<view>
合计:
<text class='pColor' v-if="cartArr[4].payStatus == 1 && active == 4">¥0.00</text>
<text class='pColor' v-else>¥{{payForm.money }}</text>
</view>
</view>
<view class='settlement' :class='couponData.status != "noAddress" ? "" : "disabled"' style='z-index:100'
@tap="SubOrder">{{couponData.status != "noAddress" ? '提交订单':'选择地址'}}</view>
</view>
</view>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
let app = getApp();
import {
orderConfirm,
getOrderConfirm,
getCouponsOrderPrice,
orderCreate,
createOrder
} from '@/api/order.js';
import {
getAddressDefault,
getAddressDetail,
getAddressList,
getUserInfo,
} from '@/api/user.js';
import {
openPaySubscribe
} from '@/utils/SubscribeMessage.js';
import {
presellAgreement
} from '@/api/activity.js';
import {
storeListApi
} from '@/api/store.js';
import {
CACHE_LONGITUDE,
CACHE_LATITUDE
} from '@/config/cache.js';
import couponListWindow from '@/components/orderCoupon';
import addressWindow from '@/components/addressWindow';
import orderGoods from '@/components/orderGoods';
import checkDelivery from '@/components/checkDelivery/index.vue';
import discountDetails from '@/components/discountDetails/index.vue';
import addInvoicing from '@/components/addInvoicing';
import parser from "@/components/jyf-parser/jyf-parser";
import {
mapGetters
} from "vuex";
import authorize from '@/components/Authorize';
import {
configMap
} from '@/utils';
import {
HTTP_REQUEST_URL
} from '@/config/app';
import {
orderPay
} from "@/api/payment.js";
export default {
components: {
couponListWindow,
addressWindow,
orderGoods,
checkDelivery,
addInvoicing,
discountDetails,
"jyf-parser": parser,
authorize,
},
filters: {
filterDay(val) {
if (val) {
var reg = /(\d{4})\-(\d{2})\-(\d{2})/;
var date = val.replace(reg, "$2月$3日");
return date
}
}
},
data() {
return {
// 备注
textareaStatus: true,
platformConsumption: [],
//支付方式
cartArr: [{
"name": "微信支付",
"icon": "icon-weixin2",
value: 'weixin',
title: '微信快捷支付',
payStatus: 1,
},
{
name: "支付宝支付",
icon: "icon-icon34",
// #ifdef H5 || APP-PLUS
value: 'alipay',
// #endif
// #ifdef MP
value: 'alipayQr',
// #endif
title: '支付宝支付',
payStatus: this.$store.getters.globalData.alipay_open
},
{
"name": "余额支付",
"icon": "icon-icon-test",
value: 'balance',
title: '可用余额:',
payStatus: this.$store.getters.globalData.yue_pay_status,
},
{
"name": "线下支付",
"icon": "icon-yinhangqia",
value: 'offline',
title: '线下支付',
payStatus: 2,
}, {
"name": "先货后款",
"icon": "tan-a-lujing17324",
value: 'creditBuy',
title: `结算周期:${this.settle_cycle}天 日利率:${this.interest_rate}%`,
payStatus: '',
},
],
tagStyle: {
img: 'width:100%;display:block;',
video: 'width:100%;'
},
radioList: [{
title: this.deliveryName,
check: true
}, {
title: '到店核销',
check: false
}],
payType: 'weixin', //支付方式
openType: 1, //优惠券打开方式 1=使用
active: 0, //支付方式切换
address: {
address: false
}, //地址组件
invoice: {
invoice: false,
mer_id: 0,
add: true
}, //发票组件
couponId: 0, //优惠券id
cartId: '', //购物车id
userInfo: {}, //用户信息
post: {},
coupon_price: 0, //优惠券抵扣金额
useIntegral: false, //是否使用积分
integral_price: 0, //积分抵扣金额
integral: 0,
ChangePrice: 0, //使用积分抵扣变动后的金额
formIds: [], //收集formid
status: 0,
is_address: false,
toPay: false, //修复进入支付时页面隐藏从新刷新页面
shippingType: 0,
system_store: {},
storePostage: 0,
contacts: '',
contactsTel: '',
mydata: {},
storeList: [],
store_self_mention: 0,
cartInfo: [],
priceGroup: {},
animated: false,
totalPrice: 0,
use_integral: false,
pagesUrl: "",
orderKey: "",
offlinePostage: "",
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
from: '',
orderStatus: '', //是否有地址
couponIndex: 0, //选择商铺优惠券索引
subCoupon: {}, //提交订单使用的优惠券
proPrice: 0, //商品总价
isShowBox: false,
invoice_func: false,
special_invoice: false,
isAgree: false,
showProtocol: false,
isCoupon: false,
protocol: '',
order_type: 0,
addInvoice: {},
couponData: {},
orderPay: false,
take: [],
open_integral: 0,
coupon_number: 0,
store_coupon_number: 0,
coupon_amount: 0,
store_coupon_amount: 0,
plant_coupon_amount: 0,
integral_count: '',
pics: [],
order_model: 2,
order_extend: [],
extend: [],
virtualIndex: 0,
platformCoupon: [],
total_platform_coupon_price: 0,
enabledPlatformCoupon: false,
plantCoupon: false,
order_key: '',
is_take: '',
product_type: '',
source: null,
settle_cycle: '', // 周期
type_id: '', //店铺类型
consumption_id: '', //补贴id
consumption_money: '', //补贴抵扣金额
payForm: {
cart_id: '',
address_id: '',
use_coupon: '',
takes: '',
use_integral: '',
receipt_data: [],
mark: '',
pay_type: '',
money: '',
merName: '',
return_url: ''
}
};
},
computed: {
...mapGetters(['isLogin', 'viewColor']),
...configMap(['hide_mer_status', 'yue_pay_status']),
},
watch: {
yue_pay_status(n) {
this.payMode[2].payStatus = n
}
},
onLoad: function(options) {
this.payForm.cart_id = options.cartId;
this.payForm.money = options.money;
this.payForm.merName = options.merName;
// #ifdef H5
this.from = this.$wechat.isWeixin() ? 'weixin' : 'h5'
// #endif
// #ifdef MP
this.from = 'routine'
// #endif
// #ifdef APP-PLUS
this.from = 'weixin'
// #endif
if (!this.isLogin) {
this.isAuto = true;
this.isShowAuth = true
}
if (this.payType == 'weixin') {
this.payType = this.from
}
let _this = this
this.textareaStatus = true;
uni.setStorage({
key: 'invoice_Data',
data: {},
success: function() {}
})
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
this.getUserInfo()
return;
let that = this;
if (this.isLogin && this.toPay == false && !this.orderPay) {
// this.getaddressInfo();
this.$nextTick(function() {
this.$refs.addressWindow.getAddressList();
})
}
},
methods: {
/*预售协议*/
getPresellAgree: function() {
this.showProtocol = true
this.agrementTtile = '预售协议'
presellAgreement().then(res => {
this.protocol = res.data.sys_product_presell_agree;
})
},
changeIsAgree: function(e) {
this.isAgree = !this.isAgree;
},
changeIntegral: function(e) {
this.use_integral = !this.use_integral;
this.getConfirm(this.addressId);
},
showPresellAgree() {
this.getPresellAgree()
},
showCoupon() {
this.getCouponAgreement();
},
// 图片预览
// 获得相册 idx
getPhotoClickIdx(e) {
let _this = this;
let idx = e.currentTarget.dataset.index;
_this.imgPreview(_this.pics, idx);
},
// 图片预览
imgPreview: function(list, idx) {
// list图片 url 数组
if (list && list.length > 0) {
uni.previewImage({
current: list[idx], // 传 Number H5端出现不兼容
urls: list
});
}
},
// 获取个人信息
getUserInfo() {
getUserInfo().then(res => {
this.userInfo = res.data
})
},
/**
* 授权回调事件
*
*/
onLoadFun: function() {
this.isShowAuth = false;
this.getaddressInfo();
this.getUserInfo();
//调用子页面方法授权后执行获取地址列表
// this.$scope.selectComponent('#address-window').getAddressList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e;
},
ChangCouponsClone: function() {
this.$set(this.coupon, 'status', false);
},
changeTextareaStatus: function() {
for (let i = 0, len = this.coupon.list.length; i < len; i++) {
this.coupon.list[i].use_title = '';
this.coupon.list[i].is_use = 0;
}
this.textareaStatus = true;
this.status = 0;
this.$set(this.coupon, 'list', this.coupon.list);
},
/**
* 获取当前订单详细信息
*
*/
getConfirm: function(address_id) {
let that = this;
uni.showLoading({
title: '',
mask: true
});
getOrderConfirm({
cart_id: that.cartId.split(","),
address_id: address_id,
takes: that.take,
consumption_id: this.consumption_id,
use_coupon: that.subCoupon,
use_integral: that.use_integral,
product_type: that.product_type,
source: that.source
}).then(res => {
// 默认选中
that.product_type = res.data.order_type
that.is_take = false;
that.platformConsumption = res.data.platformConsumption;
res.data.order.forEach(el => {
if (el.order.isTake == 1) that.is_take = true
el.isTake = 0
that.subCoupon[el.mer_id] = []
el.coupon.forEach(coupon => {
if (coupon.checked) {
that.subCoupon[el.mer_id].push(coupon.coupon_user_id)
}
})
})
that.subCoupon['0'] = []
if (res.data.platformCoupon?.length > 0) {
res.data.platformCoupon.forEach(el => {
if (el.checked) {
that.subCoupon[el.mer_id] = []
that.subCoupon[el.mer_id].push(el.coupon_user_id)
}
})
} else res.data.platformCoupon = [];
that.consumption_money = res.data.consumption_money;
that.$set(that.coupon, "coupon", that.plantCoupon ? res.data.platformCoupon : res.data
.order[that.couponIndex].coupon);
that.$set(that, "store_coupon_number", res.data.order[that.couponIndex].order.useCouponIds
.length);
that.$set(that, "coupon_amount", parseFloat(res.data.order[that.couponIndex].order
.coupon_price) + parseFloat(res.data.total_platform_coupon_price));
that.$set(that, "store_coupon_amount", parseFloat(res.data.order[that.couponIndex].order
.coupon_price));
that.$set(that, "plant_coupon_amount", parseFloat(res.data.total_platform_coupon_price));
that.$set(that, 'couponData', res.data);
that.$set(that, 'cartInfo', res.data.order);
that.$set(that, 'total_platform_coupon_price', res.data.total_platform_coupon_price);
that.$set(that, 'enabledPlatformCoupon', res.data.enabledPlatformCoupon);
that.$set(that, 'platformCoupon', res.data.platformCoupon);
that.$set(that, 'order_type', res.data.order_type);
that.$set(that, 'coupon_price', res.data.order_coupon_price);
that.$set(that, 'integral_count', res.data.order_total_integral);
that.$set(that, 'integral_price', res.data.order_total_integral_price);
that.$set(that, 'open_integral', res.data.openIntegral);
that.$set(that, 'use_integral', res.data.useIntegral);
that.$set(that, 'order_extend', (that.order_extend && that.order_extend.length > 0) ? that
.order_extend : res.data.order_extend);
that.totalPrice = res.data.order_price
that.orderStatus = res.data.status
that.proPrice = res.data.total_price
that.order_type = res.data.order_type
that.order_model = res.data.order_model
that.order_key = res.data.key
uni.getStorage({
key: "invoice_Data",
success: function(res) {
that.addInvoice = res.data;
if (res.data) {
that.getInvoiceDatas(res.data)
}
}
})
uni.hideLoading();
}).catch(err => {
return this.$util.Tips({
title: err
}, {
tab: 3,
url: 1
});
});
},
payItem: function(e) {
let that = this;
let active = e;
that.active = active;
// console.log(this.active);
that.animated = true;
that.payType = that.cartArr[active].value;
if (that.payType == 'weixin') {
that.payType = that.from
}
},
couponTap: function(item, index) {
this.coupon = item
this.$set(this.coupon, 'status', true)
this.couponIndex = index
this.plantCoupon = false
this.$set(this, "coupon_number", this.store_coupon_number);
this.$set(this, "coupon_amount", this.store_coupon_amount);
},
couponTap2: function(item, index) {
this.coupon = {
coupon: item,
mer_id: 0,
status: true
}
this.plantCoupon = true
this.$set(this, "coupon_number", this.subCoupon['0'].length);
this.$set(this, "coupon_amount", this.plant_coupon_amount);
},
couponTap3: function(item, index) {
uni.navigateTo({
url: '/pages/redpacket/redpacket',
success: (res) => {
res.eventChannel.emit('changeRedPacketInfo', this.platformConsumption)
uni.$once('changeRedPacket', (data) => {
this.consumption_id = data;
})
}
})
},
car: function() {
let that = this;
that.animated = false;
},
onAddress: function() {
let that = this;
if (that.addressInfo.real_name) {
that.textareaStatus = false;
that.address.address = true;
// that.pagesUrl = '/pages/users/user_address/index?cartId=' + this.cartId + '&pinkId=' + this
// .pinkId + '&couponId=' + this.couponId;
that.pagesUrl = '/pages/users/user_address_list/index'
} else {
// uni.navigateTo({
// url: `/pages/users/user_address/index?cartId=${this.cartId}`,
// });
uni.navigateTo({
url: `pages/users/user_address_list/index`,
});
}
},
payment: function(data) {
let that = this;
createOrder(data).then(res => {
let status = res.data.status,
orderId = res.data.result.order_id,
callback_key = res.data.result.pay_key,
jsConfig = res.data.result.config,
// 暂不跳转
goPages = '/pages/order_pay_status/index?order_id=' + orderId + '&msg=' + res.message +
'&product_type=' + that.product_type + '&source=' + that.source,
goPagesOrder = '/pages/order_details/stay?order_id=' + orderId +
'&credit_buy=1&product_type=' + that.product_type;
that.orderPay = true;
uni.hideLoading();
switch (status) {
case 'ORDER_EXIST':
case 'EXTEND_ORDER':
case 'PAY_ERROR':
case 'error':
return that.$util.Tips({
title: res.message
}, {
tab: 5,
url: goPagesOrder
});
break;
case 'success':
return that.$util.Tips({
title: res.message,
icon: 'success'
}, {
tab: 5,
url: goPages
});
break;
case 'alipay':
case "alipayQr":
// uni.navigateTo({
// url: '/pages/order_pay_back/index?keyCode=' + callback_key + '&url=' +
// jsConfig
// })
return;
break;
// #ifndef MP
case "wechat":
case "weixin":
case "weixinApp":
jsConfig.timeStamp = jsConfig.timestamp;
// #ifndef APP-PLUS
this.$wechat.pay(jsConfig).then(res => {
return that.$util.Tips({
title: res.message,
icon: 'success'
}, {
tab: 4,
url: goPages
});
}).catch(res => {
if (res.errMsg == 'chooseWXPay:cancel') return that.$util.Tips({
title: '取消支付'
}, {
tab: 5,
url: goPages + '&status=0'
});
})
// #endif
// #ifdef APP-PLUS
let mp_pay_name = ''
if (uni.requestOrderPayment) {
mp_pay_name = 'requestOrderPayment'
} else {
mp_pay_name = 'requestPayment'
}
uni[mp_pay_name]({
provider: 'wxpay',
orderInfo: jsConfig,
success: (e) => {
// 暂不跳转
let url = '/pages/order_pay_status/index?order_id=' + orderId +
'&msg=支付成功' + '&product_type=' + that.product_type +
'&source=' + that.source;
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 4,
url: url
});
},
fail: (e) => {
console.log(e, '111111111')
// 暂不跳转
let url = '/pages/order_pay_status/index?order_id=' + orderId +
'&msg=取消支付' + '&product_type=' + that.product_type +
'&source=' + that.source;
return that.$util.Tips({
title: '取消支付',
}, {
tab: 4,
url: url
});
},
complete: (res) => {
uni.hideLoading();
// 暂不跳转
// let url = '/pages/order_pay_status/index?order_id=' + orderId +
// '&msg=取消支付' + '&product_type=' + that.product_type + '&source=' + that.source;
// return that.$util.Tips({
// title: '取消支付',
// }, {
// tab: 4,
// url: url
// });
},
});
// #endif
break;
// #endif
// #ifdef MP
case "routine":
jsConfig.timeStamp = jsConfig.timestamp;
that.toPay = true;
let mp_pay_name = ''
if (uni.requestOrderPayment) {
mp_pay_name = 'requestOrderPayment'
} else {
mp_pay_name = 'requestPayment'
}
uni[mp_pay_name]({
...jsConfig,
success: function(res) {
uni.hideLoading();
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 5,
url: goPages
});
},
fail: function(e) {
// 暂不跳转
let pages = '/pages/order_pay_status/index?order_id=' +
orderId + '&msg=取消支付' + '&product_type=' + that
.product_type + '&source=' + that.source;
return that.$util.Tips({
title: '取消支付'
}, {
tab: 5,
url: pages + '&status=0'
});
},
})
break;
// #endif
case "balance":
//余额
return that.$util.Tips({
title: res.msg
}, {
tab: 5,
url: goPages + '&status=1'
});
break;
// #ifdef H5
case 'h5':
let host = window.location.protocol + "//" + window.location.host;
let url =
`${host}/pages/order_pay_status/index?order_id=${orderId}&msg=${res.message}&product_type=${that.product_type}&source${that.source}`
let eUrl = encodeURIComponent(url)
let jsurl = jsConfig.mweb_url || jsConfig.h5_url
let locations = `${jsurl}&redirect_url=${eUrl}`
// 暂不跳转
setTimeout(() => {
location.href = locations;
}, 100);
break;
// #endif
// #ifdef APP-PLUS
case 'alipayApp':
uni.requestPayment({
provider: 'alipay',
orderInfo: jsConfig,
success: (e) => {
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 5,
url: goPages
});
},
fail: (e) => {
// 暂不跳转
let pages = '/pages/order_pay_status/index?order_id=' +
orderId + '&msg=支付失败' + '&product_type=' + that
.product_type + '&source=' + that.source
return that.$util.Tips({
title: '支付失败'
}, {
tab: 5,
url: pages
});
},
complete: () => {
uni.hideLoading();
// // 暂不跳转
// let pages = '/pages/order_pay_status/index?order_id=' +
// orderId + '&msg=取消支付' + '&product_type=' + that
// .product_type + '&source=' + that.source
// return that.$util.Tips({
// title: '取消支付'
// }, {
// tab: 5,
// url: pages
// });
},
});
break;
// #endif
default:
// 暂不跳转
let pages = '/pages/order_pay_status/index?order_id=' +
orderId + '&msg=取消支付' + '&product_type=' + that.product_type + '&source=' +
that.source
return that.$util.Tips({
title: '取消支付'
}, {
tab: 5,
url: pages + '&status=0'
});
}
}).catch(err => {
uni.hideLoading();
return that.$util.Tips({
title: err
});
});
},
isEmojiCharacter: function(substring) {
if (substring) {
for (var i = 0; i < substring.length; i++) {
var hs = substring.charCodeAt(i);
if (0xd800 <= hs && hs <= 0xdbff) {
if (substring.length > 1) {
var ls = substring.charCodeAt(i + 1);
var uc = ((hs - 0xd800) * 0x400) + (ls - 0xdc00) + 0x10000;
if (0x1d000 <= uc && uc <= 0x1f77f) {
return true;
}
}
} else if (substring.length > 1) {
var ls = substring.charCodeAt(i + 1);
if (ls == 0x20e3) {
return true;
}
} else {
if (0x2100 <= hs && hs <= 0x27ff) {
return true;
} else if (0x2B05 <= hs && hs <= 0x2b07) {
return true;
} else if (0x2934 <= hs && hs <= 0x2935) {
return true;
} else if (0x3297 <= hs && hs <= 0x3299) {
return true;
} else if (hs == 0xa9 || hs == 0xae || hs == 0x303d || hs == 0x3030 ||
hs == 0x2b55 || hs == 0x2b1c || hs == 0x2b1b ||
hs == 0x2b50) {
return true;
}
}
}
}
},
bindDateChange(e) {
let that = this
that.$set(that.order_extend[that.virtualIndex], 'value', e.detail.value);
},
getTime(index) {
this.virtualIndex = index;
},
SubOrder: function() {
let that = this,
data = {};
if (!that.payType) return that.$util.Tips({
title: '请选择支付方式'
});
this.payForm.pay_type = that.payType;
uni.showLoading({
title: '订单支付中',
mask: true
});
// 支付
orderPay(this.payForm).then(res => {
uni.hideLoading();
console.log(res)
}).catch(() => {
uni.hideLoading();
})
// this.cartInfo.map(el => {
// if (el.isTake == 1 || el.order.isTake) {
// data.takes.push(el.mer_id)
// }
// })
// if (data.payType == 'balance' && parseFloat(that.userInfo.now_money) < parseFloat(that.totalPrice))
// return that.$util
// .Tips({
// title: '余额不足!'
// });
// data.consumption_id = this.consumption_id;
// // #ifdef MP
// openPaySubscribe().then(() => {
// that.payment(data);
// });
// // #endif
// // #ifndef MP
// that.payment(data);
// // #endif
},
// 继续支付
closeAndSubOrder() {
this.closeTipsRef();
this.$nextTick(() => {
this.SubOrder();
})
}
}
}
</script>
<style lang="scss" scoped>
/deep/checkbox .uni-checkbox-input.uni-checkbox-input-checked,
/deep/checkbox .wx-checkbox-input.wx-checkbox-input-checked {
border: 1px solid var(--view-theme) !important;
background-color: var(--view-theme) !important;
color: #fff !important;
}
.order-submission .line {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 3rpx;
}
.order-submission .line image {
width: 100%;
height: 100%;
display: block;
}
.order-submission .address {
padding: 28rpx 30rpx;
background-color: #fff;
box-sizing: border-box;
}
.order-submission .address .addressCon {
width: 610rpx;
font-size: 26rpx;
color: #666;
}
.order-submission .address .addressCon .name {
font-size: 30rpx;
color: #282828;
font-weight: bold;
margin-bottom: 10rpx;
}
.order-submission .address .addressCon .name .phone {
margin-left: 50rpx;
}
.order-submission .address .addressCon .default {
margin-right: 12rpx;
}
.t-color {
color: var(--view-theme);
}
.order-submission .address .addressCon .setaddress {
color: #333;
font-size: 28rpx;
}
.order-submission .address .iconfont {
font-size: 35rpx;
color: #707070;
}
.order-submission .allAddress {
width: 100%;
}
.order-submission .allAddress .nav {
width: 710rpx;
margin: 0 auto;
}
.order-submission .allAddress .nav .item {
width: 355rpx;
}
.order-submission .allAddress .nav .item.on {
position: relative;
width: 250rpx;
}
.order-submission .allAddress .nav .item.on::before {
position: absolute;
bottom: 0;
content: "快递配送";
font-size: 28rpx;
display: block;
height: 0;
width: 336rpx;
border-width: 0 20rpx 80rpx 0;
border-style: none solid solid;
border-color: transparent transparent #fff;
z-index: 2;
border-radius: 7rpx 30rpx 0 0;
text-align: center;
line-height: 80rpx;
}
.order-submission .allAddress .nav .item:nth-of-type(2).on::before {
content: "到店核销";
border-width: 0 0 80rpx 20rpx;
border-radius: 30rpx 7rpx 0 0;
}
.order-submission .allAddress .nav .item.on2 {
position: relative;
}
.order-submission .allAddress .nav .item.on2::before {
position: absolute;
bottom: 0;
content: "到店核销";
font-size: 28rpx;
display: block;
height: 0;
width: 400rpx;
border-width: 0 0 60rpx 60rpx;
border-style: none solid solid;
border-color: transparent transparent #f7c1bd;
border-radius: 40rpx 6rpx 0 0;
text-align: center;
line-height: 60rpx;
}
.order-submission .allAddress .nav .item:nth-of-type(1).on2::before {
content: "快递配送";
border-width: 0 60rpx 60rpx 0;
border-radius: 6rpx 40rpx 0 0;
}
.order-submission .allAddress .address {
height: 150rpx;
margin: 0 auto;
}
.order-submission .allAddress .line {
margin: 0 auto;
}
.order-submission .wrapper .item .discount .placeholder {
color: #ccc;
text-align: right;
}
.order-submission .wrapper {
margin-bottom: 12rpx;
background-color: #fff;
}
.order-submission .wrapper .item {
padding: 27rpx 30rpx;
font-size: 30rpx;
color: #282828;
}
.order-submission .virtual_form {
padding: 0 30rpx;
}
/deep/.order-submission .virtual_form .uni-input-wrapper {
text-align: right;
}
.order-submission .virtual_form .item-require {
color: red;
margin-right: 4rpx;
}
.order-submission .virtual_form .item {
border-bottom: 1rpx solid #EEEEEE;
padding: 27rpx 0;
}
.upload {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-o-box-lines: multiple;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.order-submission .virtual_form .pictrue {
width: 156rpx;
height: 156rpx;
margin: 24rpx 20rpx 0 0;
position: relative;
font-size: 11px;
color: #bbb;
border-radius: 3rpx;
&:nth-child(4n) {
margin-right: 0;
}
&:nth-last-child(1) {
border: 0.5px solid #ddd;
box-sizing: border-box;
}
uni-image,
image {
width: 100%;
height: 100%;
border-radius: 1px;
img {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
display: block;
position: absolute;
top: 0;
left: 0;
opacity: 0;
width: 100%;
height: 100%;
}
}
.icon-guanbi4 {
color: #fff;
font-size: 14rpx;
position: absolute;
top: 0;
right: 0;
width: 30rpx;
height: 30rpx;
text-align: center;
line-height: 30rpx;
border-radius: 0 8rpx 0 8rpx;
background: rgba(0, 0, 0, .6);
}
}
.vipImg {
width: 65rpx;
height: 28rpx;
margin-left: 4rpx;
image {
width: 100%;
height: 100%;
display: block;
}
}
.order-submission .wrapper .item .discount {
font-size: 30rpx;
color: #999;
&.discount_voice {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 500rpx;
text-align: right;
}
}
.order-submission .wrapper .item .discount .iconfont {
color: #515151;
font-size: 30rpx;
margin-left: 15rpx;
}
.order-submission .wrapper .item .discount .num {
font-size: 32rpx;
margin-right: 20rpx;
}
.order-submission .wrapper .item .shipping {
font-size: 30rpx;
color: #999;
position: relative;
padding-right: 58rpx;
}
.order-submission .wrapper .item .shipping .iconfont {
font-size: 35rpx;
color: #707070;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
margin-left: 30rpx;
}
.order-submission .wrapper .item input {
flex: 1;
height: 100%;
margin-left: 20rpx;
text-align: right;
}
.order-submission .wrapper .item .placeholder {
color: #ccc;
}
.order-submission .wrapper .item .list {
margin-top: 35rpx;
}
.order-submission .wrapper .item .list .payItem {
border: 1px solid #eee;
border-radius: 6rpx;
height: 86rpx;
width: 100%;
box-sizing: border-box;
margin-top: 20rpx;
font-size: 28rpx;
color: #282828;
}
.order-submission .wrapper .item .list .payItem.on {
border-color: var(--view-theme);
color: var(--view-theme);
}
.order-submission .wrapper .item .list .payItem .name {
width: 50%;
text-align: center;
border-right: 1px solid #eee;
justify-content: left;
padding-left: 80rpx;
}
.order-submission .wrapper .item .list .payItem .name .iconfont {
width: 44rpx;
height: 44rpx;
border-radius: 50%;
text-align: center;
line-height: 44rpx;
background-color: #fe960f;
color: #fff;
font-size: 30rpx;
margin-right: 15rpx;
}
.order-submission .wrapper .item .list .payItem .name .iconfont.icon-weixin2 {
background-color: #41b035;
}
.order-submission .wrapper .item .list .payItem .name .iconfont.icon-icon34 {
background-color: #4295D5;
}
.order-submission .wrapper .item .list .payItem .tip {
width: 49%;
text-align: center;
font-size: 26rpx;
color: #aaa;
}
.order-submission .moneyList {
margin-top: 12rpx;
background-color: #fff;
padding: 30rpx;
}
.order-submission .moneyList .item {
font-size: 28rpx;
color: #282828;
}
.order-submission .moneyList .item~.item {
margin-top: 20rpx;
}
.order-submission .moneyList .item .money {
color: #868686;
}
.order-submission .footer {
width: 100%;
height: 100rpx;
height: calc(100rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
height: calc(100rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
background-color: #fff;
padding: 0 30rpx;
font-size: 28rpx;
color: #333;
box-sizing: border-box;
position: fixed;
bottom: 0;
left: 0;
z-index: 30;
.footer_count {
font-size: 28rpx;
}
.coupon_price {
color: #999999;
font-size: 20rpx;
margin-top: 10rpx;
text {
color: #282828;
padding: 2rpx 10rpx;
background: #F5F5F5;
border-radius: 26rpx;
margin-left: 20rpx;
line-height: 30rpx;
height: 30rpx;
display: inline-block;
}
}
}
.pColor {
color: var(--view-priceColor);
}
.order-submission .footer .settlement {
font-size: 30rpx;
color: #fff;
width: 240rpx;
height: 70rpx;
background-color: var(--view-theme);
border-radius: 50rpx;
text-align: center;
line-height: 70rpx;
&.disabled {
background-color: #cccccc;
}
}
.footer .transparent {
opacity: 0
}
.event_bg {
background: #FF7F00;
}
.event_color {
color: #FF7F00;
}
.color_red {
color: var(--view-theme);
}
.storeinfo-wrapper {
.store-item {
margin-top: 12rpx;
background-color: #fff;
.store-title {
display: flex;
align-items: center;
padding: 28rpx 30rpx;
.icon-shangjiadingdan {
font-size: 32rpx;
}
.icon-xiangyou {
font-size: 26rpx;
color: #999;
}
.txt {
margin: 0 8rpx;
}
}
.product-item {
display: flex;
padding: 25rpx 30rpx;
border-top: 1px solid #F0F0F0;
.img-box {
width: 130rpx;
height: 130rpx;
image {
width: 130rpx;
height: 130rpx;
border-radius: 16rpx;
}
}
.content {
position: relative;
width: 550rpx;
margin-left: 30rpx;
font-size: 28rpx;
color: #282828;
overflow: hidden;
&.event_content {
.line1 {
width: 360rpx;
}
.price {
position: absolute;
top: 0;
right: 0;
margin-top: 0;
text {
display: block;
text-align: right;
}
}
}
.event_name {
display: inline-block;
margin-right: 9rpx;
color: #fff;
font-size: 20rpx;
padding: 0 8rpx;
line-height: 30rpx;
text-align: center;
border-radius: 6rpx;
}
.event_ship {
font-size: 20rpx;
margin-top: 10rpx;
}
.label {
margin-top: 10rpx;
color: #868686;
font-size: 20rpx;
}
.price {
margin-top: 20rpx;
color: var(--view-priceColor);
position: relative;
text {
margin-left: 10rpx;
color: #999;
}
.delivery_type {
float: right;
text {
color: var(--view-priceColor);
font-size: 20rpx;
}
}
}
.err-txt {
display: flex;
align-items: center;
margin-top: 18rpx;
color: $theme-color;
.iconfont {
margin-right: 10rpx;
}
}
.step {
position: absolute;
right: 0;
top: 100rpx;
display: flex;
align-items: center;
.min {
width: 50rpx;
height: 40rpx;
background-image: url('~@/static/images/min.png');
background-size: 17rpx 17rpx;
background-position: center;
background-repeat: no-repeat;
}
.num-box {
width: 68rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background: #F2F2F2;
font-size: 23rpx;
}
.add {
width: 50rpx;
height: 40rpx;
background-image: url('~@/static/images/add.png');
background-size: 17rpx 17rpx;
background-position: center;
background-repeat: no-repeat;
}
}
}
}
}
.event_payTime {
padding: 0 30rpx 24rpx;
.event_progress {
margin-top: 50rpx;
position: relative;
}
.progress_step {
height: 80rpx;
position: relative;
padding-left: 60rpx;
&::before {
content: '';
display: block;
width: 2rpx;
height: 40rpx;
background: var(--view-theme);
position: absolute;
left: 35rpx;
top: 18rpx;
}
&:nth-child(2) {
&::before {
bottom: 64rpx;
top: auto;
background: #EFEFEF;
}
&::after {
background: #EFEFEF;
}
}
&::after {
content: '';
display: block;
width: 14rpx;
height: 14rpx;
background: var(--view-theme);
border-radius: 50%;
position: absolute;
top: 10rpx;
left: 29rpx;
}
.name {
float: left;
color: #282828;
&.color_red {
color: var(--view-theme);
}
}
.price {
float: right;
color: #282828;
&.color_red {
color: var(--view-priceColor);
}
}
}
.progress_pay {
padding-left: 60rpx;
font-size: 24rpx;
color: #868686;
margin-top: -34rpx;
}
}
}
.integral_checked {
margin-left: 10rpx;
position: relative;
top: -2rpx;
display: inline;
}
uni-checkbox-group,
.checkgroup {
width: 100%;
.checkbox {
float: right;
}
}
.icon-wenhao1 {
color: #868686;
margin-right: 6rpx;
}
.total {
display: flex;
justify-content: flex-end;
padding-right: 30rpx;
padding-bottom: 30rpx;
font-size: 26rpx;
color: #282828;
.price {
margin-left: 10rpx;
color: var(--view-priceColor);
font-size: 28rpx;
font-weight: bold;
text {
font-size: 20rpx;
}
}
}
.store-address {
padding: 30rpx 23rpx;
margin: 0 30rpx;
background: #F6F6F6;
border-radius: 8rpx;
font-size: 24rpx;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
/*垂直居中*/
-webkit-box-align: center;
/*旧版本*/
-moz-box-align: center;
/*旧版本*/
-ms-flex-align: center;
/*混合版本*/
-webkit-align-items: center;
/*新版本*/
align-items: center;
/*新版本*/
.name {
width: 148rpx;
margin-right: 20rpx;
}
.info {
flex: 1;
}
.map {
text-align: center;
padding-left: 40rpx;
position: relative;
&::before {
content: '';
display: inline-block;
width: 2rpx;
height: 42rpx;
background-color: #DDDDDD;
position: absolute;
left: 0;
top: 18rpx;
}
.iconfont {
color: var(--view-theme);
}
.map_text {
color: var(--view-theme);
}
}
}
.settlementAgreement {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, .5);
z-index: 40;
}
.settlementAgreement .setAgCount {
background: #fff;
width: 656rpx;
height: 458px;
position: absolute;
top: 50%;
left: 50%;
border-radius: 12rpx;
-webkit-border-radius: 12rpx;
padding: 52rpx;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
overflow: hidden;
.content {
height: 900rpx;
overflow-y: scroll;
/deep/ p {
font-size: 13px;
line-height: 22px;
}
/deep/ img {
max-width: 100%;
}
}
}
.settlementAgreement .setAgCount .icon {
font-size: 42rpx;
color: #b4b1b4;
position: absolute;
top: 15rpx;
right: 15rpx;
}
.settlementAgreement .setAgCount .title {
color: #333;
font-size: 32rpx;
text-align: center;
font-weight: bold;
}
.settlementAgreement .setAgCount .content {
margin-top: 32rpx;
color: #333;
font-size: 26rpx;
line-height: 22px;
text-align: justify;
text-justify: distribute-all-lines;
height: 756rpx;
overflow-y: scroll;
}
.red_packet {
color: #ff5c2d !important;
background-color: rgba(#ff5c2d, 0.3);
border-radius: 60rpx;
padding: 5rpx 10rpx;
padding-left: 20rpx;
font-size: 25rpx;
}
.tips_popup {
width: 600rpx;
height: 450rpx;
position: relative;
.r_c_gb {
width: 100%;
height: 420rpx;
margin-top: 30rpx;
}
.ref_content {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
box-sizing: border-box;
padding: 120rpx 30rpx 30rpx 30rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
color: #2E2E2E;
font-size: 28rpx;
.r_c_title {
font-weight: blod;
}
.r_c_text {
font-size: 26rpx;
}
.r_c_btn {
display: flex;
justify-content: space-around;
.r_c_btn1 {
background-color: transparent;
border: 5rpx solid #FF874C;
color: #FF874C;
font-size: 28rpx;
padding: 5rpx 28rpx;
border-radius: 60rpx;
}
.r_c_btn2 {
background-color: #FF874C;
border: 5rpx solid #FF874C;
color: #fff;
font-size: 28rpx;
padding: 5rpx 28rpx;
border-radius: 60rpx;
}
}
}
.r_c_close {
position: absolute;
top: 0;
right: 0;
height: 60rpx;
width: 60rpx;
}
}
</style>