3D大球抽奖程序AI二次开发！2.9

3D大球年会抽奖程序 - 项目简介与使用说明

特别鸣谢
本系统是基于GitHub：

游客，如果您要查看本帖隐藏内容请回复

，特别感谢！
基于自公司的一些因素主要修改了很多默认颜色搭配和初始数据；添加了个形式主义的管理账号和密码；添加了每轮抽奖必中号码的暗箱操作（隐藏模式）；还有其他一些乱七八糟的。

一、项目简介
log-lottery 是一个基于 Vue 3 + TypeScript + Three.js 开发的现代化、可视化抽奖应用，集成了前端、后端和桌面应用多种部署方式，为企业年会、活动抽奖等场景提供了专业、高效、美观的解决方案。

核心功能

• 多样化抽奖模式
    - 支持随机抽奖、固定人数抽奖
    - 支持多次抽奖、单次抽奖
    - 支持自定义中奖概率
    - 支持键盘快捷键操作
    - 支持百分百中奖设置
• 丰富的视觉效果
    - Three.js 3D 卡片动画效果
    - 粒子特效背景
    - 响应式设计，适配 PC 和移动设备
    - 自定义主题和背景图片
• 完整的人员管理
    - Excel 表格导入人员数据
    - 支持人员信息批量管理
    - 已中奖人员自动管理
    - 支持导出人员数据
• 灵活的奖品配置
    - 支持多种奖品类型
    - 可配置中奖人数和抽奖次数
    - 奖品图片自定义
    - 支持红包奖项特殊设置
    - 支持百分百中奖模式配置
• 个性化界面设置
    - 自定义主标题、字体、颜色
    - 背景图片和音乐配置
    - 国际化支持（中英文）
    - 管理员登录保护
• 多端部署支持
    - 网页版：支持浏览器访问
    - 桌面版：基于 Tauri 构建，支持 Windows、Mac、Linux
    - 移动版：响应式设计，支持手机访问
  

技术栈

前端	Vue 3 + TypeScript + Three.js + Pinia + Vue Router
后端	Rust (WebSocket 服务器)
桌面应用	Tauri (Rust)
构建工具	Vite
样式	SCSS
国际化	i18n
数据存储	IndexedDB (Dexie.js, LocalForage)
UI 组件	自定义组件 + DaiysuiTable
3D 效果	Three.js
动画	GSAP

二、适应说明
适用场景

• 企业年会：为公司年会提供专业的抽奖工具，支持大屏幕显示，营造热烈氛围
• 活动促销：商场、展会等活动的抽奖环节，吸引顾客参与
• 线上直播：结合直播平台，进行线上抽奖互动
• 内部活动：公司内部团建、部门活动的抽奖环节
• 校园活动：学校、社团活动的抽奖工具
  

环境要求

网页版	现代浏览器（Chrome、Firefox、Edge 等），支持 ES6+，网络连接
桌面版	Windows 7+ / macOS 10.13+ / Linux，至少 2GB 内存，至少 100MB 磁盘空间
开发环境	Node.js 18+，pnpm 8+，Rust 1.70+，Vite 5+

安装与部署
网页版

#安装环境
1、下载安装node.js。下载地址：https://nodejs.org/dist/v24.13.0/node-v24.13.0-x64.msi
2、下载源码解压至目录
3、打开目录，在目录的地址栏输入cmd打开
4、CMD窗口输入：先npm install -g pnpm、后pnpm install
5、安装结束后输入：pnpm -v，看到版本号说明安装成功
6、输入：pnpm dev，打开开发者模式
7、看到如下地址信息：（窗口不可关闭，如关闭，再次3、6步即可）
单机访问：http://localhost:6719/log-lottery/
局域网访问： http://192.168.1.188:6719/log-lottery/（实际是自己电脑IP地址）
src\store\data.ts里的const originUrl（默认单机）参数要修改实际访问的网址，不然图片会失效。
8、提供了背景图片的PSD，可自行修改公司抬头，代码根目录：背景底图.PSD。

使用指南
首次使用

• 访问应用首页，点击使用默认数据，可以直接体验。
• 点击右侧齿轮图标，输入管理员账号密码（默认：admin / 456852），单纯意思意思的密码。src/layout/RightButton/index.vue，文件搜索可修改。
• 进入配置页面，导入人员数据或使用默认数据
• 配置奖品信息
• 保存配置，返回首页开始抽奖
  

抽奖操作

• 点击首页中央的"开始抽奖"按钮
• 按空格键或点击按钮停止抽奖
• 中奖结果会显示在屏幕中央
• 点击"继续抽奖"按钮开始下一轮抽奖
  

快捷键

空格键	开始/停止抽奖
ESC 键	取消操作/关闭弹窗
Enter 键	确认操作/提交表单

百分百中奖功能使用方法

• 功能说明：百分百中奖
• 配置方法：
    1. 登录管理员账号，进入"奖品配置"页面
    2. 找到需要设置为百分百中奖的奖品，点击前面的9点“戒疤”
    3. 点击数字下面的齿轮，弹窗内填入要百分百中间的UID号，多个用,[英文状态]分开。
• 使用场景：
    - 活动促销：确保每个参与者都能获得奖品，提高参与积极性
    - 内部福利：公司内部活动，确保每位员工都能获得福利
    - 游戏环节：游戏胜利后的抽奖奖励，增加游戏趣味性
• 注意事项：
    - 开启"可重复"选项后，已中奖人员仍会参与后续抽奖
    - 建议合理设置奖品数量和抽奖次数，确保奖品充足
    - 可结合多次抽奖功能，为参与者提供多次中奖机会
  

三、故障排除

• 无法导入 Excel 文件：
    - 确保 Excel 文件格式正确（.xlsx 或 .xls）
    - 确保文件包含正确的列头（编号、姓名、部门等）
    - 检查浏览器控制台是否有错误信息
• 抽奖过程卡顿：
    - 减少人员数量或关闭部分 3D 特效
    - 检查设备性能是否足够
    - 尝试使用桌面版
• WebSocket 连接失败：
    - 检查网络连接是否正常
    - 确保 WebSocket 服务器正在运行
    - 检查服务器地址配置是否正确
• 桌面应用无法启动：
    - 检查系统是否满足最低要求
    - 检查是否有足够的权限
    - 查看应用日志以获取详细错误信息
• 数据丢失：
    - 定期导出数据备份
    - 使用浏览器的隐私模式可能会导致数据丢失
    - 清除浏览器缓存可能会导致数据丢失
  

四、总结
log-lottery 是一个功能强大、界面美观、操作简单的抽奖应用，适用于各种活动场景。它不仅提供了丰富的抽奖功能，还支持高度自定义，能够满足不同用户的个性化需求。无论是企业年会、活动促销还是内部团建，log-lottery 都能为您的活动增添乐趣和专业感。
通过前端、后端和桌面应用的多端部署支持，log-lottery 能够适应不同的使用环境，为用户提供便捷、高效的抽奖体验。同时，项目的模块化设计和良好的代码结构，也为后续的功能扩展和维护提供了便利。
特别是其独特的"百分百中奖"功能，为活动组织者提供了更多灵活性，能够根据不同场景需求，确保每位参与者都能获得奖品，提高活动的参与度和满意度。

修改历程（仅部分）


下载链接：

游客，如果您要查看本帖隐藏内容请回复