zfc/bindbox-mini
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: merge pending stash changes (orders, activity, api) and update docs

Browse Source
This commit is contained in:
邹方成 2025-12-18 14:39:37 +08:00
parent 6f7207da2d
commit bed414251c
6 changed files with 731 additions and 163 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
api/appUser.js
View File

@ -31,6 +31,17 @@ export function getOrders(user_id, status, page = 1, page_size = 20) {
return authRequest({ url: `/api/app/users/${user_id}/orders`, method: 'GET', data })
}
// 获取订单详情
export function getOrderDetail(order_id) {
return authRequest({ url: `/api/app/orders/${order_id}`, method: 'GET' })
}
// 取消订单
export function cancelOrder(order_id, reason = '') {
const data = reason ? { reason } : {}
return authRequest({ url: `/api/app/orders/${order_id}/cancel`, method: 'POST', data })
}
export function listAddresses(user_id) {
return authRequest({ url: `/api/app/users/${user_id}/addresses`, method: 'GET' })
}

4
components/YifanSelector.vue
View File

@ -55,6 +55,7 @@
import { ref, computed, onMounted, watch } from 'vue'
import { getIssueChoices, getUserCoupons, joinLottery, createWechatOrder, getLotteryResult } from '@/api/appUser'
import PaymentPopup from '@/components/PaymentPopup.vue'
import { requestLotterySubscription } from '@/utils/subscribe'
const props = defineProps({
activityId: { type: [String, Number], required: true },
@ -216,6 +217,9 @@ async function onPaymentConfirm(paymentData) {
return
}
// 请求用户订阅开奖通知
await requestLotterySubscription()
uni.showLoading({ title: '处理中...' })
try {

14
pages/activity/duiduipeng/index.vue
View File

@ -255,23 +255,25 @@ function onPreviewBanner() {
if (url) uni.previewImage({ urls: [url], current: url })
}
function onParticipate() {
async function onParticipate() {
const aid = activityId.value || ''
const iid = currentIssueId.value || ''
if (!aid || !iid) { uni.showToast({ title: '期数未选择', icon: 'none' }); return }
uni.showLoading({ title: '抽选中...' })
drawActivityIssue(aid, iid).then(res => {
try { uni.hideLoading() } catch (_) {}
try {
const res = await drawActivityIssue(aid, iid)
uni.hideLoading()
const obj = res || {}
const data = obj.data || obj.result || obj.reward || obj.item || obj
const name = String((data && (data.title || data.name || data.product_name)) || '未知奖励')
const img = String((data && (data.image || data.img || data.pic || data.product_image)) || '')
uni.showModal({ title: '抽选结果', content: '恭喜获得：' + name, showCancel: false, success: () => { if (img) uni.previewImage({ urls: [img], current: img }) } })
}).catch(err => {
try { uni.hideLoading() } catch (_) {}
} catch (err) {
uni.hideLoading()
const msg = String((err && (err.message || err.msg)) || '抽选失败')
uni.showToast({ title: msg, icon: 'none' })
})
}
}
onLoad((opts) => {

772
pages/orders/index.vue
View File

@ -1,34 +1,130 @@
<template>
<view class="wrap">
<view class="bg-decoration"></view>
<view class="page-container">
<!-- 顶部 Tab -->
<view class="tabs">
<view class="tab" :class="{ active: currentTab === 'pending' }" @click="switchTab('pending')">待付款</view>
<view class="tab" :class="{ active: currentTab === 'completed' }" @click="switchTab('completed')">已完成</view>
</view>
<view v-if="error" class="error">{{ error }}</view>
<view v-if="orders.length === 0 && !loading" class="empty">
<view class="empty-icon">📦</view>
<view class="empty-text">暂无订单</view>
</view>
<view v-for="item in orders" :key="item.id || item.order_no" class="order">
<view class="order-main">
<view class="order-title">{{ item.title || item.subject || '订单' }}</view>
<view class="order-sub">{{ formatTime(item.created_at || item.time) }}</view>
<view
class="tab-item"
:class="{ active: currentTab === 'pending' }"
@click="switchTab('pending')"
>
<text class="tab-text">待付款</text>
</view>
<view class="order-right">
<view class="order-amount">{{ formatAmount(item.total_amount || item.amount || item.price) }}</view>
<view class="order-status" :class="getStatusClass(item)">{{ statusText(item) }}</view>
<view
class="tab-item"
:class="{ active: currentTab === 'completed' }"
@click="switchTab('completed')"
>
<text class="tab-text">已完成</text>
</view>
</view>
<!-- 页面内容 -->
<view class="page-content">
<!-- 错误提示 -->
<view v-if="error" class="error-toast">
<text class="error-icon">⚠️</text>
<text class="error-text">{{ error }}</text>
</view>
<!-- 加载状态 -->
<view v-if="loading" class="loading-state">
<view class="loading-spinner"></view>
<text class="loading-text">加载中...</text>
</view>
<!-- 空状态 -->
<view v-else-if="orders.length === 0" class="empty-state">
<view class="empty-illustration">
<text class="empty-icon">📦</text>
</view>
<text class="empty-title">暂无订单</text>
<text class="empty-desc">{{ currentTab === 'pending' ? '没有待付款的订单' : '完成的订单将显示在这里' }}</text>
<button class="empty-btn" @tap="goShopping">去逛逛</button>
</view>
<!-- 订单列表 -->
<view v-else class="orders-list">
<view
v-for="(item, index) in orders"
:key="item.id || item.order_no"
class="order-card"
:style="{ '--delay': index * 0.05 + 's' }"
@tap="goOrderDetail(item)"
>
<!-- 订单头部 -->
<view class="order-header">
<view class="order-type">
<text class="type-icon">{{ getTypeIcon(item) }}</text>
<text class="type-name">{{ getTypeName(item) }}</text>
</view>
<view class="order-status" :class="getStatusClass(item)">
{{ statusText(item) }}
</view>
</view>
<!-- 订单内容 -->
<view class="order-body">
<!-- 商品图片 -->
<view class="product-image-wrap">
<image
class="product-image"
:src="getProductImage(item)"
mode="aspectFill"
/>
<view class="image-overlay" v-if="item.is_winner">
<text class="winner-badge">🎉 中奖</text>
</view>
</view>
<!-- 商品信息 -->
<view class="product-info">
<text class="product-title">{{ getOrderTitle(item) }}</text>
<view class="product-meta">
<text class="meta-item" v-if="item.activity_name">{{ item.activity_name }}</text>
<text class="meta-item" v-if="item.issue_number">第{{ item.issue_number }}期</text>
</view>
<text class="order-time">{{ formatTime(item.created_at) }}</text>
</view>
</view>
<!-- 订单底部 -->
<view class="order-footer">
<view class="order-no">
<text class="no-label">订单号:</text>
<text class="no-value">{{ item.order_no }}</text>
</view>
<view class="order-amount">
<text class="amount-label">实付</text>
<text class="amount-value">{{ formatAmount(item.actual_amount || item.total_amount) }}</text>
</view>
</view>
<!-- 快捷操作 -->
<view class="order-actions" v-if="currentTab === 'pending'">
<button class="action-btn secondary" @tap.stop="cancelOrder(item)">取消订单</button>
<button class="action-btn primary" @tap.stop="payOrder(item)">立即支付</button>
</view>
</view>
<!-- 加载更多 -->
<view v-if="loadingMore" class="loading-more">
<view class="loading-spinner small"></view>
<text>加载更多...</text>
</view>
<view v-else-if="!hasMore" class="no-more">
<view class="divider"></view>
<text>没有更多了</text>
<view class="divider"></view>
</view>
</view>
</view>
<view v-if="loadingMore" class="loading">加载中...</view>
<view v-else-if="!hasMore && orders.length > 0" class="end">没有更多了</view>
</view>
</template>
<script setup>
import { ref } from 'vue'
import { onLoad, onReachBottom } from '@dcloudio/uni-app'
import { getOrders } from '../../api/appUser'
import { getOrders, cancelOrder as cancelOrderApi } from '../../api/appUser'
const currentTab = ref('pending')
const orders = ref([])
@ -39,41 +135,109 @@ const page = ref(1)
const pageSize = ref(20)
const hasMore = ref(true)
// 默认商品图片
const defaultImage = 'https://keaiya-1259195914.cos.ap-shanghai.myqcloud.com/images/default-product.png'
function formatTime(t) {
if (!t) return ''
const d = typeof t === 'string' ? new Date(t) : new Date(t)
const y = d.getFullYear()
const now = new Date()
const diffMs = now - d
const diffMins = Math.floor(diffMs / 60000)
const diffHours = Math.floor(diffMs / 3600000)
const diffDays = Math.floor(diffMs / 86400000)
if (diffMins < 1) return '刚刚'
if (diffMins < 60) return `${diffMins}分钟前`
if (diffHours < 24) return `${diffHours}小时前`
if (diffDays < 7) return `${diffDays}天前`
const m = String(d.getMonth() + 1).padStart(2, '0')
const day = String(d.getDate()).padStart(2, '0')
const hh = String(d.getHours()).padStart(2, '0')
const mm = String(d.getMinutes()).padStart(2, '0')
return `${y}-${m}-${day} ${hh}:${mm}`
return `${m}-${day} ${hh}:${mm}`
}
function formatAmount(a) {
if (a === undefined || a === null) return ''
if (a === undefined || a === null) return '¥0.00'
const n = Number(a)
if (Number.isNaN(n)) return String(a)
if (Number.isNaN(n)) return '¥0.00'
const yuan = n / 100
return `¥${yuan.toFixed(2)}`
}
function getOrderTitle(item) {
// 优先使用 remark 中的商品名称
if (item.remark && !item.remark.startsWith('lottery:')) {
return item.remark
}
// 其次使用 items 中的商品名称
if (item.items && item.items.length > 0) {
return item.items[0].title || '商品'
}
// 使用活动名称
if (item.activity_name) {
return item.activity_name
}
return item.title || item.subject || '订单'
}
function getProductImage(item) {
// 从 items 中获取图片
if (item.items && item.items.length > 0) {
const images = item.items[0].product_images
if (images) {
try {
const parsed = JSON.parse(images)
if (Array.isArray(parsed) && parsed.length > 0) {
return parsed[0]
}
} catch (e) {
if (typeof images === 'string' && images.startsWith('http')) {
return images
}
}
}
}
return defaultImage
}
function getTypeIcon(item) {
const sourceType = item.source_type
if (sourceType === 2) return '🎰' // 抽奖订单
if (sourceType === 1) return '🛒' // 商城订单
return '📦'
}
function getTypeName(item) {
const sourceType = item.source_type
if (sourceType === 2) return '一番赏'
if (sourceType === 1) return '商城'
return '订单'
}
function statusText(item) {
const v = item && (item.is_draw ?? item.drawed ?? item.completed)
const ok = v === true || v === 1 || String(v) === 'true' || String(v) === '1'
if (ok) return '已完成'
const s = item && (item.status || item.pay_status || item.state)
const t = String(s || '').toLowerCase()
if (t.includes('pend')) return '待付款'
if (t.includes('paid') || t.includes('complete') || t.includes('done')) return '已完成'
return s || ''
// 检查是否已开奖
if (item.is_draw === true || item.is_draw === 1) {
return item.is_winner ? '已中奖' : '未中奖'
}
const status = item.status
if (status === 1) return '待付款'
if (status === 2) return '已完成'
if (status === 3) return '已取消'
return '进行中'
}
function getStatusClass(item) {
const text = statusText(item)
if (text === '待付款') return 'status-pending'
if (text === '已完成') return 'status-completed'
return ''
if (text === '已完成' || text === '已中奖') return 'status-success'
if (text === '未中奖') return 'status-normal'
if (text === '已取消') return 'status-cancelled'
return 'status-processing'
}
function switchTab(tab) {
@ -86,10 +250,17 @@ function apiStatus() {
return currentTab.value === 'pending' ? 'pending' : 'completed'
}
// 过滤掉 source_type=3 的发奖订单
function filterOrders(items) {
if (!Array.isArray(items)) return []
return items.filter(item => item.source_type !== 3)
}
async function fetchOrders(append) {
const user_id = uni.getStorageSync('user_id')
const token = uni.getStorageSync('token')
const phoneBound = !!uni.getStorageSync('phone_bound')
if (!user_id || !token || !phoneBound) {
uni.showModal({
title: '提示',
@ -103,6 +274,7 @@ async function fetchOrders(append) {
})
return
}
if (!append) {
if (currentTab.value === 'completed') {
await fetchAllOrders()
@ -118,12 +290,17 @@ async function fetchOrders(append) {
loadingMore.value = true
page.value = page.value + 1
}
error.value = ''
try {
const list = await getOrders(user_id, apiStatus(), page.value, pageSize.value)
const items = Array.isArray(list) ? list : (list && list.items) || []
const rawItems = Array.isArray(list) ? list : (list && list.items) || (list && list.list) || []
const items = filterOrders(rawItems)
const total = (list && list.total) || 0
orders.value = append ? orders.value.concat(items) : items
if (total) {
hasMore.value = orders.value.length < total
} else {
@ -146,15 +323,20 @@ async function fetchAllOrders() {
page.value = 1
hasMore.value = false
orders.value = []
try {
const first = await getOrders(user_id, apiStatus(), 1, pageSize.value)
const itemsFirst = Array.isArray(first) ? first : (first && first.items) || (first && first.list) || []
const rawItemsFirst = Array.isArray(first) ? first : (first && first.items) || (first && first.list) || []
const itemsFirst = filterOrders(rawItemsFirst)
const total = (first && first.total) || 0
orders.value = itemsFirst
const totalPages = Math.max(1, Math.ceil(Number(total) / pageSize.value))
for (let p = 2; p <= totalPages; p++) {
const res = await getOrders(user_id, apiStatus(), p, pageSize.value)
const items = Array.isArray(res) ? res : (res && res.items) || (res && res.list) || []
const rawItems = Array.isArray(res) ? res : (res && res.items) || (res && res.list) || []
const items = filterOrders(rawItems)
orders.value = orders.value.concat(items)
}
} catch (e) {
@ -163,6 +345,45 @@ async function fetchAllOrders() {
loading.value = false
}
}
function goOrderDetail(item) {
// 跳转订单详情页
uni.navigateTo({
url: `/pages/orders/detail?id=${item.id}&order_no=${item.order_no}`
})
}
function goShopping() {
uni.switchTab({ url: '/pages/index/index' })
}
async function doCancelOrder(item) {
uni.showModal({
title: '确认取消',
content: '确定要取消这个订单吗？',
success: async (res) => {
if (res.confirm) {
uni.showLoading({ title: '取消中...' })
try {
await cancelOrderApi(item.id, '用户主动取消')
uni.hideLoading()
uni.showToast({ title: '订单已取消', icon: 'success' })
// 刷新订单列表
fetchOrders(false)
} catch (e) {
uni.hideLoading()
uni.showToast({ title: e.message || '取消失败', icon: 'none' })
}
}
}
})
}
function payOrder(item) {
// TODO: 跳转支付
uni.showToast({ title: '支付功能开发中', icon: 'none' })
}
onLoad((opts) => {
const s = (opts && opts.status) || ''
if (s === 'completed' || s === 'pending') currentTab.value = s
@ -176,121 +397,217 @@ onReachBottom(() => {
<style lang="scss" scoped>
/* ============================================
奇盒潮玩 - 订单页面
采用暖橙色调的订单列表设计
订单页面 - 高级设计重构
============================================ */
.wrap {
padding: $spacing-md;
.page-container {
min-height: 100vh;
background-color: $bg-page;
background: $bg-page;
position: relative;
overflow-x: hidden;
padding-bottom: calc(40rpx + env(safe-area-inset-bottom));
}
&::before {
content: '';
position: fixed;
top: 0; left: 0; width: 100%; height: 100vh;
background: radial-gradient(circle at 10% 10%, rgba($brand-primary, 0.05), transparent 40%),
radial-gradient(circle at 90% 90%, rgba($accent-gold, 0.05), transparent 40%);
pointer-events: none;
z-index: 0;
/* 顶部 Tab - 与货柜页面保持一致 */
.tabs {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 88rpx;
background: rgba($bg-card, 0.95);
backdrop-filter: blur(20rpx);
display: flex;
align-items: center;
justify-content: center;
z-index: 100;
box-shadow: 0 2rpx 20rpx rgba(0, 0, 0, 0.05);
}
.tab-item {
position: relative;
flex: 1;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
&.active {
.tab-text {
color: $brand-primary;
font-weight: 700;
font-size: 30rpx;
}
&::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 40rpx;
height: 4rpx;
background: $brand-primary;
border-radius: 4rpx;
}
}
}
/* Tab 切换 */
.tabs {
display: flex;
background: $bg-glass;
backdrop-filter: blur(10rpx);
border: 1px solid rgba(255, 255, 255, 0.5);
border-radius: $radius-lg;
padding: 8rpx;
margin-bottom: $spacing-lg;
box-shadow: $shadow-sm;
}
.tab {
flex: 1;
text-align: center;
padding: 20rpx 0;
font-size: $font-md;
.tab-text {
font-size: 28rpx;
color: $text-sub;
border-radius: $radius-md;
transition: all 0.25s ease;
font-weight: 500;
transition: all 0.3s;
}
.tab.active {
background: $gradient-brand;
color: $text-inverse;
.page-content {
position: relative;
z-index: 1;
padding: $spacing-lg;
padding-top: calc(88rpx + $spacing-lg); /* tabs height + spacing */
}
/* 错误提示 */
.error-toast {
display: flex;
align-items: center;
justify-content: center;
gap: $spacing-sm;
padding: $spacing-md $spacing-lg;
background: rgba($uni-color-error, 0.1);
border-radius: $radius-lg;
margin-bottom: $spacing-lg;
.error-icon { font-size: $font-lg; }
.error-text { color: $uni-color-error; font-size: $font-sm; }
}
/* 加载状态 */
.loading-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 120rpx 0;
.loading-text {
margin-top: $spacing-lg;
color: $text-sub;
font-size: $font-sm;
}
}
.loading-spinner {
width: 60rpx;
height: 60rpx;
border: 4rpx solid rgba($brand-primary, 0.2);
border-top-color: $brand-primary;
border-radius: 50%;
animation: spin 0.8s linear infinite;
&.small {
width: 32rpx;
height: 32rpx;
border-width: 3rpx;
}
}
@keyframes spin {
to { transform: rotate(360deg); }
}
/* 空状态 */
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
padding: 100rpx $spacing-xl;
animation: fadeInUp 0.5s ease-out;
}
.empty-illustration {
width: 200rpx;
height: 200rpx;
background: rgba($brand-primary, 0.05);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: $spacing-xl;
}
.empty-icon {
font-size: 80rpx;
animation: float 3s ease-in-out infinite;
}
.empty-title {
font-size: $font-xl;
font-weight: 700;
color: $text-main;
margin-bottom: $spacing-sm;
}
.empty-desc {
font-size: $font-sm;
color: $text-sub;
margin-bottom: $spacing-xl;
}
.empty-btn {
background: $gradient-brand !important;
color: #fff !important;
border: none !important;
padding: 0 60rpx;
height: 80rpx;
line-height: 80rpx;
border-radius: $radius-round;
font-size: $font-md;
font-weight: 600;
box-shadow: $shadow-glow;
box-shadow: $shadow-warm;
}
/* 订单列表 */
.orders-list {
display: flex;
flex-direction: column;
gap: $spacing-lg;
}
/* 订单卡片 */
.order {
display: flex;
justify-content: space-between;
align-items: center;
.order-card {
background: $bg-card;
border-radius: $radius-md;
padding: $spacing-lg;
margin-bottom: $spacing-lg;
box-shadow: $shadow-sm;
border: 1rpx solid rgba(0,0,0,0.02);
transition: all 0.2s ease;
border-radius: $radius-xl;
overflow: hidden;
box-shadow: $shadow-card;
animation: fadeInUp 0.4s ease-out backwards;
}
animation-delay: var(--delay, 0s);
transition: all 0.2s;
@for $i from 1 through 10 {
.order:nth-child(#{$i}) {
animation-delay: #{$i * 0.05}s;
&:active {
transform: scale(0.98);
}
}
.order:active {
transform: scale(0.98);
box-shadow: none;
}
.order-main {
/* 订单头部 */
.order-header {
display: flex;
flex-direction: column;
flex: 1;
min-width: 0;
justify-content: space-between;
align-items: center;
padding: $spacing-md $spacing-lg;
border-bottom: 1rpx solid $border-color-light;
background: rgba($bg-secondary, 0.3);
}
.order-title {
font-size: $font-md;
font-weight: 700;
color: $text-main;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: $spacing-xs;
.order-type {
display: flex;
align-items: center;
gap: $spacing-xs;
}
.order-sub {
.type-icon {
font-size: $font-lg;
}
.type-name {
font-size: $font-sm;
color: $text-sub;
}
.order-right {
display: flex;
flex-direction: column;
align-items: flex-end;
margin-left: $spacing-lg;
flex-shrink: 0;
}
.order-amount {
font-size: $font-lg;
font-weight: 800;
color: $brand-primary;
font-family: 'DIN Alternate', sans-serif;
font-weight: 500;
}
.order-status {
font-size: $font-xs;
color: $text-sub;
margin-top: 10rpx;
padding: 4rpx $spacing-md;
background: $bg-page;
padding: 6rpx 16rpx;
border-radius: $radius-round;
font-weight: 600;
@ -298,51 +615,194 @@ onReachBottom(() => {
background: rgba($brand-primary, 0.1);
color: $brand-primary;
}
&.status-completed {
&.status-success {
background: rgba($uni-color-success, 0.1);
color: $uni-color-success;
}
&.status-normal {
background: rgba($text-sub, 0.1);
color: $text-sub;
}
&.status-cancelled {
background: rgba($text-placeholder, 0.1);
color: $text-placeholder;
}
&.status-processing {
background: rgba($accent-gold, 0.15);
color: #B45309;
}
}
/* 空状态 */
.empty {
/* 订单内容 */
.order-body {
display: flex;
padding: $spacing-lg;
gap: $spacing-lg;
}
.product-image-wrap {
width: 160rpx;
height: 160rpx;
border-radius: $radius-lg;
overflow: hidden;
position: relative;
flex-shrink: 0;
background: $bg-secondary;
}
.product-image {
width: 100%;
height: 100%;
}
.image-overlay {
position: absolute;
top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0, 0, 0, 0.4);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 120rpx;
animation: fadeInUp 0.5s ease-out;
.empty-icon {
font-size: 80rpx;
margin-bottom: $spacing-lg;
opacity: 0.6;
animation: float 4s ease-in-out infinite;
}
.empty-text {
color: $text-sub;
font-size: $font-md;
}
}
/* 错误提示 */
.error {
color: $uni-color-error;
.winner-badge {
color: #fff;
font-size: $font-sm;
margin-bottom: $spacing-md;
padding: $spacing-md;
background: rgba($uni-color-error, 0.1);
border-radius: $radius-lg;
text-align: center;
font-weight: 700;
background: $gradient-gold;
padding: 6rpx 16rpx;
border-radius: $radius-sm;
}
/* 加载状态 */
.loading, .end {
text-align: center;
.product-info {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
min-width: 0;
}
.product-title {
font-size: $font-md;
font-weight: 700;
color: $text-main;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.product-meta {
display: flex;
flex-wrap: wrap;
gap: $spacing-sm;
margin-top: $spacing-xs;
}
.meta-item {
font-size: $font-xs;
color: $text-sub;
padding: $spacing-lg 0;
background: $bg-secondary;
padding: 4rpx 12rpx;
border-radius: $radius-sm;
}
.order-time {
font-size: $font-xs;
color: $text-placeholder;
margin-top: auto;
}
/* 订单底部 */
.order-footer {
display: flex;
justify-content: space-between;
align-items: center;
padding: $spacing-md $spacing-lg;
background: rgba($bg-secondary, 0.3);
border-top: 1rpx solid $border-color-light;
}
.order-no {
display: flex;
align-items: center;
gap: $spacing-xs;
}
.no-label {
font-size: $font-xs;
color: $text-placeholder;
}
.no-value {
font-size: $font-xs;
color: $text-sub;
font-family: 'SF Mono', monospace;
}
.order-amount {
display: flex;
align-items: baseline;
gap: $spacing-xs;
}
.amount-label {
font-size: $font-xs;
color: $text-sub;
}
.amount-value {
font-size: $font-lg;
font-weight: 800;
color: $brand-primary;
font-family: 'DIN Alternate', sans-serif;
}
/* 操作按钮 */
.order-actions {
display: flex;
justify-content: flex-end;
gap: $spacing-md;
padding: $spacing-md $spacing-lg;
border-top: 1rpx solid $border-color-light;
}
.action-btn {
height: 64rpx;
line-height: 64rpx;
padding: 0 32rpx;
border-radius: $radius-round;
font-size: $font-sm;
font-weight: 600;
&.primary {
background: $gradient-brand !important;
color: #fff !important;
border: none !important;
}
&.secondary {
background: transparent !important;
color: $text-sub !important;
border: 2rpx solid $border-color !important;
}
}
/* 加载更多 */
.loading-more {
display: flex;
align-items: center;
justify-content: center;
gap: $spacing-sm;
padding: $spacing-xl 0;
color: $text-sub;
font-size: $font-sm;
}
.no-more {
display: flex;
align-items: center;
justify-content: center;
gap: $spacing-md;
padding: $spacing-xl 0;
color: $text-placeholder;
font-size: $font-xs;
.divider {
width: 60rpx;
height: 1rpx;
background: $border-color-light;
}
}
/* 动画 */
@keyframes float {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10rpx); }
}
</style>

90
utils/subscribe.js Normal file
View File

@ -0,0 +1,90 @@
/**
* 微信订阅消息授权工具
* 用于在抽奖前请求用户授权接收开奖通知
*/
// 抽奖结果通知模板 ID
const LOTTERY_RESULT_TEMPLATE_ID = 'O2eqJQD3pn-vQ6g2z9DWzINVwOmPoz8yW-172J_YcpI'
/**
* 请求用户订阅抽奖结果通知
* @returns {Promise<object>} 订阅结果
*/
export function requestLotterySubscription() {
return new Promise((resolve) => {
// #ifdef MP-WEIXIN
wx.requestSubscribeMessage({
tmplIds: [LOTTERY_RESULT_TEMPLATE_ID],
success(res) {
console.log('订阅消息授权结果:', res)
resolve({
success: true,
result: res,
// 检查用户是否接受了订阅
accepted: res[LOTTERY_RESULT_TEMPLATE_ID] === 'accept'
})
},
fail(err) {
console.warn('订阅消息授权失败:', err)
// 即使授权失败也不阻止用户参与抽奖
resolve({
success: false,
error: err,
accepted: false
})
}
})
// #endif
// #ifndef MP-WEIXIN
// 非微信小程序环境，直接返回成功
resolve({
success: true,
accepted: false,
message: '非微信小程序环境，跳过订阅授权'
})
// #endif
})
}
/**
* 批量请求多个模板的订阅授权
* @param {string[]} templateIds 模板ID数组
* @returns {Promise<object>} 订阅结果
*/
export function requestSubscriptions(templateIds) {
return new Promise((resolve) => {
// #ifdef MP-WEIXIN
wx.requestSubscribeMessage({
tmplIds: templateIds,
success(res) {
console.log('订阅消息授权结果:', res)
resolve({
success: true,
result: res
})
},
fail(err) {
console.warn('订阅消息授权失败:', err)
resolve({
success: false,
error: err
})
}
})
// #endif
// #ifndef MP-WEIXIN
resolve({
success: true,
message: '非微信小程序环境，跳过订阅授权'
})
// #endif
})
}
export default {
requestLotterySubscription,
requestSubscriptions,
LOTTERY_RESULT_TEMPLATE_ID
}

1
说明文档.md
View File

@ -30,5 +30,6 @@
* [x] 2025-12-17: 修复 `pages/activity/yifanshang/index.vue` 编译错误，在 `uni.scss` 中补充 `text-ellipsis` mixin 定义。
* [x] 2025-12-17: 修复 `pages/login/index.vue` 等多处 `$border-color` 未定义错误，在 `uni.scss` 中增加变量别名。
* [x] 2025-12-17: 修复 `pages/mine/index.vue` 编译错误，在 `api/appUser.js` 中补充 `getUserInfo`, `getUserTasks`, `getInviteRecords` 导出。
* [x] 2025-12-17: 将 dev 分支代码强制推送至 main 分支 (Deployment/Sync)。
* [ ] 2025-12-17: 进行中 - 优化 `pages/activity/yifanshang/index.vue` 及相关组件。
* [ ] 2025-12-17: 待开始 - 优化 `pages/login/index.vue` 视觉细节。