1434 lines
38 KiB
Vue
1434 lines
38 KiB
Vue
<template>
|
|
<div class="settlement" :style="{ overflow: isShow ? 'hidden' : 'auto' }">
|
|
<div class="settlement-title">
|
|
<div
|
|
class="settlement-yy"
|
|
@click="getYy"
|
|
:class="{ 'settlement-color': active === 0 }"
|
|
>
|
|
<i class="yy-img" :class="{ 'yy-img-active': active === 0 }"></i>
|
|
预约
|
|
</div>
|
|
<div
|
|
class="settlement-ts"
|
|
@click="getTs"
|
|
:class="{ 'settlement-color': active === 1 }"
|
|
>
|
|
<i class="ts-img" :class="{ 'ts-img-active': active === 1 }"></i>
|
|
堂食
|
|
</div>
|
|
</div>
|
|
<div class="sellement-apponit-box">
|
|
<div class="sellement-apponit-unit" v-if="active === 0">
|
|
<!-- class="link-type" -->
|
|
<div class="time-title">联系方式</div>
|
|
<view class="radio-box bb1">
|
|
<input
|
|
type="number"
|
|
placeholder="请输入联系号码"
|
|
@input="bindKeyInput"
|
|
:value="phoneNumber"
|
|
/>
|
|
</view>
|
|
</div>
|
|
<div class="sellement-apponit-unit" v-if="active === 1 && tableNum != ''">
|
|
<!-- class="link-type" -->
|
|
<div class="time-title">就餐桌号</div>
|
|
<view class="radio-box" style="font-size: 28rpx">
|
|
{{ tableNum }}号
|
|
</view>
|
|
</div>
|
|
<div class="sellement-apponit-unit" v-if="active === 0">
|
|
<div class="time-title">就餐时间</div>
|
|
<radio-group
|
|
:value="radio"
|
|
@change="onChangeRadio"
|
|
class="radio-box bb1"
|
|
>
|
|
<radio
|
|
color="#CAA97F"
|
|
class="radio-list"
|
|
:name="deteTime[0].value"
|
|
@click="getRadio(deteTime[0])"
|
|
>
|
|
<!-- checked-color="#CAA97F" -->
|
|
|
|
<span class="radio-unit">{{ deteTime[0].name }}</span>
|
|
</radio>
|
|
<radio
|
|
class="radio-list"
|
|
color="#CAA97F"
|
|
:name="showTime"
|
|
checked-color="#CAA97F"
|
|
@click="getRadio({ value: showTime })"
|
|
>
|
|
<picker
|
|
ref="timePicker"
|
|
mode="time"
|
|
id="timePicker"
|
|
:value="time"
|
|
:start="start"
|
|
:end="end"
|
|
@change="bindTimeChange"
|
|
>
|
|
<view class="section">
|
|
<view class="picker">
|
|
{{ showTime }}
|
|
<div style="padding-top: 10rpx">
|
|
<van-icon name="arrow" size="28rpx" color="#333" />
|
|
</div>
|
|
</view>
|
|
</view>
|
|
</picker>
|
|
</radio>
|
|
</radio-group>
|
|
</div>
|
|
<div class="sellement-apponit-unit">
|
|
<div class="time-title">就餐方向</div>
|
|
<radio-group :value="storeId" class="radio-box bb1">
|
|
<!-- @change="onChangeStore" -->
|
|
|
|
<label
|
|
class="radio-list"
|
|
v-for="(item, index) in nowStore.ShopList"
|
|
:key="index"
|
|
>
|
|
<radio
|
|
color="#CAA97F"
|
|
:value="item.SERVERPARTSHOP_ID"
|
|
@click="getFx(item)"
|
|
/>
|
|
<!-- <span class="radio-unit">{{ item.SHOPNAME }}</span> -->
|
|
<span class="radio-unit">{{ item.SHOPDIRECTION }}</span>
|
|
</label>
|
|
</radio-group>
|
|
</div>
|
|
<div class="sellement-apponit-unit">
|
|
<div class="time-title">是否打包</div>
|
|
<radio-group
|
|
:value="isPackage"
|
|
@change="onChangeIsPackage"
|
|
class="radio-box bb1"
|
|
>
|
|
<view
|
|
class="radio-list"
|
|
v-for="(item, index) in packageList"
|
|
:key="index"
|
|
>
|
|
<radio
|
|
:value="item.value"
|
|
color="#CAA97F"
|
|
@click="getPackge(item)"
|
|
/>
|
|
<text class="radio-unit">{{ item.name }}</text>
|
|
</view>
|
|
</radio-group>
|
|
</div>
|
|
<div class="sellement-apponit-unit">
|
|
<span class="time-title">订单备注</span>
|
|
<view class="radio-box coupon-right" @click="goRemark">
|
|
<div class="coupon-remark">{{ remark || "口味、偏好" }}</div>
|
|
<van-icon
|
|
name="arrow"
|
|
size="28rpx"
|
|
custom-style="margin-left:12rpx;"
|
|
color="#999"
|
|
/>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="sellement-apponit-box">
|
|
<div class="time-title bb1">订单信息</div>
|
|
<!-- <div class="order-title">订单信息</div> -->
|
|
<div class="order-list" v-for="(item, i) in shopOrder" :key="i">
|
|
<div class="order-name">
|
|
{{
|
|
item.COMMODITY_RULE
|
|
? item.COMMODITY_NAME + "(" + item.COMMODITY_RULE + ")"
|
|
: item.COMMODITY_NAME
|
|
}}
|
|
</div>
|
|
<div class="order-num">x{{ item.ORDER_COUNT }}</div>
|
|
<div class="order-price">￥{{ item.AVERAGE_PRICE }}</div>
|
|
</div>
|
|
<div style="width: 100%; height: 1px; background: #ededed"></div>
|
|
<!-- <hr /> -->
|
|
<div class="price-sum">
|
|
<div class="coupon" @click="goCoupon" v-if="couponCout > 0">
|
|
<span class="coupon-title">优惠券</span>
|
|
<div class="coupon-right">
|
|
<div
|
|
:class="{
|
|
priceColor: couponAmount,
|
|
'icon-coupon': couponAmount === 0,
|
|
}"
|
|
>
|
|
{{ couponAmount > 0 ? "-￥" + couponAmount : "" }}
|
|
</div>
|
|
<van-icon
|
|
name="arrow"
|
|
size="28rpx"
|
|
custom-style="margin-left:12rpx;"
|
|
color="#999"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="coupon" v-if="packageAmount > 0">
|
|
<span class="coupon-title">打包费</span>
|
|
<span class="pay-price">￥{{ packageAmount }}</span>
|
|
</div>
|
|
<div class="coupon">
|
|
<span class="coupon-title">合计</span>
|
|
<span class="pay-price">￥{{ orderAmount }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="coupon sellement-apponit-box" @click="goRemark" >
|
|
<span class="coupon-title">备注</span>
|
|
<div class="coupon-right">
|
|
<div class="coupon-remark">{{remark||'口味、偏好'}}</div>
|
|
<van-icon name="arrow" size="28rpx" custom-style="padding-top:16rpx;margin-left:12rpx;" color="#999"/>
|
|
</div>
|
|
</div> -->
|
|
|
|
<div class="go-pay">
|
|
<div class="pay-left">
|
|
还需支付<span class="pay-price">￥{{ orderAmount }}</span>
|
|
</div>
|
|
<div class="pay-right" @click="goPayMent">去支付</div>
|
|
</div>
|
|
<UniPopup :show="isShow" position="bottom" overlay="false" @close="onClose">
|
|
<div class="bottom-box">
|
|
<div class="bottom-pop-title">确认支付方式</div>
|
|
<div class="bottom-content">
|
|
<van-radio-group :value="cardPay.payType" @change="changePayType">
|
|
<van-radio
|
|
name="余额支付"
|
|
checked-color="#CAA97F"
|
|
class="bottom-radio"
|
|
:disabled="!cardPay.canCardPay"
|
|
>
|
|
<span :class="{ disable: !cardPay.canCardPay }"
|
|
>余额支付<span style="font-size: 24rpx">{{
|
|
" (剩余:￥" +
|
|
cardPay.amount +
|
|
") " +
|
|
(!cardPay.canCardPay ? cardPay.reason : "")
|
|
}}</span></span
|
|
>
|
|
</van-radio>
|
|
<van-radio
|
|
name="微信支付"
|
|
checked-color="#CAA97F"
|
|
class="bottom-radio"
|
|
>
|
|
<span class="">微信支付</span>
|
|
</van-radio>
|
|
</van-radio-group>
|
|
</div>
|
|
|
|
<div class="bottom-btn" @click="createOrder">立即付款</div>
|
|
</div>
|
|
</UniPopup>
|
|
|
|
<UniPopup
|
|
:show="payShow"
|
|
position="bottom"
|
|
overlay="false"
|
|
ref="payPopup"
|
|
@close="handlePayClose"
|
|
:safe-area="false"
|
|
>
|
|
<div class="payShowBox">
|
|
<div class="payBoxTitle">支付方式</div>
|
|
|
|
<div class="payList">
|
|
<radio-group :value="payType" class="radio-group">
|
|
<div
|
|
class="bottom-radio"
|
|
color="#CAA97F"
|
|
@click="handleChangePayType(1)"
|
|
>
|
|
<div class="radioLeft">
|
|
<div class="logoBox">
|
|
<image
|
|
class="logoIcon"
|
|
src="/static/images/home/alipayIcon.png"
|
|
/>
|
|
</div>
|
|
<text>支付宝支付</text>
|
|
</div>
|
|
<radio
|
|
value="支付宝支付"
|
|
color="#CAA97F"
|
|
:checked="payType === 1"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="bottom-radio"
|
|
color="#CAA97F"
|
|
@click="handleChangePayType(2)"
|
|
>
|
|
<div class="radioLeft">
|
|
<div class="logoBox">
|
|
<image class="logoIcon" src="/static/images/home/wxPay.png" />
|
|
</div>
|
|
<text>微信支付</text>
|
|
</div>
|
|
<radio
|
|
value="微信支付"
|
|
color="#CAA97F"
|
|
:checked="payType === 2"
|
|
/>
|
|
</div>
|
|
</radio-group>
|
|
</div>
|
|
|
|
<div class="goPayBox" @click="handleRealGoPay">
|
|
<div class="goPay">确认支付</div>
|
|
</div>
|
|
</div>
|
|
</UniPopup>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import UniPopup from "@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue";
|
|
export default {
|
|
data() {
|
|
let newM = new Date().getTime();
|
|
let startT = newM + 1000 * 60 * 15;
|
|
return {
|
|
start: this.$utils.getLocalTime(startT, "hh:mm"),
|
|
end: "23:59",
|
|
time: this.$utils.getLocalTime(startT, "hh:mm"),
|
|
startT: this.$utils.getLocalTime(new Date(), "hh:mm"),
|
|
remark: "", // 备注
|
|
doorId: "",
|
|
storeId: "", // 门店id
|
|
active: 0,
|
|
radio: 30,
|
|
radio2: "",
|
|
radioType: 10,
|
|
type: 2000, // 判断预约还是堂食
|
|
showTime: "自定义",
|
|
phoneNumber: "",
|
|
// tableNum: "",
|
|
deteTime: [
|
|
// {
|
|
// name: '10分钟后到店',
|
|
// value: 10
|
|
// },
|
|
// {
|
|
// name: '20分钟后到店',
|
|
// value: 20
|
|
// },
|
|
{
|
|
name: "30分钟后到店",
|
|
value: 30,
|
|
},
|
|
],
|
|
packageList: [
|
|
{
|
|
name: "是",
|
|
value: 2000,
|
|
},
|
|
{
|
|
name: "否",
|
|
value: 1000,
|
|
},
|
|
],
|
|
isShow: false,
|
|
isPackage: 1000,
|
|
cardPay: {
|
|
payType: "余额支付", // 用户支付方式
|
|
reason: "",
|
|
canCardPay: true, // 是否可以余额支付
|
|
amount: "", // 实业饭卡余额
|
|
},
|
|
shopOrder: [],
|
|
shopList: [], // 方向列表
|
|
yyTime: "",
|
|
provinceCode: "",
|
|
couponCout: 0, // 可用优惠券数量
|
|
orderNumber: "", // 订单号
|
|
orderInternal: "", // 订单内码
|
|
payShow: false, // 支付方式的悬浮框
|
|
payType: 1, // 1 支付宝 2 微信
|
|
loginType: "", //
|
|
isMakeOrdering: false,
|
|
};
|
|
},
|
|
components: {
|
|
UniPopup,
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
user: "user",
|
|
tableNum: "orderTable",
|
|
orderRemark: "orderRemark",
|
|
// provinceCode: 'provinceCode',
|
|
couponPrice: "couponPrice",
|
|
nowStore: "nowStore",
|
|
}),
|
|
packageAmount() {
|
|
// 打包费
|
|
let amount = 0;
|
|
if (this.isPackage === 2000) {
|
|
this.shopOrder.map((n) => {
|
|
amount += n.ORDER_COUNT;
|
|
});
|
|
return amount;
|
|
} else {
|
|
return 0;
|
|
}
|
|
},
|
|
couponAmount() {
|
|
// 优惠金额
|
|
if (this.couponPrice) {
|
|
if (this.couponPrice.CouponType === 2000) {
|
|
// 折扣券
|
|
return (1 - this.couponPrice.UseAmount) * this.couponOrder;
|
|
} else {
|
|
// 满减券
|
|
return this.couponPrice.UseAmount;
|
|
}
|
|
} else {
|
|
return 0;
|
|
}
|
|
},
|
|
couponOrder() {
|
|
// 商品金额
|
|
let amount = 0;
|
|
this.shopOrder.map((v) => {
|
|
amount += v.ORDER_AMOUNT;
|
|
});
|
|
return amount;
|
|
},
|
|
orderAmount() {
|
|
// 支付金额
|
|
let _this = this;
|
|
this.remark = this.orderRemark;
|
|
let coast =
|
|
_this.couponOrder - Number(this.couponAmount) + this.packageAmount;
|
|
return coast > 0 ? Math.round(coast * 100) / 100 : 0;
|
|
},
|
|
},
|
|
methods: {
|
|
// 确认支付
|
|
handleRealGoPay() {
|
|
if (this.loginType === "android") {
|
|
if (this.payType === 1) {
|
|
uni.showModal({
|
|
title: "确认跳转支付宝？",
|
|
content: "点击确认将自动跳转到支付宝付款码页面",
|
|
confirmText: "确认",
|
|
cancelText: "取消",
|
|
success: function (res) {
|
|
plus.runtime.openURL(
|
|
`alipayqr://platformapi/startapp?saId=20000056`
|
|
);
|
|
},
|
|
});
|
|
} else if (this.payType === 2) {
|
|
uni.showModal({
|
|
title: "确认跳转微信？",
|
|
content: "跳转后点击首页右上角-->首付款",
|
|
confirmText: "确认",
|
|
cancelText: "取消",
|
|
success: function (res) {
|
|
plus.runtime.openURL(`weixin://`);
|
|
},
|
|
});
|
|
}
|
|
} else if (this.loginType === "min") {
|
|
}
|
|
},
|
|
// 改变支付方式
|
|
handleChangePayType(value) {
|
|
this.payType = value;
|
|
},
|
|
// 就餐方向
|
|
onChangeStore(event) {
|
|
this.storeId = event.detail.value; // 更新 storeId 的值
|
|
},
|
|
// 是否打包
|
|
onChangeIsPackage(event) {
|
|
this.isPackage = event.detail.value; // 更新 storeId 的值
|
|
},
|
|
// 就餐时间
|
|
onChangeRadio(event) {
|
|
this.radio = event.detail.value; // 更新 storeId 的值
|
|
},
|
|
// 去预约
|
|
changePayType(data) {
|
|
this.cardPay.payType = data.mp.detail;
|
|
},
|
|
onClose() {
|
|
this.isShow = false;
|
|
},
|
|
getYy() {
|
|
// eslint-disable-next-line eqeqeq
|
|
if (this.tableNum == 0) {
|
|
this.active = 0;
|
|
this.type = 2000;
|
|
}
|
|
},
|
|
getCardAmount() {
|
|
let _this = this;
|
|
_this.$api
|
|
.getCoop({
|
|
action_type: "GetIndustryMemberInfo",
|
|
serverpartShopId: _this.radio2,
|
|
})
|
|
.then((rs) => {
|
|
if (rs.ResultCode === "100") {
|
|
_this.cardPay.amount = rs.Data.INDUSTRY_ACCOUNT_BALANCE;
|
|
|
|
if (_this.cardPay.amount < _this.orderAmount) {
|
|
_this.cardPay.payType = "微信支付";
|
|
_this.cardPay.canCardPay = false;
|
|
_this.cardPay.reason = "余额不足";
|
|
} else {
|
|
_this.cardPay.payType = "余额支付";
|
|
_this.cardPay.canCardPay = true;
|
|
_this.cardPay.reason = "";
|
|
}
|
|
} else {
|
|
_this.cardPay.amount = rs.Data.INDUSTRY_ACCOUNT_BALANCE;
|
|
_this.cardPay.payType = "微信支付";
|
|
_this.cardPay.canCardPay = false;
|
|
_this.cardPay.reason = rs.ResultDesc;
|
|
}
|
|
_this.isShow = true;
|
|
_this.$forceUpdate();
|
|
});
|
|
},
|
|
getcoup() {
|
|
// 获取可使用的优惠券
|
|
let _this = this;
|
|
|
|
let arr = {
|
|
CouponStatus: 0,
|
|
provinceCode: this.provinceCode,
|
|
orderAmount: this.couponOrder,
|
|
serverpartShopId: this.storeId,
|
|
};
|
|
console.log("arr", arr);
|
|
|
|
_this.$api.$get("/WeChat/GetMemberCouponList", arr).then(function (data) {
|
|
console.log("data", data);
|
|
if (data.Result_Code === 100) {
|
|
_this.couponCout = data.Result_Data.List.length;
|
|
}
|
|
});
|
|
},
|
|
getTs() {
|
|
this.active = 1;
|
|
this.type = 1000;
|
|
},
|
|
getRadio(item) {
|
|
// 就餐时间
|
|
// if (this.radio === item.value) {
|
|
// this.radio = ''
|
|
// } else {
|
|
this.radio = item.value;
|
|
this.radioType = this.radio;
|
|
// console.log(this.radioType)
|
|
// }
|
|
},
|
|
getFx(item) {
|
|
console.log("方向", item);
|
|
// 方向
|
|
this.storeId = item.SERVERPARTSHOP_ID;
|
|
this.getcoup();
|
|
},
|
|
getPackge(item) {
|
|
// 是否打包
|
|
this.isPackage = item.value;
|
|
},
|
|
bindKeyInput(event) {
|
|
this.phoneNumber = event.mp.detail.value;
|
|
},
|
|
bindTimeChange(event) {
|
|
this.showTime = event.mp.detail.value;
|
|
let stime1 = this.showTime.split(":");
|
|
let stime2 = this.startT.split(":");
|
|
let st1 =
|
|
60 * Number(stime1[1]) +
|
|
Number(stime1[0]) * 3600 -
|
|
(60 * Number(stime2[1]) + Number(stime2[0]) * 3600);
|
|
this.radio = this.showTime;
|
|
this.radioType = st1 / 60;
|
|
},
|
|
goCoupon() {
|
|
uni.navigateTo({
|
|
url:
|
|
"/pages/shopPages/coupon/index?storeId=" +
|
|
this.storeId +
|
|
"&couponOrder=" +
|
|
this.couponOrder,
|
|
});
|
|
},
|
|
goRemark() {
|
|
uni.navigateTo({ url: "/pages/shopPages/orderRemark/index" });
|
|
},
|
|
|
|
createOrder() {
|
|
// 生成订单
|
|
let _this = this;
|
|
// _this.orderInternal
|
|
// eslint-disable-next-line no-constant-condition
|
|
if (0 === 1) {
|
|
if (
|
|
this.user.MEMBERSHIP_TYPE === 3000 &&
|
|
this.cardPay.payType === "余额支付"
|
|
) {
|
|
_this.payByCard();
|
|
} else {
|
|
_this.getOrderInfo(); // 微信支付
|
|
}
|
|
} else {
|
|
if (this.isMakeOrdering) {
|
|
uni.showToast({
|
|
title: "请勿连续点击！",
|
|
icon: "none",
|
|
});
|
|
return;
|
|
}
|
|
this.isMakeOrdering = true;
|
|
|
|
_this.$api
|
|
.postCoop({
|
|
action_type: "ScanOrder",
|
|
salebillType: 6000,
|
|
provinceCode: _this.provinceCode || "530000",
|
|
serverpartShopId: _this.storeId, // 门店内码
|
|
salebillDesc: _this.remark || "",
|
|
wechatOpenId: _this.user.WECHATAPP_OPENID || "",
|
|
wechatUnionId: _this.user.USER_UNIONID || "",
|
|
tableNumber: _this.tableNum || "",
|
|
takeType: _this.type,
|
|
packType: _this.isPackage,
|
|
reservationDate: _this.type === 2000 ? _this.radio : "",
|
|
orderPersonTel: _this.phoneNumber ? _this.phoneNumber : "",
|
|
couponCode: _this.couponAmount ? _this.couponPrice.CouponCode : "",
|
|
t_saleorderdetail: JSON.stringify(_this.shopOrder),
|
|
requestType: "application/x-www-form-urlencoded",
|
|
})
|
|
.then((res) => {
|
|
if (res.ResultCode === "100") {
|
|
console.log("res", res);
|
|
_this.handleWxPay(res.Data);
|
|
// 调起支付方式的悬浮框
|
|
// _this.$refs.payPopup.open("bottom");
|
|
// _this.payShow = true;
|
|
return;
|
|
// let _data = res.Data;
|
|
// _this.orderInternal = _data.SALEBILL_ID;
|
|
// _this.orderNumber = _data.SALEBILL_CODE;
|
|
|
|
// if (
|
|
// this.user.MEMBERSHIP_TYPE === 3000 &&
|
|
// this.cardPay.payType === "余额支付"
|
|
// ) {
|
|
// _this.payByCard();
|
|
// } else {
|
|
// _this.getOrderInfo(); // 微信支付
|
|
// }
|
|
} else {
|
|
// uni.showModal({
|
|
// title: "温馨提示",
|
|
// content: res.ResultDesc,
|
|
// showCancel: false,
|
|
// });
|
|
}
|
|
});
|
|
}
|
|
this.onClose();
|
|
},
|
|
// 微信支付的实际方法
|
|
async handleWxPay(obj) {
|
|
let _this = this;
|
|
// 拿到签名
|
|
let mchid = "1672298991";
|
|
let timeStamp = Math.ceil(new Date().getTime() / 1000);
|
|
let nonceStr = Math.random().toString(36).substring(2, 8);
|
|
let serial_no = "5BA7C0F427FC042DB5BF299E35B373D5EFCECD35";
|
|
// let out_trade_no = this.generateOutTradeNo(32)
|
|
let out_trade_no = obj.SALEBILL_CODE;
|
|
|
|
let req = {
|
|
appid: "wxee018fb96955552a", // 公众账号ID
|
|
mchid: "1672298991", // 商户号
|
|
description: "彩云驿商城", //商品描述
|
|
out_trade_no: out_trade_no, // 商户订单号
|
|
notify_url:
|
|
"https://mp.eshangtech.com/Coop.Merchant/Handler/Handler_Trade.ashx", // 商户回调地址
|
|
amount: {
|
|
total: Number(_this.orderAmount) * 100 || 1,
|
|
currency: "CNY",
|
|
}, // 订单金额
|
|
payer: {
|
|
openid: _this.user.WECHATAPP_OPENID,
|
|
}, // 支付者信息
|
|
};
|
|
console.log("req", req);
|
|
|
|
let reqSign = {
|
|
parameters:
|
|
"POST\n/v3/pay/transactions/jsapi\n" +
|
|
timeStamp +
|
|
"\n" +
|
|
nonceStr +
|
|
"\n" +
|
|
JSON.stringify(req) +
|
|
"\n",
|
|
provinceCode: _this.provinceCode || "530000",
|
|
};
|
|
|
|
const data = await this.$api.$get("/WeChat/GenerateSign", reqSign);
|
|
console.log("data3213123", data.Result_Data);
|
|
let Authorization = `mchid="${mchid}",nonce_str="${nonceStr}",signature="${data.Result_Data}",timestamp="${timeStamp}",serial_no="${serial_no}"`;
|
|
let AuthorizationStr = `WECHATPAY2-SHA256-RSA2048 ${Authorization}`;
|
|
console.log("AuthorizationStr", AuthorizationStr);
|
|
|
|
uni.request({
|
|
url: "https://api.mch.weixin.qq.com/v3/pay/transactions/jsapi",
|
|
method: "POST",
|
|
data: req,
|
|
header: {
|
|
Authorization: AuthorizationStr,
|
|
Accept: "application/json", //自定义请求头信息
|
|
"Content-Type": "application/json",
|
|
},
|
|
success: async (res) => {
|
|
console.log(res.data.prepay_id);
|
|
_this.text = "request success";
|
|
let paySign = "";
|
|
let reqSign = {
|
|
parameters:
|
|
"wxee018fb96955552a\n" +
|
|
timeStamp +
|
|
"\n" +
|
|
nonceStr +
|
|
"\nprepay_id=" +
|
|
res.data.prepay_id +
|
|
"\n",
|
|
};
|
|
const data = await _this.$api.$get("/WeChat/GenerateSign", reqSign);
|
|
paySign = data.Result_Data;
|
|
|
|
wx.requestPayment({
|
|
timeStamp: timeStamp.toString(),
|
|
nonceStr: nonceStr,
|
|
package: `prepay_id=${res.data.prepay_id}`,
|
|
signType: "RSA",
|
|
paySign: paySign,
|
|
total_fee: Number(_this.orderAmount) * 100 || 1,
|
|
success(res) {
|
|
console.log("res", res);
|
|
},
|
|
fail(res) {
|
|
console.log("fail", res);
|
|
},
|
|
complete(res) {
|
|
_this.isMakeOrdering = true;
|
|
uni.redirectTo({
|
|
url: `/pages/order/orderFoodDetail/index?orderInternal=${obj.SALEBILL_ID}`,
|
|
});
|
|
},
|
|
});
|
|
},
|
|
});
|
|
},
|
|
// 去支付
|
|
goPayMent() {
|
|
let _this = this;
|
|
if (this.type === 2000) {
|
|
if (this.radio === "自定义") {
|
|
uni.showToast({
|
|
title: "请选择预约时间",
|
|
icon: "none",
|
|
});
|
|
return false;
|
|
}
|
|
if (
|
|
!/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.phoneNumber) &&
|
|
!this.user.MEMBERSHIP_MOBILEPHONE
|
|
) {
|
|
uni.showToast({
|
|
title: "请输入联系号码，确保你的订单预约成功",
|
|
icon: "none",
|
|
});
|
|
return false;
|
|
}
|
|
this.phoneNumber = this.phoneNumber
|
|
? this.phoneNumber
|
|
: this.user.MEMBERSHIP_MOBILEPHONE;
|
|
}
|
|
|
|
if (!this.storeId) {
|
|
uni.showToast({
|
|
title: "请选择就餐方向",
|
|
icon: "none",
|
|
});
|
|
return false;
|
|
}
|
|
|
|
_this.createOrder();
|
|
|
|
// // 调起支付方式的悬浮框
|
|
// this.$refs.payPopup.open("bottom");
|
|
// this.payShow = true;
|
|
|
|
// if (this.user.MEMBERSHIP_TYPE === 3000) { // 判断是否是内部会员
|
|
// _this.getCardAmount()
|
|
// _this.isShow = true
|
|
// } else {
|
|
// _this.createOrder()
|
|
// }
|
|
},
|
|
// 关闭支付方式悬浮框
|
|
handlePayClose() {
|
|
this.$refs.payPopup.close();
|
|
this.payShow = false;
|
|
},
|
|
payByCard() {
|
|
// 实业饭卡支付
|
|
let _this = this;
|
|
_this.$api
|
|
.postCoop({
|
|
action_type: "ECodeConsume",
|
|
industryMembershipId: _this.user.INDUSTRY_MEMBERSHIP_ID,
|
|
saleBill: _this.orderInternal,
|
|
})
|
|
.then((rs) => {
|
|
if (rs.ResultCode === "100") {
|
|
// uni.showToast({
|
|
// title: '支付成功',
|
|
// icon: 'success',
|
|
// duration: 1000
|
|
// })
|
|
// _this.isShow = false
|
|
// setTimeout(() => {
|
|
_this.$store.commit("orderRemark", "");
|
|
_this.$store.commit("couponPrice", "");
|
|
_this.$store.commit("shopcartOrder", "");
|
|
_this.$store.commit("orderTable", "");
|
|
uni.redirectTo({
|
|
url:
|
|
"/pages/orders/orderdetail/index?type=1&orderNumber=" +
|
|
_this.orderNumber +
|
|
"&orderInternal=" +
|
|
_this.orderInternal,
|
|
});
|
|
// }, 1000)
|
|
} else {
|
|
uni.showToast({
|
|
title: rs.ResultDesc,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
}
|
|
});
|
|
},
|
|
// 获取后台信息调取微信支付
|
|
getOrderInfo() {
|
|
let _this = this;
|
|
_this.$api
|
|
.postCoop({
|
|
action_type: "JsApiPay",
|
|
action_data: 1,
|
|
action_record: _this.user.WECHATAPP_OPENID,
|
|
// action_record: 'ortWV5OP2g9P81cxxJYIIhrAezS4',
|
|
TOTAL_FEE: _this.orderAmount,
|
|
// TOTAL_FEE: 0.01,
|
|
OFFPRICE: 0,
|
|
payType: 2,
|
|
SALEBILL_ID: _this.orderInternal,
|
|
SALEBILL_CODE: _this.orderNumber,
|
|
})
|
|
.then((res) => {
|
|
_this.$api
|
|
.postCoop({
|
|
action_type: "EndPay",
|
|
action_data: _this.orderNumber,
|
|
action_record: 1,
|
|
})
|
|
.then((res) => {
|
|
uni.hideLoading();
|
|
if (res === 1) {
|
|
_this.$store.commit("orderRemark", "");
|
|
_this.$store.commit("couponPrice", "");
|
|
_this.$store.commit("shopcartOrder", "");
|
|
_this.$store.commit("orderTable", "");
|
|
uni.redirectTo({
|
|
url:
|
|
"/pages/orders/orderdetail/index?type=1&orderNumber=" +
|
|
_this.orderNumber +
|
|
"&orderInternal=" +
|
|
_this.orderInternal,
|
|
});
|
|
} else {
|
|
uni.showModal({
|
|
content: "请确认是否支付成功",
|
|
cancelText: "未支付",
|
|
confirmText: "我已支付",
|
|
success: function (back) {
|
|
if (back.confirm) {
|
|
_this.$api
|
|
.postCoop({
|
|
action_type: "EndPay",
|
|
action_data: _this.orderNumber,
|
|
action_record: 1,
|
|
})
|
|
.then((_data) => {
|
|
_this.$store.commit("orderRemark", "");
|
|
_this.$store.commit("couponPrice", "");
|
|
_this.$store.commit("shopcartOrder", "");
|
|
_this.$store.commit("orderTable", "");
|
|
console.log("_data", _data);
|
|
uni.redirectTo({
|
|
url:
|
|
"/pages/orders/orderdetail/index?type=1&orderNumber=" +
|
|
_this.orderNumber +
|
|
"&orderInternal=" +
|
|
_this.orderInternal,
|
|
});
|
|
});
|
|
} else {
|
|
uni.redirectTo({
|
|
url:
|
|
"/pages/orders/orderdetail/index?type=1&orderNumber=" +
|
|
_this.orderNumber +
|
|
"&orderInternal=" +
|
|
_this.orderInternal,
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
});
|
|
});
|
|
},
|
|
getDicretion(op) {
|
|
let _this = this;
|
|
|
|
let arr = {
|
|
action_type: "GetSacnShopDetail",
|
|
provinceCode: op.province,
|
|
serverpartShopId: op.sid,
|
|
showCoupon: 1,
|
|
};
|
|
|
|
this.$api.getCoop(arr).then(function (res) {
|
|
if (res.ResultCode === "100") {
|
|
let _data = res.Data;
|
|
|
|
_this.shopList = _data.ShopList;
|
|
_this.radio2 = _data.ShopList[0].SERVERPARTSHOP_ID;
|
|
console.log("_this.shopList", _this.shopList);
|
|
_this.getcoup();
|
|
_this.$forceUpdate();
|
|
}
|
|
});
|
|
},
|
|
},
|
|
onShow() {
|
|
// this.getOrderAmount()
|
|
let id = this.doorId;
|
|
let yuyue = this.$store.getters.appointmentOrder[id];
|
|
this.yyTime = yuyue ? yuyue.showTime : "";
|
|
},
|
|
onUnload() {
|
|
this.$store.commit("orderRemark", "");
|
|
this.$store.commit("couponPrice", "");
|
|
this.orderInternal = "";
|
|
this.orderNumber = "";
|
|
this.phoneNumber = "";
|
|
this.isPackage = 1000;
|
|
this.isShow = false;
|
|
},
|
|
onLoad(option) {
|
|
console.log("nowStore", this.nowStore);
|
|
console.log("option.sid", option.sid);
|
|
let type = uni.getStorageSync("loginType");
|
|
this.loginType = type;
|
|
|
|
this.doorId = option.id;
|
|
this.storeId = Number(option.sid); // 门店id
|
|
// this.tableNum = option.tableNum || 0;
|
|
this.provinceCode = option.province;
|
|
// eslint-disable-next-line eqeqeq
|
|
if (this.tableNum != 0) {
|
|
this.active = 1;
|
|
this.type = 1000;
|
|
} else {
|
|
// 预约
|
|
this.active = 0;
|
|
this.type = 2000;
|
|
}
|
|
this.phoneNumber = this.user.MEMBERSHIP_MOBILEPHONE || "";
|
|
this.shopOrder = this.$store.getters.shopcartOrder[option.id];
|
|
this.getcoup();
|
|
|
|
console.log("this.shopOrder", this.shopOrder);
|
|
// this.getDicretion(option)
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="stylus" scoped>
|
|
bodyColor = #CAA97F;
|
|
|
|
.disable {
|
|
color: #999;
|
|
}
|
|
|
|
.bb1 {
|
|
border-bottom: 1rpx solid #EDEDED;
|
|
}
|
|
|
|
.mt24 {
|
|
margin-top: 24rpx;
|
|
}
|
|
|
|
.sellement-apponit-box {
|
|
margin: 24rpx 24rpx;
|
|
background: #fff;
|
|
border-radius: 20rpx;
|
|
padding: 0 24rpx;
|
|
}
|
|
|
|
.sellement-apponit-unit {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.settlement {
|
|
padding-bottom: 160rpx;
|
|
box-sizing: border-box;
|
|
background-color: #f5f5f5;
|
|
|
|
.settlement-title {
|
|
background: #ffffff;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
padding: 48rpx 30rpx;
|
|
box-sizing: border-box;
|
|
font-size: 28rpx;
|
|
margin: 24rpx;
|
|
border-radius: 16rpx;
|
|
|
|
.settlement-yy, .settlement-ts {
|
|
flex: 0.4;
|
|
border: 6rpx solid #dddddd;
|
|
border-radius: 16rpx;
|
|
padding: 24rpx 30rpx;
|
|
color: #999;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.yy-img, .ts-img {
|
|
display: inline-block;
|
|
width: 61rpx;
|
|
height: 53rpx;
|
|
margin-right: 20rpx;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.yy-img {
|
|
background: url('/static/images/home/yy.png') no-repeat;
|
|
background-size: contain;
|
|
}
|
|
|
|
.yy-img-active {
|
|
background: url('/static/images/home/yy-a.png') no-repeat;
|
|
background-size: contain;
|
|
}
|
|
|
|
.ts-img {
|
|
background: url('/static/images/home/md.png') no-repeat;
|
|
background-size: contain;
|
|
}
|
|
|
|
.ts-img-active {
|
|
background: url('/static/images/home/md-a.png') no-repeat;
|
|
background-size: contain;
|
|
}
|
|
}
|
|
|
|
.settlement-color {
|
|
color: bodyColor;
|
|
border: 6rpx solid bodyColor;
|
|
}
|
|
}
|
|
|
|
.link-type {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 32rpx;
|
|
background-color: #fff;
|
|
border-bottom: 1rpx solid #ddd;
|
|
}
|
|
|
|
input {
|
|
font-size: 32rpx;
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
width: 98%;
|
|
}
|
|
|
|
.time-title {
|
|
// padding 0 24rpx
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
font-size: 24rpx;
|
|
color: #333;
|
|
font-weight: bolder;
|
|
flex: 2;
|
|
}
|
|
|
|
.radio-box {
|
|
padding: 0rpx 10rpx;
|
|
background: #fff;
|
|
font-size: 26rpx;
|
|
flex: 8;
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
|
|
.radio-list {
|
|
width: 50%;
|
|
display: inline-block;
|
|
|
|
.radio-unit {
|
|
font-size: 26rpx;
|
|
line-height: 96rpx;
|
|
}
|
|
|
|
.picker {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 28rpx;
|
|
padding-right: 16rpx;
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
}
|
|
|
|
.custom-radio:checked::before {
|
|
background-color: #caa97f; /* 金黄色背景 */
|
|
}
|
|
}
|
|
}
|
|
|
|
.order-fx {
|
|
margin-top: 20rpx;
|
|
border-bottom: 2rpx dashed #dddddd;
|
|
}
|
|
|
|
.order-yy, .order-fx {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
font-size: 30rpx;
|
|
background: #ffffff;
|
|
padding: 0 30rpx;
|
|
|
|
.order-yy-time {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.span-time {
|
|
color: bodyColor;
|
|
}
|
|
}
|
|
}
|
|
|
|
.door-box {
|
|
padding: 20rpx 30rpx;
|
|
box-sizing: border-box;
|
|
|
|
.settlement-door {
|
|
font-size: 30rpx;
|
|
color: #333;
|
|
font-weight: 900;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.door-addr {
|
|
font-size: 24rpx;
|
|
color: #666;
|
|
}
|
|
}
|
|
|
|
.order-title {
|
|
background: #ffffff;
|
|
width: 100%;
|
|
font-size: 24rpx;
|
|
color: #666;
|
|
padding: 20rpx 30rpx;
|
|
border-top: 1rpx solid #eee;
|
|
}
|
|
|
|
hr {
|
|
background-color: #ededed;
|
|
height: 2rpx;
|
|
}
|
|
|
|
.order-list {
|
|
padding: 24rpx 12rpx 24rpx 12rpx;
|
|
box-sizing: border-box;
|
|
background-color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
color: #333;
|
|
|
|
.order-name {
|
|
font-size: 26rpx;
|
|
// font-weight bolder
|
|
flex: 0.7;
|
|
}
|
|
|
|
.order-num {
|
|
font-size: 26rpx;
|
|
flex: 0.1;
|
|
}
|
|
|
|
.order-price {
|
|
font-size: 26rpx;
|
|
flex: 0.2;
|
|
color: #333;
|
|
text-align: right;
|
|
font-weight: bolder;
|
|
}
|
|
}
|
|
|
|
.coupon {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
font-size: 26rpx;
|
|
box-sizing: border-box;
|
|
line-height: 60rpx;
|
|
color: bodyColor;
|
|
|
|
.coupon-title {
|
|
color: #333;
|
|
font-size: 26rpx;
|
|
}
|
|
|
|
.coupon-right {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
color: #666;
|
|
|
|
.coupon-remark {
|
|
width: 364rpx;
|
|
text-align: right;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
height: 42rpx;
|
|
}
|
|
|
|
.priceColor {
|
|
color: bodyColor;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.price-sum {
|
|
box-sizing: border-box;
|
|
background-color: #fff;
|
|
text-align: right;
|
|
font-size: 26rpx;
|
|
padding: 22rpx 16rpx;
|
|
|
|
.pay-price {
|
|
color: #333;
|
|
font-size: 32rpx;
|
|
margin-left: 10rpx;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
.go-pay {
|
|
border-top: 1rpx solid #eee;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
// z-index 2
|
|
background-color: #fff;
|
|
overflow: hidden;
|
|
|
|
.pay-left {
|
|
font-size: 26rpx;
|
|
flex: 7;
|
|
background-color: #fff;
|
|
padding-left: 20rpx;
|
|
|
|
.pay-price {
|
|
color: #333;
|
|
margin-left: 10rpx;
|
|
font-size: 36rpx;
|
|
font-weight: bolder;
|
|
}
|
|
}
|
|
|
|
.pay-right {
|
|
font-size: 28rpx;
|
|
flex: 3;
|
|
text-align: center;
|
|
background-color: #333;
|
|
color: bodyColor;
|
|
font-weight: bolder;
|
|
}
|
|
}
|
|
}
|
|
|
|
.coupon.sellement-apponit-box {
|
|
padding: 12rpx 24rpx;
|
|
}
|
|
|
|
.bottom-box {
|
|
height: 450rpx;
|
|
width: 100%;
|
|
box-sizing: content-box;
|
|
|
|
.bottom-pop-title {
|
|
text-align: center;
|
|
font-size: 32rpx;
|
|
padding: 20rpx 0;
|
|
border-bottom: 1rpx solid #f9f9f9;
|
|
}
|
|
|
|
.bottom-content {
|
|
box-sizing: content-box;
|
|
padding: 0 0 0 80rpx;
|
|
}
|
|
|
|
.bottom-btn {
|
|
width: 600rpx;
|
|
margin: 20rpx auto;
|
|
border-radius: 8rpx;
|
|
background: #444;
|
|
color: #caa97f;
|
|
font-size: 32rpx;
|
|
text-align: center;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
}
|
|
}
|
|
|
|
.payShowBox {
|
|
width: 100%;
|
|
height: 380px;
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
padding: 12px;
|
|
border-radius: 12px;
|
|
|
|
.payBoxTitle {
|
|
width: 100%;
|
|
font-Weight: bold;
|
|
font-size: 16px;
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.payList {
|
|
width: 100%;
|
|
height: 250px;
|
|
overflow-y: auto;
|
|
|
|
.radio-group {
|
|
.bottom-radio {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0 24rpx;
|
|
border-bottom: 1px solid #ededed;
|
|
padding: 12px 0;
|
|
|
|
.radioLeft {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.logoBox {
|
|
width: 30px;
|
|
height: 30px;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
margin-right: 8px;
|
|
|
|
.logoIcon {
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.goPayBox {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 0 24px;
|
|
|
|
.goPay {
|
|
width: 100%;
|
|
padding: 8px;
|
|
box-sizing: border-box;
|
|
border-radius: 20px;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: #CAA97F;
|
|
}
|
|
}
|
|
}
|
|
|
|
.icon-coupon {
|
|
background: url('/static/images/home/settlement-coupon.png') no-repeat center;
|
|
background-size: contain;
|
|
width: 33rpx;
|
|
height: 55rpx;
|
|
}
|
|
|
|
.radio-box.coupon-right {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
color: #666;
|
|
align-items: center;
|
|
|
|
.coupon-remark {
|
|
width: 444rpx;
|
|
text-align: right;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
height: 68rpx;
|
|
line-height: 68rpx;
|
|
}
|
|
}
|
|
</style>
|
|
|