515 lines
12 KiB
Vue
515 lines
12 KiB
Vue
<template>
|
|
<view class="s_page" :class="{ mb_flag: mb_flag }">
|
|
<view class="view_content step_three">
|
|
<view class="public_box all_money flex">
|
|
<view class="title">実際支払い金額</view>
|
|
<!-- <view class="content">¥{{ all_price | changeMoney }}</view> -->
|
|
<view class="content"
|
|
>¥{{ newData.dMoney || newData.totalMoney | changeMoney }}</view
|
|
>
|
|
</view>
|
|
<!-- <view class="step_three_txt">認証明細/{{ $t('核销明细') }}</view> -->
|
|
<view class="public_box fun_box">
|
|
<view class="fun_item">
|
|
<view class="left">店舗ID</view>
|
|
<view class="right flex_abs">
|
|
<view class="right_l">
|
|
<view>NO.{{ axios_data.id }}</view>
|
|
<view>{{ axios_data.storeName }}</view>
|
|
</view>
|
|
<view class="right_r flex_ac"></view>
|
|
</view>
|
|
</view>
|
|
<view class="fun_item">
|
|
<view class="left">割引前金額</view>
|
|
<view class="right flex_abs">
|
|
<!-- <view class="right_l">
|
|
</view> -->
|
|
<view class="right_r flex_ac">
|
|
<view class="txt">¥{{ newData.totalMoney | changeMoney }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="fun_item">
|
|
<view class="left"> 割引 </view>
|
|
<view class="left"> </view>
|
|
<view
|
|
class="right flex_abs"
|
|
@tap="
|
|
gotoWhere(
|
|
`/pages/verification/selectCoupon?money=${newData.totalMoney}`
|
|
)
|
|
"
|
|
>
|
|
<!-- <view class="right_l">
|
|
</view> -->
|
|
<view class="right_r flex_ac" v-if="newData.dTicket">
|
|
<view class="txt">-¥{{ newData.dTicket }}</view>
|
|
<image src="/static/img/icon_118.png" mode=""></image>
|
|
</view>
|
|
<view class="right_r" v-else>
|
|
<view
|
|
style="
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
"
|
|
v-if="newData.dTicket == 0 && newData.dTicket != ''"
|
|
>
|
|
<view class="txt">SPECIAL OFFER</view>
|
|
<image src="/static/img/icon_118.png" mode=""></image>
|
|
</view>
|
|
|
|
<view
|
|
style="
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
"
|
|
v-else
|
|
>
|
|
<view></view>
|
|
<image src="/static/img/icon_118.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="fun_item" v-if="poins_deduction.redirect">
|
|
<view class="left">ポイント利用</view>
|
|
<view
|
|
class="right flex_abs"
|
|
@tap="gotoWhere(`/pages/verification/selectIntegral`)"
|
|
>
|
|
<!-- <view class="right_l">
|
|
</view> -->
|
|
<view class="right_r flex_ac">
|
|
<view class="txt txt_two" v-if="newData.dIntegral"
|
|
>-{{ newData.dIntegral }}</view
|
|
>
|
|
<view class="txt txt_two" v-else></view>
|
|
<image src="/static/img/icon_118.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 人数 -->
|
|
<view class="fun_item">
|
|
<view class="left">お客様人数</view>
|
|
<view class="right flex_abs">
|
|
<!-- <view class="right_l">
|
|
</view> -->
|
|
<view class="right_r flex_ac">
|
|
<view class="txt">{{ newData.userNum }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="next_btn_box">
|
|
<view
|
|
class="next_btn flex_abc"
|
|
:class="{ active: last_btn_flag }"
|
|
@tap="nextStep()"
|
|
>提出</view
|
|
>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import custom from "@/components/custom/custom";
|
|
import { verification, getWriteOffInfo } from "@/request/ticketReq";
|
|
export default {
|
|
components: {
|
|
custom,
|
|
},
|
|
data() {
|
|
const moneyRule = (value, callback) => {
|
|
if (!value || value <= 0) {
|
|
return this.$t("请输入金额");
|
|
}
|
|
};
|
|
const peopleRule = (value, callback) => {
|
|
if (!value || value < 1) {
|
|
return this.$t("请输入用餐人数");
|
|
}
|
|
};
|
|
const codeRule = (value, callback) => {
|
|
if (!value) {
|
|
return this.$t("请输入店家核销码");
|
|
}
|
|
};
|
|
return {
|
|
// 表单规则
|
|
rule: {
|
|
money: moneyRule,
|
|
people: peopleRule,
|
|
code: codeRule,
|
|
},
|
|
ids: "",
|
|
store_arr: [],
|
|
plan: 3,
|
|
axios_data: {
|
|
id: "",
|
|
storeName: "",
|
|
point: 0,
|
|
money: "",
|
|
num_dine: "", // 人数
|
|
imei:''
|
|
},
|
|
mb_flag: false,
|
|
tenantId: "",
|
|
|
|
poins_deduction: [],
|
|
newData: [],
|
|
};
|
|
},
|
|
onLoad(options) {
|
|
this.newData = uni.getStorageSync("heXiaoData");
|
|
|
|
this.axios_data.id = uni.getStorageSync("store_obj").id;
|
|
this.axios_data.storeName = uni.getStorageSync("store_obj").shop_name;
|
|
this.axios_data.imei = uni.getStorageSync("store_obj").imei;
|
|
|
|
this.tenantId = uni.getStorageSync("customer_info")[0];
|
|
this.getListFn(this.axios_data.id, this.tenantId);
|
|
},
|
|
onUnload() {
|
|
this.clearStore();
|
|
},
|
|
onShow() {
|
|
this.newData = uni.getStorageSync("heXiaoData");
|
|
this.customer_info = uni.getStorageSync("customer_info");
|
|
},
|
|
computed: {
|
|
last_btn_flag() {
|
|
return true;
|
|
},
|
|
},
|
|
methods: {
|
|
async getListFn(spid, userId) {
|
|
let res = await getWriteOffInfo({ shop_id: spid, user_id: userId });
|
|
this.poins_deduction = res.data.data.poins_deduction;
|
|
|
|
console.log("店铺上限", this.poins_deduction);
|
|
},
|
|
keyboardheightchange(event) {
|
|
let { height } = event.detail;
|
|
if (height > 0) {
|
|
this.mb_flag = true;
|
|
} else {
|
|
this.mb_flag = false;
|
|
}
|
|
},
|
|
clearStore() {
|
|
uni.removeStorageSync("heXiaoData");
|
|
},
|
|
async verificationApi() {
|
|
// 处理优惠券为JSON格式
|
|
this.newData.coupon = JSON.stringify(this.newData.coupon);
|
|
let params = {
|
|
type: 2,
|
|
imei: this.axios_data.imei,
|
|
user_id: this.tenantId,
|
|
number_of_people: +this.newData.userNum,
|
|
amount_receivable: this.newData.totalMoney,
|
|
coupon: this.newData.coupon,
|
|
points: this.newData.dIntegral,
|
|
};
|
|
console.log("核销参数", params);
|
|
let res = await verification(params);
|
|
console.log("核销结果", res);
|
|
if (res.data.status == 1) {
|
|
const paramsData = encodeURIComponent(JSON.stringify(res.data.data));
|
|
|
|
this.clearStore();
|
|
let url = `/pages/verification/stepResult?params=${paramsData}`;
|
|
uni.redirectTo({
|
|
url,
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.msg,
|
|
duration: 1500,
|
|
icon: "none",
|
|
});
|
|
}
|
|
},
|
|
// 通用方法
|
|
nextStep() {
|
|
this.verificationApi();
|
|
},
|
|
gotoWhere(url) {
|
|
uni.navigateTo({
|
|
url,
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style>
|
|
page {
|
|
/* background-color: #FFFFFF; */
|
|
background: linear-gradient(
|
|
rgba(160, 204, 87, 0.2) 0%,
|
|
rgba(223, 226, 0, 0.2) 100%
|
|
);
|
|
}
|
|
</style>
|
|
<style scoped lang="scss">
|
|
.s_page {
|
|
min-height: 100vh;
|
|
&.mb_flag {
|
|
width: 100%;
|
|
position: fixed;
|
|
top: -60rpx;
|
|
left: 0;
|
|
// // min-height: calc(100vh + 120rpx);
|
|
// padding-bottom: 500rpx;
|
|
// box-sizing: border-box;
|
|
}
|
|
}
|
|
.custom_c_txt {
|
|
width: 560rpx;
|
|
font-size: 36rpx;
|
|
color: $step_color;
|
|
font-weight: 600;
|
|
text-align: center;
|
|
}
|
|
.public_box {
|
|
width: 100%;
|
|
padding: 30rpx;
|
|
box-sizing: border-box;
|
|
background-color: #ffffff;
|
|
border-radius: 16rpx;
|
|
overflow: hidden;
|
|
margin-bottom: 20rpx;
|
|
box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.1);
|
|
}
|
|
.view_content {
|
|
padding-top: 20rpx;
|
|
padding-bottom: 150rpx;
|
|
// &.mb_flag {
|
|
// padding-bottom: 500rpx;
|
|
// position: absolute;
|
|
// top: 60rpx;
|
|
// z-index: -1;
|
|
// }
|
|
}
|
|
.title_txt {
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
font-weight: bold;
|
|
&.one {
|
|
color: #007ad7;
|
|
margin: 80rpx 0 8rpx;
|
|
}
|
|
&.two {
|
|
color: #4a4a4a;
|
|
margin-bottom: 40rpx;
|
|
}
|
|
}
|
|
.item {
|
|
border: 3px solid #ffffff;
|
|
.top {
|
|
font-size: 28rpx;
|
|
line-height: 28rpx;
|
|
color: $them_color_two;
|
|
font-weight: bold;
|
|
}
|
|
.line {
|
|
width: 100%;
|
|
height: 1px;
|
|
background-color: $them_color_two;
|
|
margin: 16rpx 0;
|
|
}
|
|
.txt {
|
|
color: #000000;
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
font-weight: bold;
|
|
}
|
|
&.active {
|
|
border-color: $them_color_two;
|
|
// background: linear-gradient(90deg, #7EB96A 0%, #D3D823 100%) !important;
|
|
// .top {
|
|
// color: #FFFFFF;
|
|
// }
|
|
// .line {
|
|
// background-color: #FFFFFF;
|
|
// }
|
|
}
|
|
}
|
|
.step_two {
|
|
.item_box {
|
|
width: 100%;
|
|
margin-bottom: 40rpx;
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.box_title {
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
color: $them_color_two;
|
|
font-weight: bold;
|
|
}
|
|
.box_fun {
|
|
width: 100%;
|
|
min-height: 80rpx;
|
|
|
|
.change_btn_box {
|
|
flex-shrink: 0;
|
|
margin-left: 20rpx;
|
|
.chang_btn {
|
|
height: 54rpx;
|
|
width: 54rpx;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
image {
|
|
height: 35%;
|
|
width: 35%;
|
|
display: block;
|
|
}
|
|
&.del {
|
|
background-color: $them_color_two;
|
|
}
|
|
&.add {
|
|
background-color: $them_color_two;
|
|
}
|
|
}
|
|
}
|
|
.txt {
|
|
flex: 1;
|
|
height: 100%;
|
|
padding: 16rpx 0 30rpx;
|
|
box-sizing: border-box;
|
|
align-items: flex-end;
|
|
border-bottom: 1px solid #e1e0e8;
|
|
> view,
|
|
input {
|
|
color: #000000;
|
|
font-size: 48rpx;
|
|
line-height: 48rpx;
|
|
font-weight: bold;
|
|
}
|
|
&.ts {
|
|
> view {
|
|
font-size: 28rpx !important;
|
|
line-height: 38rpx !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.step_three {
|
|
.step_three_txt {
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
margin-bottom: 16rpx;
|
|
color: #000000;
|
|
font-weight: bold;
|
|
}
|
|
.all_money {
|
|
flex-direction: column;
|
|
align-items: center;
|
|
.title {
|
|
color: $step_color;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
text-align: center;
|
|
margin-bottom: 16rpx;
|
|
}
|
|
.content {
|
|
font-size: 68rpx;
|
|
line-height: 96rpx;
|
|
font-weight: bold;
|
|
color: #000000;
|
|
text-align: center;
|
|
padding: 0 100rpx;
|
|
border-bottom: 1px solid #dbdbdb;
|
|
}
|
|
}
|
|
.fun_box {
|
|
.fun_item {
|
|
width: 100%;
|
|
margin-bottom: 20rpx;
|
|
border-bottom: 1px solid #dbdbdb;
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.left {
|
|
color: $them_color_two;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
}
|
|
.right {
|
|
padding: 20rpx 0 10rpx;
|
|
.right_l {
|
|
> view {
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
color: #000000;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
.right_r {
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
.txt {
|
|
font-size: 44rpx;
|
|
line-height: 56rpx;
|
|
color: #000000;
|
|
font-weight: bold;
|
|
}
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
display: block;
|
|
margin-left: 4rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.shop_code_box {
|
|
border: 2px solid #8a8a8a;
|
|
&.active {
|
|
border-color: #007ad7;
|
|
}
|
|
.content {
|
|
input {
|
|
font-size: 28rpx;
|
|
line-height: 38rpx;
|
|
color: #007ad7;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.next_btn_box {
|
|
width: 100%;
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
background-color: #ffffff;
|
|
padding: 20rpx 0;
|
|
}
|
|
.next_btn {
|
|
margin: 0 auto;
|
|
width: 92%;
|
|
height: 82rpx;
|
|
border-radius: 41rpx;
|
|
font-size: 32rpx;
|
|
line-height: 32rpx;
|
|
font-weight: bold;
|
|
background: #f2f2f2;
|
|
color: #acacac;
|
|
&.active {
|
|
background: linear-gradient(90deg, #7eb96a 0%, #d3d722 100%);
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
</style>
|