【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战

项目背景

本项目经费43000元，需求文档如下，工期25天，目前已经过了7天，时间不多了，我们需要在2月17日之前完成。

技术栈要求

前端vue.js
前端客户端框架 uniapp-x
服务端 java
后台管理 java+vue
java框架选择：若依框架

注意：整个项目以web形式存在，并且可以为后续二期开发打包app，【选择uniapp-x】
【第一次接触，问题不大，卓伊凡是全栈开发】

本项目具有典型例子，曾几何时这样的项目在没有AI的情况下至少要10个人甚至更多人才能开发，现在不需要了，由卓伊凡来为大家演示，当然了能达到卓伊凡这样的也是屈指可数的，其实也不用担心了。

项目实战：

ui图设计

由于目前国内蓝湖还没有ai的功能不是咱们不支持国产，因此关乎AI设计图ui设计我们采用figma AI

但是普通free版本的figma无法使用ai功能，于是这块我们得需要简单设计下了，根据需求我们是只需要设计用户端的，后台管理主要是管理功能，到差不差，客户端的功能梳理完成后大部分问题都可得以解决，

用户端功能需求

3.1 积分展示与查询

• 当前积分余额
• 积分来源
• 积分消耗

3.2 积分来源与消耗记录

• 积分来源类型
• 积分消耗类型

3.3 积分转账功能

• 选择接收用户
• 转账数量
• 转账备注
• 转账确认
• 转账记录

3.4 分佣

3.4.1 渠道包与代理设置

• 渠道包的创建与管理
• 代理佣金设置

3.4.2 抽佣机制（平台收入优先提取）

• 抽佣优先
• 用户分佣

3.4.3 抽佣触发条件与扣除规则

• 代理亏损时才扣佣金
• 亏损与盈利的判断

根据需求文档查看，我们需要，先做个注册登录把，再做首页，内页，转账页，分佣页面，以及统计页面，大体我们需要做这些内容。

第一步进入figma

选择#图标，打开选择frame 选择画布，我这里选择iPhone 16 promax，

第二步，我们要选择对应的按钮组件 插件 之类的，kit，因此我们登陆官方社区

https://www.figma.com/community

我登录后选择 mobile app 选项，一眼就看到了右边这两个非常的不错 ，我们选其一，感觉右边那个紫色更加高大上。

选择了紫色并且导入到了我们的设计项目中，可见一下

这里，我们再做一件事情，也就是汉化插件，在这件事情之前，先升级个专业版

这些必须要的花费是避免不了的，作为普通开发者都需要，还别说我们想做AI工程师了。

汉化一下，另外汉化插件已经发布到csdn的下载资源中了，下载搜索：
【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
可以搜到，

注意，我们安装汉化插件，只能支持Chrome浏览器，浏览器 输入 chrome://extensions 进入配置

勾选开发者模式，

选择加载已解压的资源

浏览本地文件目录浏览整个我上传好的figmaCN

完成加载后关闭，重启浏览器，再次进入，已经汉化完毕

虽然只是菜单汉化了，但是已经很不错了，本篇这里到此为止

mysql数据库设计

根据目前的项目情况我们初步设计了初步的数据库情况，

数据库表设计

1. 用户表 (users)

• user_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• username (VARCHAR, UNIQUE)
• password (VARCHAR)
• email (VARCHAR, UNIQUE)
• created_at (TIMESTAMP)

2. 积分表 (points)

• point_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• user_id (INT, FOREIGN KEY -> users.user_id)
• current_points (INT)
• last_updated (TIMESTAMP)

3. 积分来源与消耗记录表 (points_history)

• history_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• user_id (INT, FOREIGN KEY -> users.user_id)
• change_type (ENUM(‘source’, ‘consume’))
• source_type (VARCHAR, NULL)
• consume_type (VARCHAR, NULL)
• points_changed (INT)
• timestamp (TIMESTAMP)
• notes (VARCHAR, NULL)

4. 转账记录表 (transfers)

• transfer_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• sender_id (INT, FOREIGN KEY -> users.user_id)
• receiver_id (INT, FOREIGN KEY -> users.user_id)
• transfer_points (INT)
• transfer_notes (VARCHAR)
• transfer_timestamp (TIMESTAMP)
• status (ENUM(‘pending’, ‘confirmed’, ‘failed’))

5. 分佣渠道包表 (channels)

• channel_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• channel_name (VARCHAR)
• commission_rate (DECIMAL(5, 2))
• created_at (TIMESTAMP)

6. 抽佣记录表 (commission)

• commission_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• channel_id (INT, FOREIGN KEY -> channels.channel_id)
• user_id (INT, FOREIGN KEY -> users.user_id)
• amount (DECIMAL(10, 2))
• commission_type (ENUM(‘platform’, ‘user’))
• status (ENUM(‘pending’, ‘completed’))
• timestamp (TIMESTAMP)

7. 线下积分同步记录表 (offline_sync)

• sync_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• user_id (INT, FOREIGN KEY -> users.user_id)
• sync_points (INT)
• sync_timestamp (TIMESTAMP)
• status (ENUM(‘pending’, ‘completed’))

8. 积分充值记录表 (recharge)

• recharge_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• user_id (INT, FOREIGN KEY -> users.user_id)
• amount (DECIMAL(10, 2))
• recharge_timestamp (TIMESTAMP)
• status (ENUM(‘pending’, ‘completed’))

9. 积分提取记录表 (withdrawals)

• withdrawal_id (INT, PRIMARY KEY, AUTO_INCREMENT)
• user_id (INT, FOREIGN KEY -> users.user_id)
• amount (DECIMAL(10, 2))
• withdrawal_timestamp (TIMESTAMP)
• status (ENUM(‘pending’, ‘completed’))

这是我们对mysql的数据库设计，并且我们需要确定数据库版本，版本设定为mysql5.7+ 以上， 其次mysql版本推荐是8.0

以上是第二篇内容，篇幅有限，我们需要快马加鞭进行第三篇内容。