up uni-app

2026-07-05 12:05:02 +00:00 · 2025-08-23 17:12:25 +08:00 · 2025-08-23 17:12:25 +08:00 · 195cea7bd4
commit 195cea7bd4
parent 0022acba80
31 changed files with 4051 additions and 1398 deletions
--- a/uni-app/src/addon/components/diy-form/index.vue
+++ b/uni-app/src/addon/components/diy-form/index.vue
@ -4,7 +4,8 @@
        <view v-show="requestData.status == 1 && requestData.error && requestData.error.length === 0 && !diy.getLoading()" class="diy-template-wrap">
            <diy-group ref="diyGroupRef" :data="diyFormData"/>
        </view>
-        <view class="flex flex-col" v-if="requestData.error && requestData.error.length > 0">
+        <!-- 目前只有自定义表单才展示错误信息，其他类型暂时不控制 -->
+        <view class="flex flex-col" v-if="requestData.error && requestData.error.length > 0 && diy.data == 'DIY_FORM'">
            <view class="flex-1 flex flex-col items-center pt-[20rpx]" v-for="(item, index) in requestData.error.slice(0, 1)" :key="index">
                <text class="nc-iconfont nc-icon-tanhaoV6mm text-[#ccc] mb-[30rpx] !text-[100rpx]"></text>
                <view class="text-[38rpx] font-bold mt-3">{{ item.title }}</view>
--- a/uni-app/src/addon/components/diy/group/index.vue
+++ b/uni-app/src/addon/components/diy/group/index.vue
@ -122,6 +122,9 @@
                        <diy-form-file ref="diyFormFileRef" :component="component" :global="data.global" :index="index" />
                    </template>

+
+                    <!-- 以下是addon文件夹下的自定义组件 -->
+
                </view>
            </view>
        </template>
@ -132,6 +135,7 @@
    </view>
 </template>
 <script lang="ts" setup>
+
 import topTabbar from '@/components/top-tabbar/top-tabbar.vue'
 import popAds from '@/components/pop-ads/pop-ads.vue'
 import { useDiyGroup } from './useDiyGroup'
--- a/uni-app/src/app/components/diy/form-table/index.vue
+++ b/uni-app/src/app/components/diy/form-table/index.vue
@ -8,6 +8,88 @@
 					<text class="text-[#ec0003]">{{ diyComponent.field.required ? '*' : '' }}</text>
 				</view>
 			</view>
+			<view>
+<!--				<uni-table border>
+					<uni-tr v-for="(column, columnIndex) in diyComponent.columnList" :key="columnIndex">
+						<uni-th>{{ column.name }}</uni-th>
+						<uni-td>
+							<view class="layout-two-content"
+								v-if="column.type === 'text' || column.type === 'number' || column.type === 'idcard'">
+								<input :type="column.type" class="layout-one-content"
+									placeholderClass="layout-one-input-placeholder"
+									:placeholder-style="{'font-size': (diyComponent.fontSize * 2) + 'rpx' }"
+									:style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx'}"
+									v-model="column.value" :disabled="isDisabled" />
+							</view>
+							<view class="layout-two-content"
+								v-else-if="column.type === 'mobile'">
+								<input type="tel" class="layout-one-content"
+									placeholderClass="layout-one-input-placeholder"
+									:placeholder-style="{'font-size': (diyComponent.fontSize * 2) + 'rpx' }"
+									:style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx'}"
+									v-model="column.value" :disabled="isDisabled" />
+							</view>
+							<view v-else-if="column.type === 'gender'">
+								<view @click="openSex(column)"
+									class="px-[16rpx] box-border h-[80rpx] flex items-center justify-between border-solid border-[2rpx] border-[#e6e6e6] rounded-[10rpx] w-[100%]">
+									<view>
+										<text class="mr-[10rpx] text-[28rpx]"
+											:style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx'}">
+											{{ getSexName(column) }}
+										</text>
+									</view>
+									<text class="nc-iconfont nc-icon-xiaV6xx pull-down-arrow text-[#666]"
+										:class="{'selected': selectShow[columnIndex]}"
+										:style="{'font-size': (diyComponent.fontSize * 2 + 2) + 'rpx !important'}"></text>
+								</view>
+							</view>
+							<view v-else-if="column.type === 'date'">
+								<view class="layout-one-content" @click="openCalendar(column)">
+									<view
+										class="nc-iconfont nc-icon-a-riliV6xx-36 !text-[32rpx] text-[#999] mr-[16rpx]">
+									</view>
+									<view class="flex-1 text-overflow-ellipsis flex"
+										:class="{'!text-[#999]' : !diyComponent.field.value.date && !diyComponent.defaultControl}"
+										:style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx' }">
+										{{ startDate }}
+									</view>
+								</view>
+							</view>
+							<view v-else-if="column.type === 'address'">
+								<view class="flex layout-one-content justify-between items-center">
+									<input type="text" class="flex-1" :placeholder="inputPlaceholder(column)" 
+								       placeholderClass="layout-one-input-placeholder"
+								       :placeholder-style="{'font-size': (diyComponent.fontSize * 2) + 'rpx' }"
+								       :style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx'}"
+								       v-model="column.value" :disabled="isDisabled" @click="selectArea(column)" />
+									   <view class="text-[var(&#45;&#45;primary-color)]" v-if="column.value" @click="column.value=''">
+									   	清除
+									   </view>
+								</view>	
+								<textarea v-if="column.addressFormat=='province/city/district/address'" type="textarea" class="layout-one-content mt-2 w-full" placeholderClass="layout-one-input-placeholder" :placeholder-style="{'font-size': (diyComponent.fontSize * 2) + 'rpx' }" placeholder="详细地址(如小区门牌号)" :disabled="isDisabled"></textarea>
+							</view>
+
+							&lt;!&ndash; 仅当字段类型为 'radio' 时才显示 &ndash;&gt;
+							<view class="layout-two-content" v-else-if="column.type === 'radio'">
+								<view @click="openPicker(columnIndex)"
+									class="px-[16rpx] box-border h-[80rpx] flex items-center justify-between border-solid border-[2rpx] border-[#e6e6e6] rounded-[10rpx] w-[100%]">
+									<view v-if="column.value">
+										<text class="mr-[10rpx] text-[28rpx]"
+											:style="{'color': diyComponent.textColor,'font-size': (diyComponent.fontSize * 2) + 'rpx'}">
+											{{ getSelectRadioName(columnIndex) }}
+										</text>
+									</view>
+									<text v-else class="text-[28rpx] text-[#999]"
+										:style="{'font-size': (diyComponent.fontSize * 2) + 'rpx'}">请选择</text>
+									<text class="nc-iconfont nc-icon-xiaV6xx pull-down-arrow text-[#666]"
+										:class="{'selected': selectShow[columnIndex]}"
+										:style="{'font-size': (diyComponent.fontSize * 2 + 2) + 'rpx !important'}"></text>
+								</view>
+							</view>
+						</uni-td>
+					</uni-tr>
+				</uni-table>-->
+			</view>
 		</view>

 		<!-- 下拉弹窗 -->
@ -50,7 +132,10 @@
 	import { ref, computed, watch, onMounted } from 'vue';
 	import useDiyStore from '@/app/stores/diy';
 	import { img, timeStampTurnTime, timeTurnTimeStamp } from '@/utils/common';
