百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术分析 > 正文

管理系统模板开发详细教程

liebian365 2024-11-22 17:15 4 浏览 0 评论

序言

继上一篇 一套管理系统基础模版

详细梳理一下安装流程,功能说明,开发规范等。

  • 后端项目结构?
  • 如何从零搭建环境开发?
  • 如何打包部署?
  • 接入开发及规范
  • 项目地址
  • 小结

后端项目结构

? shop-server 依赖以下项目

https://github.com/cuteJ/ot-server-parent (统一版本插件管理)

https://github.com/cuteJ/ot-server-commons (公共基础类)

https://github.com/cuteJ/ot-boot-starter (自定义Spring boot starter)

https://github.com/cuteJ/ot-mybatis-generator (定制生成器)

所依赖的项目安装包位置:https://maven.pkg.github.com/cuteJ/ot-server-parent

依赖继承关系如下:


如何从零搭建环境开发

此小节为零基础搭建,经验开发人员可直接跳过!!!

安装环境

  • JDK1.8
  • https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html
  • Maven
  • https://downloads.apache.org/maven/maven-3/3.6.3/binaries/apache-maven-3.6.3-bin.zip
  • Git
  • https://git-scm.com/downloads
  • Intellij idea
  • https://www.jetbrains.com/idea/download/
  • Mysql
  • https://downloads.mysql.com/archives/community/
  • NodeJs
  • https://nodejs.org/en/download/

git jdk maven 配置

Git 配置

git config --global user.name <your name>
git config --global user.email <your_email@example.com>

Git建议配置

windows

git config --global core.autocrlf true

macos

git config --global core.autocrlf input

不必每次输入密码

git config credential.helper store


Jdk配置

# 执行以下命令,显示版本信息,安装完毕。

?  ~ java -version
java version "1.8.0_151"
Java(TM) SE Runtime Environment (build 1.8.0_151-b12)
Java HotSpot(TM) 64-Bit Server VM (build 25.151-b12, mixed mode)

#如果提示找不到对应命令添加

?  ~ vim .bash_profile
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk版本/Contents/Home
export PATH=$PATH:$M2_HOME/bin

Maven配置


?  ~ vim .bash_profile
export M2_HOME=/Users/lixingping/soft/apache-maven-3.5.2
export PATH=$PATH:$M2_HOME/bin

?  ~ source .bash_profile
?  ~ mvn -v
Apache Maven 3.5.2 (138edd61fd100ec658bfa2d307c43b76940a5d7d; 2017-10-18T15:58:13+08:00)

~/.m2 目录下添加settings.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<settings xmlns="http://maven.apache.org/SETTINGS/1.0.0"
          xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
          xsi:schemaLocation="http://maven.apache.org/SETTINGS/1.0.0 http://maven.apache.org/xsd/settings-1.0.0.xsd">
  <servers>
    <server>
      <id>github</id>
      <username>cuteJ</username>
      <password>30b172901cad280e75dd5aa519fa02ab1040d3db</password>
    </server>
  </servers>
  <mirrors>
    <mirror>
      <id>nexus</id>
      <mirrorOf>central</mirrorOf>
      <url>http://maven.aliyun.com/nexus/content/groups/public/</url>
    </mirror>
  </mirrors>
  <profiles>

    <profile>
      <id>github</id>
      <repositories>
        <repository>
          <id>github</id>
          <name>GitHub OWNER Apache Maven Packages</name>
          <url>https://maven.pkg.github.com/cuteJ/ot-server-parent</url>
          <releases>
            <enabled>true</enabled>
          </releases>
          <snapshots>
            <enabled>true</enabled>
          </snapshots>
        </repository>
      </repositories>
    </profile>
  </profiles>

  <activeProfiles>
    <activeProfile>github</activeProfile>
  </activeProfiles>
</settings>


运行项目

  1. 下载项目
git clone https://github.com/cuteJ/shop-server.git
  1. 初始化数据库
shop-server/install/sql
								---- db.sql // 创建数据库和用户
								---- data.sql // 项目表结构和初始化数据

3. 安装maven依赖启动

maven.pkg.github.com下载有点慢,请有心理准备

4. 安装启动前端

