框架介绍


JSite 基于 Maven 构建,以 spring boot2.2.2 为主框架的 J2EE 企业级快速开发平台。框架采用多模块结构,低耦合性,层次结构清晰。可用于所有Web应用,如企业后台管理系统、OA系统、CMS、CRM等。

架构优势


基于主流技术构建
Spring Boot + MyBatis + Apache Shiro + Redis + Flowable + Beetl ,架构优良,系统健壮、稳定安全。

模块化、低耦合
框架以模块化、低耦合的设计思路实现,层次结构清晰。可随业务需求动态拆卸、启用模块,灵活配置。

完善的通用基础模块
具备完善的 待办任务、系统管理、Flowable流程管理、文件管理、代码生成模块,开发者只需要关注实际业务需求,快速上手。

集成Flowable工作流
集成了主流工作流引擎 Flowable ,内置流程设计器。封装了从流程设计、建模 到 部署、运行、发起相关功能,可以快速开始OA流程二次开发。

New!! 流程表单设计器
新版本增加流程表单设计器,在线设计表单,绑定流程,一键启动运行。

封装技术细节
框架装了底层技术细节(自定义常用 HTML 标签,形成自己的标签库 · form 表单数据自动绑定等等),降低了技术难度。

基础代码一键生成
支持业务功能前后端基础代码一键自动生成,开发加速20%以上。

如果你喜欢这个项目快去 【Star】&【Fork】 ,谢谢支持!

技术选型


环境要求

  1. JDK 8
  2. Tomcat 8
  3. Apache Maven 3.x

基础框架

  1. Spring Boot 2.2.2
  2. Apache Shiro 1.4.2
  3. Spring Framework 5.2.2.RELEASE
  4. Jackson 2.10.1
  5. Flowable 6.4.0 (工作流引擎)
  6. Redis 3.2.0

持久层

  1. Alibaba Druid 1.1.21
  2. Apache MyBatis 3.5.3
  3. Hibernate Validation 6.0

视图层

  1. Beetl 3.0.15.RELEASE
  2. UI框架:AdminLTE 3

其他前端组件库

  • jquery 3
  • jquery-zTree 3.5
  • jquery-toastr
  • layer 3.1
  • wdScrollTab
  • webuploader
  • select2.4.0
  • cropper3.1.3

内置功能

本节将对系统内置功能模块进行介绍,主要包括系统管理、在线办公、流程管理、文件管理、代码生成五大主模块及下属子模块。


系统管理

机构管理

机构管理指公司及下属组织、部门的结构管理,与区域管理组合使用。支持多层级、多区域配置。与角色权限配合实现跨部门、跨区域数据权限控制。
image

区域管理

区域管理是系统内维护的一套地理区域信息,表现形式为树结构信息:国家->省、自治区、直辖市->下级区域信息。系统内与机构管理配合使用,其他用户模块也可以直接使用。
image

用户管理

用户管理是系统内所有登录用户的账号信息管理。主要包括:用户信息增删查改,角色分配、账户启用、禁用等功能。

目前系统中用户类型分为:普通用户、部门经理、人力资源。

新增用户默认不需要设置密码,系统默认密码123456
image

菜单管理

菜单管理是系统菜单增删查改、显示隐藏、页面链接及权限配置的模块。

菜单权限标识配置指编辑或新增菜单页面的权限标识字段,系统登录后会将用户角色下的所有菜单权限标识注入到Shiro权限框架,以用来控制用户权限。
image

角色管理

角色管理 是用来维护系统用户的页面菜单、按钮权限 和 数据权限的模块。不同角色相当于不同的权限分组,用户具有某个角色便拥有了该角色下分配的所有菜单权限、操作权限、数据权限。

image

日志管理

日志管理 即登录系统的所有用户访问页面日志记录、查询信息管理。


在线办公

目前主要是配合工作流模块使用,主要包括以下功能:

待办任务

工作流节点处理人是当前登录用户的话,当流程流转到该节点时,会在待办任务中出现记录,可以进行流程图查看,任务签收、处理等操作,任务被处理之后从待办任务列表界面消失,进入已办任务列表。

已办任务

登录用户在 “待办任务” 中处理过的任务,会自动归档到已办任务列表,在已办任务中可以查看任务当前流转情况,任务详情、流程图等。