-
+	// import uniTable from '@/addon/o2o/components/uni-table/components/uni-table/uni-table.vue'
+	// import uniTr from '@/addon/o2o/components/uni-table/components/uni-tr/uni-tr.vue'
+	// import uniTh from '@/addon/o2o/components/uni-table/components/uni-th/uni-th.vue'
+	// import uniTd from '@/addon/o2o/components/uni-table/components/uni-td/uni-td.vue'
 	const props = defineProps(['component', 'index', 'global']);
 	const diyStore = useDiyStore();
 	const formData: any = ref({
@ -251,8 +336,8 @@


 	const warpCss = computed(() => {
-		var style = '';
-		style += 'position:relative;';
+        let style = '';
+        style += 'position:relative;';
 		if (diyComponent.value.componentStartBgColor) {
 			if (diyComponent.value.componentStartBgColor && diyComponent.value.componentEndBgColor) style += `background:linear-gradient(${diyComponent.value.componentGradientAngle},${diyComponent.value.componentStartBgColor},${diyComponent.value.componentEndBgColor});`;
 			else style += 'background-color:' + diyComponent.value.componentStartBgColor + ';';
--- a/uni-app/src/app/pages/auth/bind.vue
+++ b/uni-app/src/app/pages/auth/bind.vue
@ -10,13 +10,13 @@
            <view class="text-[26rpx] leading-[39rpx] text-[var(--text-color-light6)] mt-[24rpx] mb-[90rpx]">{{ t('bindMobileTip') }}</view>
            <u-form labelPosition="left" :model="formData" errorType='toast' :rules="rules" ref="formRef">
                <view
-                    class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6]">
+                    class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[40rpx] box-border bg-[#F6F6F6]">
                    <u-form-item label="" prop="mobile" :border-bottom="false">
                        <u-input v-model="formData.mobile" type="number" maxlength="11" border="none" :placeholder="t('mobilePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]" />
                    </u-form-item>
                </view>
                <view
-                    class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[var(--goods-rounded-mid)] box-border bg-[#F6F6F6] mt-[40rpx]">
+                    class="h-[90rpx] flex w-full items-center px-[30rpx] rounded-[40rpx] box-border bg-[#F6F6F6] mt-[40rpx]">
                    <u-form-item label="" prop="mobile_code" :border-bottom="false">
                        <u-input v-model="formData.mobile_code" type="number" maxlength="4" border="none" :placeholder="t('codePlaceholder')" class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx" placeholderClass="!text-[var(--text-color-light9)]">
                            <template #suffix>
@ -84,18 +84,11 @@ const formData: any = reactive({

 const real_name_input = ref(true);

-const wxPrivacyPopupRef: any = ref(null)
-
 onLoad(() => {
    // 防止浏览器自动填充
    setTimeout(() => {
        real_name_input.value = false;
    }, 800)
-    // #ifdef MP
-    nextTick(() => {
-        if (wxPrivacyPopupRef.value) wxPrivacyPopupRef.value.proactive();
-    })
-    // #endif

    uni.getStorageSync('openid') && (Object.assign(formData, { openid: uni.getStorageSync('openid') }))
    uni.getStorageSync('pid') && (Object.assign(formData, { pid: uni.getStorageSync('pid') }))
--- a/uni-app/src/app/pages/auth/login.vue
+++ b/uni-app/src/app/pages/auth/login.vue
@ -18,7 +18,7 @@
                            <u-input v-model="formData.username" border="none" maxlength="40"
                                     :placeholder="t('usernamePlaceholder')" autocomplete="off" class="!bg-transparent"
                                     :disabled="real_name_input" fontSize="26rpx"
-                                     placeholderClass="!text-[var(--text-color-light6)] text-[26rpx]" />
+                                     placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]" />
                        </u-form-item>
                    </view>
                    <view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[40rpx] box-border bg-[#F6F6F6] mt-[40rpx]">
@ -26,7 +26,7 @@
                            <u-input v-model="formData.password" border="none" :password="isPassword" maxlength="40"
                                     :placeholder="t('passwordPlaceholder')" autocomplete="new-password"
                                     class="!bg-transparent" :disabled="real_name_input" fontSize="26rpx"
-                                     placeholderClass="!text-[var(--text-color-light6)] text-[26rpx]">
+                                     placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
                                <template #suffix>
                                    <view @click="changePassword" v-if="formData.password">
                                        <u-icon :name="isPassword?'eye-off':'eye-fill'" color="#b9b9b9" size="20"></u-icon>
@ -42,15 +42,15 @@
                            <u-input v-model="formData.mobile" type="number" maxlength="11" border="none"
                                     :placeholder="t('mobilePlaceholder')" autocomplete="off" class="!bg-transparent"
                                     :disabled="real_name_input" fontSize="26rpx"
-                                     placeholderClass="!text-[var(--text-color-light6)] text-[26rpx]" />
+                                     placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]" />
                        </u-form-item>
                    </view>
-                    <view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[40rpx] box-border bg-[#F6F6F6] mt-[40rpx] text-[26rpx]">
+                    <view class="h-[88rpx] flex w-full items-center px-[30rpx] rounded-[40rpx] box-border bg-[#F6F6F6] mt-[40rpx]">
                        <u-form-item label="" prop="mobile_code" :border-bottom="false">
                            <u-input v-model="formData.mobile_code" type="number" maxlength="4" border="none"
                                     class="!bg-transparent" fontSize="26rpx" :disabled="real_name_input"
                                     :placeholder="t('codePlaceholder')"
-                                     placeholderClass="!text-[var(--text-color-light6)] text-[26rpx]">
+                                     placeholderClass="!text-[var(--text-color-light9)] text-[26rpx]">
                                <template #suffix>
                                    <sms-code v-if="configStore.login.agreement_show" :mobile="formData.mobile" type="login" v-model="formData.mobile_key" :isAgree="isAgree"></sms-code>
                                    <sms-code v-else :mobile="formData.mobile" type="login" v-model="formData.mobile_key"></sms-code>
--- a/uni-app/src/app/pages/verify/record.vue
+++ b/uni-app/src/app/pages/verify/record.vue
@ -39,7 +39,7 @@
                            </view>
                            <view class="flex-1">
                                <view class="text-[22rpx] text-[var(--text-color-light9)] mb-[10rpx] leading-[30rpx]">核销员</view>
-                                <view class="text-[26rpx] text-[#303133] leading-[36rpx]">{{ item.member ? item.member.nickname : '--' }}</view>
+                                <view class="text-[26rpx] text-[#303133] leading-[36rpx]">{{ (item.is_admin == 1 ? '后台核销' : item.member?.nickname) || '--' }}</view>
                            </view>
                        </view>
                    </view>
--- a/uni-app/src/components/area-select/area-select.vue
+++ b/uni-app/src/components/area-select/area-select.vue
@ -17,16 +17,16 @@
                </view>
                <view class="flex-1 pr-[10rpx]" v-else></view>
            </view>
-            <scroll-view scroll-y="true" class="h-[50vh]">
-                <view class="flex p-[30rpx] pt-[0] text-sm font-500">
-                    <view v-if="areaList.province.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'province' ? 1 : 0, pointerEvents: currSelect == 'province' ? 'auto' : 'none' }">
-                        <view v-for="item in areaList.province" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.province && selected.province.id == item.id }" @click="selected.province = item">{{ item.name }}</view>
+            <scroll-view scroll-y="true" class="h-[50vh]" :scroll-top="scrollTop" scroll-with-animation @touchmove.stop>
+                <view class="flex p-[30rpx] pt-[0] text-sm font-500 h-[50vh]">
+                    <view v-if="areaList.province.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'province' ? 1 : 0, pointerEvents: currSelect == 'province' ? 'auto' : 'none',height: currSelect == 'province' ? 'auto' : '0',overflow: currSelect == 'province' ? 'auto' : 'hidden' }">
+                        <view v-for="(item, index) in areaList.province" :key="item.id" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.province && selected.province.id == item.id }" @click="handleProvinceClick(item)">{{ item.name }}</view>
                    </view>
-                    <view v-if="areaList.city.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'city' ? 1 : 0, pointerEvents: currSelect == 'city' ? 'auto' : 'none' }">
-                        <view v-for="item in areaList.city" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.city && selected.city.id == item.id }" @click="selected.city = item">{{ item.name }}</view>
+                    <view v-if="areaList.city.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'city' ? 1 : 0, pointerEvents: currSelect == 'city' ? 'auto' : 'none',height: currSelect == 'city' ? 'auto' : '0',overflow: currSelect == 'city' ? 'auto' : 'hidden' }">
+                        <view v-for="(item, index) in areaList.city" :key="item.id" class="h-[80rpx] flex items-center" :class="{'text-[var(--primary-color)]': selected.city && selected.city.id == item.id }" @click="handleCityClick(item)">{{ item.name }}</view>
                    </view>
-                    <view v-if="areaList.district.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'district' ? 1 : 0, pointerEvents: currSelect == 'district' ? 'auto' : 'none' }">
-                        <view v-for="item in areaList.district" class="h-[80rpx] flex items-center " :class="{'text-[var(--primary-color)]': selected.district && selected.district.id == item.id }" @click="selected.district = item">{{ item.name }}</view>
+                    <view v-if="areaList.district.length" class="flex-1 pr-[10rpx]" :style="{ opacity: currSelect == 'district' ? 1 : 0, pointerEvents: currSelect == 'district' ? 'auto' : 'none',height: currSelect == 'district' ? 'auto' : '0',overflow: currSelect == 'district' ? 'auto' : 'hidden' }">
+                        <view v-for="(item, index) in areaList.district" :key="item.id" class="h-[80rpx] flex items-center " :class="{'text-[var(--primary-color)]': selected.district && selected.district.id == item.id }" @click="selected.district = item">{{ item.name }}</view>
                    </view>
                    <view class="flex-1 pr-[10rpx]" v-else></view>
                </view>
@ -36,7 +36,7 @@
 </template>

 <script setup lang="ts">
-import { ref, reactive, watch } from 'vue'
+import { ref, reactive, watch, nextTick } from 'vue'
 import { getAreaListByPid, getAreaByCode } from '@/app/api/system'

 const prop = defineProps({
@ -60,6 +60,9 @@ const selected = reactive({
    district: null
 })

+// 滚动控制
+const scrollTop = ref(0)
+
 getAreaListByPid(0).then(({ data }) => {
    areaList.province = data
 }).catch()
@ -86,14 +89,21 @@ watch(() => selected.province, () => {

        if (selected.city) {
            let isExist = false
+            let selectedIndex = -1
            for (let i = 0; i < data.length; i++) {
                if (selected.city.id == data[i].id) {
                    isExist = true
+                    selectedIndex = i
                    break
                }
            }
            if (!isExist) {
                selected.city = null
+            } else {
+                // 滚动到选中的城市位置
+                setTimeout(() => {
+                    scrollToSelected('city', selectedIndex)
+                }, 100)
            }
        }
    }).catch()
@ -110,14 +120,21 @@ watch(() => selected.city, (nval) => {

            if (selected.district) {
                let isExist = false
+                let selectedIndex = -1
                for (let i = 0; i < data.length; i++) {
                    if (selected.district.id == data[i].id) {
                        isExist = true
+                        selectedIndex = i
                        break
                    }
                }
                if (!isExist) {
                    selected.district = null
+                } else {
+                    // 滚动到选中的区县位置
+                    setTimeout(() => {
+                        scrollToSelected('district', selectedIndex)
+                    }, 100)
                }
            }
 			if (!data.length) {
@ -135,6 +152,44 @@ watch(() => selected.city, (nval) => {

 const emits = defineEmits(['complete'])

+// 滚动到选中项位置
+const scrollToSelected = (type: string, selectedIndex: number) => {
+    // 计算目标位置，让选中项显示在列表的下半部分
+    const itemHeight = 80 // 每项高度 80rpx
+    const targetScrollTop = Math.max(0, (selectedIndex - 2) * itemHeight) // 让选中项显示在第3个位置左右
+    scrollTop.value = targetScrollTop
+}
+
+// 重置滚动位置
+const resetScrollTop = () => {
+    scrollTop.value = 0
+}
+
+// 监听当前选择标签变化，重置滚动位置并滚动到选中项
+watch(() => currSelect.value, (newVal) => {
+    // 先重置滚动位置
+    resetScrollTop()
+    
+    setTimeout(() => {
+        if (newVal === 'province' && selected.province) {
+            const index = areaList.province.findIndex((item: any) => item.id === selected.province.id)
+            if (index >= 0) {
+                scrollToSelected('province', index)
+            }
+        } else if (newVal === 'city' && selected.city) {
+            const index = areaList.city.findIndex((item: any) => item.id === selected.city.id)
+            if (index >= 0) {
+                scrollToSelected('city', index)
+            }
+        } else if (newVal === 'district' && selected.district) {
+            const index = areaList.district.findIndex((item: any) => item.id === selected.district.id)
+            if (index >= 0) {
+                scrollToSelected('district', index)
+            }
+        }
+    }, 150)
+})
+
 /**
 * 监听区县变更
 */
@ -146,6 +201,24 @@ watch(() => selected.district, (nval) => {
    }
 }, { deep: true })

+// 处理省份点击
+const handleProvinceClick = (item: any) => {
+    selected.province = item
+    // 立即滚动到顶部，确保新数据可见
+    nextTick(() => {
+        resetScrollTop()
+    })
+}
+
+// 处理城市点击
+const handleCityClick = (item: any) => {
+    selected.city = item
+    // 立即滚动到顶部，确保新数据可见
+    nextTick(() => {
+        resetScrollTop()
+    })
+}
+
 const open = () => {
    show.value = true
    if(prop.areaId){
--- a/uni-app/src/components/avatar-swiper/avatar-swiper.vue
+++ b/uni-app/src/components/avatar-swiper/avatar-swiper.vue
@ -0,0 +1,191 @@
+<template>
+    <view class="carousel-container">
+        <view class="carousel-track" :style="trackStyle">
+            <view
+                v-for="(item, index) in displayList"
+                :key="item.key" 
+                class="carousel-item"
+                :style="itemStyle(index)"
+                :class="{ 'scale-in': item.isNew }"
+            >
+                <u--image width="30rpx" height="30rpx" radius="15rpx" :src="img(item.src)" mode="aspectFill">
+                    <template #error>
+                        <image
+                            class="w-[30rpx] h-[30rpx] rounded-full"
+                            :src="img('static/resource/images/default_headimg.png')"
+                            mode="aspectFill"
+                        />
+                    </template>
+                </u--image>
+            </view>
+        </view>
+    </view>
+</template>
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted, computed, nextTick } from 'vue';
+import { img } from '@/utils/common';
+
+const props = defineProps<{
+    avatars: string[];
+    interval?: number; // 动画间隔时间（默认2000ms）
+}>();
+
+// 配置参数（优化动画连贯性）
+const VISIBLE_COUNT = 3;
+const ITEM_WIDTH = 30;
+const OVERLAP = 10;
+const ANIMATION_DURATION = 500; // 稍长动画，减少急促感
+const EASING = 'cubic-bezier(0.25, 0.1, 0.25, 1)'; // 平滑曲线
+const slideDistance = ITEM_WIDTH - OVERLAP;
+
+// 状态管理
+const displayList = ref<{ 
+    src: string; 
+    isNew: boolean; 
+    key: string; // 唯一key，避免v-for复用导致的闪烁
+}[]>([]);
+let currentIndex = 0;
+let timer: ReturnType<typeof setInterval> | null = null;
+const isTransitioning = ref(false);
+const trackOffset = ref(0);
+
+/**
+ * 初始化列表：确保初始状态稳定
+ */
+const initList = () => {
+    if (props.avatars.length <= VISIBLE_COUNT) {
+        displayList.value = props.avatars.map((src, i) => ({
+            src,
+            isNew: true,
+            key: `init-${i}-${src}` // 唯一key
+        }));
+    } else {
+        displayList.value = props.avatars.slice(0, VISIBLE_COUNT).map((src, i) => ({
+            src,
+            isNew: true,
+            key: `init-${i}-${src}`
+        }));
+        currentIndex = VISIBLE_COUNT;
+    }
+};
+
+/**
+ * 单个头像样式：同步动画参数
+ */
+const itemStyle = (index: number) => ({
+    zIndex: VISIBLE_COUNT + 1 - index,
+    transition: `transform ${ANIMATION_DURATION}ms ${EASING}`, // 与轨道动画完全同步
+});
+
+/**
+ * 轨道样式：启用硬件加速，优化过渡
+ */
+const trackStyle = computed(() => ({
+    transform: `translateX(${trackOffset.value}rpx)`,
+    transition: isTransitioning.value 
+        ? `transform ${ANIMATION_DURATION}ms ${EASING}` 
+        : 'none',
+    display: 'flex',
+    // 硬件加速：减少重绘闪烁
+    willChange: isTransitioning.value ? 'transform' : 'auto',
+    backfaceVisibility: 'hidden',
+    perspective: '1000px',
+}));
+
+/**
+ * 滑动动画：优化时序，避免闪烁
+ */
+const slide = async () => {
+    if (props.avatars.length <= VISIBLE_COUNT || isTransitioning.value) return;
+    isTransitioning.value = true;
+
+    try {
+        // 1. 提前插入新头像（带唯一key，避免复用闪烁）
+        const nextKey = `slide-${currentIndex}-${Date.now()}`; // 用时间戳确保唯一
+        const nextAvatar = {
+            src: props.avatars[currentIndex % props.avatars.length],
+            isNew: false, // 初始隐藏
+            key: nextKey
+        };
+        displayList.value.unshift(nextAvatar);
+        await nextTick(); // 等待DOM稳定渲染
+
+        // 2. 重置轨道位置（无动画，为滑动做准备）
+        trackOffset.value = -slideDistance;
+        isTransitioning.value = false;
+        await nextTick(); // 确保位置重置生效
+
+        // 3. 启动向右滑动动画（核心步骤）
+        isTransitioning.value = true;
+        trackOffset.value = 0; // 向右移动到目标位置
+
+        // 4. 同步显示新头像（与滑动动画同步开始）
+        setTimeout(() => {
+            nextAvatar.isNew = true; // 新头像缩放显示，与滑动同步
+        }, 500); // 轻微延迟，模拟“滑入时逐渐显示”
+
+        // 5. 等待动画完全结束（关键：确保动画结束后再操作）
+        await new Promise(resolve => {
+            setTimeout(resolve, ANIMATION_DURATION);
+        });
+
+        // 6. 无痕移除最右侧旧头像（动画结束后，无视觉闪烁）
+        displayList.value.pop();
+
+        // 7. 更新索引，为下次动画准备
+        currentIndex = (currentIndex + 1) % props.avatars.length;
+
+    } finally {
+        isTransitioning.value = false; // 解锁
+    }
+};
+
+/**
+ * 组件挂载与清理
+ */
+onMounted(() => {
+    if (props.avatars?.length) {
+        initList();
+        if (props.avatars.length > VISIBLE_COUNT) {
+            const delay = props.interval || 2000;
+            timer = setInterval(slide, delay);
+        }
+    }
+});
+
+onUnmounted(() => {
+    if (timer) clearInterval(timer);
+});
+</script>
+
+<style scoped lang="scss">
+.carousel-container {
+    width: 70rpx;
+    height: 30rpx;
+    overflow: hidden;
+    position: relative;
+    display: flex;
+    justify-content: flex-end; // 不足3个时右对齐
+}
+
+.carousel-track {
+    height: 100%;
+    position: relative;
+}
+
+.carousel-item {
+    width: 30rpx;
+    height: 30rpx;
+    position: relative;
+    flex-shrink: 0;
+    &:not(:first-child) {
+        margin-left: -10rpx; // 固定重叠，避免计算误差
+    }
+    transform: scale(0); // 初始隐藏
+}
+
+// 缩放动画与滑动动画完全同步
+.carousel-item.scale-in {
+    transform: scale(0.9);
+}
+</style>
--- a/uni-app/src/components/barrage/barrage-item.vue
+++ b/uni-app/src/components/barrage/barrage-item.vue
@ -0,0 +1,107 @@
+@ -1,108 +0,0 @@
+<template>
+  <view :style="itemStyle">
+    <view class="danmu-item" :style="{ backgroundColor: bgColor, borderRadius: rounded, color: textColor }">
+		  <image class="w-[40rpx] h-[40rpx] rounded-[100rpx]" :src="data.headimg?img(data.headimg):img('static/resource/images/default_headimg.png')" :mode="'aspectFill'"
+      />
+      <text class="username max-w-[160rpx] truncate">{{ data.nickname }}</text>
+      <text class="time whitespace-nowrap">{{ data.time }}下单</text>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { img } from '@/utils/common';
+const props = defineProps({
+  bgColor: {
+    type: String,
+    default: '#B0B0B0'
+  },
+  opacity: {
+      type: String,
+      default: '1'
+  },
+  textColor: {
+    type: String,
+    default: '#FFFFFF'
+  },
+  rounded: {
+    type: Number,
+    default: 20
+  },
+  data: {
+    type: Object,
+    required: true
+  },
+  delay: {
+    type: Number,
+    default: 0
+  },
+  speed: {
+    type: Number,
+    default: 8
+  }
+})
+
+const itemStyle = computed(() => {
+  return {
+    '--speed': `${props.speed}s`,
+    '--delay': `${props.delay}s`,
+    '--height': `-300rpx`
+  }
+})
+</script>
+
+<style scoped>
+.danmu-item {
+  position: absolute;
+  left: 30rpx;
+  bottom: 0;
+  min-width: 180rpx;
+  white-space: nowrap;
+  padding: 10rpx;
+  padding-right: 20rpx;
+  background-color: rgba(255, 255, 255, 0.9);
+  border-radius: 40rpx;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1);
+  font-size: 28rpx;
+  color: #333;
+  transform: translateY(0);
+  opacity: 0;
+  animation: moveUp linear var(--speed) forwards;
+  animation-delay: var(--delay);
+  display: flex;
+  align-items: center;
+  margin-bottom: 0;
+}
+
+.username {
+  margin-left: 8rpx;
+  font-size: 24rpx;
+}
+
+.time {
+  font-size: 24rpx;
+}
+
+@keyframes moveUp {
+  0% {
+    transform: translateY(0);
+    opacity: 0;
+  }
+
+  10% {
+    opacity: 1;
+  }
+
+  90% {
+    opacity: 1;
+  }
+
+  100% {
+    transform: translateY(var(--height));
+    opacity: 0;
+  }
+}
+</style>
--- a/uni-app/src/components/barrage/container.vue
+++ b/uni-app/src/components/barrage/container.vue
@ -0,0 +1,176 @@
+<template>
+    <view class="danmu-container">
+        <barrage-item v-for="(item, index) in danmuList" :key="`${item.id}-${item.timestamp}`" :data="item" :delay="item.delay" :speed="item.speed"
+        :textColor="props.textColor" :bgColor="props.bgColor" :rounded="props.rounded" />
+    </view>
+</template>
+
+<script setup>
+import { ref, onMounted, computed,nextTick, watch, onUpdated, onUnmounted } from 'vue'
+import barrageItem from '@/components/barrage/barrage-item.vue'
+const props = defineProps({
+    bgColor: {
+        type: String,
+        default: '#B0B0B0'
+    },
+    textColor: {
+        type: String,
+        default: '#FFFFFF'
+    },
+    rounded: {
+        type: Number,
+        default: 20
+    },
+    maxCount: {
+        type: Number,
+        default: 6
+    },
+    speed: {
+        type: Number,
+        default: 6
+    },
+    interval: {
+        type: Number,
+        default: 1.5
+    },
+    data: {
+        type: Object,   
+        default: []
+    },
+    play:{ // 是否播放弹幕,true:播放,false:不播放
+        type: Boolean,
+        default: true
+    }
+})
+
+const danmuList = ref([]) // 当前弹幕列表
+const waitList = ref([]) // 等待弹幕列表
+const initTimeId = ref([]) // 初始化时间id
+const loopTimeId = ref(null) // 初始化时间id
+
+
+// 初始化弹幕数据
+const initDanmu = () => {
+    nextTick(() => {
+        danmuList.value = props.data.map((item, index) => {
+            let obj = {}
+            const timestamp = Date.now() + Math.random()
+            obj.id = item.id ? `danmu-${item.id}-${timestamp}` : `danmu-${timestamp}`
+            obj.timestamp = timestamp
+            obj.nickname = item.nickname
+            obj.headimg = item.headimg
+            obj.time = formatTimestampToHumanTime(item.time)
+            obj.delay = index * props.interval,
+            obj.speed = props.speed
+            return obj
+        })
+        
+        danmuList.value.forEach((item, index) => {
+            initTimeId.value[index] = setTimeout(() => {
+                waitList.value.push(item)
+                danmuList.value.shift();
+                loopTriggerFn()
+            }, (item.delay + item.speed) * 1000)
+        }) 
+    })
+}
+// 循环触发
+const loopTriggerFn = () => {
+    if (!danmuList.value.length) {
+        loopTimeId.value = setTimeout(() => {
+            // 创建新的数据对象，避免组件复用
+            danmuList.value = waitList.value.map(item => {
+                const timestamp = Date.now() + Math.random()
+                return {
+                    ...item,
+                    id: `${item.id}-loop-${timestamp}`,
+                    timestamp: timestamp
+                }
+            })
+            waitList.value = []
+            danmuList.value.forEach((item, index) => {
+                initTimeId.value[index] = setTimeout(() => {
+                    waitList.value.push(item)
+                    danmuList.value.shift();
+                    loopTriggerFn()
+                }, (item.delay + item.speed) * 1000)
+            })
+        }, 1000)
+    }
+}
+watch(() => props.play, (newVal, oldVal) => {
+    nextTick(() => {
+        if (newVal) {
+            initTimeId.value.forEach((item, index) => {
+                if (item) {
+                    clearTimeout(item)
+                }
+            })
+            clearTimeout(loopTimeId.value)
+            waitList.value = []
+            danmuList.value = []
+            initDanmu()
+        }else{
+            initTimeId.value.forEach((item, index) => {
+                if (item) {
+                    clearTimeout(item)
+                }
+            })
+            clearTimeout(loopTimeId.value)
+            waitList.value = []
+            danmuList.value = []
+        } 
+    })
+})
+
+onMounted(() => {
+    initDanmu()
+})
+
+/**
+* 将时间戳转换为最合适的可读时间单位（分钟、小时、天等），并舍去小数部分
+* @param {number} timestamp - 时间戳（毫秒）
+* @returns {string} 人类可读的相对时间字符串
+*/
+const formatTimestampToHumanTime = (timestamp) => {
+    const now = Date.now();
+    let seconds = Math.round((now - timestamp) / 1000); // 保留时间差为秒数，四舍五入
+
+    // 如果是未来的时间
+    if (seconds < 0) {
+        return '未来';
+    }
+
+    const intervals = [
+        { label: '年', seconds: 31536000 },   // 60 * 60 * 24 * 365
+        { label: '个月', seconds: 2592000 },  // 60 * 60 * 24 * 30
+        { label: '周', seconds: 604800 },     // 60 * 60 * 24 * 7
+        { label: '天', seconds: 86400 },      // 60 * 60 * 24
+        { label: '小时', seconds: 3600 },     // 60 * 60
+        { label: '分钟', seconds: 60 }
+    ];
+
+    for (let i = 0; i < intervals.length; i++) {
+        const interval = intervals[i];
+        const count = Math.floor(seconds / interval.seconds); // 舍去小数部分
+        if (count >= 1) {
+            return `${count}${interval.label}前`;
+        }
+    }
+
+    return '刚刚';
+}
+</script>
+
+<style scoped>
+.danmu-container {
+    position: fixed;
+    top: 160rpx;
+    left: 0;
+    height: 500rpx;
+    width: 100%;
+    pointer-events: none;
+    z-index: 9;
+    overflow: hidden;
+}
+</style>
--- a/uni-app/src/components/firework-effect/README.md
+++ b/uni-app/src/components/firework-effect/README.md
@ -0,0 +1,253 @@
+# 🎆 简单烟花特效组件
+
+一个轻量级的uni-app烟花特效组件，专注于提供最佳的用户体验。
+
+## 📁 组件结构
+
+```
+firework-effect/
+├── firework-effect.vue          # 主要的烟花特效组件
+├── simple-firework.vue          # 简单烟花特效组件
+└── README.md                    # 说明文档
+```
+
+## ✨ 特效特点
+
+### 🎇 简单烟花 (simple-firework)
+- 从底部发射，空中爆炸成彩色粒子
+- 自动发射，可定义持续时间
+- **不阻挡用户操作** - 设置了 `pointer-events: none`
+- **自动停止** - 默认30秒，可自定义
+- **无黑色阴影** - 使用透明背景
+- **兼容性最好** - 使用传统Canvas API
+
+### 🧧 红包雨 (red-packet-rain)
+- **新增功能** ⭐
+- 从屏幕顶部飘落的红包雨效果
+- **点击获得金额** - 点击红包显示随机金额提示
+- **不阻挡用户操作** - 设置了 `pointer-events: none`，不会挡住底部按钮
+- **自定义时间** - 可设置持续时间
+- **自定义密度** - 可调节红包数量
+- **自定义速度** - 可调节下落速度
+- **自定义大小** - 可设置红包大小范围
+- **自定义金额** - 可设置金额范围
+- **精美动画** - 金额提示有向上飘动的动画效果
+- **自动绘制红包** - 无需图片资源，自动绘制精美红包
+
+## 🎯 使用方法
+
+### 1. 基本使用
+
+```vue
+<template>
+  <view>
+    <!-- 你的页面内容 -->
+    <!-- 基础配置 -->
+    <firework-effect
+      ref="fireworkRef"
+      :duration="20000"
+      :no-trail="true"
+      :red-packet-density="5"
+      :red-packet-speed="3"
+      :red-packet-min-size="80"
+      :red-packet-max-size="120"
+      :red-packet-min-amount="0.1"
+      :red-packet-max-amount="50.0"
+      :red-packet-clickable="true"
+    ></firework-effect>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import FireworkEffect from '@/components/firework-effect/firework-effect.vue';
+
+const fireworkRef = ref(null);
+
+// 显示简单烟花特效
+const showFireworks = () => {
+  fireworkRef.value?.handleShowEffect({
+    type: 'simple-firework',
+    duration: 15000 // 15秒后自动停止，可选参数
+  });
+};
+
+// 显示红包雨特效（新功能）
+const showRedPacketRain = () => {
+  fireworkRef.value?.handleShowEffect({
+    type: 'red-packet-rain',
+    duration: 10000 // 10秒后自动停止
+  });
+};
+
+// 使用默认30秒
+const showDefaultFireworks = () => {
+  fireworkRef.value?.handleShowEffect({ type: 'simple-firework' });
+};
+</script>
+```
+
+### 2. API 说明
+
+#### FireworkEffect 组件
+
+**Props:**
+- `duration`: 特效持续时间（毫秒），默认30000（30秒）
+- `noTrail`: 是否禁用拖尾效果（避免黑色阴影），默认true
+- `redPacketImages`: 红包图片数组，如：`['/static/images/hongbao1.png']`
+- `redPacketUseImages`: 是否使用图片模式，默认false（使用绘制模式）
+- `redPacketDensity`: 红包密度（每次生成数量），默认3
+- `redPacketSpeed`: 红包下落速度，默认2
+- `redPacketMinSize`: 红包最小大小（px），默认60
+- `redPacketMaxSize`: 红包最大大小（px），默认100
+- `redPacketMinAmount`: 红包最小金额，默认0.01
+- `redPacketMaxAmount`: 红包最大金额，默认10.00
+- `redPacketClickable`: 是否可点击红包，默认true
+
+**方法:**
+- `handleShowEffect(params)`: 显示特效
+  - `params.type`: 特效类型
+    - `'simple-firework'`: 简单烟花特效
+    - `'red-packet-rain'` 或 `'hongbao'`: 红包雨特效
+  - `params.duration`: 自定义持续时间（可选）
+### 🚫 解决黑色阴影问题
+
+如果您看到黑色阴影，请确保：
+
+1. **设置 `no-trail="true"`**（默认已启用）
+2. **避免使用拖尾效果**，这会产生半透明覆盖
+
+```vue
+<!-- ✅ 推荐：无阴影版本 -->
+<firework-effect :no-trail="true"></firework-effect>
+
+<!-- ❌ 不推荐：可能有阴影 -->
+<firework-effect :no-trail="false"></firework-effect>
+```
+
+### 📋 注意事项
+
+1. 确保页面有足够的渲染性能
+2. 在低端设备上可能需要减少粒子数量
+3. 长时间运行建议定期清理资源
+4. 某些小程序平台可能对 Canvas API 有限制
+5. **只支持 `simple-firework` 类型**，不会阻挡用户操作
+
+### 🎁 红包雨详细配置
+
+#### 方式一：使用自定义图片
+
+```vue
+<template>
+  <!-- 使用自定义红包图片 -->
+  <firework-effect
+    ref="fireworkRef"
+    :red-packet-images="[
+      '/static/images/hongbao1.png',
+      '/static/images/hongbao2.png',
+      '/static/images/hongbao3.png'
+    ]"
+    :red-packet-use-images="true"    <!-- 启用图片模式 -->
+    :red-packet-min-size="100"       <!-- 红包最小100px -->
+    :red-packet-max-size="150"       <!-- 红包最大150px -->
+    :red-packet-min-amount="1.0"     <!-- 最小1元 -->
+    :red-packet-max-amount="100.0"   <!-- 最大100元 -->
+    :red-packet-density="6"          <!-- 每次生成6个红包 -->
+    :red-packet-speed="1.5"          <!-- 较慢的下落速度 -->
+    :red-packet-clickable="true"     <!-- 启用点击功能 -->
+  ></firework-effect>
+</template>
+```
+
+#### 方式二：使用代码绘制（默认）
+
+```vue
+<template>
+  <!-- 使用代码绘制的红包 -->
+  <firework-effect
+    ref="fireworkRef"
+    :red-packet-use-images="false"   <!-- 使用绘制模式（默认） -->
+    :red-packet-min-size="80"        <!-- 红包最小80px -->
+    :red-packet-max-size="120"       <!-- 红包最大120px -->
+    :red-packet-min-amount="0.1"     <!-- 最小0.1元 -->
+    :red-packet-max-amount="50.0"    <!-- 最大50元 -->
+    :red-packet-density="4"          <!-- 每次生成4个红包 -->
+    :red-packet-speed="2.5"          <!-- 下落速度 -->
+    :red-packet-clickable="true"     <!-- 启用点击功能 -->
+  ></firework-effect>
+</template>
+```
+
+#### 方式三：使用网络图片
+
+```vue
+<template>
+  <!-- 使用网络红包图片 -->
+  <firework-effect
+    ref="fireworkRef"
+    :red-packet-images="[
+      'https://example.com/hongbao1.png',
+      'https://example.com/hongbao2.png'
+    ]"
+    :red-packet-use-images="true"
+    :red-packet-min-size="100"
+    :red-packet-max-size="150"
+  ></firework-effect>
+</template>
+```
+
+### 🖼️ 红包图片要求
+
+#### 图片格式
+- **PNG**（推荐，支持透明背景）
+- **JPG/JPEG**
+- **WebP**
+
+#### 尺寸建议
+- **推荐尺寸**: 200x160px（宽高比5:4）
+- **最小尺寸**: 100x80px
+- **最大尺寸**: 400x320px
+
+#### 文件大小
+- **建议**: 小于100KB
+- **最大**: 不超过500KB
+
+#### 图片准备步骤
+1. 将红包图片放在 `uni-app/public/static/images/` 目录
+2. 文件命名建议：`hongbao1.png`, `hongbao2.png` 等
+3. 确保图片背景透明（PNG格式）
+4. 图片内容应该是完整的红包设计
+
+### 📏 红包大小控制
+
+```vue
+<!-- 小红包 -->
+:red-packet-min-size="60"
+:red-packet-max-size="80"
+
+<!-- 中等红包 -->
+:red-packet-min-size="80"
+:red-packet-max-size="120"
+
+<!-- 大红包 -->
+:red-packet-min-size="120"
+:red-packet-max-size="180"
+
+<!-- 超大红包 -->
+:red-packet-min-size="150"
+:red-packet-max-size="200"
+```
+
+### 🎯 红包点击功能
+
+- **点击检测**: 自动检测用户点击的红包
+- **金额显示**: 显示随机金额（在设定范围内）
+- **动画效果**: 金额提示向上飘动并淡出
+- **防重复**: 已点击的红包变为半透明，不可重复点击
+- **响应式**: 支持触摸和鼠标点击
+
+### 🔧 兼容性
+
+- 支持 Vue 2 和 Vue 3
+- 支持 uni-app 各平台（H5、小程序、App）
+- 使用传统 Canvas API，兼容性最佳
--- a/uni-app/src/components/firework-effect/firework-effect.vue
+++ b/uni-app/src/components/firework-effect/firework-effect.vue
@ -0,0 +1,155 @@
+<template>
+	<!-- 简单烟花特效 -->
+	<simple-firework ref="simpleFireworkRef" :duration="fireworkDuration" :no-trail="props.noTrail"></simple-firework>
+	<!-- 红包雨特效 -->
+	<red-packet-rain
+		ref="redPacketRainRef"
+		:duration="fireworkDuration"
+		:images="redPacketImages"
+		:density="redPacketDensity"
+		:speed="redPacketSpeed"
+		:min-size="redPacketMinSize"
+		:max-size="redPacketMaxSize"
+		:min-amount="redPacketMinAmount"
+		:max-amount="redPacketMaxAmount"
+		:clickable="redPacketClickable"
+		:use-images="redPacketUseImages"
+	></red-packet-rain>
+</template>
+<script setup>
+	// 导入特效组件
+	import SimpleFirework from './simple-firework.vue'
+	import RedPacketRain from './red-packet-rain.vue'
+	// #ifdef VUE3
+	import {
+		ref,
+		computed
+	} from 'vue';
+	// #endif
+	// #ifndef VUE3
+	import {
+		ref,
+		computed
+	} from '@vue/composition-api';
+	// #endif
+
+	// 定义props
+	const props = defineProps({
+		duration: {
+			type: Number,
+			default: 30000 // 默认30秒
+		},
+		noTrail: {
+			type: Boolean,
+			default: true // 默认无拖尾，避免黑色阴影
+		},
+		// 红包雨相关配置
+		redPacketImages: {
+			type: Array,
+			default: () => ['/static/images/hongbao.png']
+		},
+		redPacketDensity: {
+			type: Number,
+			default: 3 // 每次生成的红包数量
+		},
+		redPacketSpeed: {
+			type: Number,
+			default: 2 // 红包下落速度
+		},
+		// 红包大小配置
+		redPacketMinSize: {
+			type: Number,
+			default: 60 // 红包最小大小
+		},
+		redPacketMaxSize: {
+			type: Number,
+			default: 100 // 红包最大大小
+		},
+		// 红包金额配置
+		redPacketMinAmount: {
+			type: Number,
+			default: 0.01 // 最小金额
+		},
+		redPacketMaxAmount: {
+			type: Number,
+			default: 10.00 // 最大金额
+		},
+		// 是否可点击
+		redPacketClickable: {
+			type: Boolean,
+			default: true // 默认可点击
+		},
+		// 是否使用图片模式
+		redPacketUseImages: {
+			type: Boolean,
+			default: false // 默认使用绘制模式
+		}
+	});
+
+	// 特效组件引用
+	const simpleFireworkRef = ref(null)
+	const redPacketRainRef = ref(null)
+
+	// 计算烟花持续时间
+	const fireworkDuration = computed(() => props.duration)
+
+	const handleShowEffect = (params) => {
+		const {
+			type,
+			duration
+		} = params;
+
+		// 支持的特效类型
+		if (type == 'simple-firework') {
+			handleShowSimpleFirework(duration)
+		} else if (type == 'red-packet-rain' || type == 'hongbao') {
+			handleShowRedPacketRain(duration)
+		} else {
+			console.warn('🎆 支持的特效类型: simple-firework, red-packet-rain，当前类型:', type)
+		}
+	}
+
+	// 显示简单烟花特效
+	const handleShowSimpleFirework = (customDuration) => {
+		if (simpleFireworkRef.value) {
+			simpleFireworkRef.value.startFireworks(customDuration);
+		}
+	}
+
+	// 显示红包雨特效
+	const handleShowRedPacketRain = (customDuration) => {
+		if (redPacketRainRef.value) {
+			redPacketRainRef.value.startRedPacketRain(customDuration);
+		}
+	}
+
+	// 停止烟花特效
+	const stopFireworks = () => {
+		if (simpleFireworkRef.value && typeof simpleFireworkRef.value.stopFireworks === 'function') {
+			simpleFireworkRef.value.stopFireworks();
+		}
+	}
+
+	// 停止红包雨特效
+	const stopRedPacketRain = () => {
+		if (redPacketRainRef.value && typeof redPacketRainRef.value.stopRedPacketRain === 'function') {
+			redPacketRainRef.value.stopRedPacketRain();
+		}
+	}
+
+	// 停止所有特效
+	const stopAllEffects = () => {
+		stopFireworks();
+		stopRedPacketRain();
+	}
+
+	// 暴露方法给父组件
+	defineExpose({
+		handleShowEffect,
+		stopFireworks,
+		stopRedPacketRain,
+		stopAllEffects
+	})
+
+
+</script>
--- a/uni-app/src/components/firework-effect/red-packet-rain.vue
+++ b/uni-app/src/components/firework-effect/red-packet-rain.vue
@ -0,0 +1,682 @@
+<template>
+  <view class="red-packet-container" v-if="isVisible">
+    <canvas
+      class="red-packet-canvas"
+      canvas-id="redPacketRain"
+      id="redPacketRain"
+    ></canvas>
+
+
+
+    <!-- 红包元素（图片模式或绘制模式） -->
+    <view
+      v-for="packet in redPackets"
+      :key="packet.id"
+      class="red-packet-item"
+      :style="{
+        left: packet.x + 'px',
+        top: packet.y + 'px',
+        width: packet.width + 'px',
+        height: packet.height + 'px',
+        transform: `rotate(${packet.rotation}rad)`,
+        opacity: packet.opacity
+      }"
+      @click="handlePacketClick(packet, $event)"
+    >
+      <!-- 图片模式 -->
+      <image
+        v-if="props.useImages && packet.image"
+        :src="packet.image"
+        class="red-packet-image"
+        mode="aspectFit"
+        @load="onRedPacketImageLoad"
+        @error="onRedPacketImageError"
+      />
+      <!-- 绘制模式 -->
+      <view
+        v-else
+        class="red-packet-drawn"
+        :style="{
+          width: '100%',
+          height: '100%'
+        }"
+      >
+        <view class="red-packet-body"></view>
+        <view class="red-packet-text">福</view>
+      </view>
+    </view>
+
+    <!-- 预加载图片（隐藏） -->
+    <image
+      v-for="(imagePath, index) in props.images"
+      :key="'preload-' + index"
+      :src="imagePath"
+      class="preload-image"
+      @load="onImageLoad"
+      @error="onImageError"
+    />
+
+    <!-- 金额提示弹窗 -->
+    <view
+      v-for="tip in amountTips"
+      :key="tip.id"
+      class="amount-tip"
+      :style="{
+        left: tip.x + 'px',
+        top: tip.y + 'px',
+        opacity: tip.opacity
+      }"
+    >
+      <view class="tip-content">
+        <text class="amount">+¥{{ tip.amount }}</text>
+        <text class="label">{{ tip.label }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, getCurrentInstance, onUnmounted } from 'vue';
+
+// 定义props
+const props = defineProps({
+  duration: {
+    type: Number,
+    default: 30000 // 默认30秒
+  },
+  images: {
+    type: Array,
+    default: () => [
+      // 可以是网络图片或本地图片路径
+      // 'https://example.com/hongbao1.png',
+      // '/static/images/hongbao.png',
+      // 如果为空数组，则使用绘制的红包
+    ]
+  },
+  // 是否使用图片模式
+  useImages: {
+    type: Boolean,
+    default: false // 默认使用绘制模式
+  },
+  density: {
+    type: Number,
+    default: 3 // 每次生成的红包数量
+  },
+  speed: {
+    type: Number,
+    default: 2 // 下落速度
+  },
+  // 红包大小配置
+  minSize: {
+    type: Number,
+    default: 60 // 最小红包大小
+  },
+  maxSize: {
+    type: Number,
+    default: 100 // 最大红包大小
+  },
+  // 金额配置
+  minAmount: {
+    type: Number,
+    default: 0.01 // 最小金额
+  },
+  maxAmount: {
+    type: Number,
+    default: 10.00 // 最大金额
+  },
+  // 是否启用点击功能
+  clickable: {
+    type: Boolean,
+    default: true
+  }
+});
+
+const app = getCurrentInstance();
+let ctx = null;
+let animationId = null;
+let isRunning = false;
+let canvasWidth = 375;
+let canvasHeight = 667;
+let autoStopTimer = null;
+let createTimer = null;
+let loadedImages = new Map(); // 存储加载的图片
+let tipIdCounter = 0; // 提示ID计数器
+
+const isVisible = ref(false);
+const amountTips = ref([]); // 金额提示数组
+const redPackets = ref([]); // 红包数组（响应式）
+
+// 红包类
+class RedPacket {
+  constructor(x, y, image) {
+    this.x = x;
+    this.y = y;
+    // 使用props中的大小范围
+    this.width = props.minSize + Math.random() * (props.maxSize - props.minSize);
+    this.height = this.width * 0.8; // 保持比例
+    this.speed = props.speed + Math.random() * 2; // 随机速度
+    this.rotation = Math.random() * 0.2 - 0.1; // 轻微旋转
+    this.rotationSpeed = (Math.random() - 0.5) * 0.02;
+    this.image = image;
+    this.opacity = 0.9 + Math.random() * 0.1;
+    // 随机金额
+    this.amount = (props.minAmount + Math.random() * (props.maxAmount - props.minAmount)).toFixed(2);
+    this.clicked = false; // 是否已被点击
+    this.id = Date.now() + Math.random(); // 唯一ID
+  }
+  
+  update() {
+    this.y += this.speed;
+    this.rotation += this.rotationSpeed;
+    
+    // 轻微的左右摆动
+    this.x += Math.sin(this.y * 0.01) * 0.5;
+  }
+  
+  draw() {
+    if (!ctx) return;
+
+    ctx.save();
+    ctx.globalAlpha = this.opacity;
+    ctx.translate(this.x + this.width / 2, this.y + this.height / 2);
+    ctx.rotate(this.rotation);
+
+    // 根据模式选择绘制方式
+    if (props.useImages && this.image) {
+      console.log('🧧 使用图片模式绘制红包:', this.image);
+      this.drawImage();
+    } else {
+      console.log('🧧 使用代码绘制红包');
+      this.drawRedPacket();
+    }
+
+    ctx.restore();
+  }
+
+  // 绘制图片红包
+  drawImage() {
+    const halfWidth = this.width / 2;
+    const halfHeight = this.height / 2;
+
+    try {
+      if (this.image && typeof this.image === 'string') {
+        console.log('🧧 绘制图片红包:', this.image);
+
+        // 在uni-app中，使用ctx.drawImage绘制图片
+        // 参数：图片路径, x, y, width, height
+        ctx.drawImage(this.image, -halfWidth, -halfHeight, this.width, this.height);
+
+        console.log('🧧 图片绘制完成');
+      } else {
+        console.log('🧧 图片无效，使用绘制模式');
+        this.drawRedPacket();
+      }
+    } catch (error) {
+      console.warn('🧧 图片绘制失败，降级到绘制模式:', error);
+      this.drawRedPacket();
+    }
+  }
+
+  drawRedPacket() {
+    const halfWidth = this.width / 2;
+    const halfHeight = this.height / 2;
+
+    // 绘制红包主体（圆角矩形）
+    ctx.setFillStyle('#ff4444');
+    ctx.fillRect(-halfWidth, -halfHeight, this.width, this.height);
+
+    // 绘制金色装饰边框
+    ctx.setStrokeStyle('#ffd700');
+    ctx.setLineWidth(2);
+    ctx.strokeRect(-halfWidth, -halfHeight, this.width, this.height);
+
+    // 绘制中间的"福"字或装饰
+    ctx.setFillStyle('#ffd700');
+    try {
+      ctx.setFontSize(this.width * 0.4);
+      ctx.setTextAlign('center');
+      ctx.fillText('福', 0, this.height * 0.1);
+    } catch (error) {
+      // 如果文本绘制失败，绘制一个圆形装饰
+      ctx.beginPath();
+      ctx.arc(0, 0, this.width * 0.15, 0, 2 * Math.PI);
+      ctx.fill();
+    }
+
+    // 绘制顶部的蝴蝶结
+    ctx.setFillStyle('#ffaa00');
+    ctx.fillRect(-halfWidth * 0.6, -halfHeight, this.width * 0.6, this.height * 0.2);
+  }
+  
+  isOffScreen() {
+    return this.y > canvasHeight + this.height;
+  }
+
+  // 检测点击
+  isClicked(touchX, touchY) {
+    if (this.clicked) return false;
+
+    const centerX = this.x + this.width / 2;
+    const centerY = this.y + this.height / 2;
+    const distance = Math.sqrt(
+      Math.pow(touchX - centerX, 2) + Math.pow(touchY - centerY, 2)
+    );
+
+    return distance <= Math.max(this.width, this.height) / 2;
+  }
+
+  // 标记为已点击
+  markAsClicked() {
+    this.clicked = true;
+    // 点击后变为半透明
+    this.opacity = 0.3;
+  }
+}
+
+// 图片加载成功事件
+const onImageLoad = (event) => {
+  console.log('🧧 预加载图片成功:', event.target.src);
+};
+
+// 图片加载失败事件
+const onImageError = (event) => {
+  console.error('🧧 预加载图片失败:', event.target.src);
+};
+
+// 红包图片加载成功事件
+const onRedPacketImageLoad = () => {
+  // 图片加载成功，无需处理
+};
+
+// 红包图片加载失败事件
+const onRedPacketImageError = () => {
+  // 图片加载失败，将使用绘制模式
+};
+
+// 加载图片（简化版，依赖image标签预加载）
+const loadImages = async () => {
+  if (!props.useImages || props.images.length === 0) {
+    loadedImages.set('default', 'default');
+    return Promise.resolve();
+  }
+
+  // 直接将图片路径添加到loadedImages中
+  // 实际的预加载由template中的image标签完成
+  for (const imagePath of props.images) {
+    loadedImages.set(imagePath, imagePath);
+  }
+
+  return Promise.resolve();
+};
+
+// 初始化Canvas
+const initCanvas = () => {
+  try {
+    ctx = uni.createCanvasContext('redPacketRain', app.proxy);
+
+    if (ctx) {
+      // 获取屏幕尺寸
+      const systemInfo = uni.getSystemInfoSync();
+      canvasWidth = systemInfo.windowWidth || 375;
+      canvasHeight = systemInfo.windowHeight || 667;
+
+      // 初始化透明背景
+      ctx.setFillStyle('rgba(0, 0, 0, 0)');
+      ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+      ctx.draw();
+
+      return true;
+    } else {
+      return false;
+    }
+  } catch (error) {
+    return false;
+  }
+};
+
+// 创建红包
+const createRedPackets = () => {
+  if (!isRunning) {
+    return;
+  }
+
+  for (let i = 0; i < props.density; i++) {
+    const x = Math.random() * (canvasWidth - 100);
+    const y = -100 - Math.random() * 200; // 从屏幕上方开始
+
+    let image = null;
+
+    if (props.useImages && loadedImages.size > 0) {
+      // 随机选择一张图片
+      const allKeys = Array.from(loadedImages.keys());
+      const imageKeys = allKeys.filter(key => key !== 'default');
+
+      if (imageKeys.length > 0) {
+        const randomImage = imageKeys[Math.floor(Math.random() * imageKeys.length)];
+        image = loadedImages.get(randomImage);
+      } else {
+        // 如果没有过滤出图片，直接使用第一个
+        if (allKeys.length > 0) {
+          const firstKey = allKeys[0];
+          image = loadedImages.get(firstKey);
+        }
+      }
+    }
+
+    const packet = new RedPacket(x, y, image);
+    redPackets.value.push(packet);
+  }
+
+};
+
+// 动画循环
+const animate = () => {
+  if (!isRunning) return;
+
+  try {
+    // 更新红包位置（HTML元素会自动重新渲染）
+    redPackets.value = redPackets.value.filter(packet => {
+      packet.update();
+      return !packet.isOffScreen();
+    });
+
+    // 继续动画
+    if (isRunning) {
+      setTimeout(animate, 16); // 约60fps
+    }
+  } catch (error) {
+    if (isRunning) {
+      setTimeout(animate, 50);
+    }
+  }
+};
+
+// 开始动画
+const startAnimation = () => {
+  isRunning = true;
+  animate();
+};
+
+// 停止动画
+const stopAnimation = () => {
+  isRunning = false;
+  if (animationId) {
+    clearTimeout(animationId);
+    animationId = null;
+  }
+};
+
+// 开始创建红包的定时器
+const startCreating = () => {
+  if (createTimer) {
+    clearInterval(createTimer);
+  }
+  
+  // 立即创建一批红包
+  createRedPackets();
+  
+  // 每隔一段时间创建新红包
+  createTimer = setInterval(() => {
+    if (isRunning && createTimer) { // 确保在停止创建后不再生成新红包
+      createRedPackets();
+    }
+  }, 1000); // 每秒创建新红包
+};
+
+// 停止创建红包
+const stopCreating = () => {
+  if (createTimer) {
+    clearInterval(createTimer);
+    createTimer = null;
+  }
+};
+
+// 启动红包雨
+const startRedPacketRain = async (customDuration) => {
+  // 显示组件
+  isVisible.value = true;
+
+  // 加载图片
+  await loadImages();
+
+  // 初始化Canvas（可选，仅用于背景）
+  initCanvas();
+
+  // 开始动画和创建红包
+  startAnimation();
+  startCreating();
+
+  // 设置自动停止定时器
+  const duration = customDuration || props.duration;
+
+  if (autoStopTimer) {
+    clearTimeout(autoStopTimer);
+  }
+
+  autoStopTimer = setTimeout(() => {
+    stopRedPacketRain();
+  }, duration);
+};
+
+// 停止红包雨
+const stopRedPacketRain = () => {
+  // 停止创建新红包，但继续动画让现有红包落完
+  stopCreating();
+
+  // 清除自动停止定时器
+  if (autoStopTimer) {
+    clearTimeout(autoStopTimer);
+    autoStopTimer = null;
+  }
+
+  // 等待现有红包全部落下后再停止动画和隐藏组件
+  const waitForPacketsToFall = () => {
+    if (redPackets.value.length === 0) {
+      // 所有红包都落下了，停止动画
+      stopAnimation();
+      amountTips.value = [];
+
+      // 延迟隐藏组件
+      setTimeout(() => {
+        isVisible.value = false;
+      }, 1000);
+    } else {
+      // 还有红包在飘落，继续等待
+      setTimeout(waitForPacketsToFall, 500);
+    }
+  };
+
+  waitForPacketsToFall();
+};
+
+
+
+// 处理红包图片点击
+const handlePacketClick = (packet, event) => {
+  if (!props.clickable || packet.clicked) return;
+
+  console.log('🧧 点击红包图片，金额:', packet.amount);
+
+  // 标记红包为已点击
+  packet.markAsClicked();
+
+  // 获取点击位置
+  const touchX = event.currentTarget.offsetLeft + packet.width / 2;
+  const touchY = event.currentTarget.offsetTop + packet.height / 2;
+
+  // 显示金额提示
+  showAmountTip(touchX, touchY, packet.amount);
+};
+
+// 显示金额提示
+const showAmountTip = (x, y, amount) => {
+  const tipId = ++tipIdCounter;
+  const tip = {
+    id: tipId,
+    x: x - 50, // 居中显示
+    y: y - 30,
+    amount: amount,
+    label: '恭喜获得',
+    opacity: 1
+  };
+
+  amountTips.value.push(tip);
+
+  // 动画效果：向上移动并淡出
+  let animationStep = 0;
+  const animate = () => {
+    animationStep++;
+    const progress = animationStep / 60; // 60帧动画
+
+    if (progress >= 1) {
+      // 动画结束，移除提示
+      const index = amountTips.value.findIndex(t => t.id === tipId);
+      if (index !== -1) {
+        amountTips.value.splice(index, 1);
+      }
+      return;
+    }
+
+    // 更新提示位置和透明度
+    const tipIndex = amountTips.value.findIndex(t => t.id === tipId);
+    if (tipIndex !== -1) {
+      amountTips.value[tipIndex].y = y - 30 - progress * 50; // 向上移动50px
+      amountTips.value[tipIndex].opacity = 1 - progress; // 淡出
+    }
+
+    setTimeout(animate, 16); // 约60fps
+  };
+
+  animate();
+};
+
+// 组件卸载时清理资源
+onUnmounted(() => {
+  console.log('🧧 红包雨组件卸载，清理资源');
+  stopRedPacketRain();
+});
+
+// 暴露方法
+defineExpose({
+  startRedPacketRain,
+  stopRedPacketRain
+});
+</script>
+
+<style lang="scss" scoped>
+.red-packet-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 998; /* 比烟花稍低的层级 */
+  pointer-events: none; /* 容器本身不阻挡点击事件 */
+
+  .red-packet-canvas {
+    width: 100%;
+    height: 100%;
+    pointer-events: none; /* Canvas 背景不阻挡点击事件 */
+  }
+
+
+
+  .test-red-packet {
+    border: 2px solid red;
+  }
+
+  .red-packet-image {
+    position: absolute;
+    pointer-events: auto; /* 红包图片可以被点击 */
+    z-index: 999;
+    transition: opacity 0.3s ease;
+
+    &:active {
+      transform: scale(0.95);
+    }
+  }
+
+  .red-packet-item {
+    position: absolute;
+    pointer-events: auto; /* 红包元素可以被点击 */
+    z-index: 999;
+    transition: opacity 0.3s ease;
+  }
+
+  .red-packet-image {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+
+  .red-packet-drawn {
+    position: relative;
+    background: linear-gradient(135deg, #ff4444, #cc0000);
+    border: 2px solid #ffd700;
+    border-radius: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: -8px;
+      left: 50%;
+      transform: translateX(-50%);
+      width: 60%;
+      height: 12px;
+      background: linear-gradient(135deg, #ffaa00, #ff8800);
+      border-radius: 6px;
+      border: 1px solid #ffd700;
+    }
+  }
+
+  .red-packet-text {
+    color: #ffd700;
+    font-size: 24px;
+    font-weight: bold;
+    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
+  }
+
+  .preload-image {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    opacity: 0;
+    pointer-events: none;
+    z-index: -1;
+  }
+
+  .amount-tip {
+    position: fixed;
+    pointer-events: none; /* 金额提示不阻挡点击事件 */
+    z-index: 1000; /* 确保金额提示在最上层显示 */
+    transition: all 0.3s ease-out;
+
+    .tip-content {
+      background: linear-gradient(135deg, #ff6b6b, #ff8e8e);
+      color: white;
+      padding: 8px 16px;
+      border-radius: 20px;
+      box-shadow: 0 4px 12px rgba(255, 107, 107, 0.4);
+      text-align: center;
+      min-width: 100px;
+
+      .amount {
+        display: block;
+        font-size: 18px;
+        font-weight: bold;
+        margin-bottom: 2px;
+      }
+
+      .label {
+        display: block;
+        font-size: 12px;
+        opacity: 0.9;
+      }
+    }
+  }
+}
+</style>
--- a/uni-app/src/components/firework-effect/simple-firework.vue
+++ b/uni-app/src/components/firework-effect/simple-firework.vue
@ -0,0 +1,378 @@
+<template>
+  <view class="firework-container" v-if="isVisible">
+    <canvas
+      class="firework-canvas"
+      canvas-id="simpleFirework"
+      id="simpleFirework"
+    ></canvas>
+  </view>
+</template>
+
+<script setup>
+// #ifdef VUE3
+import {
+  ref,
+  onMounted,
+  onUnmounted,
+  getCurrentInstance
+} from 'vue';
+// #endif
+// #ifndef VUE3
+import {
+  ref,
+  onMounted,
+  onUnmounted,
+  getCurrentInstance
+} from '@vue/composition-api';
+// #endif
+
+// 定义props
+const props = defineProps({
+  duration: {
+    type: Number,
+    default: 30000 // 默认30秒
+  },
+  autoStart: {
+    type: Boolean,
+    default: false
+  },
+  noTrail: {
+    type: Boolean,
+    default: true // 默认不显示拖尾，避免黑色阴影
+  }
+});
+
+const app = getCurrentInstance();
+let ctx = null;
+let animationId = null;
+let fireworks = [];
+let isRunning = false;
+let canvasWidth = 375;
+let canvasHeight = 667;
+let autoStopTimer = null;
+let autoLaunchTimer = null;
+
+const isVisible = ref(false);
+
+// 获取随机颜色
+const getRandomColor = () => {
+  const colors = ['#ff0000', '#00ff00', '#0000ff', '#ffff00', '#ff00ff', '#00ffff'];
+  return colors[Math.floor(Math.random() * colors.length)];
+};
+
+// 简化的烟花类
+class SimpleFirework {
+  constructor(startX, startY, targetX, targetY) {
+    this.x = startX;
+    this.y = startY;
+    this.targetX = targetX;
+    this.targetY = targetY;
+    this.color = getRandomColor();
+    this.particles = [];
+    this.exploded = false;
+    this.speed = 5;
+    
+    // 计算方向
+    const dx = targetX - startX;
+    const dy = targetY - startY;
+    const distance = Math.sqrt(dx * dx + dy * dy);
+    this.vx = (dx / distance) * this.speed;
+    this.vy = (dy / distance) * this.speed;
+  }
+  
+  update() {
+    if (!this.exploded) {
+      this.x += this.vx;
+      this.y += this.vy;
+      
+      // 检查是否到达目标
+      const distance = Math.sqrt((this.targetX - this.x) ** 2 + (this.targetY - this.y) ** 2);
+      if (distance < 20 || this.y <= this.targetY) {
+        this.explode();
+        this.exploded = true;
+      }
+    } else {
+      // 更新粒子
+      this.particles = this.particles.filter(particle => {
+        particle.x += particle.vx;
+        particle.y += particle.vy;
+        particle.vy += 0.1; // 重力
+        particle.alpha -= 0.02;
+        return particle.alpha > 0;
+      });
+    }
+  }
+  
+  explode() {
+    // 创建粒子
+    for (let i = 0; i < 20; i++) {
+      const angle = (Math.PI * 2 * i) / 20;
+      const speed = Math.random() * 4 + 2;
+      this.particles.push({
+        x: this.x,
+        y: this.y,
+        vx: Math.cos(angle) * speed,
+        vy: Math.sin(angle) * speed,
+        alpha: 1,
+        color: this.color
+      });
+    }
+  }
+  
+  draw() {
+    if (!ctx) return;
+    
+    try {
+      if (!this.exploded) {
+        // 绘制发射的烟花
+        if (ctx.setFillStyle) {
+          ctx.setFillStyle(this.color);
+          ctx.beginPath();
+          ctx.arc(this.x, this.y, 3, 0, Math.PI * 2);
+          ctx.fill();
+        }
+      } else {
+        // 绘制爆炸粒子
+        this.particles.forEach(particle => {
+          if (ctx.setGlobalAlpha && ctx.setFillStyle) {
+            ctx.setGlobalAlpha(particle.alpha);
+            ctx.setFillStyle(particle.color);
+            ctx.beginPath();
+            ctx.arc(particle.x, particle.y, 2, 0, Math.PI * 2);
+            ctx.fill();
+          }
+        });
+        if (ctx.setGlobalAlpha) {
+          ctx.setGlobalAlpha(1);
+        }
+      }
+    } catch (error) {
+      // 绘制错误，忽略
+    }
+  }
+  
+  isDead() {
+    return this.exploded && this.particles.length === 0;
+  }
+}
+
+// 初始化Canvas
+const initCanvas = () => {
+  try {
+    // 尝试创建Canvas上下文
+    ctx = uni.createCanvasContext('simpleFirework', app.proxy);
+
+    if (ctx) {
+      // 获取屏幕尺寸
+      const systemInfo = uni.getSystemInfoSync();
+      canvasWidth = systemInfo.windowWidth || 375;
+      canvasHeight = systemInfo.windowHeight || 667;
+
+      // 初始化透明背景
+      ctx.setFillStyle('rgba(255, 255, 255, 0.01)');
+      ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+
+      // 绘制一个测试点来验证Canvas是否工作
+      ctx.setFillStyle('#ff0000');
+      ctx.fillRect(canvasWidth / 2, canvasHeight / 2, 10, 10);
+
+      ctx.draw(); // 立即绘制初始背景
+
+      // 开始动画（延迟更长时间确保Canvas完全准备好）
+      setTimeout(() => {
+        startAnimation();
+      }, 1000);
+    } else {
+      // 重试机制
+      setTimeout(() => {
+        initCanvas();
+      }, 1000);
+    }
+  } catch (error) {
+    // 重试机制
+    setTimeout(() => {
+      initCanvas();
+    }, 1000);
+  }
+};
+
+// 动画循环
+const animate = () => {
+  if (!isRunning || !ctx) {
+    return;
+  }
+
+  try {
+    // 根据props决定清除方式
+    if (props.noTrail) {
+      // 完全清除，无拖尾效果，无阴影
+      ctx.clearRect && ctx.clearRect(0, 0, canvasWidth, canvasHeight);
+      // 如果不支持clearRect，使用极淡的白色
+      if (!ctx.clearRect) {
+        ctx.setFillStyle('rgba(255, 255, 255, 0.02)');
+        ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+      }
+    } else {
+      // 半透明清除，产生拖尾效果
+      ctx.setFillStyle('rgba(255, 255, 255, 0.08)');
+      ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+    }
+
+    // 更新和绘制烟花
+    fireworks = fireworks.filter(firework => {
+      firework.update();
+      firework.draw();
+      return !firework.isDead();
+    });
+
+    // 绘制到画布
+    ctx.draw();
+
+    // 继续动画
+    setTimeout(animate, 16); // 约60fps
+  } catch (error) {
+    if (isRunning) {
+      setTimeout(animate, 50);
+    }
+  }
+};
+
+// 开始动画
+const startAnimation = () => {
+  isRunning = true;
+  animate();
+};
+
+// 停止动画
+const stopAnimation = () => {
+  isRunning = false;
+  fireworks = [];
+};
+
+// 创建烟花
+const createFirework = (targetX, targetY) => {
+  if (!ctx) {
+    return;
+  }
+
+  const startX = Math.random() * canvasWidth;
+  const startY = canvasHeight;
+  const finalTargetX = targetX || Math.random() * canvasWidth;
+  const finalTargetY = targetY || Math.random() * canvasHeight * 0.5;
+
+  fireworks.push(new SimpleFirework(startX, startY, finalTargetX, finalTargetY));
+};
+
+// 自动发射
+const startAutoLaunch = () => {
+  if (autoLaunchTimer) {
+    clearInterval(autoLaunchTimer);
+  }
+
+  autoLaunchTimer = setInterval(() => {
+    if (isRunning && autoLaunchTimer) { // 确保在停止发射后不再生成新烟花
+      createFirework();
+    }
+  }, 800); // 每0.8秒发射一个烟花
+};
+
+const stopAutoLaunch = () => {
+  if (autoLaunchTimer) {
+    clearInterval(autoLaunchTimer);
+    autoLaunchTimer = null;
+  }
+};
+
+// 移除点击和触摸处理，避免阻挡用户操作
+
+// 启动烟花
+const startFireworks = (customDuration) => {
+  // 显示组件
+  isVisible.value = true;
+
+  if (!isRunning) {
+    startAnimation();
+  }
+
+  // 立即创建一个测试烟花
+  createFirework();
+
+  // 开始自动发射
+  startAutoLaunch();
+
+  // 设置自动停止定时器
+  const duration = customDuration || props.duration;
+
+  if (autoStopTimer) {
+    clearTimeout(autoStopTimer);
+  }
+
+  autoStopTimer = setTimeout(() => {
+    stopFireworks();
+  }, duration);
+};
+
+// 停止烟花
+const stopFireworks = () => {
+  // 停止自动发射新烟花，但继续动画让现有烟花完成
+  stopAutoLaunch();
+
+  // 清除自动停止定时器
+  if (autoStopTimer) {
+    clearTimeout(autoStopTimer);
+    autoStopTimer = null;
+  }
+
+  // 等待现有烟花全部完成后再停止动画和隐藏组件
+  const waitForFireworksToFinish = () => {
+    if (fireworks.length === 0) {
+      // 所有烟花都完成了，停止动画
+      stopAnimation();
+
+      // 延迟隐藏组件
+      setTimeout(() => {
+        isVisible.value = false;
+      }, 1000);
+    } else {
+      // 还有烟花在进行，继续等待
+      setTimeout(waitForFireworksToFinish, 500);
+    }
+  };
+
+  waitForFireworksToFinish();
+};
+
+onMounted(() => {
+  setTimeout(() => {
+    initCanvas();
+  }, 1000);
+});
+
+onUnmounted(() => {
+  stopFireworks();
+});
+
+defineExpose({
+  startFireworks,
+  stopFireworks,
+  createFirework
+});
+</script>
+
+<style lang="scss" scoped>
+.firework-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  pointer-events: none; /* 不阻挡用户操作 */
+  z-index: 999; /* 降低层级，避免遮挡重要UI */
+
+  .firework-canvas {
+    width: 100%;
+    height: 100%;
+    pointer-events: none; /* Canvas也不接收事件，完全不阻挡操作 */
+  }
+}
+</style>
--- a/uni-app/src/components/information-filling/information-filling.vue
+++ b/uni-app/src/components/information-filling/information-filling.vue
@ -22,7 +22,7 @@
                        <u-form-item :label=" t('nickname')" prop="nickname" :border-bottom="true">
                            <input type="nickname" v-model="formData.nickname" :placeholder="t('nicknamePlaceholder')" placeholderClass="text-[28rpx]" class="text-[28rpx]" @blur="bindNickname" @click="checkAuth($event, 'nickname')"/>
                        </u-form-item>
-                        <u-form-item :label="t('mobile')" prop="mobile" :border-bottom="true" v-if="isBindMobile">
+                        <u-form-item :label="t('mobile')" prop="mobile" :border-bottom="true" v-if="isBindMobile || config.login.is_bind_mobile">
                            <input type="mobile" v-model="formData.mobile" :disabled="true" v-if="formData.mobile">
                            <template v-else>
                                <u-button v-if="info" :customStyle="{border:'none',color: 'var(--primary-color)',width:'140rpx', textAlign:'left',margin:'0rpx'}" :text="t('getMobile')" open-type="getPhoneNumber" @getphonenumber="memberStore.bindMobile"></u-button>
--- a/uni-app/src/components/music/music-container.vue
+++ b/uni-app/src/components/music/music-container.vue
@ -0,0 +1,355 @@
+<template>
+  <view class="music-container" :class="{ playing: isPlaying }" :style="musicStyle">
+    <view class="music-control" :style="defaultStyleCss" @click="togglePlay">
+      <view class="music-disc " :class="{ rotate: isPlaying }">
+        <image v-if="discImage" class="disc-image" :src="discImage" mode="aspectFill"></image>
+        <block v-else>
+          <text class="default-style iconfont iconyinfuV6mm" v-if="isPlaying"></text>
+          <text class="default-style disable iconfont iconyinfuV6mm" v-else></text>
+        </block>
+      </view>
+      <view class="music-icon">
+        <text v-if="isPlaying" class="iconfont icon-pause"></text>
+        <text v-else class="iconfont icon-play"></text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { ref, watch, onMounted, onBeforeUnmount, computed } from 'vue';
+import { img } from '@/utils/common';
+// 定义组件属性
+const props = defineProps({
+  // 音乐文件地址
+  src: {
+    type: String,
+    default: ''
+  },
+  // 是否自动播放
+  autoplay: {
+    type: Boolean,
+    default: true
+  },
+  // 是否循环播放
+  loop: {
+    type: Boolean,
+    default: true
+  },
+  // 自定义唱片图片
+  discImage: {
+    type: String,
+    default: ''
+  },
+  defaultBgColor: {
+      type: String,
+      default: '#B0B0B0'
+  },
+  defaultTextColor: {
+      type: String,
+      default: '#FFFFFF'
+  },
+  defaultRounded: {
+      type: Number,
+      default: 20
+  }
+});
+
+// 默认唱片图片
+const defaultDiscImage = img('/addon/seckill/goods/music1.png');
+const defaultDiscImage2 = img('/addon/seckill/goods/music2.png');
+
+// 播放状态
+const isPlaying = ref(false);
+// 音频实例
+let audioContext: any = null;
+
+// 创建音频实例
+const createAudioContext = () => {
+  console.log('创建音频实例，音乐地址:', props.src);
+  
+  // #ifdef MP-WEIXIN
+  audioContext = uni.createInnerAudioContext();
+  // #endif
+  
+  // #ifdef APP-PLUS || H5
+  audioContext = uni.createInnerAudioContext();
+  // #endif
+  
+  if (!audioContext) {
+    console.error('无法创建音频实例');
+    return;
+  }
+  
+  audioContext.src = props.src;
+  audioContext.loop = props.loop;
+  
+  // 监听播放事件
+  audioContext.onPlay(() => {
+    console.log('音乐开始播放');
+    isPlaying.value = true;
+  });
+  
+  // 监听暂停事件
+  audioContext.onPause(() => {
+    console.log('音乐暂停播放');
+    isPlaying.value = false;
+  });
+  
+  // 监听停止事件
+  audioContext.onStop(() => {
+    console.log('音乐停止播放');
+    isPlaying.value = false;
+  });
+  
+  // 监听结束事件
+  audioContext.onEnded(() => {
+    console.log('音乐播放结束');
+    isPlaying.value = false;
+  });
+  
+  // 监听错误事件
+  audioContext.onError((res: any) => {
+    console.error('音频播放错误:', res.errMsg || res);
+    isPlaying.value = false;
+  });
+  
+  // 自动播放
+  if (props.autoplay && props.src) {
+    // #ifdef H5
+    // H5环境下不自动播放
+    console.log('H5环境，不自动播放音乐');
+    isPlaying.value = false;
+    // #endif
+    
+    // #ifndef H5
+    // 非H5环境正常自动播放
+    console.log('准备自动播放音乐');
+    // 延迟一下确保各平台兼容性
+    setTimeout(() => {
+      playMusic();
+    }, 300);
+    // #endif
+  }
+};
+const defaultStyleCss = computed(() => {
+  let style = '';
+  style += `background:${props.defaultBgColor};`;
+  if(props.defaultTextColor){ style += `color:${props.defaultTextColor};`; }
+  if(props.defaultRounded){ 
+      style += `border-border-top-left-radius:${props.defaultRounded * 2}rpx;`;
+      style += `border-border-bottom-left-radius:${props.defaultRounded * 2}rpx;`;
+  }
+  return style;
+});
+
+// 播放音乐
+const playMusic = () => {
+  if (!audioContext || !props.src) {
+    console.error('无法播放音乐，audioContext或src为空');
+    return;
+  }
+  
+  console.log('尝试播放音乐:', props.src);
+  
+  // 尝试播放音乐
+  audioContext.play();
+  
+  // 强制设置播放状态
+  isPlaying.value = true;
+  
+  // 微信小程序环境特殊处理
+  // #ifdef MP-WEIXIN
+  try {
+    const systemInfo = uni.getSystemInfoSync();
+    if (systemInfo.platform === 'ios') {
+      // iOS端需要特殊处理微信小程序音频播放
+      uni.showToast({
+        title: '音乐播放中...',
+        icon: 'none',
+        duration: 1000
+      });
+    }
+  } catch (error) {
+    console.error('获取系统信息失败:', error);
+  }
+  // #endif
+};
+
+// 暂停音乐
+const pauseMusic = () => {
+  if (!audioContext) return;
+  console.log('暂停音乐');
+  audioContext.pause();
+  isPlaying.value = false;
+};
+
+// 切换播放状态
+const togglePlay = () => {
+  console.log('切换播放状态，当前状态:', isPlaying.value);
+  if (isPlaying.value) {
+    pauseMusic();
+  } else {
+    playMusic();
+  }
+};
+
+// 监听音乐地址变化
+watch(() => props.src, (newSrc) => {
+  console.log('音乐地址变化:', newSrc);
+  if (!audioContext) return;
+  
+  const wasPlaying = isPlaying.value;
+  
+  // 更新音乐地址
+  audioContext.src = newSrc;
+  
+  // 如果之前正在播放，则继续播放新音乐
+  if (wasPlaying && newSrc) {
+    playMusic();
+  }
+});
+
+// 监听自动播放状态变化
+watch(() => props.autoplay, (newAutoplay) => {
+  console.log('自动播放状态变化:', newAutoplay);
+  if (newAutoplay && audioContext && !isPlaying.value && props.src) {
+    playMusic();
+  }
+});
+
+// 组件挂载时创建音频实例
+onMounted(() => {
+  console.log('音乐组件挂载，初始化音频');
+  createAudioContext();
+});
+
+// 组件卸载前释放资源
+onBeforeUnmount(() => {
+  console.log('音乐组件卸载，释放资源');
+  if (audioContext) {
+    // 停止播放
+    if (isPlaying.value) {
+      audioContext.stop();
+    }
+    
+    // 释放资源
+    audioContext.destroy();
+    audioContext = null;
+  }
+});
+
+const musicStyle = computed(() => {
+  return {
+    '--color': `${props.defaultTextColor}`
+  }
+})
+
+// 暴露方法给父组件使用
+defineExpose({
+  play: playMusic,
+  pause: pauseMusic,
+  toggle: togglePlay,
+  isPlaying: () => isPlaying.value
+});
+</script>
+
+<style lang="scss" scoped>
+.music-container {
+  position: fixed;
+  right: 0;
+  top: calc(120rpx + var(--status-bar-height));
+  z-index: 999;
+  
+  .music-control {
+    width: 80rpx;
+    height: 80rpx;
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: rgba(0, 0, 0, 0.5);
+    border-top-left-radius: 20rpx;
+    border-bottom-left-radius: 20rpx;
+  }
+  
+  .music-disc {
+    transition: all 0.3s;
+    
+    &.rotate {
+      animation: rotate 5s linear infinite;
+      animation-play-state: running;
+    }
+    
+    .disc-image {
+      width: 60rpx;
+      height: 60rpx;
+      // background-color: #ffffff;
+    }
+  }
+  
+  .music-icon {
+    position: absolute;
+    width: 80rpx;
+    height: 80rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    
+    .iconfont {
+      font-size: 40rpx;
+      color: #ffffff;
+      text-shadow: 0 0 5rpx rgba(0, 0, 0, 0.5);
+    }
+  }
+}
+
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* 适配不同平台 */
+/* #ifdef MP-WEIXIN */
+.music-container {
+  z-index: 900;
+}
+/* #endif */
+
+/* #ifdef APP-PLUS */
+.music-container {
+  z-index: 999;
+}
+/* #endif */
+
+/* #ifdef H5 */
+.music-container {
+  position: fixed;
+  z-index: 999;
+}
+/* #endif */
+.default-style{
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 60rpx;
+  height: 60rpx;
+  font-size: 34rpx;
+  box-sizing: border-box;
+  &.disable:after{
+    content: '';
+    position: absolute;
+    left: 0;
+    height: 50rpx;
+    width: 2rpx;
+    background: var(--color);
+    left: 50%;
+    transform: translateX(-50%) rotate(-45deg);
+  }
+}
+</style>
--- a/uni-app/src/components/online-service/online-service.vue
+++ b/uni-app/src/components/online-service/online-service.vue
@ -0,0 +1,69 @@
+<template>
+    <view @touchmove.prevent.stop>
+        <u-popup class="popup-type" mode="center" :show="servicesDataShow" @close="servicesDataShow = false" bgColor="transparent" overlayOpacity="0.8">
+            <view @touchmove.prevent.stop class="flex flex-colitems-center">
+                <view class="bg-[#ffff] rounded-[34rpx]">
+                    <view class="text-center text-[30rpx] mt-[40rpx] mb-[40rpx]">联系在线客服</view>
+                    <scroll-view scroll-y="true" class="w-[570rpx] pb-[60rpx] max-h-[580rpx] overflow-y-auto">
+                        <view class="flex flex-col items-center justify-center px-[30rpx]" v-if="data.customer_phone">
+                            <text class="text-[45rpx]">{{ data.customer_phone }}</text>
+                            <view class="rounded-[30rpx] mt-[30rpx] bg-[#EF000C] text-[#fff] h-[60rpx] leading-[60rpx] w-[240rpx] text-center text-[24rpx]" @click="makePhoneCallFn(data.customer_phone)">一键拨打</view>
+                        </view>
+                        <view v-if="data.customer_phone" class="w-full h-[1rpx] bg-dashed-style my-[40rpx]"></view>
+                        <view class="px-[24rpx] flex flex-col items-center justify-center" v-if="data.customer_qrcode">
+                            <view class="border border-[#eee] border-solid rounded-[10rpx] border-[1rpx] w-[240rpx] h-[240rpx] flex items-center justify-center">
+                                <image class="w-[226rpx] h-[226rpx]" :src="img(data.customer_qrcode)" mode="widthFix" />
+                            </view>
+                            <view class="text-[26rpx] text-[#333] mt-[20rpx]">扫描二维码添加客服</view>
+                        </view>
+                        <view class="px-[50rpx] mt-[16rpx] text-[22rpx] text-[#999] leading-[1.5]" style="text-indent: 2em;">{{ data.customer_guided_words }}</view>
+                    </scroll-view>
+                </view>
+                <!-- <view @click="servicesDataShow = false" class="mt-[50rpx] nc-iconfont nc-icon-cuohaoV6xx1 !text-[50rpx] text-[#fff]"></view> -->
+            </view>
+        </u-popup>
+    </view>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import { redirect, img } from '@/utils/common'
+
+const props = defineProps({
+    data: {
+        type: Object,
+        default: {}
+    }
+})
+
+const servicesDataShow = ref<boolean>(false)
+const data = computed(() => {
+    return props.data;
+})
+
+const open = () => {
+    servicesDataShow.value = true;
+}
+
+const makePhoneCallFn = (data: any)=>{
+    uni.makePhoneCall({
+        phoneNumber: data,
+        success: (res) => {
+        },
+        fail: (res) => {
+        }
+    });
+}
+
+defineExpose({
+    open
+})
+</script>
+
+<style scoped lang="scss">
+.bg-dashed-style {
+  background: linear-gradient(to right, #eee 60%, transparent 40%);
+  background-size: 24rpx 100%; /* 控制线段长度（20rpx）和间隔 */
+  background-repeat: repeat-x;
+}
+</style>
--- a/uni-app/src/components/share-poster/share-poster.vue
+++ b/uni-app/src/components/share-poster/share-poster.vue
@ -1,7 +1,7 @@
 <template>
    <!-- 分享弹窗 -->
    <view @touchmove.prevent.stop class="share-popup">
-        <u-popup :show="sharePopupShow" type="bottom" @close="sharePopupClose" overlayOpacity="0.8">
+        <u-popup :show="sharePopupShow" @close="sharePopupClose" overlayOpacity="0.8">
            <view @touchmove.prevent.stop>
                <view class="poster-img-wrap" :style="{'top': shareTop}">
                    <image v-if="isPosterAnimation" class="poster-animation" :src="img('addon/shop/poster_animation.gif')" mode="aspectFit"/>
@ -61,7 +61,7 @@ import useSystemStore from "@/stores/system";

 const props = defineProps({
    posterId: {
-        type: String || Number,
+        type: [String, Number],
        default: 0
    },
    posterType: {
@ -79,6 +79,10 @@ const props = defineProps({
    copyUrlParam: {
        type: String,
        default: ''
+    },
+    isPreload: {
+        type: Boolean,
+        default: true
    }
 })

@ -117,7 +121,7 @@ const isPosterImg = ref(false)
 // 获取分享海报
 const poster = ref('');
 const loadPoster = () => {
-    if (poster.value) {
+    if (poster.value && props.isPreload) {
        // 预加载
        isPosterAnimation.value = false;
        isPosterImg.value = true;
@ -222,9 +226,10 @@ defineExpose({
 </script>
 <style lang="scss" scoped>
 .share-popup {
-    :deep(.u-transition), :deep(.u-popup__content) {
-        background-color: transparent;
-    }
+    //  苹果手机下要白色背景
+    // :deep(.u-transition), :deep(.u-popup__content) {
+    //     background-color: transparent;
+    // }

    .share-content {
        border-top-left-radius: 40rpx;
--- a/uni-app/src/components/top-tabbar/top-tabbar.vue
+++ b/uni-app/src/components/top-tabbar/top-tabbar.vue
@ -17,7 +17,7 @@
                </view>

                <view v-if="topStatusBarData.style == 'style-3'" :style="navbarInnerStyle" class="content-wrap">
-                    <view class="back-wrap -ml-[16rpx] text-[26px] nc-iconfont nc-icon-zuoV6xx" :style="{ color: titleTextColor }" @tap="goBack" :class="{'!text-transparent': !isBackShow}"></view>
+                    <view v-if="isBackShow" class="back-wrap -ml-[16rpx] text-[26px] nc-iconfont nc-icon-zuoV6xx" :style="{ color: titleTextColor }" @tap="goBack" :class="{'!text-transparent': !isBackShow}"></view>
                    <view class="title-wrap" @click="diyStore.toRedirect(topStatusBarData.link)">
                        <image :src="img(topStatusBarData.imgUrl)" mode="heightFix"/>
                    </view>
--- a/uni-app/src/hooks/useDiy.ts
+++ b/uni-app/src/hooks/useDiy.ts
@ -202,7 +202,7 @@ export function useDiy(params: any = {}) {
            if (e.scrollTop > 0) {
                diyStore.scrollTop = e.scrollTop;
            }
-            uni.$emit('scroll')
+            // uni.$emit('scroll')
        })
    }

--- a/uni-app/src/hooks/useDiyForm.ts
+++ b/uni-app/src/hooks/useDiyForm.ts
@ -140,6 +140,7 @@ export function useDiyForm(params: any = {}) {
                if (requestData.value) {
                    diyData.pageMode = requestData.mode;
                    diyData.title = requestData.title;
+                    diyData.type = requestData.type;

                    diyStore.id = requestData.form_id;
                    let sources = requestData.value;
--- a/uni-app/src/hooks/useLogin.ts
+++ b/uni-app/src/hooks/useLogin.ts
@ -22,13 +22,14 @@ export function useLogin() {
            const systemStore = useSystemStore()

            // #ifdef MP-WEIXIN
-            if (!uni.getStorageSync('autoLoginLock') && uni.getStorageSync('openid') && config.login.is_bind_mobile) {
+
+            if (!uni.getStorageSync('autoLoginLock')  && config.login.is_bind_mobile) {
                uni.setStorageSync('isBindMobile', true) // 强制绑定手机号标识
            }
            // #endif

            // #ifdef H5
-            if (!uni.getStorageSync('autoLoginLock') && isWeixinBrowser() && uni.getStorageSync('openid') && config.login.is_bind_mobile) {
+            if (!uni.getStorageSync('autoLoginLock') && isWeixinBrowser() && config.login.is_bind_mobile) {
                uni.setStorageSync('isBindMobile', true) // 强制绑定手机号标识
            }
            // #endif
@ -213,7 +214,7 @@ export function useLogin() {
                })
            }
        }).catch((err) => {
-            if (err.msg == -1) {
+            if (err.code == -1) {
                getAuthCode({ scopes: 'snsapi_userinfo' })
            } else {
                uni.showToast({ title: err.msg, icon: 'none' })
--- a/uni-app/src/hooks/useShare.ts
+++ b/uni-app/src/hooks/useShare.ts
@ -40,6 +40,7 @@ export const useShare = () => {
    }

    const setShare = (options: any = {}) => {
+        console.log('setShare options',options)
        if (currRoute() == '' || currRoute().indexOf('app/pages/index/close') != -1 || currRoute().indexOf('app/pages/index/nosite') != -1) return;

        let queryStr = getQuery();
@ -60,10 +61,9 @@ export const useShare = () => {
            query: queryStr.join('&'),
        }
        // #endif
+        
        if (options && Object.keys(options).length) {
-
            if (options.wechat) {
-
                // #ifdef H5
                wechatOptions.title = options.wechat.title || ''
                wechatOptions.link = options.wechat.link || h5Link
@ -89,37 +89,38 @@ export const useShare = () => {

        } 
        getShareInfo({
-                route: '/' + currRoute(),
-                params: JSON.stringify(currShareRoute().params)
-            }).then((res: any) => {
+               route: '/' + currRoute(),
+               params: JSON.stringify(currShareRoute().params)
+           }).then((res: any) => {
+            let data = res.data;

-                let data = res.data;
+            // #ifdef H5
+            let wechat = data.wechat;
+            if (wechat) {
+                wechatOptions.title = wechat.title
+                wechatOptions.desc = wechat.desc
+                wechatOptions.imgUrl = wechat.url ? img(wechat.url) : ''
+            } else {
+                wechatOptions.title = document.title;
+                wechatOptions.desc = ''
+            }
+            wechatShare()
+            // #endif
+
+            // #ifdef MP-WEIXIN
+            let weapp = data.weapp;
+            if (weapp) {
+                weappOptions.title = weapp.title
+                weappOptions.imageUrl = weapp.url ? img(weapp.url) : ''
+            }
+            // #endif
+            if(!weappOptions.title && !weappOptions.imageUrl){
+                    return;
+            }
+            uni.setStorageSync('weappOptions', weappOptions)
+        })

-                // #ifdef H5
-                let wechat = data.wechat;
-                if (wechat) {
-                    wechatOptions.title = wechat.title
-                    wechatOptions.desc = wechat.desc
-                    wechatOptions.imgUrl = wechat.url ? img(wechat.url) : ''
-                } else {
-                    wechatOptions.title = document.title;
-                    wechatOptions.desc = ''
-                }
-                wechatShare()
-                // #endif

-                // #ifdef MP-WEIXIN
-                let weapp = data.weapp;
-                if (weapp) {
-                    weappOptions.title = weapp.title
-                    weappOptions.imageUrl = weapp.url ? img(weapp.url) : ''
-                }
-                // #endif
-                if(!weappOptions.title && !weappOptions.imageUrl){
-                        return;
-                }
-                uni.setStorageSync('weappOptions', weappOptions)
-            })
    }

    // 小程序分享，分享给好友
@ -149,10 +150,41 @@ export const useShare = () => {
        })
    }

+    // 禁用当前页面的分享功能（同时支持小程序和公众号）
+    const disableShare = () => {
+        // 公众号（H5）禁用分享
+        // #ifdef H5
+        if (isWeixinBrowser()) {
+            // 确保SDK初始化后再禁用
+            wechat.init(() => {
+                wechat.disableShare();
+            });
+        }
+        // #endif
+
+        // 小程序禁用分享
+        // #ifdef MP-WEIXIN
+        // 隐藏分享菜单（转发给朋友、朋友圈）
+        uni.hideShareMenu({
+            menus: ['shareAppMessage', 'shareTimeline'],
+            success: () => {
+                console.log('小程序分享已禁用');
+            },
+            fail: (err) => {
+                console.error('小程序禁用分享失败：', err);
+            }
+        });
+        // 覆盖分享方法，返回空对象
+        onShareAppMessage(() => ({}));
+        onShareTimeline(() => ({}));
+        // #endif
+    };
+
    return {
        wechatInit: wechatInit,
        setShare: setShare,
        onShareAppMessage: shareApp,
        onShareTimeline: shareTime,
+        disableShare: disableShare,
    }
 }
--- a/uni-app/src/styles/account_info.scss
+++ b/uni-app/src/styles/account_info.scss
@ -1,41 +0,0 @@
-.account-info-wrap{
-	@apply bg-[#F5F6FA] min-h-[100vh];
-	.account-info-head{
-		@apply relative h-40;
-		.name{
-			@apply ml-4 pt-7 text-white text-lg mb-3;
-		}
-		.content{
-			@apply absolute bg-white left-3 right-3 rounded-lg p-5;
-			.money{
-				@apply text-xl font-bold;
-			}
-			.text{
-				@apply text-xs text-slate-500 mt-2;
-			}
-			.money-wrap{
-				@apply mt-5 flex;
-				.money-item{
-					@apply flex-1;
-				}
-				.money{
-					@apply text-lg;
-				}
-				.text{
-					@apply mt-1;
-				}
-			}
-		}
-	}
-	.account-info-btn{
-		@apply flex mt-24 ml-3 mr-3;
-		.btn{
-			&:first-of-type{
-				@apply mr-1 rounded;
-			}
-			&:last-of-type{
-				@apply ml-1 rounded;
-			}
-		}
-	}
-}
--- a/uni-app/src/styles/common.scss
+++ b/uni-app/src/styles/common.scss
@ -552,4 +552,18 @@ button[type='primary'],uni-button[type='primary']{
 }
 .information-filling .u-line{
 	border-color: #dddddd !important;
+}
+.order-grey-hollow-btn{
+	border: 2rpx solid #ccc;
+	height: 56rpx;
+	font-size: 24rpx;
+	background-color: #fff;
+	border-radius: 30rpx;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	min-width: 144rpx;
+	color: #333;
 }
--- a/uni-app/src/styles/iconfont.css
+++ b/uni-app/src/styles/iconfont.css
--- a/uni-app/src/styles/member_record_detail.scss
+++ b/uni-app/src/styles/member_record_detail.scss
@ -1,25 +0,0 @@
-page{
-	background-color: #f5f6fa;
-	@apply pt-4;
-}
-.member-record-detail{
-	@apply m-4 mt-0 bg-white rounded-md px-4 py-6;
-	.money-wrap{
-		@apply flex items-center flex-col mb-6;
-		text:first-of-type{
-			@apply text-3xl font-bold mt-1;
-		}
-		text:last-of-type{
-			@apply text-sm mt-3;
-		}
-	}
-	.line-wrap{
-		@apply flex justify-between text-sm mt-3;
-		.label{
-			@apply text-[#878787];
-		}
-		.value{
-			@apply text-[#222];
-		}
-	}
-}
--- a/uni-app/src/styles/member_record_list.scss
+++ b/uni-app/src/styles/member_record_list.scss
@ -1,21 +0,0 @@
-.member-record-list{
-	@apply min-h-[100vh];
-	.member-record-item{
-		@apply relative sidebar-margin border-solid border-t-0 border-l-0 border-r-0 border-b-1 border-[#ECEBEC] py-3 mx-[var(--sidebar-m)];
-		.name{
-			@apply text-sm;
-		}
-		.desc{
-			@apply text-xs text-[#8D8C8D] mt-1;
-		}
-		.text-active{
-			color: #FF0D3E;
-		}
-		.money{
-			@apply absolute right-0 top-4 text-base font-bold;
-		}
-		.state{
-			@apply absolute right-0 top-11 text-[#8D8C8D] text-xs;
-		}
-	}
-}
--- a/uni-app/src/utils/common.ts
+++ b/uni-app/src/utils/common.ts
@ -401,53 +401,132 @@ export function timeStampTurnTime(timeStamp: any, type = "") {
 * @param dateStr
 */
 export function timeTurnTimeStamp(dateStr: string) {
-    let timestamp;
-    let date;
+    // 输入验证
+    if (!dateStr || typeof dateStr !== 'string' || dateStr.trim() === '') {
+        return null;
+    }

-    // 尝试解析 'YYYY年M月D日'
-    try {
-        let dateStr1 = dateStr.replace('年', '-').replace('月', '-').replace('日', '');
-        date = new Date(dateStr1);
-        timestamp = date.getTime();
-    } catch (e) {
-        // 尝试解析 'YYYY-MM-DD'
-        try {
-            date = new Date(dateStr);
-            timestamp = date.getTime();
-        } catch (e) {
-            // 尝试解析 'YYYY/MM/DD'
-            try {
-                date = new Date(dateStr.replace(/\//g, "-"));
-                timestamp = date.getTime();
-            } catch (e) {
-                // 尝试解析 'YYYY年M月D日 HH时mm分'
-                try {
-                    let dateStr1 = dateStr.replace('年', '-').replace('月', '-').replace('日', ' ').replace('时', ':').replace('分', '');
-                    date = new Date(dateStr1);
-                    timestamp = date.getTime();
-                } catch (e) {
-                    // 尝试解析 'YYYY-MM-DD HH:mm'
-                    try {
-                        date = new Date(dateStr);
-                        timestamp = date.getTime();
-                    } catch (e) {
-                        // 尝试解析 'YYYY/MM/DD HH:mm'
-                        try {
-                            date = new Date(dateStr.replace(/\//g, "-"));
-                            timestamp = date.getTime();
-                        } catch (e) {
-                            // 如果所有格式都失败，返回null
-                            console.error("无法解析日期字符串:", dateStr);
-                            return null;
-                        }
-                    }
-                }
-            }
+    const trimmedDateStr = dateStr.trim();
+    
+    // 定义支持的日期格式转换规则
+    const formatRules = [
+        // 'YYYY年M月D日' -> 'YYYY-MM-DD'
+        {
+            pattern: /(\d{4})年(\d{1,2})月(\d{1,2})日/,
+            transform: (str: string) => str.replace(/(\d{4})年(\d{1,2})月(\d{1,2})日/, '$1-$2-$3')
+        },
+        // 'YYYY年M月D日 HH时mm分' -> 'YYYY-MM-DD HH:mm'
+        {
+            pattern: /(\d{4})年(\d{1,2})月(\d{1,2})日\s+(\d{1,2})时(\d{1,2})分/,
+            transform: (str: string) => str.replace(/(\d{4})年(\d{1,2})月(\d{1,2})日\s+(\d{1,2})时(\d{1,2})分/, '$1-$2-$3 $4:$5')
+        },
+        // 'YYYY/MM/DD' -> 'YYYY-MM-DD'
+        {
+            pattern: /^\d{4}\/\d{1,2}\/\d{1,2}(\s+\d{1,2}:\d{1,2}(:\d{1,2})?)?$/,
+            transform: (str: string) => str.replace(/\//g, '-')
+        },
+        // 标准格式，无需转换
+        {
+            pattern: /^\d{4}-\d{1,2}-\d{1,2}(\s+\d{1,2}:\d{1,2}(:\d{1,2})?)?$/,
+            transform: (str: string) => str
+        }
+    ];
+
+    // 尝试匹配并转换格式
+    let normalizedDateStr = null;
+    for (const rule of formatRules) {
+        if (rule.pattern.test(trimmedDateStr)) {
+            normalizedDateStr = rule.transform(trimmedDateStr);
+            break;
        }
    }
-    return (timestamp / 1000);
+
+    // 如果没有匹配的格式，直接尝试原始字符串
+    if (!normalizedDateStr) {
+        normalizedDateStr = trimmedDateStr;
+    }
+
+    // 创建日期对象并验证
+    const date = new Date(normalizedDateStr);
+    
+    // 检查日期是否有效
+    if (isNaN(date.getTime())) {
+        return null;
+    }
+
+    // 返回秒级时间戳
+    return Math.floor(date.getTime() / 1000);
 }

+/**
+ * 日期格式转时间戳 (兼容 iOS)
+ * @param dateStr
+ */
+export function timeTurnTimeStampTwo(dateStr: string) {
+    if (!dateStr || typeof dateStr !== 'string' || dateStr.trim() === '') {
+        return null;
+    }
+
+    let trimmedDateStr = dateStr.trim();
+
+    // 定义支持的日期格式转换规则
+    const formatRules = [
+        // 'YYYY年M月D日'
+        {
+            pattern: /(\d{4})年(\d{1,2})月(\d{1,2})日/,
+            transform: (str: string) =>
+                str.replace(/(\d{4})年(\d{1,2})月(\d{1,2})日/, '$1/$2/$3'),
+        },
+        // 'YYYY年M月D日 HH时mm分'
+        {
+            pattern: /(\d{4})年(\d{1,2})月(\d{1,2})日\s+(\d{1,2})时(\d{1,2})分/,
+            transform: (str: string) =>
+                str.replace(
+                    /(\d{4})年(\d{1,2})月(\d{1,2})日\s+(\d{1,2})时(\d{1,2})分/,
+                    '$1/$2/$3 $4:$5'
+                ),
+        },
+        // 'YYYY-MM-DD HH:mm:ss' -> 'YYYY/MM/DD HH:mm:ss' (iOS兼容)
+        {
+            pattern: /^\d{4}-\d{1,2}-\d{1,2}\s+\d{1,2}:\d{1,2}(:\d{1,2})?$/,
+            transform: (str: string) => str.replace(/-/g, '/'),
+        },
+        // 'YYYY-MM-DD' -> 'YYYY/MM/DD' (iOS兼容)
+        {
+            pattern: /^\d{4}-\d{1,2}-\d{1,2}$/,
+            transform: (str: string) => str.replace(/-/g, '/'),
+        },
+        // 'YYYY/MM/DD' / 'YYYY/MM/DD HH:mm:ss'
+        {
+            pattern: /^\d{4}\/\d{1,2}\/\d{1,2}(\s+\d{1,2}:\d{1,2}(:\d{1,2})?)?$/,
+            transform: (str: string) => str,
+        },
+    ];
+
+    // 尝试匹配并转换
+    let normalizedDateStr: string | null = null;
+    for (const rule of formatRules) {
+        if (rule.pattern.test(trimmedDateStr)) {
+            normalizedDateStr = rule.transform(trimmedDateStr);
+            break;
+        }
+    }
+
+    if (!normalizedDateStr) {
+        normalizedDateStr = trimmedDateStr;
+    }
+
+    // 创建日期对象
+    const date = new Date(normalizedDateStr);
+
+    if (isNaN(date.getTime())) {
+        return null;
+    }
+
+    return Math.floor(date.getTime() / 1000);
+}
+
+
 /**
 * 复制
 * @param {Object} value
--- a/uni-app/src/utils/interceptor.ts
+++ b/uni-app/src/utils/interceptor.ts
@ -97,6 +97,7 @@ const loadShare = () => {
    // 分享其它页面时，需要设置当前页面为白名单
    const shareWhiteList = [
        'addon/cms/pages/detail',
+        'addon/seckill/pages/goods/detail',
        'addon/shop/pages/goods/detail',
        'addon/shop/pages/point/detail',
        'addon/shop_fenxiao/pages/promote_code',
--- a/uni-app/src/utils/wechat.ts
+++ b/uni-app/src/utils/wechat.ts
@ -24,7 +24,7 @@ class Wechat {
                timestamp: data.timestamp, // 必填，生成签名的时间戳
                nonceStr: data.nonceStr, // 必填，生成签名的随机串
                signature: data.signature,// 必填，签名
-                jsApiList: ['chooseWXPay', 'updateAppMessageShareData', 'updateTimelineShareData', 'scanQRCode', 'getLocation'] // 必填，需要使用的JS接口列表
+                jsApiList: ['chooseWXPay', 'updateAppMessageShareData', 'updateTimelineShareData', 'scanQRCode', 'getLocation','hideMenuItems'] // 必填，需要使用的JS接口列表
            });
            if (callback) callback();
        })
@ -138,6 +138,52 @@ class Wechat {
        })
        // #endif
    }
+    /**
+     * 禁用分享（小程序和公众号）
+     */
+    public disableShare() {
+        // 公众号（H5）禁用分享
+       // #ifdef H5
+        if (isWeixinBrowser()) {
+            wx.ready(() => {
+                // 先检查是否有权限
+                wx.checkJsApi({
+                    jsApiList: ['hideMenuItems'],
+                    success: (res) => {
+                        // 若有权限，执行隐藏
+                        if (res.checkResult.hideMenuItems) {
+                            wx.hideMenuItems({
+                                menuList: [
+                                    "menuItem:share:appMessage",
+                                    "menuItem:share:timeline",
+                                    "menuItem:share:qq",
+                                    "menuItem:share:QZone",
+                                    "menuItem:share:weiboApp",
+                                    "menuItem:favorite"
+                                ],
+                                success: () => console.log("公众号分享已禁用"),
+                                fail: (err) => console.error("隐藏菜单失败：", err)
+                            });
+                        } else {
+                            console.warn("无hideMenuItems权限，无法禁用分享");
+                        }
+                    },
+                    fail: (err) => console.error("检查权限失败：", err)
+                });
+            });
+        }
+        // #endif
+
+
+        // 小程序禁用分享
+        // #ifdef MP-WEIXIN
+        wx.hideShareMenu({
+            menus: ['shareAppMessage', 'shareTimeline'], // 隐藏转发给朋友、朋友圈
+            success: () => console.log("小程序分享已禁用"),
+            fail: (err) => console.error("小程序禁用分享失败：", err)
+        });
+        // #endif
+    }
 }

 export default new Wechat()