git clone https://github.com/cuteJ/shop-web-mgt.git
cd shop-web-mgt
npm install --registry=https://registry.npm.taobao.org
npm run dev

如何打包部署

  1. 打包 shop-server
cd shop-server
mvn clean package
// 将jar拷贝到服务器/data/cuteJ/server
shop-server/shop-server-mgt/shop-server-mgt.jar
  1. 添加启动脚本(shop-server/install/shell/execute.sh)

脚本环境变量说明

  • MYSQL_URL:127.0.0.1:3306 数据库地址
  • MYSQL_USER:cuteJ_shop 数据库用户名
  • MYSQL_PASSWORD:cuteJ_shop123 数据库密码
  • SERVER_PORT:8300 应用启动端口
  • SERVER_CONTEXT_PATH:/shop 应用上下文
  • SERVER_SESSION_TIMEOUT:1800 管理后台Session超时时间(单位秒)
  • SERVER_ERROR_MODE:always 服务异常响应形式:always: 返回全部的堆栈信息(一般在debug,开发测试环境使用)never:返回友好提示
  • APP_CORS_ORIGIN: http://localhost:9527 跨域配置,也可以在nginx 配置
  • JWT_HEADER:Authorization Jwt C端API 认证配置
  • JWT_EXPIRATION token失效时间(单位秒)
#!/bin/bash -

#export MYSQL_URL=127.0.0.1:3306
#export MYSQL_USER=cuteJ_shop
#export MYSQL_PASSWORD=cuteJ_shop123
#export SERVER_PORT=8300
#export SERVER_CONTEXT_PATH=/shop
#export SERVER_SESSION_TIMEOUT=1800
#export SERVER_ERROR_MODE=always
#export APP_CORS_ORIGIN: http://localhost:9527
#export JWT_HEADER=Authorization
#export JWT_SECRET=abkfdsfooi0934
#export JWT_EXPIRATION=86400
# oss optional(aliyun|huawei)
#export APP_OSS_KEY=xxx
#export APP_OSS_SECRET=xxx
#export APP_OSS_ENDPOINT=xxx
#export APP_OSS_URL=xxx
#export APP_OSS_BUCKET=xxx

MS_HOME=/data/cuteJ/server
MS_JAR=shop-server-mgt.jar #
APP_NAME=shop-server-mgt #
JAVA_OPTS="-Dspring.profiles.active=prod -Xms1g -Xmx4g -XX:MaxMetaspaceSize=256m -XX:+UseG1GC";

MS_PID=`ps fax|grep java|grep "${MS_JAR}"|awk '{print $1}'`
export MS_PID;

# Function: start
start() {
  pid=${MS_PID}
  if [ -n "${pid}" ]; then {
    echo "${APP_NAME} Service is already running (pid: ${pid})";
  }
  else {
    # Start screener ms
    echo "Starting ${APP_NAME} service";
    cd ${MS_HOME}
    nohup java ${JAVA_OPTS} -jar ./${MS_JAR} > /dev/null 2>&1 &
  } fi;
  # return 0;
}

# Function: stop
stop() {
  pid=${MS_PID}
  if [ -n "${pid}" ]; then {
    echo -ne "Stopping service module";
    kill -15 ${pid}
    sleep 5
    pid=`ps fax|grep java|grep "${MS_JAR}"|awk '{print $1}'`
    if [ ${pid} ]; then {
      echo 'Kill Process!'
      kill -9 ${pid}
    }
    else {
      echo "${APP_NAME} stop success."
    } fi;
  }
  else {
      echo "${APP_NAME} service is not running";
  } fi;

  #return 0;
}

# Main Code

case $1 in
  start)
    start;
    ;;
  stop)
    stop;
    ;;
  restart)
    stop;
    sleep 1;
    start;
    ;;
  status)
    pid=${MS_PID}
    if [ "${pid}" ]; then {
      echo "${APP_NAME} service is running with pid: ${pid}";
    }
    else {
      echo "${APP_NAME} service is not running";
    } fi;
    ;;
esac

exit 0;
  1. 执行脚本
sh execute.sh start // 启动应用
sh execute.sh stop // 停止应用
sh execute.sh status // 查看应用状态
  1. 安装 nginx http://nginx.org