已发任务

由当前登录用户发起的流程都会在已发任务列表界面有记录,该界面实现用户发起过的流程查询、流程图查看、流程详情查看等功能。

发起流程

系统中由管理员部署的各种业务流程,都会在“发起流程”页面显示,登录用户可以选择其中的某个业务流程发起任务。


流程管理

该模块一般由管理员负责管理维护,主要用于业务流程的在线设计、部署,运行中流程的查看、挂起、激活等操作。

运行中的流程

当前系统中,由用户发起的正在运行流转的流程任务列表。管理员可以执行删除操作,级联删除,流程相关的所有内容均会被删除。

部署流程

外部流程文件部署入口。用户可以使用别的流程设计工具,设计生成符合bpmn格式的文件(可以是zip、bar、bpmn、bpmn20.xml格式),然后使用该功能将流程文件部署到系统中。

流程管理

已部署的流程都会在流程管理界面显示,管理员可以在该页面进行已部署流程的流程文件、流程图查看,还可以进行流程的挂起、激活、删除等操作。

模型管理

实现流程模型相关功能。Flowable流程设计器入口界面,主要实现:新、旧流程的在线设计、编辑、保存、部署、下载、删除、查询等功能。


文件管理

文件夹管理

主要实现 “文件目录” 的增、删、查、改、移动的功能维护,数据库表是sys_file_tree,树形结构,可以自由修改某个目录的归属节点,目录结构修改之后,文件夹下的文件路径也会相应同步关联到新目录下。

文件管理

主要实现文件上传功能,上传插件使用webuploader,封装了了大文件切片、多线程上传功能,可以多个文件同时上传,上传进度实时回调刷新,上传完成之后自动合并切片文件。


代码生成

该模块一般为开发人员使用,在数据库表建模完成之后,经过简单配置,系统根据数据库表字段,一键自动生成前后台代码,包括后端:mapping文件、dao文件、service文件、controller文件 && 前端:列表展示html文件、Form表单html文件。

业务表配置

开发人员选择某一个需要生成代码的业务表,系统会自动读取生成业务表的列名、说明、物理类型、Java类型、Java属性名称等属性,开发人员手动配置字段的是否可空、插入、编辑、列表显示、查询等属性,保存业务表配置为下一步的 “生成方案配置” 做准备。

生成方案配置

代码一键自动生成就是在 “生成方案配置” 中完成的。开发人员选择生成模板分类(单表、一对多、树结构、仅持久层等),选择上一步配置好的 业务表 ,最后添加业务相关的生成路径、描述、模块名称等 即可完成 “生成方案保存 + 代码生成” 。

开发部署手册


Hello world! 本节将依据JSite开发、运行、部署的环境要求,从基础的环境搭建、开发工具选择、数据库选择开始,完成JSite平台的运行、部署,一起来试试吧!

环境搭建、配置


