diancan_uni/pages/pay-order/index.vue

<template>
    <view>
        <!-- index.wxml -->
        <view class="wrap">
            <view class="order_wrap">
                <text class="price">
                    <text class="unit">¥</text>
                    {{ totalPrice }}
                </text>
                <view class="order_price">账单金额</view>
            </view>
            <view class="payment_wrap">
                <view class="payment_item" @tap="changeCard">
                    <view class="item_t">
                        <view class="item_t_l">
                            <image class="item_icon" mode="heightFix" src="/static/statics/img/icon_dengji.png"></image>
                            <view class="item_name">会员卡支付</view>
                        </view>
                        <view class="item_t_r">
                            <!-- <text class="unit"></text> -->
                            <view class="price">{{ userMoney > totalPrice ? '-' + totalPrice : '-' + userMoney }}</view>
                            <van-checkbox :value="checkedCard" checked-color="#295C56"></van-checkbox>
                        </view>
                    </view>
                    <view class="item_b">
                        <text class="wenzi">
                            <text class="label">卡内余额</text>
                            ¥{{ userMoney }}
                        </text>
                        <text class="wenzi">
                            <text class="label">可用</text>
                            ¥{{ userMoney > totalPrice ? totalPrice : userMoney }}
                        </text>
                    </view>
                </view>
                <view class="card_list">
                    <view class="card_item_w" @tap="clickCard" :data-id="item.id" v-for="(item, index) in cardList" :key="index">
                        <view :class="item.checked ? 'card_item active' : 'card_item'">
                            <view v-if="item.type == 2">
                                <!-- 年卡 -->
                                <view class="card_item_col">
                                    <view class="card_text">{{ item.price }}元购{{ item.title }}</view>
                                    <view class="card_send">得</view>
                                    <view class="card_text">会员</view>
                                </view>
                            </view>
                            <view v-else>
                                <view class="card_item_col">
                                    <view class="card_text">充值{{ item.price }}元</view>
                                    <view class="card_send">得</view>
                                    <view class="card_text">{{ item.priceAddCoupons }}元</view>
                                </view>
                                <view class="card_item_col desc" v-if="item.coupon_rule">
                                    <text class="">{{ item.price }}元卡金</text>
                                    <text class="">+ {{ item.coupon_rule.coupon.price }}元x{{ item.coupon_rule.num }}张券</text>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
                <view class="payment_item" @tap="changeWechat">
                    <view class="item_t">
                        <view class="item_t_l">
                            <image class="item_icon" mode="heightFix" src="/static/statics/img/icon_weixin.png"></image>
                            <view class="item_name">微信支付</view>
                        </view>
                        <view class="item_t_r">
                            <van-checkbox :value="checkedWechat" checked-color="#295C56"></van-checkbox>
                        </view>
                    </view>
                </view>
                <view class="payment_item" v-if="couponNums && !order_id" @tap="onShowCoupons">
                    <view class="item_t">
                        <view class="item_t_l">
                            <image class="item_icon" mode="heightFix" src="/static/statics/img/icon_quan.png"></image>
                            <view class="item_name">优惠券</view>
                        </view>
                        <view class="item_t_r">
                            <view class="quan">
                                <!-- <text wx:if="{{ checkedCoupon }}">{{ checkedCoupon.type == 3 ? '折扣优惠券' : checkedCoupon.type == 2 ? '金额优惠券' : '满减券'  }}</text> -->
                                <text v-if="checkedCoupon">{{ checkedCoupon.type == 3 ? checkedCoupon.discount + '折' : '-' + checkedCoupon.price }}</text>
                                <text v-else>{{ couponNums }}张可用</text>
                            </view>
                            <van-icon name="arrow" color="#333333" />
                        </view>
                    </view>
                </view>
            </view>
            <view class="btn_tijiao" @tap="confirmCreateOrder">
                <text class="label">{{ checkedCard ? '会员卡支付' : '微信支付' }}</text>
                <text class="price">
                    <text class="unit">¥</text>
                    {{ totalPrice }}
                </text>
            </view>
        </view>
        <!-- 余额不足提醒 -->
        <van-overlay :z-index="2" class-style="background: rgba(0,0,0,.3);" :show="showCashPop">
            <view class="cash_pop">
                <view class="cash_pop_t">余额不足充值享更多优惠</view>
                <view class="cash_pop_b">
                    <view class="cash_pop_btn" @tap="onAddWechat">加微信支付</view>
                    <view class="cash_pop_btn recharge" @tap="onRecharge">先充值</view>
                </view>
                <!-- <image class="tip_tu" src="/statics/img/fail_tu.png"></image> -->
            </view>
        </van-overlay>
        <!-- 选择优惠券 -->
        <van-overlay :z-index="2" class-style="background: rgba(0,0,0,.3);" :show="showCoupons">
            <view class="coupon_wrap">
                <view class="coupon_t">
                    <view class="coupon_t_l">选择优惠券</view>
                    <van-icon name="cross" color="rgba(0,0,0,.36)" @tap.native="onCloseCoupons" />
                </view>
                <scroll-view scroll-y class="coupon_wrap_scroll">
                    <view class="coupon_list">
                        <van-checkbox-group :value="couponIdArr" :max="1">
                            <van-cell-group>
                                <van-cell
                                    clickable
                                    :data-name="item.id"
                                    @click="onClickCoupons($event, { name: item.id, item })"
                                    :data-item="item"
                                    v-for="(item, index) in couponList"
                                    :key="index"
                                >
                                    <view class="coupon_item" :style="'background-image: url(' + couponBg + ')'">
                                        <view class="item_l" v-if="item.type == 1">
                                            <view class="price">
                                                <text class="unit">¥</text>
                                                {{ item.price }}
                                            </view>
                                            <view class="tips">满{{ item.base_price }}元可用</view>
                                        </view>
                                        <view class="item_l" v-if="item.type == 2">
                                            <view class="price">
                                                <text class="unit">¥</text>
                                                {{ item.price }}
                                            </view>
                                            <view class="tips">无门槛</view>
                                        </view>
                                        <view class="item_l" v-if="item.type == 3">
                                            <view class="price">{{ item.discount }}折</view>
                                        </view>
                                        <view class="item_r">
                                            <view class="item_r_l">
                                                <view class="quan_name">{{ item.type == 3 ? '折扣优惠券' : item.type == 2 ? '金额优惠券' : '满减券' }}</view>
                                                <view class="quan_time">有效期至{{ item.due_time }}</view>
                                            </view>
                                            <van-checkbox slot="right-icon" :name="item.id" checked-color="#295C56" />
                                        </view>
                                    </view>
                                </van-cell>
                            </van-cell-group>
                        </van-checkbox-group>
                    </view>
                </scroll-view>
            </view>
        </van-overlay>
        <!-- loading -->
        <!-- <van-overlay show="{{ loading }}" z-index="100">
	<van-loading custom-class="custom_loading" />
