# coffee-boot

**Repository Path**: x_msdn/coffee-boot

## Basic Information

- **Project Name**: coffee-boot
- **Description**: Coffee Admin权限管理系统，基于VUE3.x、SpringBoot2.x、SpringSecurity、MyBatis-Plus等技术实现的前后端分离的权限管理系统。 可用于学习参考和项目开发。
- **Primary Language**: Java
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 56
- **Created**: 2022-06-13
- **Last Updated**: 2022-06-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<div align="center">
<h1>Coffee Admin</h1>
</div>

<p align="center">
    <img src="https://img.shields.io/badge/Spring%20Boot-2.6.4-blue">
    <img src="https://img.shields.io/badge/JDK-1.8+-green.svg">
    <img src="https://img.shields.io/badge/license-Apache%202-blue.svg">
</p>

### 简介

Coffee Admin权限管理系统，基于VUE3.x、SpringBoot2.x、Sa-Token、MyBatis-Plus、Mybatis-Plus Dynamic Datasource等技术实现的前后端分离的权限管理系统。 可用于学习参考和项目开发。

### 特性

- WEB容器使用了undertow，相较于tomcat，并发性更好，性能要好一些。
- Lombok，消除冗长的java代码，更加简化。
- Mybatis Plus，可以简化CRUD开发。
- Mybatis Plus Generator，生成前后端代码，简化开发工作量。
- 使用java新特性，Stream API、lambda表达式等。
- HuTool工具集合，减少项目工具类的编写。
- Sa-Token权限认证框架，细分到页面按钮级别。
- EasyExcel，方便导入导出功能，自定义Convert类，实现了数据字典的转化。
- Guava，非常方便的java工具集，提供了类似Lists.newArrayList()和Sets.newHashSet()等静态方法。
- @DS注解，支持多数据源切换。
- Fastjson，方便了JSON的格式化和解析。
- Alibaba Java Coding Guidelines插件，IDEA插件，提高代码质量。
- MinIO，分布式文件存储。
- 前端框架采用最新技术栈，Vue3 & Vite，打包更快更轻。
- 前端框架采用TypeScript和Eslint，规范代码，提高项目可持续性和可维护性。

### 演示环境

