# quasar-sika-design-admin
**Repository Path**: tangtony/quasar-sika-design-admin
## Basic Information
- **Project Name**: quasar-sika-design-admin
- **Description**: quasar-sika-design-admin是一套企业级中后台管理系统解决方案,Quasar Sika Design Admin 是一个企业级中后台前端 / 设计解决方案,中后台管理模板,我们秉承 Ant Design 的设计价值观,致力于在设计规范和基础组件的基础上,继续向上构建,提炼出典型模板 / 业务组件 / 配套设计资源,进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的
- **Primary Language**: Java
- **License**: MIT
- **Default Branch**: main
- **Homepage**: http://quasar.admin.sikacode.com/
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 38
- **Created**: 2021-12-03
- **Last Updated**: 2021-12-03
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# quasar-sika-design-admin
[English](./README.md) | 简体中文
Quasar Sika Design Admin
An out-of-box UI solution for enterprise applications as a Vue boilerplate. based on
Quasar
[](https://github.com/dq-open-cloud/quasar-sika-design/blob/main/LICENSE)
[](https://github.com/dq-open-cloud/quasar-sika-design/releases)
- 预览: http://quasar.admin.sikacode.com/
- Github
- Gitee
- 交流QQ群:327424532
- 微信公众号:sikacode 开源社区
- 首页: 待完善
- 文档: 待完善
- 更新日志: 待完善
- 常见问题: 待完善
## 项目介绍
- quasar-sika-design-admin是一套企业级中后台管理系统解决方案,Quasar Sika Design Admin 是一个企业级中后台前端 / 设计解决方案,中后台管理模板,我们秉承 Ant Design 的设计价值观,致力于在设计规范和基础组件的基础上,继续向上构建,提炼出典型模板 / 业务组件 / 配套设计资源,进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验
## 项目初衷
起于 Sika Design,不止于 Sika Design,每一个细节都是极致体验
愿景:开源改变世界,Sika Design Admin 让世界没有难写的代码。
## 项目特色
### 前端
- 优雅美观:基于 Ant Design 体系精心设计
- 常见设计模式:开源改变世界,Sika Design 让世界没有难写的代码
- 最新技术栈:使用 Quasar&Vue&echarts 等前端前沿技术开发
- 响应式:针对不同屏幕大小设计
- 主题:可配置的主题满足多样化的品牌诉求
- 最佳实践:良好的工程实践助你持续产出高质量代码
### 后端
- 优雅、简洁、规范而不失个性
- 抽象基础组件
- 约束代码规范
- **特色**的领域驱动设计实践【上下文对象context+executor执行者】
- 完整的代码生成器-新模块基础功能零开发
## 组织结构
```
- quasar-sika-design-admin
- quasar-sika-design // 前端-基于vue+quasar构建
- quasar-sika-design-server // 后端服务-基于springboot+mybatis
- doc // 文档说明
- sql // sql脚本
- quasar-sika-design-server-common // 基础公共模块;包括业务的constant+dto+query以及baseDTO+baseSrvice等等
- quasar-sika-design-server-core // 核心业务模块;包括业务的service,核心领域实现逻辑等等
- quasar-sika-design-server-ataaccess // 数据库访问层
- quasar-sika-design-server-generator // 代码生成器模块【无须开发】
- quasar-sika-design-server-web // controller层
- sika-code-cor // 核心公共组件,包括且不限于缓存组件、代码生成器组件、公共组件、数据访问、分布式锁、脚手架规范
- cache // 缓存组件
- code-generator // 代码生成器组件
- common // 公共组件
- databasse // 数据库访问组件
- hutool-starter // hutool基础集成
- lock // 分布式组件
- standard-footer // 标准脚手架组件
```
## 技术选型
### 后端技术
| 技术 | 官网 | 备注 |
| --- | --- | --- |
| Spring Framework | http://projects.spring.io/spring-framework/ | 容器 |
| spring-boot-dependencies | https://spring.io/projects/spring-boot/ | 不解释 |
| Apache Shiro | http://shiro.apache.org/ | 安全框架 |
| MyBatis | http://www.mybatis.org/mybatis-3/zh/index.html | ORM框架 |
| MyBatisPlus | https://mp.baomidou.com/ | ORM增强框架 |
| Mybatis-plus-boot-starter | https://mp.baomidou.com/ | ORM增强框架 |
| Mybatis-Plus-Generator | https://baomidou.gitee.io/mybatis-plus-doc/#/generate-code/ | ORM增强框架 |
| HikariCP | https://github.com/brettwooldridge/HikariCP/ | 数据库连接池 |
| ShardingSphere | https://shardingsphere.apache.org/ | 分库分表组件 |
| Redis | https://redis.io/ | 分布式缓存数据库 |
| commons-collections | http://commons.apache.org/proper/commons-collections/ | 集合工具组件 |
| Log4J | http://logging.apache.org/log4j/1.2/ | 日志组件 |
| FastJson | https://mvnrepository.com/artifact/com.alibaba/fastjson/ | JSON序列化和反序列化组件 |
| Lombok | https://www.projectlombok.org/ | 简化JAVA代码组件 |
| Hutool | http://hutool.mydoc.io/ | 符合国人习惯的工具组件 |
| MapStruct | http://mapstruct.org/ | 实体转化组件 |
### 前端技术
| 技术 | 官网 | 备注 |
| --- | --- | --- |
| Vue | https://cn.vuejs.org/ | 渐进式JavaScript 框架 |
| Quasar | http://www.quasarchs.com/ | 基于Vue实现的前端UI框架 |
| Echarts | https://echarts.apache.org/zh/index.html/ | 基于 JavaScript 的开源可视化图表库 |
| Lodashi | https://www.lodashjs.com/ | 一致性、模块化、高性能的 JavaScript 实用工具库 |
Overview
----
基于 [Quasar](http://www.quasarchs.com/quasar-cli/installation/#Introduction) 实现的 [Quasar Sika Design_Admin](http://quasar.admin.sikacode.com/)
PC端示例
----
***
***
***
mobile端示例
----
***
服务端代码示例
----
#### Controller 由代码生成器生成
```
package com.quasar.sika.design.server.business.menu.controller;
import java.util.List;
import com.sika.code.result.Result;
import com.sika.code.standard.base.controller.BaseStandardController;
import com.quasar.sika.design.server.business.menu.service.MenuService;
import com.quasar.sika.design.server.business.menu.pojo.dto.MenuDTO;
import com.quasar.sika.design.server.business.menu.pojo.query.MenuQuery;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
/**
*
* 菜单权限表 前端控制器
*
*
* @author daiqi
* @since 2021-01-07 23:35:13
*/
@RestController(value = "menuController")
@RequestMapping("menu")
public class MenuController extends BaseStandardController {
@Autowired
private MenuService menuService;
@RequestMapping(value = "save")
public Result save(@RequestBody MenuDTO menuDto) {
return super.success(menuService.save(menuDto));
}
@RequestMapping(value = "save_batch")
public Result saveBatch(@RequestBody List menuDtos) {
return super.success(menuService.saveForBatch(menuDtos));
}
@RequestMapping(value = "update_by_id")
public Result updateById(@RequestBody MenuDTO menuDto) {
return super.success(menuService.updateById(menuDto));
}
@RequestMapping(value = "page")
public Result page(@RequestBody MenuQuery menuQuery) {
return super.success(menuService.page(menuQuery));
}
@RequestMapping(value = "find")
public Result find(@RequestBody MenuQuery menuQuery) {
return super.success(menuService.find(menuQuery));
}
@RequestMapping(value = "list")
public Result list(@RequestBody MenuQuery menuQuery) {
return super.success(menuService.list(menuQuery));
}
}
```
#### Service 由代码生成器生成
```
package com.quasar.sika.design.server.business.menu.service;
import com.quasar.sika.design.server.business.menu.pojo.dto.MenuDTO;
import com.sika.code.standard.base.service.BaseStandardService;
import java.util.List;
/**
*
* 菜单权限表 服务类
*
*
* @author daiqi
* @since 2021-01-07 23:35:09
*/
public interface MenuService extends BaseStandardService {
}
```
#### ServiceImpl 由代码生成器生成
```
package com.quasar.sika.design.server.business.menu.service.impl;
import cn.hutool.core.collection.CollUtil;
import com.google.common.collect.Lists;
import com.quasar.sika.design.server.business.menu.convert.MenuConvert;
import com.quasar.sika.design.server.business.menu.entity.MenuEntity;
import com.quasar.sika.design.server.business.menu.mapper.MenuMapper;
import com.quasar.sika.design.server.business.menu.pojo.dto.MenuDTO;
import com.quasar.sika.design.server.business.menu.pojo.query.MenuQuery;
import com.quasar.sika.design.server.business.menu.service.MenuService;
import com.quasar.sika.design.server.business.rolemenu.service.RoleMenuService;
import com.sika.code.standard.base.convert.BaseConvert;
import com.sika.code.standard.base.service.impl.BaseStandardServiceImpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
import java.util.Set;
/**
*
* 菜单权限表 服务实现类
*
*
* @author daiqi
* @since 2021-01-07 23:35:10
*/
@Service(value = "menuService")
public class MenuServiceImpl extends BaseStandardServiceImpl implements MenuService {
@Autowired
private MenuMapper menuMapper;
@Override
protected BaseConvert convert() {
return MenuConvert.INSTANCE;
}
}
```
#### Mapper 由代码生成器生成
```
package com.quasar.sika.design.server.business.menu.mapper;
import com.quasar.sika.design.server.business.menu.entity.MenuEntity;
import org.springframework.stereotype.Repository;
import com.sika.code.standard.base.basemapper.BaseStandardMapper;
/**
*
* 菜单权限表 Mapper 接口
*
*
* @author daiqi
* @since 2021-01-07 23:35:08
*/
@Repository
public interface MenuMapper extends BaseStandardMapper {
}
```
#### Xml 由代码生成器生成
```
id, create_by, update_by, create_date, update_date, version, available, is_deleted, remark, menu_name, parent_id, order_num, url, target, menu_type, visible, perms, icon
AND id = #{query.id}
AND id = #{query.menuId}
AND menu_name = #{query.menuName}
AND parent_id = #{query.parentId}
AND order_num = #{query.orderNum}
AND url = #{query.url}
AND target = #{query.target}
AND menu_type = #{query.menuType}
AND visible = #{query.visible}
AND perms = #{query.perms}
AND icon = #{query.icon}
AND id in
#{item}
ORDER BY
id
id
DESC
ASC
```
#### Context【领域上下文对象】
```
package com.quasar.sika.design.server.common.auth.context;
import com.quasar.sika.design.server.common.auth.executor.AuthRegisterRequestExecutor;
import com.quasar.sika.design.server.common.auth.pojo.request.AuthRegisterRequest;
import com.quasar.sika.design.server.common.captcha.pojo.request.CaptchaCheckRequest;
import com.quasar.sika.design.server.common.mail.context.CheckMailCodeContext;
import com.quasar.sika.design.server.common.mail.pojo.request.CheckMailRequest;
import com.quasar.sika.design.server.common.shiro.util.SHA256Util;
import com.sika.code.standard.base.pojo.context.BaseStandardContext;
import com.sika.code.standard.base.pojo.executor.BaseStandardExecutor;
import lombok.Data;
import lombok.experimental.Accessors;
/**
* @author daiqi
* @create 2021-01-09 18:02
*/
@Data
@Accessors(chain = true)
public class AuthRegisterContext extends BaseStandardContext {
private AuthRegisterRequest registerRequest;
private CheckMailRequest checkMailRequest;
protected CaptchaCheckRequest captchaCheckRequest;
private CheckMailCodeContext checkMailCodeContext;
private Boolean bindOauthUser;
@Override
public void initCustomer() {
checkMailCodeContext = new CheckMailCodeContext().setRequest(checkMailRequest);
registerRequest.setPassword(SHA256Util.sha256(registerRequest));
}
@Override
protected Class extends BaseStandardExecutor> buildExecutorClass() {
return AuthRegisterRequestExecutor.class;
}
}
```
#### Executor领域执行者对象【按领域划分】
```
package com.quasar.sika.design.server.common.auth.executor;
import cn.hutool.core.util.BooleanUtil;
import com.quasar.sika.design.server.common.auth.context.AuthRegisterContext;
import com.quasar.sika.design.server.common.auth.domain.AuthDomain;
import com.quasar.sika.design.server.common.auth.pojo.request.AuthLoginRequest;
import com.quasar.sika.design.server.common.auth.pojo.request.AuthRegisterRequest;
import com.quasar.sika.design.server.common.auth.pojo.response.AuthResponse;
import com.sika.code.basic.pojo.dto.ServiceResult;
import com.sika.code.exception.BusinessException;
import com.sika.code.standard.base.pojo.executor.BaseStandardExecutor;
import lombok.Data;
import lombok.experimental.Accessors;
/**
* @author daiqi
* @create 2021-01-09 18:02
*/
@Data
@Accessors(chain = true)
public class AuthRegisterRequestExecutor extends BaseStandardExecutor implements AuthDomain {
@Override
protected void executeBefore() {
verify();
}
protected void verify() {
// 图片验证码校验
captchaService().checkCaptchaVerifyCode(context.getCaptchaCheckRequest());
// 邮箱验证码校验
executorManager().execute(context.getCheckMailCodeContext());
// 校验用户名
AuthRegisterRequest registerRequest = context.getRegisterRequest();
authService().checkRegisterUsername(registerRequest);
// 校验邮箱
authService().checkRegisterEmail(registerRequest);
// 校验手机号
authService().checkRegisterPhone(registerRequest);
}
@Override
protected ServiceResult doExecute() {
AuthRegisterRequest registerRequest = context.getRegisterRequest();
boolean saveSuccess = userService().save(registerRequest);
if (BooleanUtil.isFalse(saveSuccess)) {
throw new BusinessException("保存失败,请校验注册参数");
}
return ServiceResult.newInstanceOfSucResult(AuthResponse.success(registerRequest));
}
@Override
protected void executeAfter() {
// 自动登录
AuthRegisterRequest registerRequest = context.getRegisterRequest();
AuthLoginRequest request = new AuthLoginRequest(registerRequest.getUsername(), registerRequest.getPassword());
request.setEncryptedPassword(true);
if (BooleanUtil.isTrue(context.getBindOauthUser())) {
authService().bindOauthUser(request);
} else {
authService().login(request);
}
// 移除缓存
captchaService().removeCaptchaVerifyCode(context.getCaptchaCheckRequest());
mailService().removeMailCode(context.getCheckMailRequest());
}
}
```
前端环境和依赖
----
- node
- yarn
- webpack
- eslint
- @vue/cli ~3
- [Quasar](https://github.com/quasarframework/quasar) - Quasar Of Vue 实现
> 请注意,我们强烈建议本项目使用 [Yarn](https://yarnpkg.com/) 包管理工具,这样可以与本项目演示站所加载完全相同的依赖版本 (yarn.lock) 。由于我们没有对依赖进行强制的版本控制,采用非 yarn 包管理进行引入时,可能由于 Pro 所依赖的库已经升级版本而引入了新版本所导致的问题。作者可能会由于时间问题无法及时排查而导致您采用本项目作为基项目而出现问题。
项目下载和运行
----
- 拉取项目代码
```bash
git clone https://github.com/dq-open-cloud/quasar-sika-design.git
cd quasar-sika-design
```
- 安装依赖
```
yarn install
```
- 开发模式运行
```
quasar dev
```
- 编译项目
```
quasar build
```
- Lints and fixes files
```
yarn run lint
```
文档待完善
启动步骤
- 找到QuasarSikaDesignServerApplication直接运行
- 前端quasar-dev启动运行即可
其他说明
----
- **关于 Issue 反馈 (重要!重要!重要!) 请在开 *Issue* 前,先阅读该内容:[Issue / PR 编写建议](https://github.com/vueComponent/ant-design-vue-pro/issues/90)**
- 项目使用的 [quasar-cli](http://www.quasarchs.com/quasar-cli/installation/#Introduction), 请确保你所使用的 quasar-cli 是新版,并且已经学习 cli 官方文档使用教程
- 关闭 Eslint (不推荐) 移除 `package.json` 中 `eslintConfig` 整个节点代码, `vue.config.js` 下的 `lintOnSave` 值改为 `false`
- **用于生产环境,请使用 `release` 版本代码,使用 master 代码出现的任何问题需要你自行解决**
- **后端提供的`Mysql`和`Redis`环境属于线上测试环境,内测阶段请大家一定不要随意增删字段**
## 浏览器兼容
- Chrome for Android >= 87
- Firefox for Android >= 83
- Android >= 81
- Chrome >= 77
- Edge >= 84
- Firefox >= 74
- iOS >= 10.3
- Opera >= 68
- Safari >= 11
| [
](http://godban.github.io/browsers-support-badges/)IE / Edge | [
](http://godban.github.io/browsers-support-badges/)Firefox | [
](http://godban.github.io/browsers-support-badges/)Chrome | [
](http://godban.github.io/browsers-support-badges/)Safari | [
](http://godban.github.io/browsers-support-badges/)Opera |
| --- | --- | --- | --- | --- |
| IE10, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
## Contributors
This project exists thanks to all the people who contribute.
### Customize the configuration
See [Configuring quasar.conf.js](https://quasar.dev/quasar-cli/quasar-conf-js).