//配置
server {
    listen              80;
    server_name         www.xxxx.com;

    proxy_set_header Host $host;
    proxy_set_header x-auth-token $http_x_auth_token;
    proxy_set_header X-Forwarded-For $remote_addr;
    proxy_set_header Authorization $http_authorization;
    proxy_pass_header  Authorization;

     location / {
         // shop-web-mgt 打包后 dist文件
         root   /www/shop-web-mgt;                                                                                                                                                                                                                                                                                                      add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
         index  index.html index.htm;
     }

     location /shop/ {
       proxy_set_header             Host $host;
       proxy_set_header             Cookie $http_cookie;
       proxy_set_header             Referer $http_referer;
       proxy_set_header             X-Real-IP $remote_addr;
       proxy_set_header             X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_pass_header            Server;
       proxy_http_version 1.1;
       proxy_set_header Connection "";
       proxy_pass              http://127.0.0.1:8300/shop/;
       #expires                 0;
  }
}
  1. 打包前端 shop-web-mgt
// 配置接口地址
shop-web-mgt/config/prod.env.js
npm run build:prod
// 拷贝 dist 目录下的文件到nginx下面

接入开发及规范

后端

基础数据初始化

目录 shop-server-mgt/main/src/java/com.onlythinking.shop.init

  • DicsInitializer (常量初始化)
  • ApisInitializer (常量初始化)
  • MenusInitializer (菜单初始化)
  • AdminInitializer (管理员初始化)
  • GrantInitializer (管理员授权)
  • DBMetaInitializer (数据库表结构数据)

执行初始化

mvn -Pdev spring-boot:run
curl http://127.0.0.1:8300/shop/api/insecure/re_init

Mybatis 生成实体Mapper

目录 shop-server-api

https://github.com/cuteJ/ot-mybatis-generator (可根据自身项目情况定制生成器)



mvn -Pgenerator clean install


API文档的生成

定制化内容可在以下目录

shop-server-mgt/src/docs/asciidoc 添加adoc文件

mvn -PapiDcos clean install




响应异常处理

// 项目统一响应式异常为
com.onlythinking.commons.exception.RespondedException

// errorCode用法:如Token失效,接口校验约束异常等。
public static final int TOKEN_EXPIRED = 40000;                     // Token 过期。

private final int errorCode;
private String errorMsg;
private Object[] msgArgs;

国际化处理

原则上除代码注释外项目里面不应该有中文

国际化文件目录:shop-server-mgt/src/main/resources/i18n

// 读取国际化信息    
private final MessageSource messageSource;
String message = messageSource.getMessage("mgt.entity.null", null)
// 响应式异常提示国际化处理
if (StringUtils.isBlank(msg)) {
   throw RespondedException.argumentInvalid("{mgt.entity.null}");
}
// 携带参数响应式异常提示国际化处理
if (StringUtils.isBlank(msg)) {
   throw RespondedException.argumentInvalid("{mgt.entity.null}", 10);
}

接口URL规范

因为‘shop-server-app’和'shop-server-mgt'合并为一个应用启动,为了方便权限控制添加了/app前缀作为区分| 根据情况也可以拆分为两个应用)

/{content-path}/api/app/ //(h5,小程序请求接口)

/{content-path}/api/ //(管理后台接口)

com.onlythinking.commons.config.annotation.@ApiRest //说明

@Slf4j
@RequiredArgsConstructor(onConstructor = @__(@Autowired))
@Api(tags = "用户登录")
@ApiRest(serviceId = "app", value = "/auth/{appNo}/{maType}")
public class MaAuthController {

// controller 的拼接路径为
/${content-path}/api/${serviceId}/${value}

权限的处理

// H5,小程序请求接口采用jwt 具体查看:

shop-server-app

com.onlythinking.shop.app.core.security.JwtAuthorizationTokenFilter

shop-server-mgt 管理端采用Shiro框架

// RequiresPermissions value 规则 (module:domain:action)
@ApiOperation("系统角色添加")
@RequiresPermissions(value = "sys:role:save")
@PostMapping(value = "/role/save")
public RespondedBody sysRoleSave(@RequestBody OtSysRole dto) {
	infraSystemService.saveOrUpdateSysRole(dto);
  return RespondedBody.successful();
}

定时任务的开发

com.onlythinking.shop.mgt.system.jobs 创建任务

package com.onlythinking.shop.mgt.system.jobs;
/**
 * <p> The describe </p>
 *
 * @author Li Xingping
 */
@Slf4j
@DisallowConcurrentExecution
public class HelloWordJob implements Job {

