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

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

【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)
  1. 积分表 (points)
  • point_id (INT, PRIMARY KEY, AUTO_INCREMENT)
  • user_id (INT, FOREIGN KEY -> users.user_id)
  • current_points (INT)
  • last_updated (TIMESTAMP)
  1. 积分来源与消耗记录表 (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)
  1. 转账记录表 (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’))
  1. 分佣渠道包表 (channels)
  • channel_id (INT, PRIMARY KEY, AUTO_INCREMENT)
  • channel_name (VARCHAR)
  • commission_rate (DECIMAL(5, 2))
  • created_at (TIMESTAMP)
  1. 抽佣记录表 (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)
  1. 线下积分同步记录表 (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’))
  1. 积分充值记录表 (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’))
  1. 积分提取记录表 (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

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

相关实践学习
每个IT人都想学的“Web应用上云经典架构”实战
本实验从Web应用上云这个最基本的、最普遍的需求出发,帮助IT从业者们通过“阿里云Web应用上云解决方案”,了解一个企业级Web应用上云的常见架构,了解如何构建一个高可用、可扩展的企业级应用架构。
MySQL数据库入门学习
本课程通过最流行的开源数据库MySQL带你了解数据库的世界。   相关的阿里云产品:云数据库RDS MySQL 版 阿里云关系型数据库RDS(Relational Database Service)是一种稳定可靠、可弹性伸缩的在线数据库服务,提供容灾、备份、恢复、迁移等方面的全套解决方案,彻底解决数据库运维的烦恼。 了解产品详情: https://www.aliyun.com/product/rds/mysql 
目录
相关文章
|
负载均衡 算法 关系型数据库
大数据大厂之MySQL数据库课程设计:揭秘MySQL集群架构负载均衡核心算法:从理论到Java代码实战,让你的数据库性能飙升!
本文聚焦 MySQL 集群架构中的负载均衡算法,阐述其重要性。详细介绍轮询、加权轮询、最少连接、加权最少连接、随机、源地址哈希等常用算法,分析各自优缺点及适用场景。并提供 Java 语言代码实现示例,助力直观理解。文章结构清晰,语言通俗易懂,对理解和应用负载均衡算法具有实用价值和参考价值。
大数据大厂之MySQL数据库课程设计:揭秘MySQL集群架构负载均衡核心算法:从理论到Java代码实战,让你的数据库性能飙升!
|
Java 关系型数据库 MySQL
Java汽车租赁系统源码(含数据库脚本)
Java汽车租赁系统源码(含数据库脚本)
744 4
|
NoSQL Java API
在Java环境下如何进行Redis数据库的操作
总的来说,使用Jedis在Java环境下进行Redis数据库的操作,是一种简单而高效的方法。只需要几行代码,就可以实现复杂的数据操作。同时,Jedis的API设计得非常直观,即使是初学者,也可以快速上手。
532 94
|
JavaScript 安全 前端开发
关于Node.js,一定要学这个10+万Star项目 !!
一篇关于Node.js的宝藏项目——Node.js Best Practices。该项目在GitHub上已有102k Star,汇集了100+条最佳实践,涵盖架构、安全、性能等多方面。每条实践不仅有简明说明和详细解释,还附带代码示例及资源链接。文中通过三个实战案例(利用CPU多核、避免阻塞事件循环、使用中间件处理错误)展示了其实际应用价值,并推荐了几条对前端转Node.js开发者特别有用的最佳实践。强烈建议每位Node.js开发者学习此项目,理解“怎么做”与“为什么要这么做”,以提升开发能力。
532 3
|
前端开发 JavaScript Java
[Java计算机毕设]基于ssm的OA办公管理系统的设计与实现,附源码+数据库+论文+开题,包安装调试
OA办公管理系统是一款基于Java和SSM框架开发的B/S架构应用,适用于Windows系统。项目包含管理员、项目管理人员和普通用户三种角色,分别负责系统管理、请假审批、图书借阅等日常办公事务。系统使用Vue、HTML、JavaScript、CSS和LayUI构建前端,后端采用SSM框架,数据库为MySQL,共24张表。提供完整演示视频和详细文档截图,支持远程安装调试,确保顺利运行。
596 17
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
818 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
存储 JSON JavaScript
WEB CAD插件通过上下文对象MxPluginContext修改UI界面的方法
本文介绍了如何使用MxPluginContext动态控制MxCAD项目的UI界面。通过该上下文对象,开发者可以灵活设置UI配置,如控制操作栏显隐、编辑按钮、添加侧边栏等。具体方法包括调用`getUiConfig()`获取并修改`mxUiConfig.json`中的属性,实现界面的定制化。此外,还提供了控制命令行聚焦的功能,解决输入框焦点锁定问题。详细代码示例和效果对比图展示了具体实现步骤,帮助开发者更好地适配项目需求。
|
存储 人工智能 编译器
【03】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-测试hello word效果-虚拟华为手机真机环境调试-为DevEco Studio编译器安装中文插件-测试写一个滑动块效果-介绍诸如ohos.ui等依赖库-全过程实战项目分享-从零开发到上线-优雅草卓伊凡
【03】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-测试hello word效果-虚拟华为手机真机环境调试-为DevEco Studio编译器安装中文插件-测试写一个滑动块效果-介绍诸如ohos.ui等依赖库-全过程实战项目分享-从零开发到上线-优雅草卓伊凡
1160 11
【03】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-测试hello word效果-虚拟华为手机真机环境调试-为DevEco Studio编译器安装中文插件-测试写一个滑动块效果-介绍诸如ohos.ui等依赖库-全过程实战项目分享-从零开发到上线-优雅草卓伊凡
|
存储 缓存 Java
java语言后台管理ruoyi后台管理框架-登录提示“无效的会话,或者会话已过期,请重新登录。”-扩展知识数据库中密码加密的方法-问题如何解决-以及如何重置若依后台管理框架admin密码-优雅草卓伊凡
java语言后台管理ruoyi后台管理框架-登录提示“无效的会话,或者会话已过期,请重新登录。”-扩展知识数据库中密码加密的方法-问题如何解决-以及如何重置若依后台管理框架admin密码-优雅草卓伊凡
2744 3
java语言后台管理ruoyi后台管理框架-登录提示“无效的会话,或者会话已过期,请重新登录。”-扩展知识数据库中密码加密的方法-问题如何解决-以及如何重置若依后台管理框架admin密码-优雅草卓伊凡
|
SQL JavaScript 安全
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
737 11
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战

推荐镜像

更多