增加推销模式

pages/mall/consumer/order-detail.uvue

@@ -1,4 +1,4 @@
-<!-- 消费者端 - 订单详情页 -->
+<!-- 消费者端 - 订单详情页 -->
 <template>
   <view class="order-detail-page">
     <scroll-view scroll-y="true" class="scroll-content">
@@ -12,6 +12,15 @@
           </view>
           <text class="status-desc">{{ getStatusDesc() }}</text>
         </view>
+        <!-- 分享免单入口 -->
+        <view v-if="order?.order_status === 4" class="share-free-entry" @click="shareForFree">
+          <text class="share-free-icon">🎁</text>
+          <view class="share-free-info">
+            <text class="share-free-title">分享免单</text>
+            <text class="share-free-desc">分享给好友，4人购买即可免单</text>
+          </view>
+          <text class="share-free-arrow">›</text>
+        </view>
       </view>
     </view>
 
@@ -143,6 +152,7 @@
           
           <view v-if="order?.order_status === 4" class="btn-group">
             <button class="btn" @click="applyAfterSales">申请售后</button>
+            <button class="btn share-free" @click="shareForFree">分享免单</button>
             <button class="btn" @click="rePurchase">再次购买</button>
             <button class="btn primary" @click="goToReview">评价订单</button>
           </view>
@@ -686,6 +696,53 @@ const goToProduct = (pid: string) => {
     uni.navigateTo({ url: `/pages/mall/consumer/product-detail?id=${pid}` })
 }
 
+const shareForFree = async () => {
+    if (orderItems.value.length === 0) {
+        uni.showToast({ title: '没有可分享的商品', icon: 'none' })
+        return
+    }
+    
+    const firstItem = orderItems.value[0]
+    
+    try {
+        uni.showLoading({ title: '创建分享...' })
+        const result = await supabaseService.createShareRecord(
+            firstItem.product_id,
+            orderId.value,
+            firstItem.id,
+            firstItem.product_name,
+            firstItem.image_url,
+            firstItem.price
+        )
+        uni.hideLoading()
+        
+        const shareIdRaw = result.get('id')
+        const shareCodeRaw = result.get('share_code')
+        
+        if (shareIdRaw != null && shareCodeRaw != null) {
+            const shareId = shareIdRaw as string
+            const shareCode = shareCodeRaw as string
+            
+            uni.showModal({
+                title: '分享成功',
+                content: `您的分享码: ${shareCode}\n分享给好友，当有4人购买后即可免单！`,
+                confirmText: '查看详情',
+                success: (res) => {
+                    if (res.confirm) {
+                        uni.navigateTo({ url: `/pages/mall/consumer/share/detail?id=${shareId}` })
+                    }
+                }
+            })
+        } else {
+            uni.showToast({ title: '分享创建失败', icon: 'none' })
+        }
+    } catch (e) {
+        uni.hideLoading()
+        console.error('[shareForFree] 创建分享失败:', e)
+        uni.showToast({ title: '分享失败', icon: 'none' })
+    }
+}
+
 // 使用 onBackPress 拦截物理返回键和系统导航栏返回
 onBackPress((_): boolean => {
     const pages = getCurrentPages()
@@ -792,6 +849,48 @@ onLoad((options) => {
     text-align: center;
 }
 
+/* 分享免单入口 */
+.share-free-entry {
+    margin-top: 20px;
+    background-color: rgba(255, 255, 255, 0.2);
+    border-radius: 12px;
+    padding: 14px 16px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: 100%;
+    max-width: 400px;
+}
+
+.share-free-icon {
+    font-size: 28px;
+    margin-right: 12px;
+}
+
+.share-free-info {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+}
+
+.share-free-title {
+    font-size: 16px;
+    font-weight: bold;
+    color: white;
+    margin-bottom: 4px;
+}
+
+.share-free-desc {
+    font-size: 12px;
+    color: rgba(255, 255, 255, 0.85);
+}
+
+.share-free-arrow {
+    font-size: 20px;
+    color: rgba(255, 255, 255, 0.8);
+}
+
 /* 配送信息 */
 .section-title {
     font-weight: bold;
@@ -1113,6 +1212,13 @@ onLoad((options) => {
     box-shadow: 0 4px 8px rgba(255, 80, 0, 0.2);
 }
 
+.btn.share-free {
+    background: linear-gradient(to right, #52c41a, #73d13d);
+    color: #ffffff;
+    border: none;
+    font-weight: bold;
+}
+
 /* 响应式适配 */
 @media screen and (min-width: 768px) {
     .card {