    @Override
    public void execute(JobExecutionContext context) {
        String instanceId = context.getMergedJobDataMap().getString("instanceId");
        log.info("Job [{}] running ", instanceId);
        log.info("Hello world");

        if (new Random().nextInt(20) % 2 == 0) {
            throw RespondedException.argumentInvalid("执行任务参数错误");
        }
    }
}



前端

目录结构

src -- 源码目录
├── api -- API
├── assets -- 图片资源文件
├── components -- 通用组件
├── directive -- vue指令
├── filters -- 过滤器
├── lang -- 国际化配置
├── icons -- svg文件
├── router -- 路由配置
├── store -- vuex状态管理
├── styles -- 全局css样式
├── utils -- 工具类
└── views -- 页面组件
    ├── app -- 应用管理(小程序)
    ├── dashboard -- 首页
    ├── errorPage -- 错误页面
    ├── layout -- 布局页面
    ├── login -- 登录页
    ├── profile -- 个人配置
    ├── svg-icons -- 图标
    ├── system -- 系统管理
        ├── components -- 页面级别组件
        ├── sysApiListManager -- 接口列表
        ├── sysAuthorityManager -- 接口权限
        ├── sysDicManager -- 常量管理
        ├── sysJobManager -- 定时任务
        ├── sysJobRunLogManager -- 定时任务日志
        ├── sysMenuManager -- 菜单管理
        ├── sysMetadataManager -- 数据字典
        ├── sysOptLogManager -- 操作日志
        ├── sysRegionManager -- 地区管理
        ├── sysRoleManager -- 角色管理
        ├── sysUserManager -- 系统用户管理
    ├── user -- C端用户管理
        ├── userLoginManager -- C端用户列表

常量值的处理

常量值比如:性别,状态为了适配国际化和特殊字符处理制定一套映射表。


<template>         
<!--组件使用-->
 <sys-code
  v-if="cacheData.codes"
  :cache-options="cacheData['codes']"
   :type-code="'1000'"
   :selected.sync="ok"
 />
 <!--过滤器使用-->
 <span v-if="cacheData.statusMap">{{ scope.row.status | statusFilter(cacheData.statusMap['1000'])}}</span>

</template>
	import SysCode from '@/components/SysCode'
  import {cacheData} from '@/utils/cache'
  export default {
    name: 'demo',
    components: {
      SysCode
    },
    data() {
      return {
        cacheData: {},
      }
    },
    mounted() {
      cacheData(this.cacheData, '1000').then(() => {
      })
    }
  }

项目地址

如有需要使用其它语言实现后端,可以参考下面API文档实现对应接口即可。

Swagger

在线文档 https://cutej.github.io/shop-server/index.html

项目地址

https://github.com/cuteJ/shop-server 后端

https://github.com/cuteJ/shop-web-mgt 前端

演示地址:

因为项目托管在github上面且第一次加载文件较多,所有打开会比较慢

http://shop-web-mgt.onlythinking.com

小结

? 项目刚起步,由于个人能力精力有限,项目里的纰漏和不足欢迎大家指出和交流。开源不易,有了大家的支持和鼓励才能更好的走下去。

相关推荐

快递查询教程,批量查询物流,一键管理快递

作为商家,每天需要查询许许多多的快递单号,面对不同的快递公司,有没有简单一点的物流查询方法呢?小编的回答当然是有的,下面随小编一起来试试这个新技巧。需要哪些工具?安装一个快递批量查询高手快递单号怎么快...

一键自动查询所有快递的物流信息 支持圆通、韵达等多家快递

对于各位商家来说拥有一个好的快递软件,能够有效的提高自己的工作效率,在管理快递单号的时候都需要对单号进行表格整理,那怎么样能够快速的查询所有单号信息,并自动生成表格呢?1、其实方法很简单,我们不需要一...

快递查询单号查询,怎么查物流到哪了

输入单号怎么查快递到哪里去了呢?今天小编给大家分享一个新的技巧,它支持多家快递,一次能查询多个单号物流,还可对查询到的物流进行分析、筛选以及导出,下面一起来试试。需要哪些工具?安装一个快递批量查询高手...

3分钟查询物流,教你一键批量查询全部物流信息

很多朋友在问,如何在短时间内把单号的物流信息查询出来,查询完成后筛选已签收件、筛选未签收件,今天小编就分享一款物流查询神器,感兴趣的朋友接着往下看。第一步,运行【快递批量查询高手】在主界面中点击【添...

快递单号查询,一次性查询全部物流信息

现在各种快递的查询方式,各有各的好,各有各的劣,总的来说,还是有比较方便的。今天小编就给大家分享一个新的技巧,支持多家快递,一次能查询多个单号的物流,还能对查询到的物流进行分析、筛选以及导出,下面一起...

快递查询工具,批量查询多个快递快递单号的物流状态、签收时间

最近有朋友在问,怎么快速查询单号的物流信息呢?除了官网,还有没有更简单的方法呢?小编的回答当然是有的,下面一起来看看。需要哪些工具?安装一个快递批量查询高手多个京东的快递单号怎么快速查询?进入快递批量...

快递查询软件,自动识别查询快递单号查询方法

当你拥有多个快递单号的时候,该如何快速查询物流信息?比如单号没有快递公司时,又该如何自动识别再去查询呢?不知道如何操作的宝贝们,下面随小编一起来试试。需要哪些工具?安装一个快递批量查询高手快递单号若干...

教你怎样查询快递查询单号并保存物流信息

商家发货,快递揽收后,一般会直接手动复制到官网上一个个查询物流,那么久而久之,就会觉得查询变得特别繁琐,今天小编给大家分享一个新的技巧,下面一起来试试。教程之前,我们来预览一下用快递批量查询高手...

简单几步骤查询所有快递物流信息

在高峰期订单量大的时候,可能需要一双手当十双手去查询快递物流,但是由于逐一去查询,效率极低,追踪困难。那么今天小编给大家分享一个新的技巧,一次能查询多个快递单号的物流,下面一起来学习一下,希望能给大家...

物流单号查询,如何查询快递信息,按最后更新时间搜索需要的单号

最近有很多朋友在问,如何通过快递单号查询物流信息,并按最后更新时间搜索出需要的单号呢?下面随小编一起来试试吧。需要哪些工具?安装一个快递批量查询高手快递单号若干怎么快速查询?运行【快递批量查询高手】...

连续保存新单号功能解析,导入单号查询并自动识别批量查快递信息

快递查询已经成为我们日常生活中不可或缺的一部分。然而,面对海量的快递单号,如何高效、准确地查询每一个快递的物流信息,成为了许多人头疼的问题。幸运的是,随着科技的进步,一款名为“快递批量查询高手”的软件...

快递查询教程,快递单号查询,筛选更新量为1的单号

最近有很多朋友在问,怎么快速查询快递单号的物流,并筛选出更新量为1的单号呢?今天小编给大家分享一个新方法,一起来试试吧。需要哪些工具?安装一个快递批量查询高手多个快递单号怎么快速查询?运行【快递批量查...

掌握批量查询快递动态的技巧,一键查找无信息记录的两种方法解析

在快节奏的商业环境中,高效的物流查询是确保业务顺畅运行的关键。作为快递查询达人,我深知时间的宝贵,因此,今天我将向大家介绍一款强大的工具——快递批量查询高手软件。这款软件能够帮助你批量查询快递动态,一...

从复杂到简单的单号查询,一键清除单号中的符号并批量查快递信息

在繁忙的商务与日常生活中,快递查询已成为不可或缺的一环。然而,面对海量的单号,逐一查询不仅耗时费力,还容易出错。现在,有了快递批量查询高手软件,一切变得简单明了。只需一键,即可搞定单号查询,一键处理单...

物流单号查询,在哪里查询快递

如果在快递单号多的情况,你还在一个个复制粘贴到官网上手动查询,是一件非常麻烦的事情。于是乎今天小编给大家分享一个新的技巧,下面一起来试试。需要哪些工具?安装一个快递批量查询高手快递单号怎么快速查询?...

取消回复欢迎 发表评论: