SSM智能制造管理系统介绍
可以学习到的技能
1. 学会常用技术栈的使用
2. 独立开发项目
3. 学会前端的开发流程
4. 学会后端的开发流程
5. 学会数据库的设计
6. 学会前后端接口调用方式
7. 学会多模块之间的关联
8. 学会数据的处理
适用人群
1. 在校学生，小白用户，想学习知识的
2. 有点基础，想要通过项目实操提高自己的开发能力的
3. 找不到完整项目跟着练的
4. 网上项目比较大，会提供资料，太大
业务功能描述
1、 管理员信息管理：管理员可以通过关键字搜索、分页展示管理员信息，也可以进行添加、删除和修改管理员信息。
2、 用户信息管理：管理员可以通过关键字搜索、分页展示用户信息，也可以进行添加、删除和修改用户信息。
3、 仓库信息管理：管理员可以通过关键字搜索、分页展示仓库的信息，也可以进行添加、删除和修改仓库的信息。
4、 物品信息管理：管理员可以通过关键字搜索、分页展示物品的信息，也可以进行添加、删除和修改物品的信息。
5、 物品出库操作：管理员可以选择对应的操作用户执行出库操作。
6、 物品入库操作：管理员可以选择对应的操作用户执行入库操作。
7、 物品分类管理：管理员可以通过关键字搜索、分页展示物品分类的信息，也可以进行添加、删除和修改物品分类。
8、 操作日志查询：管理员可以根据时间范围、操作类型等关键字进行操作日志的查询，以便审计和追踪操作记录。
脚手架安装模块
npm install -g @vue/cli
npm config set registry registry.npm.taobao.org
npm i
npm run dev
系统技术栈
1. 后端：Springboot、MyBatis/MyBatisPlus、SpringMVC
2. 前端：Vue2/3、Element-UI/Plus、NodeJs
3. 数据库： MySQL 8
4. 前后端：分离思想
5. 编辑器：IDEA2024、VScode/WebStorm、Navicat、ProcessOn
6. 中间件：Redis后期
7. 服务器：Linux(后期部署)
8. 思维导图：XMind/XManager
9. E-R图 ：Visio
数据库创建
DB创建
目标项目演示
官方文档
nodejs下载、安装
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时，用于构建可扩展的网络应用程序。
内存足够建议一路下一步【省事不易出错】，或者根据需要确定存放的位置。
安装完成后用命令检查，显示了版本号就说明安装成功了
node -v
npm -v
使用win+R,以管理员身份运行cmd.exe
查询全局包存放位置：
查询全局包存放位置：
npm config get prefix
查询缓存地址：
npm config get cache
显示全局安装包路径
npm list -g
Vue创建脚手架
创建脚手架其实就是创建一个项目文件，但是这个项目文件已经为我们添加了很多代码，所以我们就不需要去写，直接拿来用就可以了
选择一个存放脚手架文件的位置
这里我直接选择桌面，然后已终端的形式打开这个文件
执行命令
npm create vue@latest
会安装并执行create-vue
然后命令行会问我们这个项目要取什么名字，需不需要什么功能，这里的功能我们全都选择否
我们会得到一个文件，我们来用终端来打开这个文件
npm i
用来安装vue的模块依赖，后续指令需要它来实现
启动项目，启动完了项目终端会给我们一个链接，这个链接对应的地址就是本地服务器的网页，让我们打开终端给我们的链接。
这是vue给我们的初始页面，这样很多东西就不需要我们自己去配置，直接下载到本地直接用就可以了，这种东西我们称为脚手架。
node_modules里面有很多我们环境需要使用到的包，不如vue包，这样我们就不需要到官网去获取vue的数据，直接安装在本地直接拿来用就可以了
package.json用来管理项目的文件
src/main.js是整个项目打包的入口
App.vue是vue代码的入口
index.html是项目入口网页
src下的所有代码都会被vite打包成css/js/html交给index.html然后呈现在观众眼前
分析脚手架中三个入口级代码
三个入口文件分别是：main.js，App.vue，index.html
main.js负责将App.vue的代码整合起来创建应用，App.vue负责根层的组件，index.html负责将main.js打包形成的应用在网页中展示出来
Vue单文件
Vue的文件由三个部分组成分别是HTML，CSS，JS，我们来看Vue文件的简化版
<script setup>
//数据...
</script>
<template>
<!-- 数据.. -->
</template>
<style scoped>
/* 数据 */
</style>
script：JS，template：HTML，style：CSS
这里的scoped能让<style>保证修饰<template>
清理目录
为了便于后于的开发，我们将脚手架默认给我们的数据删除，分别是assets和component还有Vue里面的初三大框架之外的代码。
*如果.Vue代码颜色不是彩色，可以添加插件。
安装 Vue 相关扩展
确保已安装以下核心扩展：
• Vue Language Support (Vetur)提供 .vue 文件的语法高亮、代码补全、格式化等功能。
• Volar（可选）如果你使用 Vue 3 + TypeScript，推荐用 Volar 替代 Vetur（二者不要同时安装）。
安装方法
1. 打开 VSCode 的扩展商店（侧边栏最下方的图标）。
2. 搜索 Vetur 或 Volar，点击 安装。
代码
前端代码，WarehouseManagerVue提供测试
后端代码，WarehouseManagerApi - idea，IDEA
数据库设计
ER图
Entity-Relation 实体关系图
user表
Record表
menu表
goodstype表
goods表
storage表
*注意：可以设计E-R图
也可以使用亿图图示或其他单独的工具设计
------详见文档-----
后端框架搭建
创建JAVA MAVEN项目
检查maven配置
按照如下框架，创建项目整体结构
构建jar依赖文件
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="//maven.apache.org/POM/4.0.0"
xmlns:xsi="//www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="//maven.apache.org/POM/4.0.0 //maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>org.example</groupId>
<artifactId>warehousepro</artifactId>
<version>1.0-SNAPSHOT</version>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.7.5</version>
<relativePath/>
</parent>
<properties>
<maven.compiler.source>8</maven.compiler.source>
<maven.compiler.target>8</maven.compiler.target>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>8.0.33</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId>
<version>3.5.0</version>
</dependency>
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.30</version>
</dependency>
<!--swagger-->
<dependency>
<groupId>com.spring4all</groupId>
<artifactId>spring-boot-starter-swagger</artifactId>
<version>1.5.1.RELEASE</version>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.10</version>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid-spring-boot-starter</artifactId>
<version>1.1.23</version>
</dependency>
</dependencies>
<!-- 配置过maven可以不写下面-->
<repositories>
<repository>
<id>public</id>
<name>aliyun nexus</name>
<url>://maven.aliyun.com/repository/public/</url>
<releases>
<enabled>true</enabled>
</releases>
</repository>
</repositories>
<pluginRepositories>
<pluginRepository>
<id>public</id>
<name>aliyun nexus</name>
<url>://maven.aliyun.com/repository/public/</url>
<releases>
<enabled>true</enabled>
</releases>
<snapshots>
<enabled>false</enabled>
</snapshots>
</pluginRepository>
</pluginRepositories>
</project>application.yml配置文件
server:
port: 9131
spring:
datasource:
druid:
# url: jdbc:mysql://localhost:3306/warehouse_manager?useUnicode=true&characterEncoding=utf-8&serveTimezone=UTC&useSSL=false&allowPublicKeyRetrieval=true
url: jdbc:mysql://localhost:3306/warehouse_manager?useUnicode=true&characterEncoding=utf-8&zeroDateTimeBehavior=convertToNull&serverTimezone=GMT%2B8&useSSL=false
driver-class-name: com.mysql.cj.jdbc.Driver
username: root
password: 123456
#
Logging:
level:
com.yunhe: debug#增强技术点
Druid首先是一个数据库连接池。Druid是目前最好的数据库连接池，在功能、性能、扩展性方面，都超过其他数据库连接池，包括DBCP、C3P0、BoneCP、Proxool、JBoss DataSource。Druid已经在阿里巴巴部署了超过600个应用，经过一年多生产环境大规模部署的严苛考验。Druid是阿里巴巴开发的号称为监控而生的数据库连接池！
启动类
@SpringBootApplication
@MapperScan("com.yunhe.mapper")
public class WareHouseApp {
public static void main(String[] args) {
SpringApplication.run(WareHouseApp.class);
}
}
MyBatisPlus-复习
- 点赞
- 收藏
- 关注作者
评论（0）