ehs_tanghHe
/
tanghe-report
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of https://gitee.com/anji-plus/report

Browse Source
qianlishi 3 years ago
parent a022f84160 7a46d53c11
commit 515e87583f
14 changed files with 733 additions and 133 deletions
Show Stats Download Patch File Download Diff File

3
doc/docs/.vuepress/config.js
Unescape Escape View File

@ -24,8 +24,7 @@ module.exports = {
children: [
{title: '介绍', path: '/guide/'},
{title: '快速入门', path: '/guide/quickly'},
{title: '项目介绍', path: '/guide/productintro'},
{title: '系统运行', path: '/guide/deploy'}
// {title: '系统运行', path: '/guide/deploy'}
]
},
{

70
doc/docs/guide/README.md
Unescape Escape View File

@ -1,25 +1,51 @@
# 介绍
---
**大屏设计**
大屏设计（Report）是一个JavaEE微服务架构平台，采用经典组合（SpringBoot，SpringCloud，Vue，ElementUI）。目前提供两种架构，单体架构和微服务架构。
内置的基础功能包括数据源，数据集，报表管理
**功能架构**
- 前端
- 后端
**在线体验**
- 访问地址
- 默认账号密码
**联系我们**
## 在线体验
####   电脑在线体验: [https://report.anji-plus.com/](https://report.anji-plus.com/ "链接")  体验账号：guest 密码：guest
#### &emsp; 在线文档: [https://report.anji-plus.com/#/doc](https://report.anji-plus.com/#/doc "doc")<br>
#### &emsp; 在线提问: [https://gitee.com/anji-plus/report/issues](https://gitee.com/anji-plus/report/issues "issue")
## 功能概述
#### &emsp; 组件介绍
&emsp;&emsp; 大屏设计（AJ-Report）是一个可视化拖拽编辑的，直观，酷炫，具有科技感的图表工具全开源项目。
内置的基础功能包括数据源，数据集，报表管理，项目部分截图如下。<br>
## 打包目录
```
├── bin 启动命令脚本
│ ├── logs 启动日志目录
│ ├── cache 本地缓存目录
│ ├── startup.cmd
│ ├── shutdown.cmd
│ ├── startup.sh
│ └── shutdown.sh
├── config 配置文件目录
├── lib 自定义扩展包
├── target report-core核心包
```
## 系统目录
```
├── doc 文档源码
│ ├── docs
│ ├── package.json
│ └── README.md
├── pom.xml 父pom，jar版本管理
├── report-core java源码
│ ├── pom.xml gaea父pom，jar版本管理
│ └── README.md
├── report-ui 前端vue源码
├── LICENSE
├── README.md
```
## 近期计划
#### &emsp; 丰富更多图表组件
## 技术支持
如有问题，请提交 [Issue](https://gitee.com/anji-plus/report/issues)
#### 开源不易，劳烦各位star ☺

69
doc/docs/guide/productintro.md
Unescape Escape View File

@ -1,69 +0,0 @@
# 项目介绍
# 项目介绍
在线拖拽大屏设计，后续会持续更新新的功能。
## 文件结构
### 系统目录
-
```
├── doc 文档源码
│ ├── docs
│ ├── package.json
│ └── README.md
├── pom.xml 父pom，jar版本管理
├── report-core java源码
│ ├── pom.xml gaea父pom，jar版本管理
│ └── README.md
├── report-ui 前端vue源码
├── LICENSE
├── README.md
```
### 前端
```
├── build # 构建相关
├── mock # 项目mock 模拟数据
├── public # 静态资源
│ │── favicon.ico # favicon图标
│ └── index.html # html模板
├── src # 源代码
│ ├── api # 所有请求
│ ├── assets # 主题 字体等静态资源
│ ├── components # 全局公用组件
│ ├── directive # 全局指令
│ ├── icons # 项目所有 svg icons
│ ├── lang # 国际化 language
│ ├── layout # 全局 layout
│ ├── router # 路由
│ ├── store # 全局 store管理
│ ├── styles # 全局样式
│ ├── utils # 全局公用方法
│ ├── views # views 所有页面
│ ├── App.vue # 入口页面
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── permission.js # 权限管理
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
```
## 核心技术
### 后端
- [Spring Boot](https://spring.io/projects/spring-boot/): Spring Boot是一款开箱即用框架，让我们的Spring应用变的更轻量化、更快的入门。 在主程序执行main函数就可以运行。你也可以打包你的应用为jar并通过使用java -jar来运行你的Web应用；
- [Mybatis-plus](https://mp.baomidou.com/): MyBatis-plus（简称 MP）是一个 MyBatis (opens new window) 的增强工具。
- [flyway](https://flywaydb.org/): 主要用于在你的应用版本不断升级的同时，升级你的数据库结构和里面的数据
### 前端
- [npm](https://www.npmjs.com/)：node.js的包管理工具，用于统一管理我们前端项目中需要用到的包、插件、工具、命令等，便于开发和维护。
- [webpack](https://webpack.docschina.org/)：用于现代 JavaScript 应用程序的_静态模块打包工具
- [ES6](https://es6.ruanyifeng.com/)：Javascript的新版本，ECMAScript6的简称。利用ES6我们可以简化我们的JS代码，同时利用其提供的强大功能来快速实现JS逻辑。
- [vue-cli](https://cli.vuejs.org/)：Vue的脚手架工具，用于自动生成Vue项目的目录及文件。
- [vue-router](https://router.vuejs.org/)： Vue提供的前端路由工具，利用其我们实现页面的路由控制，局部刷新及按需加载，构建单页应用，实现前后端分离。
- [vuex](https://vuex.vuejs.org/)：Vue提供的状态管理工具，用于统一管理我们项目中各种数据的交互和重用，存储我们需要用到数据对象。
- [element-ui](https://element.eleme.cn/#/zh-CN)：基于MVVM框架Vue开源出来的一套前端ui组件。
- [vue-element-admin](https://panjiachen.gitee.io/vue-element-admin-site/)：后台前端解决方案,它基于 vue 和 element-ui实现

49
doc/docs/guide/quickly.md
Unescape Escape View File

@ -1,32 +1,29 @@
# 快速了解
---
## 项目简介
- 项目源代码地址: <https://gitee.com/anji-plus/report>
- 在线提问: <https://gitee.com/anji-plus/report/issues>
- 在线文档:
大屏设计（Report）是一个可视化拖拽编辑的，直观，酷炫，具有科技感的图表工具项目。
内置的基础功能包括数据源，数据集，国际化，字典管理，报表管理
## 技术选型
**1.环境**
- JavaEE 8
- Apache Maven 3
**2.主框架**
- Spring Boot 2.3.x
**3.持久层**
- Apache MyBatis 3.5.x
**4.视图层**
- Vue 2.6.10+
- ElementUI 2.13.0+
## 快速部署
```js
第一步，下载zip包，解压<br>
第二步，config->application.properties，修改mysql连接<br>
第三步，启动bin目录下startup.cmd(Windows)或者startup.sh(Linux)<br>
第四步，访问 http://localhost:9095/index.html
```
## 系统特性
1. 最新最稳定的技术栈；
2. 支持多数据源配置
3. 丰富的大屏组件。拖拽配置实现动态大屏
## 核心技术
### 后端
- [Spring Boot](https://spring.io/projects/spring-boot/): Spring Boot是一款开箱即用框架，让我们的Spring应用变的更轻量化、更快的入门。 在主程序执行main函数就可以运行。你也可以打包你的应用为jar并通过使用java -jar来运行你的Web应用；
- [Mybatis-plus](https://mp.baomidou.com/): MyBatis-plus（简称 MP）是一个 MyBatis (opens new window) 的增强工具。
- [flyway](https://flywaydb.org/): 主要用于在你的应用版本不断升级的同时，升级你的数据库结构和里面的数据
### 前端
- [npm](https://www.npmjs.com/)：node.js的包管理工具，用于统一管理我们前端项目中需要用到的包、插件、工具、命令等，便于开发和维护。
- [webpack](https://webpack.docschina.org/)：用于现代 JavaScript 应用程序的_静态模块打包工具
- [ES6](https://es6.ruanyifeng.com/)：Javascript的新版本，ECMAScript6的简称。利用ES6我们可以简化我们的JS代码，同时利用其提供的强大功能来快速实现JS逻辑。
- [vue-cli](https://cli.vuejs.org/)：Vue的脚手架工具，用于自动生成Vue项目的目录及文件。
- [vue-router](https://router.vuejs.org/)： Vue提供的前端路由工具，利用其我们实现页面的路由控制，局部刷新及按需加载，构建单页应用，实现前后端分离。
- [vuex](https://vuex.vuejs.org/)：Vue提供的状态管理工具，用于统一管理我们项目中各种数据的交互和重用，存储我们需要用到数据对象。
- [element-ui](https://element.eleme.cn/#/zh-CN)：基于MVVM框架Vue开源出来的一套前端ui组件。
- [avue](https://www.avuejs.com/): 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动

9
report-ui/src/assets/styles/element-ui.scss
Unescape Escape View File

@ -24,13 +24,14 @@
margin: 0 auto;
.el-dialog__header{
background-color: rgb(48, 77, 167);
color: #fff;
background-color: #fff;
color: #333;
border-bottom: 1px solid #eee;
.el-dialog__title{
color: #fff;
color: #333;
}
.el-dialog__headerbtn i {
color: #fff;
color: #333;
}
}
}

1
report-ui/src/assets/styles/index.scss
Unescape Escape View File

@ -270,6 +270,7 @@ a:hover {
color:#a8e3ff
}
.el-input-number.is-controls-right .el-input-number__increase{
height: 15px;
border-bottom: 1px solid #3f5673;
}
.el-input-number.is-controls-right .el-input-number__decrease{

133
report-ui/src/views/report/bigscreen/designer/tools.js
Unescape Escape View File

@ -121,7 +121,7 @@ const widgetTools = [
name: 'background',
required: false,
placeholder: '',
value: 'rgba(115,170,229,.5)',
value: 'rgba(115,170,229,.1)',
},
{
type: 'el-select',
@ -1171,6 +1171,23 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineX',
require: false,
placeholder: '',
value: true,
},
{
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorX',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -1240,6 +1257,21 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
}, {
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineY',
require: false,
placeholder: '',
value: true,
}, {
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorY',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -1723,6 +1755,23 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineX',
require: false,
placeholder: '',
value: true,
},
{
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorX',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -1792,6 +1841,22 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineY',
require: false,
placeholder: '',
value: true,
}, {
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorY',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -2195,6 +2260,23 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineX',
require: false,
placeholder: '',
value: true,
},
{
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorX',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -2264,6 +2346,22 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineY',
require: false,
placeholder: '',
value: true,
}, {
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorY',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -2823,6 +2921,23 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineX',
require: false,
placeholder: '',
value: true,
},
{
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorX',
required: false,
placeholder: '',
value: '#fff',
}
],
},
@ -2892,6 +3007,22 @@ const widgetTools = [
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineY',
require: false,
placeholder: '',
value: true,
}, {
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorY',
required: false,
placeholder: '',
value: '#fff',
}
],
},

12
report-ui/src/views/report/bigscreen/designer/widget/bar/widgetGradientColorBarchart.vue
Unescape Escape View File

@ -235,6 +235,12 @@ export default {
color: optionsCollapse.lineColorX,
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineX,
lineStyle: {
color: optionsCollapse.splitLineColorX
},
},
}
this.options.xAxis = xAxis
},
@ -266,6 +272,12 @@ export default {
color: optionsCollapse.lineColorY,
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineY,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
}
this.options.yAxis = yAxis

16
report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieNightingaleRoseArea.vue
Unescape Escape View File

@ -147,7 +147,13 @@ export default {
lineStyle: {
color: optionsCollapse.lineColorX
}
}
},
splitLine: {
show: optionsCollapse.isShowSplitLineX,
lineStyle: {
color: optionsCollapse.splitLineColorX
},
},
};
this.options.xAxis = xAxis;
},
@ -178,7 +184,13 @@ export default {
lineStyle: {
color: optionsCollapse.lineColorY
}
}
},
splitLine: {
show: optionsCollapse.isShowSplitLineY,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
};
this.options.yAxis = yAxis;

409
report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieRoundChart.vue
View File

File diff suppressed because one or more lines are too long

16
report-ui/src/views/report/bigscreen/designer/widget/widgetBarchart.vue
Unescape Escape View File

@ -150,7 +150,13 @@ export default {
lineStyle: {
color: optionsCollapse.lineColorX
}
}
},
splitLine: {
show: optionsCollapse.isShowSplitLineX,
lineStyle: {
color: optionsCollapse.splitLineColorX
},
},
};
this.options.xAxis = xAxis;
},
@ -181,7 +187,13 @@ export default {
lineStyle: {
color: optionsCollapse.lineColorY
}
}
},
splitLine: {
show: optionsCollapse.isShowSplitLineY,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
};
this.options.yAxis = yAxis;

18
report-ui/src/views/report/bigscreen/designer/widget/widgetBarlinechart.vue
Unescape Escape View File

@ -192,6 +192,12 @@ export default {
color: optionsCollapse.lineColorX,
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineX,
lineStyle: {
color: optionsCollapse.splitLineColorX
},
},
}
this.options.xAxis = xAxis
},
@ -224,6 +230,12 @@ export default {
color: '#fff',
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineY,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
},
{
type: 'value',
@ -250,6 +262,12 @@ export default {
color: optionsCollapse.lineColorY,
},
},
splitLine: {
show: true,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
},
]

12
report-ui/src/views/report/bigscreen/designer/widget/widgetLinechart.vue
Unescape Escape View File

@ -158,6 +158,12 @@ export default {
color: optionsCollapse.lineColorX,
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineX,
lineStyle: {
color: optionsCollapse.splitLineColorX
},
},
}
this.options.xAxis = xAxis
},
@ -189,6 +195,12 @@ export default {
color: optionsCollapse.lineColorY,
},
},
splitLine: {
show: optionsCollapse.isShowSplitLineY,
lineStyle: {
color: optionsCollapse.splitLineColorY
},
},
}
this.options.yAxis = yAxis

49
report-ui/src/views/report/resultset/index.vue
Unescape Escape View File

@ -121,13 +121,12 @@
size="small"
label-width="100px">
<el-row :gutter="10">
<el-col :xs="24"
:sm="20"
:md="4"
:lg="4"
:xl="4">
<el-form-item label-width="0"
:md="6"
:lg="6"
:xl="6">
<el-form-item label="数据源"
prop="sourceCode">
<el-select v-model.trim="formData.sourceCode"
class="organisation"
@ -140,11 +139,45 @@
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24"
:sm="20"
:md="8"
:lg="8"
:xl="8">
<el-form-item label="数据集名称"
prop="setName">
<el-input v-model.trim="formData.setName"
size="mini" />
</el-form-item>
</el-col>
<el-col :xs="24"
:sm="20"
:md="8"
:lg="8"
:xl="8">
<el-form-item label="数据集编码"
prop="setCode">
<el-input v-model.trim="formData.setCode"
size="mini" />
</el-form-item>
</el-col>
<el-col :xs="24"
:sm="20"
:md="22"
:lg="22"
:xl="22">
<el-form-item label="数据集描述">
<el-input v-model.trim="formData.setDesc"
size="mini" />
</el-form-item>
</el-col>
<el-col :xs="24"
:sm="20"
:md="22"
:lg="22"
:xl="22"
class="code-mirror-form">
<el-form-item label="查询SQL或请求体"
label-width="140px">
<div class="codemirror">
@ -884,6 +917,12 @@ export default {
}
</script>
<style lang="scss" scoped>
.code-mirror-form {
/deep/.el-form-item__content {
height: 200px;
overflow: hidden;
}
}
.my-editor {
height: 400px;
div.jsoneditor {

Write Preview
Loading…
Cancel
Save