环境要求

  1. 推荐 IntelliJ IDEA 【点击去下载】 (Eclipse IDE for Java EE Mars 【下载】

  2. Java SDK 1.8 【点击去下载】

  3. Apache Maven 3.3.x + 【点击去下载】

  4. MySql 5.7.11+ 【点击去下载】

  5. Tomcat 8 (部署要求使用Tomcat 8) 【点击去下载】


导入IDEA

  1. 检出JSite主框架源码:

    git clone https://gitee.com/baseweb/JSite.git
  2. 导入源码到 IDEA,菜单File -> Open,打开 Open File or Project对话框,然后选择JSite,最后点击 “OK”按钮,即可成功导入。

    源码导入后,IDEA会自动下Maven载依赖包,这个过程时间可能会比较长,请耐心等待。 注:如果没有科学上网,Maven依赖包可能会下载失败,此时需要清理删除Maven本地仓库,然后切换国内的 阿里云 或者 网易 的仓库地址重试。
    替换方法:编辑jsite-root下的pom.xml文件,在 dependencies 节点之后(节点外面,与dependencies节点同级),加入下面的 阿里仓库地址。—>>

    阿里仓库地址:

        <repositorys>
            <repository>
                <id>aliyunmaven</id>
                <url>https://maven.aliyun.com/repository/central</url>
                <releases>
                    <enabled>true</enabled>
                </releases>
                <snapshots>
                    <enabled>true</enabled>
                </snapshots>
            </repository>
        </repositorys>

  3. 成功导入源码并且Maven依赖下载完成之后,请打开
    JSite/jsite-web/src/main/resources/application.properties配置文件:

    重要:修改下面的 xx.xx.xx.xx:3306 为你自己的数据库地址,修改 username、password 为你自己的数据库连接用户名、密码。

    #mysql database setting
    spring.datasource.master.url=jdbc:mysql://xx.xx.xx.xx:3306/jsite?useUnicode=true&characterEncoding=utf-8&zeroDateTimeBehavior=convertToNull&transformedBitIsBoolean=true&autoReconnect=true&failOverReadOnly=false&serverTimezone=GMT%2B8
    spring.datasource.master.username=root
    spring.datasource.master.password=xxxx
    spring.datasource.master.driver-class-name=com.mysql.cj.jdbc.Driver
    # 初始化大小
    spring.datasource.master.initial-size=5
    # 最小
    spring.datasource.master.min-idle=5
    # 最大
    spring.datasource.master.max-active=100
    # 连接超时时间
    spring.datasource.master.max-wait=60000
    # 配置间隔多久才进行一次检测,检测需要关闭的空闲连接,单位是毫秒
    spring.datasource.master.time-between-eviction-runs-millis=60000
    # 指定一个空闲连接最少空闲多久后可被清除,单位是毫秒
    spring.datasource.master.min-evictable-idle-time-millis=300000
    spring.datasource.master.validationQuery=select 'x'
    # 当连接空闲时,是否执行连接测试
    spring.datasource.master.test-while-idle=true
    # 当从连接池借用连接时,是否测试该连接
    spring.datasource.master.test-on-borrow=false
    # 在连接归还到连接池时是否测试该连接
    spring.datasource.master.test-on-return=false
    # 配置监控统计拦截的filters,去掉后监控界面sql无法统计,'wall'用于防火墙
    spring.datasource.master.filters=config,wall,stat
    spring.datasource.master.poolPreparedStatements=true
    spring.datasource.master.maxPoolPreparedStatementPerConnectionSize=20
    spring.datasource.master.maxOpenPreparedStatements=20
    spring.datasource.master.connectionProperties=druid.stat.slowSqlMillis=200;druid.stat.logSlowSql=true;config.decrypt=false

  4. UEditor富文本组件用于流程表单开发,位于jsite-web/src/main/resources/jar/ueditor-1.1.2.jar, 需要手动安装到本地Maven仓库:
    启动CMD命令窗口,切换路径到ueditor-1.1.2.jar所在目录,执行下面命令:

    mvn install:install-file -DgroupId=com.baidu.ueditor -DartifactId=ueditor -Dversion=1.1.2  -Dpackaging=jar  -Dfile=ueditor-1.1.2.jar
  5. 在此过程中,你可以同时开始数据库的初始化。


数据库设计Docs


JSite数据库设计说明文档提供单独的在线阅览。开发者在使用过程中可以随时在线查看JSite的数据库概览、详细设计、数据库表关系、ER图等等详细信息。

系统管理模块 ——> 数据库设计线上阅览地址: 【 DbDoc_sys 】

文件管理模块 ——> 数据库设计线上阅览地址: 【 DbDoc_file 】

代码生成模块 ——> 数据库设计线上阅览地址: 【 DbDoc_gen 】

工作流业务表 ——> 数据库设计线上阅览地址: 【 DbDoc_oa 】

代码生成测试 ——> 数据库设计线上阅览地址: 【 DbDoc_test 】


数据库初始化


JSite目前支持 Mysql数据库。 ( Oracle 、 Mssql 脚本都已生成好,但没经过测试,需要开发这自行测试调整) ,更多其他数据库需要开发者自行扩展,下面将以Mysql为例详细讲解JSite数据库的初始化。

新建数据库

  1. 新建数据库,数据库名称:jsite

  2. 数据库字符集:utf8

  3. 排序规则:utf8_bin


执行初始化脚本

在源码目录 JSite/jsite-web/src/main/resources/db 下,找到jsite.sql文件,直接在新建的jsite数据库中执行初始化即可。

到此,你已经完成了JSite项目启动前的所有准备工作。


多数据源、独写分离配置


JSite支持多数据源、读写分离。项目中默认启用了这些配置,数据库配置信息在application.properties,其中master为主库,slave1、slave2为从库或者另外的数据源(读写分离时作为从库使用,多数据源时作为单独的数据源使用)。

下面从

1.多数据源、独写分离配置使用;

2.单数据源(禁用多数据源),两个方面详细讲解如何配置使用;


一、多数据源、读写分离配置:

JSite/jsite-web/src/main/resources/application.properties 默认配置了多数据源,如下图所示:
image
image

对应的com.jsite.modules.config.DatabaseConfiguration.java配置多数据源支持:
image

如何进行数据源动态切换?
image

路径+方法匹配的方式会直接在匹配到的方法执行前动态切换数据源。

注解方式需要在com.jsite.modules.aop.annotation下自定义注解,目前默认有Master、Slave注解,在需要切换数据源的方法之上加对应注解,如下图所示:
image

二、单数据源(禁用多数据源)

1.JSite/jsite-web/src/main/resources/application.properties 删除slave节点配置;

2.对应的com.jsite.modules.config.DatabaseConfiguration.java配置为单数据源:
image


启动Tomcat


启动项目

  1. 由于 spring boot 工程已经集成了 Web容器,所以开发者不必再另外下载Tomcat来进行部署。

  2. 打开jsite-web/src/main/resources/application.propertites 文件,配置你自己的服务端口 server.port 和 部署路径 server.servlet.context-path,你也可以直接使用默认配置
    如下所示:

    server.port=8081
    server.servlet.context-path=/jsite
  3. 在IDEA中找到 jsite-web 下的 com.jsite.JSiteWebApplication.java 启动类,右键 -> Run ‘JSiteWebApplication’ 启动项目,你也可以点击工具栏的图标直接启动,见下图:
    image

浏览器访问

  1. 在浏览器地址栏中输入 http://localhost:8081/jsite 回车

  2. 你将跳转到JSite登录页,默认管理员账号:jsite 密码:admin

  3. 此时一切顺利的话,你已经成功运行了JSite!

很多开发者提问:演示模式怎么关闭? 很简单,找到jsite-web/src/main/resources/config/jsite-web.properties文件,修改 demoMode=false 即可关闭。

打war包部署


打包操作

在idea的Maven面板,执行JSite下的 clean 、 package命令,打包完毕会在jsite-web模块下的target目录生成jsite.war

很多开发者提问:怎么编译打包出可执行jar文件? 因为本项目是maven多模块项目,打成jar的话会存在获取子模块jar包资源错误,因此建议打成war包,然后再部署。
如果实在想要打成jar,需要将项目中的各个模块合并成一个模块,然后就可以打成jar包直接运行了!

代码生成详解


JSite前后端代码生成依赖于 数据库业务表。所以第一步需要进行 业务表建模,JSite使用的建模工具是 ER Master(目前只有Eclipse插件)。

严重注意:系统架构要求,所有的业务表必须包含公共字段common组:
image

如果是树结构业务表,则必须包含tree_fild组:
image


数据库表建模

  1. 新建ER Master文件。在Eclipse中新建测试工程Test,增加db目录,拷贝JSite/jsite-web/src/main/resource/db/test/jsite_test.erm 到Test工程的db目录,双击打开,如下图所示:
    image
  2. 开发者可以根据自己的实际业务,复制test_data表,然后修改表名、字段等信息,构建自己的业务表。其中,公用字段已经封装在common group中,新增的业务表只需要选择common组即可,不需要重复添加所有公共字段。如下图所示:
    image
  3. 新增字段示例。字段物理名称、逻辑名称、类型、描述 不可以为空(下图红色框中所示),是否主键、是够为空、是否唯一、是否自增 为可选(下图绿色框中所示),根据实际业务选择,如下图所示:
    image
  4. 生成sql脚本。业务表建模完成之后,ctrl+s保存当前文件。然后 右键当前表–>选择 option,弹出数据库选项,选择要生成的数据库脚本类型,最后点击OK确定。如下图: image
    页面上右键–>Export–>DLL,弹出导出sql配置框,按图中选项配置,点击OK导出sql脚本,如下图:
    image

  5. 到此,你已经完成了自己的数据库表建模、sql脚本生成的工作了!


业务表配置

  1. 在数据库上生成业务表。执行上一步生成的sql脚本,完成业务表创建。

  2. 系统运行启动后,点击 代码生成–> 业务表配置,进入列表页面,如下图:
    image

  3. 配置自己的业务表。点击新增、编辑按钮–>选择自己的业务表–>点击确定,进入业务表配置页面,如下图:
    image

  4. 业务表配置说明。如上图所示,列名、说明、物理类型、Java类型、Java属性名称 都是通过读取数据库表属性自动生成的,一般不需要修改。

  5. 独占一行:这个属性是针对流程表单页面的,某些流程表单属性在页面布局时需要独占一行,就会配置这个属性。非流程表单页面不需要配置这个属性。

  6. 主键:业务表主键。

  7. 可空:生成前端的新增、编辑Form页面的字段,class属性是否增加required属性,保存时自动验证。

  8. 插入:保存时是否插入数据库,该属性一般全选。

  9. 编辑:新增、编辑Form页面是否显示该字段,例如 creat_by 字段,是不显示在新增、编辑页面的,数据保存时自动获取当前用户,设置该值。

  10. 列表:业务表列表页面(一般为配置的菜单“链接”页面,点击菜单,跳转到列表页),勾选该属性,即显示为列表表头,如下图红色框中所示:
    image

  11. 查询:业务表列表页面查询字段,勾选该字段,生成的列表页面就会增加该字段的查询功能,如上图绿色框中所示。

  12. 查询匹配方式:该属性在勾选了上一步的 “查询” 属性之后才会起作用,选择不同的值,生成的MaBatis mapping文件的where条件字段会不同,如下图所示:
    image

  13. 显示表单类型:该属性对应的是 新增、编辑Form页面,控件类型,如下图所示:
    image

  14. 字典类型:该属性在上一步 “显示表单类型” 选择了 下拉框select时起作用,填入系统字典表 sys_dict 的 type字段值,例如请假类型的字典类型 oa_leave_type,然后在生成的前端页面 该字段select控件会自动装配“请假类型”字典数据,无需再手动修改。如下图所示:
    image

  15. 排序:该属性配置直接作用于生成的前端新增、编辑Form页面字段控件布局顺序。

  16. 以上业务表的15项属性配置全部完成之后,保存配置,下一步就可以进行代码生成了!


生成方案配置、生成代码

  1. 新建生成方案。 打开 代码生成 –> 生成方案配置 菜单,点击新增。 如下图所示:
    image

  2. 选择模板分类、选择业务表。模板分类根据开发者实际业务表类型选择,可选 单表、主子表、树结构表、流程模板 几种,如下图所示:
    image

  3. 其他字段按照提示自行填写,最后勾选 “替换现有文件”,点击 保存并生成方案。 如下图所示:
    image

  4. 此时一切顺利的话,在jsite-web项目对应的 java 、 mappings 、 views目录下会生成前后端代码。 如下图所示:
    image


菜单、角色配置,第一个自己的页面

代码生成完毕后,重启工程。进行菜单、角色配置后即可看到你自己的页面了。

  1. 菜单配置。打开系统菜单页面,新增一个测试菜单,配置名称、链接、权限、图标、排序等属性。如下图:
    image
    image

    注意:链接填写的是自动生成的Controller后台代码的访问路径,如下图:

    image

  2. 角色权限配置。打开系统角色配置菜单,配置新增菜单权限。如下图:
    image
    image

  3. 配置完成后,重新运行工程。进入主菜单,点击新配置的菜单,此时你将看到自己的首个业务界面。

Flowable流程详解

特别强调:整合项目之后,一定要在项目里全局搜索下’demo.jsite.org.cn’替换成自己ip+端口号。如下图: image

流程数据表介绍

流程主要涉及flowable的表和自定义表单的表

1.流程表介绍。主要包括流程运行表(以ACT_RU开头)、流程定义表以及流转历史表(以ACT_HI开头)。如下图所示:
image image

2.自由表单表介绍。都是以flow-form开头,记录一些自动配置的表单信息、表单权限以及表单数据等。如下图所示:
image

流程管理

部署一个流程需要先用流程设计器画好自己流程图并根据业务需求配置好对应的表单及权限,一个流程才能启动运行。

1.模型管理。开发者启动一个流程需要先在模型管理画好流程图以及配置好对应表单。登录系统后,点击 流程管理–> 模型管理,进入列表页面,点击新增按钮,如下图所示: image

在弹出的新增流程模型界面点击创建流程,编辑好流程模型信息变可以画流程了,如下图所示: image image

画完之后,点击左上角保存模型按钮退出,如图所示: image

form key特别说明:画流程图的时候每个节点都可以加一个任务监听器和form key,监听器会将当前的环节执行人和form key当做流程变量存起来,下次用的时候就可以自动查找而不需要重新选人。 image

1.当流程中有驳回环节的时候,如果需要驳回的节点是执行过的某一节点,如果那个节点设置了监听器和form key,系统会根据form key去流程变量中查找任务执行人。 image

2.当流程中有相同的任务执行环节的时候,只要第一步加了任务监听器和form key,后续的节点如果再有相同的审批人都不要手动选人或者设置人,系统会根据form key自动寻找下一节点的执行人。

2.表单配置。开发者画完流程图,在模型管理列表找到自己画好的流程信息,点击后面的表单配置图标,配置自己的流程表单,如下图所示:

image image

3.配置发起人。开发者配置完表单,直接在模型管理列表页面点击部署即可,然后点击 流程管理–> 表单管理,进入列表页面,找到自己要启动的流程,点击人员权限列表按钮进行人员权限关联。如下图所示:

image

image

image

4.启动流程。配置完人员权限,退出登录,用配置的人员账号登录,然后点击 在线办公–> 发起流程,进入列表页面,找到对应流程点击发起流程即可。如下图所示:

image

表单配置介绍

配置表单的时候记住一定要给新加的字段设置权限,可以控制在某一个审批节点是否必填、是否显示等。鼠标悬浮在控件上,点击权限,如下图所示:

image

image

前端技术概述

1.采用当前比较流行的 Beetl 模板引擎。

2.封装 Beetl UI 通用组件,简单实现基本表单控件、树选择,列表选择,文件上传,等等,总之是简化开发。

3.数据表格 layui table 组件封装,自动完成分页、排序、列宽、编辑表、等。

4.支持前后分离应用,方便与手机 API 接口对接,Token 方式授权。

Beetl引擎集成

Beetl, 是Beetl Template Language的缩写,它是新一代的模板引擎,功能强大,性能良好,易学易用.

Beetl的性能,通过与主流模板引擎Freemarker,Vecloity以及JSP对比,Beetl6倍于Freemarker,2倍于JSP。这是因为宏观上,通过了优化的渲染引擎,IO的二进制输出,字节码属性访问增强,微观上,通过一维数组保存上下文Context,静态文本合并处理,通过重复使用字节数组来防止java频繁的创建和销毁数组,还使用模板缓存,运行时优化等方法。

页面结构

1.基于 AdminLTE 3 平面化界面设计,精细,更加美观、高端、大气、上档次。

2.支持手机或平板访问,响应式样式、响应式布局,根据屏幕分辨率自适应控件布局。

3.无刷新设计,除了进入功能页面和新页面,其它情况下全部采用 Ajax 交互,优化体验和性能。

自定义组件

更新日志、最新动态

V0.5.0 2020-1-7

新增
1.新增jsite-form表单设计器模块、通用流程功能。
2.新增layui table表格组件以及treetable-lay树形表格组件。

优化
1.更新AdminLTE 3视图框架。
2.Springboot升级2.2.2,其他依赖(beetle等)组件全面升级。

V0.6.0 2020-3-25

新增
1.个人设置页面,头像裁剪功能;
2.列表icon更新font Awesome 图标;
3.树结构数据新增treeLeaf、treeLevel字段;
4.删除DataTables、layuiTable,页面替换jqGrid;
5.增加跨域请求配置
6.其他功能完善..

修复
1.ajax 请求,session过期处理;
2.Excel导入多行表头bug修复;
3.增加setSessionIdCookieEnabled 解决sessionid频繁过期的问题;
4.Office–area字段修改,使用Area对象接收;
5.excel导入,日期格式容错处理;
6.其他问题修复;

V0.6.0 2020-4-17

新增
1.多数据源,读写分离配置功能;
2.shiro配置优化;

修复
1.更新操作列icon图标;
2.登录默认检测误报Exception,改为log输出;
3.增加 @Override 标识;

文档编写贡献人

JSite  
Haron_Y