activityLink/抽奖逻辑修改说明.md

抽奖逻辑修改说明

修改概述

本次修改将抽奖逻辑从前端随机抽奖改为每轮抽奖都请求后端获取中奖数据。

主要修改内容

1. API接口修改 (src/api/API.js)

新增了 drawLottery 接口，用于每轮抽奖时请求后端：

export function drawLottery(data){
    return request({
        url: '/lottery/draw',
        method: 'post',
        data: {
            gradeName: data.gradeName,    // 奖项名称
            prizeName: data.prizeName,    // 奖品名称
            perWin: data.perWin,          // 每轮抽奖人数
            round: data.round             // 当前轮次
        }
    })
}

2. 抽奖引擎修改 (src/views/choujiang/lottery/lotteryEngine.js)

• 修改 executeLottery 函数，每轮抽奖都请求后端
• 后端返回数据格式：{ data: [{ jwcode: "5412", username: "猪八戒22" }, ...] }
• 添加了错误处理机制，如果后端请求失败会回退到前端随机抽奖

3. 数据管理器修改 (src/views/choujiang/lottery/dataManager.js)

• 使用真实的用户数据替代假数据
• 确保数据格式与后端返回格式兼容
• 用户数据格式：{ jwcode: "5412", username: "猪八戒22", company: "公司名称" }

4. 3D显示组件修改 (src/views/choujiang/lottery/Lottery3D.vue)

• 修改 changeCard 函数，适配新的数据格式
• 支持显示 jwcode 和 username 字段

后端接口要求

抽奖接口 /lottery/draw

请求参数：

{
    "gradeName": "一等奖",
    "prizeName": "iPhone 15",
    "perWin": 5,
    "round": 1
}

返回数据格式：

{
    "data": [
        {
            "jwcode": "5412",
            "username": "猪八戒22"
        },
        {
            "jwcode": "45125",
            "username": "宝玉"
        }
    ]
}

工作流程

1. 初始化：页面加载时获取奖品列表和用户列表
2. 开始抽奖：用户点击抽奖按钮
3. 请求后端：发送抽奖请求到后端，包含奖项信息和轮次
4. 获取结果：后端返回中奖用户列表
5. 显示动画：前端根据返回的中奖用户显示3D抽奖动画
6. 保存结果：将中奖用户保存到本地状态

错误处理

如果后端抽奖接口请求失败，系统会自动回退到前端随机抽奖逻辑，确保抽奖功能不会中断。

兼容性

修改后的代码保持了与原有数据格式的兼容性，支持新旧两种数据格式：

• 新格式：{ jwcode: "5412", username: "猪八戒22" }
• 旧格式：["5412", "猪八戒22", "PSST"]