演示地址：[http://skysong.gitee.io/coffee-ui](http://101.42.156.168)

### 预览

<table>
    <tr>
        <td>
            <img src="./doc/images/project/app.png"/>
        </td>
        <td>
            <img src="./doc/images/project/app.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/1.png"/>
        </td>
        <td>
            <img src="./doc/images/project/2.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/3.png"/>
        </td>
        <td>
            <img src="./doc/images/project/4.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/5.png"/>
        </td>
        <td>
            <img src="./doc/images/project/6.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/7.png"/>
        </td>
        <td>
            <img src="./doc/images/project/8.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/9.png"/>
        </td>
        <td>
            <img src="./doc/images/project/10.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/11.png"/>
        </td>
        <td>
            <img src="./doc/images/project/12.png"/>
        </td>
    </tr>
    <tr>
        <td>
            <img src="./doc/images/project/13.png"/>
        </td>
        <td>
            <img src="./doc/images/project/14.png"/>
        </td>
    </tr>
</table>

### 项目地址

- [coffee-ui](https://gitee.com/skysong/coffee-ui) - 前端UI
- [coffee-boot](https://gitee.com/skysong/coffee-boot) - 后端API
- [coffee-cloud](https://gitee.com/skysong/coffee-cloud) - 后端API

### 项目结构

```
coffee-boot
├── coffee-admin -- 内置功能，后台管理
├── coffee-codegen -- 内置功能，代码生成
├── coffee-common --内置功能，通用工具
├── coffee-framework -- 内置功能，核心模块
├── coffee-system -- 内置功能，系统模块
```

### 核心依赖

| 依赖                    | 版本       |
|------------------------|------------|
| Spring Cloud           | 2021.0.1   |
| Spring Cloud Alibaba   | 2021.0.1   |
| Spring Boot            | 2.7.0      |
| Sa Token               | 1.29.0     |
| Mybatis Plus           | 3.5.2      |
| HuTool                 | 5.8.2      |
| Guava                  | 30.1.1-jre |
| EasyExcel              | 3.1.0      |
| Fastjson               | 1.2.83     |
| Minio                  | 8.4.1      |

### 内置功能

```
1、菜单管理
2、字典管理
3、部门管理
4、岗位管理
5、角色管理
6、用户管理
7、参数设置
8、行政区域
9、在线用户
10、操作日志
11、账户设置
```

### 前端安装

```
# 安装依赖
pnpm install

# 运行项目
pnpm serve

# 打包发布
pnpm build

```

### 前端说明

- [vue-vben-admin](https://gitee.com/annsion/vue-vben-admin) - 基于该前端框架开发，不定期同步更新。

### 环境安装

```
1、安装Mysql数据库，安装Redis，安装MinIO文件存储。
2、执行./doc/db/schema.sql，创建数据库。
3、执行./doc/db/coffee.sql，创建数据表和插入基础数据。
```

### Docker常用命令

```
1、查看镜像
docker images

2、查看所有容器
docker ps -a

3、拉取镜像
docker pull redis:latest

4、参数解释
--name，设置运行的镜像名称
-p，映射端口，虚拟机端口:docker端口
-e，设置环境变量
-v，挂载目录/文件，虚拟机目录/文件:docker目录/文件
--privileged=true，设置特权，比如为mysql获取root权限
-d，守护进程后台运行
-it，启动并运行
--restart=always，在docker服务重启后,自动重启mysql服务,也可以把docker服务作为开机启动，这样mysql就可以跟着开机启动了
--link，设置容器别名
```

### Docker安装Redis

```
docker run \
    -itd \
    -p 6379:6379 \
    -v /etc/localtime:/etc/localtime:ro \
    --name redis \
    redis
```

### Docker安装Mysql

```
mkdir -p /data/docker/mysql/data /data/docker/mysql/conf

cd /data/docker/mysql/conf
touch my.cnf
vi /data/docker/mysql/conf/my.cnf

chmod 775 /data/docker/mysql/conf/my.cnf

my.cnf内容如下：
[client]
port=3306
default-character-set=utf8
[mysql]
default-character-set=utf8
[mysqld]
character_set_server=utf8
sql_mode=NO_ENGINE_SUBSTITUTION,STRICT_TRANS_TABLES
lower_case_table_names=1

docker run \
    -itd \
    --name mysql \
    -p 3306:3306 \
    -e MYSQL_ROOT_PASSWORD=123456 \
    -v /data/docker/mysql/conf/my.cnf:/etc/mysql/my.cnf \
    -v /data/docker/mysql/data:/var/lib/mysql \
    -v /data/docker/mysql/logs:/var/log/mysql \
    --privileged=true \
    -v /etc/localtime:/etc/localtime:ro \
    --name mysql \
    mysql:5.7

a）进入容器，docker exec -it containerId /bin/bash
b）进入MySql，mysql -uroot -p123456
c）切换数据库，use mysql
d）修改权限，grant all privileges on *.* to 'root'@'%' identified by '123456' with grant option;
e）刷新权限，flush privileges;
```

### Docker安装MinIO

```
mkdir -p /data/docker/minio/data

chmod -R 775 /data/docker/minio

docker run \
    -itd \
    -p 9000:9000 \
    -p 9001:9001 \
    -v /data/docker/minio/data:/data \
    -v /etc/localtime:/etc/localtime:ro \
    --name=minio \
    quay.io/minio/minio server /data/data-{1...4} \
    --console-address ":9001" --address ":9000"
```

### MinIO文件存储

<table>
    <tr>
        <td>
            <img src="./doc/images/minio/minio1.png"/>
        </td>
        <td>
            <img src="./doc/images/minio/minio2.png"/>
        </td>
    </tr>
</table>

### 部署

```
一、打包命令：指定prod环境，进行打包
    mvn clean package -DskipTests -Pprod
二、启动
    1、Windows环境，运行./doc/bin/run.bat
    2、Linux环境，运行./doc/bin/linux/startup.sh
三、注意事项
    1、Linux执行脚本，需要先授权，chmod +x startup.sh
    2、run.bat或startup.sh，需要和coffee-admin.jar放在同一个目录运行
    3、指定端口，需要修改脚本，并添加server.port参数，示例：--server.port=9090
四、服务器部署目录结构
    /opt
    ├── coffee
    ├──── coffee-ui
    ├──── coffee-boot
    ├────── startup.sh
    ├────── coffee-admin.jar
```

### nginx配置

```
    location / {
        root   /opt/coffee/coffee-ui;
        try_files $uri $uri/ @router;
        index  index.html index.htm;
    }
    
    location @router {
        rewrite ^.*$ /index.html last;
    }
    
    location ^~ /api {
        proxy_pass  http://localhost:2800/api;
		proxy_set_header    Host             $host;
		proxy_set_header    X-Real-IP        $remote_addr;
		proxy_set_header    X-Forwarded-For  $proxy_add_x_forwarded_for;
		proxy_set_header    HTTP_X_FORWARDED_FOR $remote_addr;
    }
```

### 使用帮助

#### 代码同步

1、fork代码，fork from https://gitee.com/skysong/coffee-ui <br/>
2、创建自己的分支，进行开发，feature-dev <br/>
3、码云强制同步 <br/>
<img src="./doc/images/doc/1.png"/>
<br/>
4、合并代码，merge into feature-dev <br/>
<img src="./doc/images/doc/2.png"/>

#### 代码生成

```
    /** 按照个人需要，进行修改 */
    public static final String AUTHOR = "Kevin";
    public static final String PROJECT_PATH = "D:\\tempCode";
    public static final String PACKAGE_PARENT = "com.coffee";
    public static final String MODULE_NAME = "system";

    /** 生成SQL脚本的上级菜单的ID，要开发的功能，需要放到XXX菜单下面，请找到XXX菜单的ID */
    public static final String PARENT_MENU_ID = "1406064334403878913";

    /** admin的ID，可以不用修改 */
    public static final String CREATE_BY = "1";
    public static final String UPDATE_BY = "1";

    /** 默认菜单图标，可以不用修改，SQL脚本生成之后，在页面选择图标，进行修改即可 */
    public static final String ICON = "ant-design:unordered-list-outlined";

    // 是否导出excel
    public static final Boolean exportExcel = false;

    public static void main(String[] args) {
        new CodeGenerator().generate(
                "sys_example"
        );
    }
```

#### Excel导出

```
1、前端代码

    a）Http请求
        return defHttp.request(
            { url: Api.exportList, params: params, method: 'get', responseType: 'blob' },
            { isReturnNativeResponse: true },
        );
        
    b）文件下载
        const res = await exportList(params);
        const blob = res.data;
        const headerFilename = res.headers['content-disposition'].split(';')[1].split('=')[1];
        const filename = decodeURIComponent(escape(headerFilename));
        downloadByData(blob, filename);

2、后端代码

    String filename = "用户列表" + "_" + System.currentTimeMillis() + ".xlsx";
    response.setContentType("application/vnd.ms-excel");
    response.setCharacterEncoding("UTF-8");
    response.setHeader("Content-Disposition", "attachment;filename=" + new String(filename.getBytes(StandardCharsets.UTF_8), StandardCharsets.ISO_8859_1));
    EasyExcel.write(response.getOutputStream())
            .head(SysUserListVO.class)
            .sheet("用户列表")
            .doWrite(sysUserService.list(req));

```

#### EasyExcel使用

```
excel标题宽度
两个字：@ColumnWidth(10)
四个字：@ColumnWidth(15)
```

#### Java规范

[Java开发手册](./doc/java开发手册/阿里巴巴Java开发手册（嵩山版）.pdf)

#### Java编码规范

```
1、大道至简

2、IDEA安装Alibaba Java Coding Guidelines插件，编码规约扫描，代码中不要出现警告
```

#### Java命名规范

| 命名规范          | 描述           |
|---------------|--------------|
| XxDTO         | 请求参数         |
| XxQueryDTO    | 查询参数         |
| XxVO          | 响应实体         |
| XxCloudDTO    | Feign请求参数    |
| XxCloudVO     | Feign响应实体    |
| XxController  | Controller命名 |
| IXxService    | Service接口命名  |
| XxServiceImpl | Service实现类命名 |
| XxMapper      | Mapper层命名    |
| XxEntity      | DB实体命名，和表名相同 |

#### MySQL建表规范

```
1、ID主键，bigint(20)，雪花算法

2、审计字段，create_by、create_time、update_by、update_time

3、表中字段类型，主要采用varchar，万一迁移oracle、sqlserver数据库呢，好兼容
```

#### Vue编码规范

```
1、全局通用组件放在/src/components目录

2、业务组件放在./components目录

3、文件夹，使用camelCase命名格式

4、*.vue文件使用PascalCase命名格式，index.vue除外

5、属于类的*.js文件，使用PascalCase命名格式，index.js除外

6、属于Api的*.js文件，统一加上Api后缀，使用camelCase命名格式

7、其他类型的*.js文件，使用camelCase命名格式

8、样式文件、图片文件等，使用kebab-case命名格式

9、api模块和view模块，一一对应

10、方便记忆规则和项目开发
```

#### CSS编码规范

```
CSS编码规范，BEM：就是块（block）、元素（element）、修饰符（modifier）

.block{}
.block__element{}
.block--modifier{}

.block 代表了更高级别的抽象或组件。
.block__element 代表.block的后代，用于形成一个完整的.block的整体。
.block--modifier代表.block的不同状态或不同版本
```

### QQ群，问题反馈和Bug修复

805450144

### 觉得还不错了，可以赞助打赏一下，兴趣爱好，看点技术，写点代码

<table>
    <tr>
        <td>
            <img src="./doc/images/qrcode/qrcode.jpg" width="200"/>
        </td>
    </tr>
</table>