项目简介纯静态页面无需部署后端接口服务数据持久化依赖浏览器存储。下载项目执行构建将打包到./dist目录可自行挂载至相应服务器上浏览使用。注意对于设置比较严格的图片服务器可能出现图片跨域无法展示的问题。技术栈React- 开发框架Three-3D效果实现Zustand- 状态管理Dexie-IndexedDB极简封装库Antd-UI组件库Exceljs-Excel文件操作管理线上地址预览地址https://bratrindersteak.github.io/party-lottery/项目地址https://github.com/Bratrindersteak/party-lottery/本地开发# 克隆项目gitclone https://github.com/Bratrindersteak/party-lottery.git# 安装依赖pnpmi 或pnpminstall# 启动本地服务pnpmrun dev# 打包pnpmrun build抽奖流程1.初始状态没有数据可以选择手动录入也可选择使用默认数据快速开始并熟悉游戏流程。2.这里我们选择【使用默认数据】可以看到成员、奖项、标题都有了数据。有了这些数据就可以进行抽奖了。3.通过单击左侧的奖项列表项选取所要抽取的奖项。奖项也支持拖拽调整顺序。奖项抽取的顺序是自上而下循环抽取的所以调整奖项顺序也就可以控制抽奖顺序。4.点击底部的【进入抽奖】按钮就会进入抽奖环节。成员卡片墙会组成卡片球并水平逆时针自转。同时会播放【开场音乐】。5.点击【开始抽奖】按钮卡片球高速旋转。同时高亮提示当前正在抽取的奖项。并切换播放【抽奖音乐】。6.点击【开奖】按钮卡片球停止旋转并选出获奖者。并播放【开奖音效】。开奖之后可以选择保留本次结果并【继续抽取】其他奖项也可以选择放弃本次结果并【重新抽取】。7.顶部右侧的操作栏提供少数辅助功能依次是静音切换、语言切换、进入后台设置界面。后台配置通用配置功能由于数据持久化依赖浏览器存储且数据量可能会很大所以这里添加了【一键清空数据】的功能用于抽奖页面不再使用后手动释放存储空间。注算法暂不支持切换默认使用随机算法。成员录入管理支持excel文件批量导入数据但请使用本页面提供的模板。奖项配置管理已经抽取完毕的奖项在这里可以重置为未抽取同时也会清除对应的抽奖记录。获奖记录管理支持导出为excel文件保存。音乐配置管理内置3个默认音效也支持自行上传。使用说明介绍