瀏覽代碼

feat(红包): 新增红包功能模块

- 添加红包相关页面和静态资源
- 实现红包扫码、领取和分享功能
- 新增红包相关API接口
- 修改验货时间从72小时改为48小时
- 在支付成功页面添加安全提示
ylong 3 周之前
父節點
當前提交
c47c519be8

+ 7 - 0
api/modules/user.js

@@ -28,5 +28,12 @@ export const useWxApi = (Vue, vm) => {
 		// 设置默认收货地址
 		addFeedbackAjax: (model) => vm.$u.post('/client/userCenter/addFeedback',model),
 		
+		// 红包相关接口
+		// 扫码获取红包信息
+		scanRedBagAjax: (bianhao) => vm.$u.http.get('/token/red/bag/scan', {bianhao}),
+		// 领取红包
+		getRedBagAjax: (bianhao) => vm.$u.http.get('/token/red/bag/get', {bianhao}),
+		// 获取分享列表
+		getShareRedBagListAjax: () => vm.$u.http.get('/token/red/bag/share/list'),
 	}
 }

+ 429 - 0
packet/pages/get.vue

@@ -0,0 +1,429 @@
+<template>
+    <view class="get-page">
+        <!-- Background -->
+        <image src="/packet/static/get/bg.png" class="bg-image" mode="widthFix"></image>
+
+        <!-- Main Content -->
+        <view class="content-wrapper">
+            <!-- Header -->
+            <view class="header-section">
+                <image src="/packet/static/get/text.png" class="header-logo" mode="widthFix"></image>
+            </view>
+
+            <!-- White Card -->
+            <view class="white-card">
+                <!-- Top Amount Row -->
+                <view class="top-amount-row">
+                    <text class="received-text">¥{{ redBagData.redPrice || 0 }} 红包已到账</text>
+                    <view class="use-btn-wrapper">
+                        <text class="use-btn-text">点击使用</text>
+                    </view>
+                </view>
+
+                <!-- Promo Box -->
+                <view class="promo-box">
+                    <image src="/packet/static/get/inner-box.png" class="inner-box-bg" mode="widthFix"></image>
+                    <view class="promo-content">
+                        <view class="promo-header">
+                            <text class="promo-amount"><text style="font-size: 30rpx;">¥</text>{{
+                                redBagData.shareSumPrice }}</text>
+                        </view>
+                        <text class="promo-desc">好友助力解锁更高金额</text>
+                        <text class="promo-detail">每邀请 1 位好友最高:你得<text class="highlight-red">¥{{
+                            redBagData.shareGetPrice }}红包</text>,好友得<text class="highlight-red">¥{{
+                                    redBagData.shareDGetPrice }}</text>红包</text>
+                    </view>
+                </view>
+
+                <!-- Invite Button -->
+                <view class="invite-btn-wrapper">
+                    <text class="invite-btn-text">立即邀请</text>
+                </view>
+
+                <!-- Red Packet Cards -->
+                <view class="red-packets-section">
+                    <view class="packet-card" v-for="(item, index) in 3" :key="index">
+                        <text class="packet-text">邀请好友</text>
+                        <text class="packet-text">双方得红包</text>
+                    </view>
+                </view>
+
+                <!-- Progress Bar -->
+                <view class="progress-section">
+                    <view class="progress-bar-bg">
+                        <view class="progress-bar-fill" :style="{ width: progressWidth + '%' }"></view>
+                        <image src="/packet/static/get/circle.png" class="progress-dot" :style="{ left: progressWidth + '%' }" mode="aspectFit"></image>
+                    </view>
+                    <text class="progress-text">已邀请{{ redBagData.shareNum || 0 }}人,已领{{ redBagData.shareGetNum || 0
+                        }}元,最高还可得¥{{ maxGetPrice }} 元</text>
+                </view>
+
+                <!-- Continue Scan Button -->
+                <view class="scan-btn-wrapper">
+                    <text class="scan-btn-text">继续扫码</text>
+                </view>
+
+                <!-- Bottom Text -->
+                <text class="bottom-text">好友助力成功后,奖励实时到账</text>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            bianhao: '', // 红包编号
+            redBagData: null, // 红包数据
+        }
+    },
+    computed: {
+        // 计算进度条宽度
+        progressWidth() {
+            return this.redBagData ? (this.redBagData.shareGetNum / (this.redBagData.shareSumPrice) * 100) : 0;
+        },
+        //最高还可得 redBagData.shareSumPrice - redBagData.shareGetNum 元
+        maxGetPrice() {
+            return this.redBagData ? this.redBagData.shareSumPrice - this.redBagData.shareGetNum : 0;
+        }
+    },
+    onLoad(options) {
+        // 从领取页面跳转过来时,获取编号参数
+        if (options.bianhao) {
+            this.bianhao = options.bianhao;
+            // 调用获取红包接口
+            this.getRedBagDetail();
+        }
+    },
+    methods: {
+        // 获取红包详情
+        async getRedBagDetail() {
+            if (!this.bianhao) {
+                uni.showModal({
+                    title: '提示',
+                    content: '红包编号缺失',
+                    showCancel: false
+                });
+                return;
+            }
+
+            try {
+                const res = await this.$u.api.getRedBagAjax(this.bianhao);
+                if (res.code === 200 || res.code === 0) {
+                    this.redBagData = res.data;
+                } else {
+                    uni.showToast({
+                        title: res.msg || '获取红包信息失败',
+                        icon: 'none'
+                    });
+                }
+            } catch (e) {
+                console.error('获取红包详情失败:', e);
+                uni.showToast({
+                    title: '网络错误',
+                    icon: 'none'
+                });
+            }
+        },
+        handleUse() {
+            // 使用红包逻辑
+            uni.showToast({
+                title: '即将跳转到使用页面',
+                icon: 'none'
+            });
+        },
+        handleInvite() {
+            // 邀请好友逻辑
+            if (this.redBagData && this.redBagData.shareRedLink) {
+                // 分享红包链接
+                uni.showModal({
+                    title: '分享红包',
+                    content: '请复制链接分享给好友:' + this.redBagData.shareRedLink,
+                    confirmText: '复制链接',
+                    success: (res) => {
+                        if (res.confirm) {
+                            uni.setClipboardData({
+                                data: this.redBagData.shareRedLink
+                            });
+                        }
+                    }
+                });
+            } else {
+                uni.showToast({
+                    title: '暂无分享链接',
+                    icon: 'none'
+                });
+            }
+        },
+        handleScan() {
+            // 继续扫码逻辑
+            uni.scanCode({
+                success: (scanRes) => {
+                    // 扫描到新红包,跳转到 index 页面
+                    uni.redirectTo({
+                        url: '/packet/pages/index?bianhao=' + scanRes.result
+                    });
+                }
+            });
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.get-page {
+    height: 100vh;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    .bg-image {
+        position: absolute;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 0;
+    }
+
+    .content-wrapper {
+        position: relative;
+        z-index: 1;
+        width: 100%;
+        padding: 40rpx 30rpx;
+        box-sizing: border-box;
+
+        .header-section {
+            text-align: center;
+            margin-bottom: 40rpx;
+            margin-top: 30rpx;
+
+            .header-logo {
+                width: 80%;
+                display: block;
+                margin: 0 auto 20rpx;
+            }
+
+            .header-title {
+                font-size: 48rpx;
+                font-weight: bold;
+                color: #1a1a1a;
+                display: block;
+            }
+        }
+
+        .white-card {
+            border-radius: 20rpx;
+            padding: 40rpx 30rpx;
+            background: url('/packet/static/get/frame.png') no-repeat center center;
+            background-size: 100% 100%;
+            margin-top: 110rpx;
+
+            .top-amount-row {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                margin: 10rpx 60rpx 30rpx 60rpx;
+
+                .received-text {
+                    font-size: 40rpx;
+                    font-weight: bold;
+                    color: #333;
+                }
+
+                .use-btn-wrapper {
+                    position: relative;
+                    width: 160rpx;
+                    height: 50rpx;
+                    background: url('/packet/static/get/use-button.png') no-repeat center center;
+                    background-size: 100% 100%;
+                    border-radius: 25rpx;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin-left: 20rpx;
+
+                    .use-btn-image {
+                        width: 100%;
+                        height: 100%;
+                    }
+
+                    .use-btn-text {
+                        font-size: 28rpx;
+                        color: #333;
+                        font-weight: 500;
+                    }
+                }
+            }
+
+            .promo-box {
+                position: relative;
+                margin-bottom: 30rpx;
+                padding: 0 10rpx;
+
+                .inner-box-bg {
+                    width: 100%;
+                    display: block;
+                }
+
+                .promo-content {
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    right: 0;
+                    bottom: 0;
+                    box-sizing: border-box;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+
+                    .promo-header {
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        margin-bottom: 16rpx;
+
+                        .promo-amount {
+                            font-size: 64rpx;
+                            font-weight: bold;
+                            color: #333;
+                        }
+                    }
+
+                    .promo-desc {
+                        font-size: 28rpx;
+                        color: #666;
+                        margin-bottom: 12rpx;
+                    }
+
+                    .promo-detail {
+                        font-size: 24rpx;
+                        color: #666;
+                        line-height: 1.5;
+
+                        .highlight-red {
+                            color: #ff4444;
+                            font-weight: bold;
+                        }
+                    }
+                }
+            }
+
+            .invite-btn-wrapper {
+                position: relative;
+                width: 300rpx;
+                height: 90rpx;
+                margin: 0 auto 40rpx;
+                background: url('/packet/static/get/button1.png') no-repeat center center;
+                background-size: 100% 100%;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+
+                .invite-btn-text {
+                    font-family: Adobe Heiti Std;
+                    font-size: 42rpx;
+                    color: #FFFFFF;
+                    text-align: center;
+                }
+            }
+
+            .red-packets-section {
+                display: flex;
+                justify-content: center;
+                gap: 20rpx;
+                margin-bottom: 30rpx;
+
+                .packet-card {
+                    flex: 1;
+                    position: relative;
+                    background: url('/packet/static/get/red-packet.png') no-repeat center center;
+                    background-size: 100% 100%;
+                    height: 184rpx;
+                    max-width: 194rpx;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    padding-top: 24rpx;
+
+                    .packet-text {
+                        font-size: 26rpx;
+                        color: #003C14;
+                        text-align: center;
+                    }
+                }
+            }
+
+            .progress-section {
+                margin-bottom: 30rpx;
+                padding: 0 30rpx;
+                .progress-bar-bg {
+                    position: relative;
+                    width: 100%;
+                    height: 15rpx;
+                    background: #BDFAAD;
+                    border-radius: 6rpx;
+
+                    .progress-bar-fill {
+                        position: absolute;
+                        left: 0;
+                        top: 0;
+                        height: 100%;
+                        background: linear-gradient(90deg, #4CAF50, #8BC34A);
+                        border-radius: 6rpx;
+                        transition: width 0.3s ease;
+                    }
+
+                    .progress-dot {
+                        position: absolute;
+                        top: 50%;
+                        transform: translateX(-50%) translateY(-50%);
+                        width: 32rpx;
+                        height: 32rpx;
+                    }
+                }
+
+                .progress-text {
+                    display: block;
+                    text-align: center;
+                    font-size: 26rpx;
+                    color: #666;
+                    margin-top: 16rpx;
+                }
+            }
+
+            .scan-btn-wrapper {
+                position: relative;
+                width: 300rpx;
+                height: 90rpx;
+                margin: 0 auto 30rpx;
+                background: url('/packet/static/get/button1.png') no-repeat center center;
+                background-size: 100% 100%;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+
+                .scan-btn-text {
+                    font-family: Adobe Heiti Std;
+                    font-size: 42rpx;
+                    color: #FFFFFF;
+                    text-align: center;
+                }
+            }
+
+            .bottom-text {
+                font-family: Adobe Heiti Std;
+                font-size: 38rpx;
+                color: #003C14;
+                text-align: center;
+                font-style: normal;
+                margin: 0 auto;
+                margin-left: 60rpx;
+            }
+        }
+    }
+}
+</style>

+ 351 - 0
packet/pages/index.vue

@@ -0,0 +1,351 @@
+<template>
+    <view class="packet-page">
+        <!-- Background -->
+        <image src="/packet/static/index/background.png" class="bg-image" mode="widthFix"></image>
+
+        <!-- Main Content -->
+        <view class="content-wrapper">
+            <!-- Headline -->
+            <image src="/packet/static/index/headline.png" class="headline-image" mode="widthFix"></image>
+
+            <!-- Red Envelope Section -->
+            <view class="envelope-section">
+                <!-- Red Envelope Image -->
+                <image src="/packet/static/index/red_envelope.png" class="envelope-image" mode="widthFix"></image>
+
+                <!-- Amount Display -->
+                <view class="amount-wrapper">
+                    <view class="amount-display">
+                        <text class="currency">¥</text>
+                        <text class="amount-value">{{ amount }}</text>
+                    </view>
+                </view>
+
+                <!-- Receive Button -->
+                <view class="receive-btn-wrapper" @click="handleReceive">
+                    <image src="/packet/static/index/btn_receive.png" class="btn-image" mode="widthFix"></image>
+                    <text class="btn-text" v-if="!redBagData.drawStatus">领{{ amount }}元红包 | 买书卖书都能用</text>
+                    <text class="btn-text" v-else>已领取</text>
+                </view>
+            </view>
+
+            <!-- Info Card -->
+            <view class="info-card-section">
+                <image src="/packet/static/index/info_frame.png" class="info-frame" mode="widthFix"></image>
+                <view class="info-content">
+                    <view class="info-list">
+                        <view class="info-item">
+                            <text>买书立减</text>
+                            <text class="spacer"></text>
+                            <text>卖书加价</text>
+                        </view>
+                        <view class="info-item">
+                            <text>伴你轻松度过大学四年</text>
+                        </view>
+                        <view class="info-item">
+                            <text>官方补贴</text>
+                            <text class="spacer"></text>
+                            <text>无门槛使用</text>
+                        </view>
+                    </view>
+                    <view class="rule-footer">
+                        <text class="rule-text">活动规则</text>
+                    </view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            amount: '1.58',
+            bianhao: '', // 红包编号
+            redBagData: null // 红包数据
+        }
+    },
+    onLoad(options) {
+        // 从二维码扫描进入时,获取编号参数
+        if (options.bianhao) {
+            this.bianhao = options.bianhao;
+            // 调用扫码接口获取红包信息
+            this.scanRedBag();
+        }
+    },
+    onShow() {
+        // 如果是从其他页面返回,重新获取红包数据
+        if (this.bianhao) {
+            this.scanRedBag();
+        }
+    },
+    methods: {
+        // 扫码获取红包信息
+        async scanRedBag() {
+            if (!this.bianhao) {
+                // 如果没有编号,提示用户扫码
+                uni.showModal({
+                    title: '提示',
+                    content: '请扫描红包二维码',
+                    showCancel: false
+                });
+                return;
+            }
+
+            try {
+                const res = await this.$u.api.scanRedBagAjax(this.bianhao);
+                if (res.code === 200 || res.code === 0) {
+                    this.redBagData = res.data;
+                    this.amount = res.data.redPrice;
+                } else {
+                    uni.showToast({
+                        title: res.msg || '获取红包信息失败',
+                        icon: 'none'
+                    });
+                }
+            } catch (e) {
+                console.error('扫码获取红包信息失败:', e);
+                uni.showToast({
+                    title: '网络错误',
+                    icon: 'none'
+                });
+            }
+        },
+        // 领取红包
+        async handleReceive() {
+            // 如果已领取,提示用户
+            if (this.redBagData && this.redBagData.drawStatus === 1) {
+                uni.showToast({
+                    title: '红包已领取',
+                    icon: 'none'
+                });
+                return;
+            }
+
+            if (!this.bianhao) {
+                uni.showToast({
+                    title: '红包编号缺失',
+                    icon: 'none'
+                });
+                return;
+            }
+
+            // 显示领取中提示
+            uni.showLoading({
+                title: '领取中...'
+            });
+
+            try {
+                const res = await this.$u.api.getRedBagAjax(this.bianhao);
+                uni.hideLoading();
+                if (res.code === 200) {
+                    // 更新红包数据
+                    this.redBagData = res.data;
+                    uni.showToast({
+                        title: '领取成功',
+                        icon: 'success'
+                    });
+                    // 跳转到 get 页面,并传递红包数据
+                    setTimeout(() => {
+                        uni.redirectTo({
+                            url: '/packet/pages/get?bianhao=' + this.bianhao
+                        });
+                    }, 1500);
+                } else {
+                    uni.showToast({
+                        title: res.msg || '领取失败',
+                        icon: 'none'
+                    });
+                }
+            } catch (e) {
+                uni.hideLoading();
+                console.error('领取红包失败:', e);
+                uni.showToast({
+                    title: '网络错误',
+                    icon: 'none'
+                });
+            }
+        },
+        handleShare() {
+            // Share logic
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.packet-page {
+    height: 100vh;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow: hidden;
+
+    .bg-image {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 0;
+    }
+
+    .content-wrapper {
+        position: relative;
+        z-index: 1;
+        width: 100%;
+        padding: 40rpx 30rpx;
+        box-sizing: border-box;
+
+        .headline-image {
+            width: 80%;
+            margin-left: 10%;
+            margin-bottom: 30rpx;
+            margin-top: 30rpx;
+        }
+
+        .envelope-section {
+            position: relative;
+
+            .envelope-image {
+                width: 90%;
+                display: block;
+                margin: 0 auto;
+            }
+
+            .amount-wrapper {
+                position: absolute;
+                top: 12%;
+                left: 50%;
+                transform: translateX(-50%);
+                text-align: center;
+
+                .amount-display {
+                    display: flex;
+                    align-items: baseline;
+                    justify-content: center;
+
+                    .currency {
+                        font-size: 78rpx;
+                        color: #FF4444;
+                        font-weight: bold;
+                        margin-right: 4rpx;
+                    }
+
+                    .amount-value {
+                        font-size: 156rpx;
+                        color: #FF4444;
+                        font-weight: bold;
+                    }
+                }
+            }
+
+            .receive-btn-wrapper {
+                position: absolute;
+                bottom: 15%;
+                left: 52%;
+                transform: translateX(-50%);
+                width: 84%;
+
+                .btn-image {
+                    width: 100%;
+                    height: auto;
+                }
+
+                .btn-text {
+                    position: absolute;
+                    top: 45%;
+                    left: 50%;
+                    transform: translate(-50%, -50%);
+                    font-size: 32rpx;
+                    color: #D73800;
+                    font-weight: 500;
+                    white-space: nowrap;
+                }
+            }
+        }
+
+        .info-card-section {
+            position: relative;
+            margin-bottom: 20rpx;
+
+            .info-frame {
+                width: 100%;
+                display: block;
+            }
+
+            .info-content {
+                position: absolute;
+                top: 20%;
+                left: 0;
+                right: 0;
+                bottom: 0;
+                padding: 30rpx;
+                box-sizing: border-box;
+
+                .info-list {
+                    padding: 0 20rpx;
+
+                    .info-item {
+                        font-family: Fotor_HelloFont_GongYiTi;
+                        font-size: 40rpx;
+                        color: #000000;
+                        line-height: 64rpx;
+                        text-align: center;
+
+                        .spacer {
+                            flex: 1;
+                            margin: 0 16rpx;
+                        }
+
+                        .star {
+                            color: #FFB300;
+                            margin-left: 8rpx;
+                        }
+                    }
+                }
+
+                .rule-footer {
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    margin-top: 30rpx;
+
+                    .rule-text {
+                        font-size: 26rpx;
+                        color: #666;
+                        text-decoration: underline;
+                    }
+
+                    .share-btn-wrapper {
+                        position: absolute;
+                        bottom: 20rpx;
+                        right: 20rpx;
+                        width: 120rpx;
+                        height: 120rpx;
+
+                        .share-btn-image {
+                            width: 100%;
+                            height: 100%;
+                        }
+
+                        .share-text {
+                            position: absolute;
+                            top: 50%;
+                            left: 50%;
+                            transform: translate(-50%, -50%);
+                            font-size: 22rpx;
+                            color: #fff;
+                            font-weight: bold;
+                            text-align: center;
+                            line-height: 1.3;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+</style>

+ 299 - 0
packet/pages/share.vue

@@ -0,0 +1,299 @@
+<template>
+    <view class="share-page">
+        <!-- Background -->
+        <image src="/packet/static/share/bg.png" class="bg-image" mode="widthFix"></image>
+
+        <!-- Main Content -->
+        <view class="content-wrapper">
+            <!-- Loop through share list -->
+            <view class="card" v-for="(item, index) in shareList" :key="index">
+                <!-- Header -->
+                <view class="card-header">
+                    <text class="card-title">邀请好友同享最高可得{{ item.shareSumPrice || 15 }}元红包</text>
+                    <text class="card-time">{{ formatExpireTime(item.shareRedBagExpire) }}</text>
+                </view>
+
+                <!-- Progress Section -->
+                <view class="progress-section">
+                    <!-- Left Icon -->
+                    <image src="/packet/static/share/invite-text.png" class="left-icon" mode="widthFix"></image>
+
+                    <!-- Center Content -->
+                    <view class="center-content">
+                        <!-- Progress Bubble -->
+                        <view class="progress-bubble">
+                            <text>已领{{ item.shareGetNum || 0 }}元,最高还可得{{ (item.shareSumPrice || 0) - (item.shareGetNum
+                                || 0) }}元</text>
+                        </view>
+
+                        <!-- Progress Bar -->
+                        <view class="progress-bar-container">
+                            <view class="progress-line"></view>
+                            <view class="progress-dot" :style="{ left: getProgressPercent(item) + '%' }"></view>
+                        </view>
+
+                        <!-- Progress Labels -->
+                        <view class="progress-labels">
+                            <text class="label">邀请好友</text>
+                            <text class="label">好友领取</text>
+                            <text class="label">获得红包</text>
+                        </view>
+                    </view>
+
+                    <!-- Right Packet Icon -->
+                    <image src="/packet/static/share/red-packet.png" class="right-packet" mode="widthFix"></image>
+                </view>
+
+                <!-- Share/Detail Button -->
+                <view class="btn-wrapper">
+                    <image src="/packet/static/share/share-btn.png" class="btn-image" mode="widthFix"></image>
+                    <text class="btn-text">{{ index === 0 ? '立即分享' : '查看详情' }}</text>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            shareList: [] // 分享列表数据
+        }
+    },
+    onLoad() {
+        // 获取分享列表
+        this.getShareList();
+    },
+    methods: {
+        // 获取分享列表
+        async getShareList() {
+            try {
+                const res = await this.$u.api.getShareRedBagListAjax();
+                if (res.code === 200 || res.code === 0) {
+                    this.shareList = res.data || [];
+                } else {
+                    uni.showToast({
+                        title: res.msg || '获取分享列表失败',
+                        icon: 'none'
+                    });
+                }
+            } catch (e) {
+                console.error('获取分享列表失败:', e);
+                uni.showToast({
+                    title: '网络错误',
+                    icon: 'none'
+                });
+            }
+        },
+        // 计算进度百分比
+        getProgressPercent(item) {
+            if (!item.shareNum || item.shareNum === 0) {
+                return 0;
+            }
+            return (item.shareGetNum / item.shareNum) * 100;
+        },
+        // 格式化过期时间
+        formatExpireTime(timeStr) {
+            if (!timeStr) {
+                return this.formatTime(new Date());
+            }
+            const date = new Date(timeStr);
+            return this.formatTime(date);
+        },
+        // 格式化时间
+        formatTime(date) {
+            const year = date.getFullYear();
+            const month = String(date.getMonth() + 1).padStart(2, '0');
+            const day = String(date.getDate()).padStart(2, '0');
+            const hours = String(date.getHours()).padStart(2, '0');
+            const minutes = String(date.getMinutes()).padStart(2, '0');
+            const seconds = String(date.getSeconds()).padStart(2, '0');
+            return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+        },
+        handleShare() {
+            // 分享逻辑
+            uni.showToast({
+                title: '分享成功',
+                icon: 'success'
+            });
+        },
+        handleViewDetail() {
+            // 查看详情逻辑
+            uni.showToast({
+                title: '查看详情',
+                icon: 'none'
+            });
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.share-page {
+    min-height: 100vh;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 40rpx 30rpx;
+    box-sizing: border-box;
+
+    .bg-image {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 0;
+    }
+
+    .content-wrapper {
+        position: relative;
+        z-index: 1;
+        width: 100%;
+        max-width: 700rpx;
+        padding-top: 60rpx;
+
+        .card {
+            background: #fff;
+            border-radius: 24rpx;
+            overflow: hidden;
+            margin-bottom: 40rpx;
+            box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
+
+            .card-header {
+                background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
+                padding: 24rpx 30rpx;
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+
+                .card-title {
+                    font-size: 28rpx;
+                    font-weight: 600;
+                    color: #fff;
+                    flex: 1;
+                }
+
+                .card-time {
+                    font-size: 22rpx;
+                    color: rgba(255, 255, 255, 0.9);
+                    white-space: nowrap;
+                    margin-left: 20rpx;
+                }
+            }
+
+            .progress-section {
+                padding: 40rpx 30rpx;
+                display: flex;
+                align-items: flex-start;
+                gap: 20rpx;
+
+                .left-icon {
+                    width: 80rpx;
+                    height: 80rpx;
+                    flex-shrink: 0;
+                }
+
+                .center-content {
+                    flex: 1;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+
+                    .progress-bubble {
+                        background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
+                        padding: 12rpx 28rpx;
+                        border-radius: 24rpx;
+                        margin-bottom: 24rpx;
+
+                        text {
+                            font-size: 24rpx;
+                            color: #fff;
+                            font-weight: 500;
+                        }
+                    }
+
+                    .progress-bar-container {
+                        position: relative;
+                        width: 100%;
+                        height: 8rpx;
+                        background: linear-gradient(90deg, #E8F5E9 0%, #C8E6C9 100%);
+                        border-radius: 4rpx;
+                        margin-bottom: 20rpx;
+
+                        .progress-line {
+                            position: absolute;
+                            left: 0;
+                            top: 0;
+                            height: 100%;
+                            width: 100%;
+                            background: linear-gradient(90deg, #4CAF50 0%, #8BC34A 100%);
+                            border-radius: 4rpx;
+                        }
+
+                        .progress-dot {
+                            position: absolute;
+                            top: 50%;
+                            transform: translate(-50%, -50%);
+                            width: 36rpx;
+                            height: 36rpx;
+                            background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
+                            border-radius: 50%;
+                            box-shadow: 0 4rpx 12rpx rgba(76, 175, 80, 0.4);
+                            border: 4rpx solid #fff;
+                        }
+                    }
+
+                    .progress-labels {
+                        display: flex;
+                        justify-content: space-between;
+                        width: 100%;
+
+                        .label {
+                            font-size: 24rpx;
+                            color: #666;
+                            text-align: center;
+                            flex: 1;
+                        }
+                    }
+                }
+
+                .right-packet {
+                    width: 90rpx;
+                    height: 90rpx;
+                    flex-shrink: 0;
+                }
+            }
+
+            .btn-wrapper {
+                position: relative;
+                display: flex;
+                justify-content: center;
+                padding: 0 30rpx 40rpx;
+
+                .btn-image {
+                    width: 320rpx;
+                    height: 88rpx;
+                    display: block;
+                }
+
+                .btn-text {
+                    position: absolute;
+                    top: 0;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    width: 320rpx;
+                    text-align: center;
+                    line-height: 88rpx;
+                    font-size: 32rpx;
+                    color: #fff;
+                    font-weight: 600;
+                    letter-spacing: 2rpx;
+                }
+            }
+        }
+    }
+}
+</style>

二進制
packet/static/get/bg.png


二進制
packet/static/get/button1.png


二進制
packet/static/get/circle.png


二進制
packet/static/get/frame.png


二進制
packet/static/get/inner-box.png


二進制
packet/static/get/red-packet.png


二進制
packet/static/get/text.png


二進制
packet/static/get/use-button.png


二進制
packet/static/index/background.png


二進制
packet/static/index/btn_receive.png


二進制
packet/static/index/btn_share.png


二進制
packet/static/index/headline.png


二進制
packet/static/index/info_frame.png


二進制
packet/static/index/red_envelope.png


二進制
packet/static/share/bg.png


二進制
packet/static/share/invite-text.png


二進制
packet/static/share/oval.png


二進制
packet/static/share/red-packet.png


二進制
packet/static/share/share-btn.png


+ 29 - 0
pages-car/pages/pay-success.vue

@@ -9,6 +9,14 @@
             <button class="btn-return" @click="handleReturn">返回首页</button>
             <button class="btn-view" @click="handleViewOrder">查看订单</button>
         </view>
+        
+        <!-- 温馨提示 -->
+        <view class="tip-section">
+            <view class="tip-title">温馨提示</view>
+            <view class="tip-content">
+                平台不会以快递丢失/商品质量等为由,向您索取银行卡信息或手机验证码。请您时刻保持警惕,如遇问题,请您先与平台核实
+            </view>
+        </view>
     </view>
 </template>
 
@@ -97,5 +105,26 @@ export default {
             }
         }
     }
+
+    .tip-section {
+        margin-top: 80rpx;
+        padding: 0 40rpx;
+        width: 100%;
+        box-sizing: border-box;
+
+        .tip-title {
+            font-size: 28rpx;
+            font-weight: 500;
+            color: #333;
+            margin-bottom: 16rpx;
+        }
+
+        .tip-content {
+            font-size: 24rpx;
+            color: #999;
+            line-height: 1.6;
+            text-align: justify;
+        }
+    }
 }
 </style>

+ 1 - 1
pages-mine/components/service-promise.vue

@@ -7,7 +7,7 @@
         </view>
         <view class="promise-item">
             <u-icon name="clock-fill" color="#FFFFFF" size="32"></u-icon>
-            <text>72小时验</text>
+            <text>48小时验</text>
         </view>
         <view class="promise-item">
             <u-icon name="yuan-circle-fill" color="#FFFFFF" size="32"></u-icon>

+ 29 - 0
pages.json

@@ -445,6 +445,35 @@
                     }
                 }
             ]
+        },
+        {
+            "root": "packet",
+            "pages": [
+                {
+                    "path": "pages/index",
+                    "style": {
+                        "navigationBarTitleText": "领取红包",
+                        "navigationBarBackgroundColor": "#ffffff",
+                        "navigationBarTextStyle": "black"
+                    }
+                },
+                {
+                    "path": "pages/get",
+                    "style": {
+                        "navigationBarTitleText": "领取红包",
+                        "navigationBarBackgroundColor": "#ffffff",
+                        "navigationBarTextStyle": "black"
+                    }
+                },
+                {
+                    "path": "pages/share",
+                    "style": {
+                        "navigationBarTitleText": "分享领红包",
+                        "navigationBarBackgroundColor": "#ffffff",
+                        "navigationBarTextStyle": "black"
+                    }
+                }
+            ]
         }
     ],
     "preloadRule": {},

+ 2 - 2
pages/home/components/ServiceGuarantee.vue

@@ -17,9 +17,9 @@
                 <view class="guarantee-item">
                     <view class="item-header">
                         <image src="/static/img/1-2.png" mode="widthFix" class="item-icon"></image>
-                        <text class="item-title">72小时验</text>
+                        <text class="item-title">48小时验</text>
                     </view>
-                    <view class="item-desc">本单获得72小时验资格,订单将在"到仓签收"后72小时内验货完毕,未完成验货将获得3元补贴到余额,可随验货书款一起提现。</view>
+                    <view class="item-desc">本单获得48小时验资格,订单将在"到仓签收"后48小时内验货完毕,未完成验货将获得3元补贴到余额,可随验货书款一起提现。</view>
                 </view>
 
                 <!-- 极速打款 -->

+ 2 - 2
pages/home/components/ServiceInfo.vue

@@ -8,7 +8,7 @@
             </view>
             <view class="icon-item">
                 <image src="/static/img/2.png" mode="widthFix" style="width: 30rpx; height: 30rpx"></image>
-                <text style="margin-left: 6rpx">72小时验</text>
+                <text style="margin-left: 6rpx">48小时验</text>
                 <text style="margin-left: 4rpx"> > </text>
             </view>
             <view class="icon-item">
@@ -54,7 +54,7 @@ export default {
                 },
                 {
                     icon: "/static/img/2.png",
-                    text: "72小时验",
+                    text: "48小时验",
                 },
                 {
                     icon: "/static/img/3.png",