</van-overlay> -->
    </view>
</template>

<script>
// index.js
let myPro = require('../../utils/wxRequest.js');

let util = require('../../utils/util.js');

export default {
    data() {
        return {
            couponBg: '/static/statics/img/quan_bg_tu.png',
            checkedCard: true,

            // 默认选择余额付
            result: [],

            checkedWechat: false,
            showCashPop: false,

            // 会员卡钱不足时
            couponIdArr: [],

            // 优惠券选中 数组
            couponId: 0,

            showCoupons: false,
            cardList: [],

            // 充值券
            userMoney: 0,

            // 用户余额
            totalPrice: 0,

            // 订单总金额
            fare_type: 0,

            // 配送方式 0外卖 1自提
            order_id: null,

            // 订单id(未支付订单)
            loading: false,

            // 全局loading
            is_member: getApp().globalData.is_member,

            // 会员 0否 1是
            // 测试锁
            addLock: false,

            address_id: '',
            store: '',
            user_mark: '',
            couponList: '',
            couponNums: '',
            pay_type: '',

            checkedCoupon: {
                type: 0,
                discount: '',
                price: ''
            }
        };
    },
    onLoad: function (options) {
        // Do some initialize when page load.
        let that = this; // 配送方式

        if (options.fare_type) {
            that.setData({
                fare_type: options.fare_type
            });
        } // 地址

        if (options.address_id) {
            that.setData({
                address_id: options.address_id
            });
        }

        if (options.order_id) {
            that.setData({
                order_id: options.order_id
            });
            that.getOrderDetail();
        }

        that.setData({
            couponBg: 'data:image/png;base64,' + uni.getFileSystemManager().readFileSync(that.couponBg, 'base64')
        });
    },
    onShow: function () {
        // Do something when page show.
        let that = this; // 店铺

        if (uni.getStorageSync('store')) {
            that.setData({
                store: JSON.parse(uni.getStorageSync('store'))
            });
        } // 获取用户余额

        that.getUserCash(); // 获取充值卡

        that.getRechargeCard(); // 获取券(只支持初次订单,不支持二次支付订单)

        if (!that.order_id && !that.addLock) {
            that.getCreatelist();
        } // console.log('show=====');
    },
    onReady: function () {
        // Do something when page ready.
    },
    onHide: function () {
        // Do something when page hide.
    },
    onUnload: function () {
        // Do something when page close.
    },
    onPullDownRefresh: function () {
        // Do something when pull down.
    },
    onReachBottom: function () {
        // Do something when page reach bottom.
    },
    onPageScroll: function () {
        // Do something when page scroll
    },
    onResize: function () {
        // Do something when page resize
    },
    methods: {
        // 获取可用优惠券(同时总了总价等)
        getCreatelist() {
            let that = this;
            let params = {
                fare_type: that.fare_type
            };

            if (that.fare_type == 0) {
                params.address_id = that.address_id;
            }

            if (uni.getStorageSync('user_mark')) {
                that.setData({
                    user_mark: uni.getStorageSync('user_mark')
                });
                params.user_mark = that.user_mark;
            }

            if (that.couponId) {
                params.user_coupon_id = that.couponId;
            } // return;

            myPro
                .wxRequest('user/v3/order/createlist', 'GET', params)
                .then((res) => {
                    let couponList = res.result.userCouponList;
                    that.setData({
                        totalPrice: res.result.orderInfo.pay_price,
                        couponList: couponList,
                        couponNums: couponList.length // 几张券
                    });
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 获取用户的余额
        getUserCash() {
            let that = this;
            myPro
                .wxRequest('user/v2/userinfo', 'GET', {})
                .then((res) => {
                    that.setData({
                        userMoney: parseFloat(res.result.money)
                    });
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 选卡付
        changeCard() {
            let that = this;
            that.setData({
                checkedCard: !that.checkedCard
            }); // 余额和微信方式只能选一种

            if (that.checkedCard) {
                that.setData({
                    checkedWechat: false
                });
            }
        },

        // 选微信付
        changeWechat() {
            let that = this;
            that.setData({
                checkedWechat: !that.checkedWechat
            }); // 余额和微信方式只能选一种

            if (that.checkedWechat) {
                that.setData({
                    checkedCard: false
                });
            }
        },

        // 创建订单前的相关判断
        confirmCreateOrder() {
            let that = this; // wx.redirectTo({
            // 	url: '/pages/pay-success/index?order_id=176',
            // 	complete: function(){
            // 		// 清掉备注
            // 		// wx.removeStorageSync("user_mark");
            // 	}
            // });
            // return;
            // that.setData({
            // 	loading: true
            // });
            // 是否勾选支付方式

            if (!that.checkedCard && !that.checkedWechat) {
                uni.showToast({
                    title: '请选择支付方式',
                    icon: 'none'
                }); // that.setData({
                // 	loading: false
                // });

                return;
            } // 判断支付方式

            let pay_type = that.checkedWechat ? 1 : 2; //1微信 2充值卡

            that.setData({
                pay_type: pay_type
            }); // 余额不足以支付时

            if (that.pay_type == 2 && that.userMoney < that.totalPrice) {
                that.setData({
                    showCashPop: true
                }); // that.setData({
                // 	loading: false
                // });

                return;
            } // 余额付

            if (that.pay_type == 2) {
                if (that.order_id) {
                    that.orderPay(2);
                } else {
                    that.createOrder(2);
                }
            } // 微信付

            if (that.pay_type == 1) {
                if (that.order_id) {
                    that.orderPay(1);
                } else {
                    that.createOrder(1);
                }
            }
        },

        // 创建订单
        createOrder(pay_type) {
            // pay_type 有三种类型 1微信 2余额 3混合
            let that = this;
            let data = {
                pay_type: pay_type,
                fare_type: that.fare_type
            }; // 收货地址

            if (that.fare_type == 0 && that.address_id) {
                data.address_id = that.address_id;
            } // 券

            if (that.couponId) {
                data.user_coupon_id = that.couponId;
            } // 备注

            if (that.user_mark) {
                data.user_mark = that.user_mark;
            } // 创建订单

            myPro
                .wxRequest('user/v3/order/create', 'POST', data)
                .then((res) => {
                    let order = res.result.order;

                    if (res.result.config) {
                        that.goWxPay(order, res.result.config);
                    } else {
                        // 不需要调微信支付,直接创建成功
                        that.onCreateOrderAfter(order, 1);
                    }
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 余额不足,加微信支付
        onAddWechat() {
            let that = this; // 混合付

            if (that.order_id) {
                that.orderPay(3);
            } else {
                that.createOrder(3);
            }

            that.setData({
                showCashPop: false
            });
        },

        // 余额不足,充值
        onRecharge() {
            let that = this;
            that.setData({
                showCashPop: false
            });
        },

        // 调起微信
        goWxPay(order, config) {
            let that = this;
            const configArr = JSON.parse(config);
            uni.requestPayment({
                timeStamp: configArr.timeStamp,
                nonceStr: configArr.nonceStr,
                package: configArr.package,
                signType: configArr.signType,
                paySign: configArr.paySign,

                success(res) {
                    // console.log(res);
                    // 执行支付成功后续操作
                    that.onCreateOrderAfter(order, 1);
                },

                fail(res) {
                    // console.error(res);
                    if (res.errMsg == 'requestPayment:fail cancel') {
                        that.setData({
                            addLock: true // 为了避免付款后,又进了onshow,影响了调优惠券的接口
                        });
                        uni.showToast({
                            title: '您取消了支付，请到我的订单中继续付款',
                            icon: 'none'
                        });
                    } else {
                        uni.showToast({
                            title: '支付失败，请到我的订单中继续付款',
                            icon: 'none'
                        });
                    } // 订单创建成功,但取消了支付 -1

                    that.onCreateOrderAfter(order, -1);
                }
            });
        },

        // 支付后的处理
        onCreateOrderAfter(order, type) {
            let that = this; // 清掉下单时的备注

            uni.removeStorageSync('user_mark'); // type 1成功 -1失败

            if (type == 1) {
                that.setData({
                    addLock: true // 为了避免付款后,又进了onshow,影响了调优惠券的接口
                });
                uni.redirectTo({
                    url: '/pages/pay-success/index?order_id=' + order.id
                });
            } else {
                // 支付失败后 跳转到订单详情(此时订单已创建成功)
                setTimeout(function () {
                    uni.redirectTo({
                        url: '/pages/user/order/detail/index?order_id=' + order.id
                    });
                }, 1000);
            }
        },

        // 打开优惠券弹层
        onShowCoupons() {
            let that = this;
            that.setData({
                showCoupons: true
            });
        },

        // 获取当前点击的优惠券
        onClickCoupons(event, _dataset) {
            /* ---处理dataset begin--- */
            this.datasetHandle(event, _dataset);
            /* ---处理dataset end--- */
            let that = this;
            let item = event.currentTarget.dataset.item;

            if (that.couponId == item.id) {
                that.setData({
                    couponIdArr: [],
                    couponId: 0,
                    checkedCoupon: null
                }); // 更新金额

                that.getCreatelist();
            } else {
                that.setData({
                    couponIdArr: ['' + item.id],
                    couponId: item.id
                });

                if (that.couponId == item.id) {
                    that.setData({
                        checkedCoupon: item,
                        showCoupons: false
                    }); // 更新金额

                    that.getCreatelist();
                } else {
                    that.setData({
                        checkedCoupon: null,
                        showCoupons: false
                    });
                }
            } // console.log('选中的优惠券',that.data.checkedCoupon)
        },

        // 关闭优惠券弹层
        onCloseCoupons() {
            let that = this;
            that.setData({
                showCoupons: false
            });
        },

        // 获取订单详情
        getOrderDetail() {
            let that = this;
            let params = {
                order_id: that.order_id
            };
            myPro
                .wxRequest('user/v2/order/detail', 'GET', params)
                .then((res) => {
                    that.setData({
                        totalPrice: res.result.pay_price
                    });
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 未支付订单,进行支付
        orderPay(pay_type) {
            let that = this;
            let params = {
                order_id: that.order_id,
                pay_type: pay_type
            };
            myPro
                .wxRequest('user/v2/order/topay', 'POST', params)
                .then((res) => {
                    let order = res.result.order; // res.result.type  1余额支付成功 2走微信

                    if (res.result.config) {
                        that.goWxPay(order, res.result.config);
                    } else {
                        that.onCreateOrderAfter(order, 1);
                    }
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 获取充值卡
        getRechargeCard() {
            let that = this;
            let params = {
                type: 1,
                // 1返回3条数据  2返回全部数据
                card_type: 1 // 1普通 2年卡(会员卡)
            };
            myPro
                .wxRequest('user/v2/rechargecardlist', 'GET', params)
                .then((res) => {
                    let list = res.result;

                    for (let i in list) {
                        list[i].checked = false; // 卡+券的总金额 (都按代金券走,折扣券不考虑)

                        if (list[i].coupon_rule) {
                            list[i].priceAddCoupons = (list[i].coupon_rule.coupon.price * list[i].coupon_rule.num + parseFloat(list[i].price)).toFixed(2);
                        } else {
                            list[i].priceAddCoupons = list[i].price;
                        }
                    }

                    that.setData({
                        cardList: list
                    });
                })
                .catch((err) => {
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 选择充值卡
        clickCard(event) {
            let that = this;
            let id = event.currentTarget.dataset.id;
            let list = that.cardList; // 测试(模拟流程,能跑了再删)
            // that.setData({
            // 	is_member: 1
            // })
            // that.getUserCash();
            // return;

            for (let i in list) {
                if (list[i].id == id) {
                    list[i].checked = !list[i].checked; // 选中状态,则去购卡

                    if (list[i].checked) {
                        that.nextFun(list[i].id);
                    }
                } else {
                    list[i].checked = false;
                }
            }

            that.setData({
                cardList: list
            });
        },

        // 充值
        nextFun(id) {
            let that = this;
            let params = {
                recharge_card_id: id,
                store_id: that.store ? that.store.id : 1 // 门店id
            };
            myPro
                .wxRequest('user/recharge', 'POST', params)
                .then((res) => {
                    let config = res.result.config;
                    that.wxPayCard(JSON.parse(config));
                })
                .catch((err) => {
                    that.setData({
                        loading: false
                    });
                    console.log('报错信息', err);
                    uni.showToast({
                        title: err,
                        icon: 'none'
                    });
                });
        },

        // 卡充值微信付款
        wxPayCard: function (result) {
            let that = this;
            uni.requestPayment({
                timeStamp: result.timeStamp,
                nonceStr: result.nonceStr,
                package: result.package,
                signType: result.signType,
                paySign: result.paySign,

                success(res) {
                    uni.showToast({
                        title: '充值成功',
                        icon: 'none'
                    }); // 拉取用户余额

                    that.getUserCash(); // 获取券(非商品待支付订单)

                    if (!that.order_id) {
                        that.getCreatelist();
                    }
                },

                fail(res) {
                    uni.showToast({
                        title: '充值失败',
                        icon: 'none'
                    });
                    console.log('报错信息', res);
                }
            });
        }
    }
};
</script>
<style>
/**index.wxss**/
.wrap {
    min-height: 100vh;
    background: #f6f6f6;
    padding-top: 20rpx;
    padding-bottom: 200rpx;
}
.order_wrap {
    width: 690rpx;
    padding: 20rpx;
    text-align: center;
    /* background: #FFFFFF; */
    border-radius: 5rpx;
    margin: 0 auto;
    position: relative;
}
.order_wrap .order_price {
    font-size: 30rpx;
    color: rgba(0, 0, 0, 0.54);
}
.order_wrap .price {
    /* padding-left: 14rpx; */
    color: #0e0e0e;
    font-size: 68rpx;
    font-weight: bold;
}
.order_wrap .price .unit {
    font-size: 40rpx;
}
.order_wrap .line_bg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 690rpx;
    height: 20rpx;
    border-radius: 0 0 5rpx 5rpx;
    background-repeat: repeat-x;
    background-size: 18rpx 30rpx;
}
/* 支付方式 */
.payment_wrap {
    width: 690rpx;
    margin: 20rpx auto 0;
    background: #ffffff;
}
.payment_item {
    padding: 30rpx;
}
.payment_item .item_t {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.payment_item .item_t .item_t_l {
    display: flex;
    align-items: center;
}
.payment_item .item_icon {
    width: 53rpx;
    height: 43rpx;
    margin-right: 18rpx;
}
.payment_item .item_name {
    font-size: 30rpx;
    color: #000;
}
.payment_item .item_t_r {
    display: flex;
    align-items: center;
}
.payment_item .price {
    font-size: 32rpx;
    font-weight: bold;
    color: #d54c43;
    padding-right: 20rpx;
}
.payment_item .price .unit {
    font-size: 24rpx;
}
.payment_item .item_b {
    padding-left: 70rpx;
    font-size: 24rpx;
    color: rgba(1, 1, 1, 0.54);
}
.payment_item .item_b .wenzi:not(:first-child) {
    padding-left: 30rpx;
}
.payment_item .item_b .label {
    padding-right: 8rpx;
}
.payment_item .item_t_r .quan {
    font-size: 30rpx;
    color: #d54c43;
    padding-right: 26rpx;
}
/* .payment_item .item_t_r .icon_arrow{
	width: 12rpx;
	height: 20rpx;
} */
/* 充会员卡 */
/* .scroll_card{
	height: 500rpx;
} */
.card_list {
    padding: 0 30rpx;
}
/* 提交 */
.btn_tijiao {
    width: 405rpx;
    height: 98rpx;
    background: #295c56;
    border-radius: 10rpx;
    margin: 0 auto;
    font-size: 28rpx;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 50rpx;
    left: 50%;
    transform: translateX(-50%);
}
.btn_tijiao .label {
    padding-right: 10rpx;
}
.btn_tijiao .price {
    font-size: 42rpx;
    font-weight: bold;
}
.btn_tijiao .price .unit {
    font-size: 27rpx;
}
/* 余额不足提醒 */
.cash_pop {
    width: 586rpx;
    background: #ffffff;
    border-radius: 10rpx;
    font-size: 30rpx;
    color: #000000;
    text-align: center;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.cash_pop_t {
    padding: 120rpx 0 40rpx;
    border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
}
.cash_pop_b {
    height: 98rpx;
    display: flex;
    align-items: center;
    position: relative;
}
.cash_pop_b .cash_pop_btn {
    flex: 1;
    height: 98rpx;
    color: rgba(0, 0, 0, 0.54);
    display: flex;
    align-items: center;
    justify-content: center;
}
.cash_pop_b .cash_pop_btn.recharge {
    color: #d54c43;
    border-left: 1rpx solid rgba(0, 0, 0, 0.1);
}
.cash_pop .tip_tu {
    width: 134rpx;
    height: 245rpx;
    position: absolute;
    left: 50%;
    top: -135rpx;
    transform: translateX(-50%);
}
/* 优惠券 */
.coupon_wrap {
    width: 750rpx;
    position: fixed;
    bottom: 0;
    left: 0;
}
.coupon_wrap .coupon_t {
    width: 750rpx;
    height: 98rpx;
    background: #ffffff;
    border-radius: 20rpx 20rpx 0 0;
    font-size: 34rpx;
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.coupon_wrap .coupon_t .van-icon {
    position: absolute;
    top: 50%;
    right: 30rpx;
    transform: translateY(-50%);
}
.coupon_wrap_scroll {
    /* height: 480rpx; */
    height: 820rpx;
    background: #f6f6f6;
}
.coupon_list {
    padding-top: 0;
    /* min-height: 480rpx;
	height: 100%; */
}
.coupon_item:first-child {
    margin-top: 30rpx;
}
</style>