提交 b6117d65 authored 作者: junjie's avatar junjie

feat(视图): 视图编辑保存,横纵维度指标,EChart展示

上级 8fca61ae
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
@Data
public class ChartView implements Serializable {
private String id;
private String name;
private String sceneId;
private String tableId;
private String type;
private String title;
private String createBy;
private Long createTime;
private Long updateTime;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.ToString;
@Data
@EqualsAndHashCode(callSuper = true)
@ToString(callSuper = true)
public class ChartViewWithBLOBs extends ChartView implements Serializable {
private String xAxis;
private String yAxis;
private String customAttr;
private String customStyle;
private String customFilter;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.mapper;
import io.dataease.base.domain.ChartView;
import io.dataease.base.domain.ChartViewExample;
import io.dataease.base.domain.ChartViewWithBLOBs;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface ChartViewMapper {
long countByExample(ChartViewExample example);
int deleteByExample(ChartViewExample example);
int deleteByPrimaryKey(String id);
int insert(ChartViewWithBLOBs record);
int insertSelective(ChartViewWithBLOBs record);
List<ChartViewWithBLOBs> selectByExampleWithBLOBs(ChartViewExample example);
List<ChartView> selectByExample(ChartViewExample example);
ChartViewWithBLOBs selectByPrimaryKey(String id);
int updateByExampleSelective(@Param("record") ChartViewWithBLOBs record, @Param("example") ChartViewExample example);
int updateByExampleWithBLOBs(@Param("record") ChartViewWithBLOBs record, @Param("example") ChartViewExample example);
int updateByExample(@Param("record") ChartView record, @Param("example") ChartViewExample example);
int updateByPrimaryKeySelective(ChartViewWithBLOBs record);
int updateByPrimaryKeyWithBLOBs(ChartViewWithBLOBs record);
int updateByPrimaryKey(ChartView record);
}
\ No newline at end of file
package io.dataease.controller.chart;
import io.dataease.base.domain.ChartViewWithBLOBs;
import io.dataease.controller.request.chart.ChartViewRequest;
import io.dataease.dto.chart.ChartViewDTO;
import io.dataease.service.chart.ChartViewService;
import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import java.util.List;
import java.util.Map;
/**
* @Author gin
* @Date 2021/3/1 1:17 下午
*/
@RestController
@RequestMapping("/chart/view")
public class ChartViewController {
@Resource
private ChartViewService chartViewService;
@PostMapping("/save")
public ChartViewWithBLOBs save(@RequestBody ChartViewWithBLOBs chartViewWithBLOBs) {
return chartViewService.save(chartViewWithBLOBs);
}
@PostMapping("/list")
public List<ChartViewWithBLOBs> list(@RequestBody ChartViewRequest chartViewRequest) {
return chartViewService.list(chartViewRequest);
}
@PostMapping("/get/{id}")
public ChartViewWithBLOBs get(@PathVariable String id) {
return chartViewService.get(id);
}
@PostMapping("/delete/{id}")
public void delete(@PathVariable String id) {
chartViewService.delete(id);
}
@PostMapping("/getData/{id}")
public ChartViewDTO getData(@PathVariable String id) throws Exception {
return chartViewService.getData(id);
}
}
package io.dataease.controller.dataset;
import io.dataease.base.domain.DatasetTable;
import io.dataease.base.domain.DatasetTableField;
import io.dataease.controller.request.dataset.DataSetTableRequest;
import io.dataease.datasource.dto.TableFiled;
import io.dataease.service.dataset.DataSetTableService;
......@@ -50,6 +51,11 @@ public class DataSetTableController {
return dataSetTableService.getFields(dataSetTableRequest);
}
@PostMapping("getFieldsFromDE")
public Map<String, List<DatasetTableField>> getFieldsFromDE(@RequestBody DataSetTableRequest dataSetTableRequest) throws Exception {
return dataSetTableService.getFieldsFromDE(dataSetTableRequest);
}
@PostMapping("getData")
public List<String[]> getData(@RequestBody DataSetTableRequest dataSetTableRequest) throws Exception {
return dataSetTableService.getData(dataSetTableRequest);
......
package io.dataease.controller.request.chart;
import io.dataease.base.domain.ChartViewWithBLOBs;
import lombok.Getter;
import lombok.Setter;
/**
* @Author gin
* @Date 2021/3/1 1:32 下午
*/
@Setter
@Getter
public class ChartViewRequest extends ChartViewWithBLOBs {
private String sort;
}
......@@ -74,4 +74,8 @@ public class DatasourceService {
return datasourceProvider.getTables(datasourceRequest);
}
public Datasource get(String id) {
return datasourceMapper.selectByPrimaryKey(id);
}
}
package io.dataease.dto.chart;
import io.dataease.base.domain.ChartViewWithBLOBs;
import lombok.Getter;
import lombok.Setter;
import java.util.Map;
/**
* @Author gin
* @Date 2021/3/1 4:19 下午
*/
@Setter
@Getter
public class ChartViewDTO extends ChartViewWithBLOBs {
private Map<String, Object> data;
}
package io.dataease.dto.chart;
import lombok.Getter;
import lombok.Setter;
import java.math.BigDecimal;
import java.util.List;
/**
* @Author gin
* @Date 2021/3/1 3:51 下午
*/
@Getter
@Setter
public class Series {
private String name;
private String type;
private List<BigDecimal> data;
}
package io.dataease.service.chart;
import com.google.gson.Gson;
import com.google.gson.reflect.TypeToken;
import io.dataease.base.domain.*;
import io.dataease.base.mapper.ChartViewMapper;
import io.dataease.commons.utils.BeanUtils;
import io.dataease.controller.request.chart.ChartViewRequest;
import io.dataease.datasource.constants.DatasourceTypes;
import io.dataease.datasource.provider.DatasourceProvider;
import io.dataease.datasource.provider.ProviderFactory;
import io.dataease.datasource.request.DatasourceRequest;
import io.dataease.datasource.service.DatasourceService;
import io.dataease.dto.chart.ChartViewDTO;
import io.dataease.dto.chart.Series;
import io.dataease.dto.dataset.DataTableInfoDTO;
import io.dataease.service.dataset.DataSetTableFieldsService;
import io.dataease.service.dataset.DataSetTableService;
import org.apache.commons.collections4.CollectionUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
import java.math.BigDecimal;
import java.text.MessageFormat;
import java.util.*;
import java.util.stream.Collectors;
/**
* @Author gin
* @Date 2021/3/1 12:34 下午
*/
@Service
public class ChartViewService {
@Resource
private ChartViewMapper chartViewMapper;
@Resource
private DataSetTableService dataSetTableService;
@Resource
private DatasourceService datasourceService;
@Resource
private DataSetTableFieldsService dataSetTableFieldsService;
public ChartViewWithBLOBs save(ChartViewWithBLOBs chartView) {
long timestamp = System.currentTimeMillis();
chartView.setUpdateTime(timestamp);
int i = chartViewMapper.updateByPrimaryKeyWithBLOBs(chartView);
if (i == 0) {
chartView.setId(UUID.randomUUID().toString());
chartView.setCreateTime(timestamp);
chartView.setUpdateTime(timestamp);
chartViewMapper.insert(chartView);
}
return chartView;
}
public List<ChartViewWithBLOBs> list(ChartViewRequest chartViewRequest) {
ChartViewExample chartViewExample = new ChartViewExample();
ChartViewExample.Criteria criteria = chartViewExample.createCriteria();
if (StringUtils.isNotEmpty(chartViewRequest.getSceneId())) {
criteria.andSceneIdEqualTo(chartViewRequest.getSceneId());
}
if (StringUtils.isNotEmpty(chartViewRequest.getSort())) {
chartViewExample.setOrderByClause(chartViewRequest.getSort());
}
return chartViewMapper.selectByExampleWithBLOBs(chartViewExample);
}
public ChartViewWithBLOBs get(String id) {
return chartViewMapper.selectByPrimaryKey(id);
}
public void delete(String id) {
chartViewMapper.deleteByPrimaryKey(id);
}
public ChartViewDTO getData(String id) throws Exception {
ChartViewWithBLOBs view = chartViewMapper.selectByPrimaryKey(id);
List<DatasetTableField> xAxis = new Gson().fromJson(view.getXAxis(), new TypeToken<List<DatasetTableField>>() {
}.getType());
List<DatasetTableField> yAxis = new Gson().fromJson(view.getYAxis(), new TypeToken<List<DatasetTableField>>() {
}.getType());
List<String> x = new ArrayList<>();
List<Series> series = new ArrayList<>();
if (CollectionUtils.isEmpty(xAxis) || CollectionUtils.isEmpty(yAxis)) {
ChartViewDTO dto = new ChartViewDTO();
BeanUtils.copyBean(dto, view);
return dto;
}
List<String> xIds = xAxis.stream().map(DatasetTableField::getId).collect(Collectors.toList());
List<String> yIds = yAxis.stream().map(DatasetTableField::getId).collect(Collectors.toList());
List<DatasetTableField> xList = dataSetTableFieldsService.getListByIds(xIds);
List<DatasetTableField> yList = dataSetTableFieldsService.getListByIds(yIds);
// 获取数据源
DatasetTable table = dataSetTableService.get(view.getTableId());
Datasource ds = datasourceService.get(table.getDataSourceId());
DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
DatasourceRequest datasourceRequest = new DatasourceRequest();
datasourceRequest.setDatasource(ds);
DataTableInfoDTO dataTableInfoDTO = new Gson().fromJson(table.getInfo(), DataTableInfoDTO.class);
datasourceRequest.setTable(dataTableInfoDTO.getTable());
datasourceRequest.setQuery(getSQL(ds.getType(), dataTableInfoDTO.getTable(), xList, yList));
List<String[]> data = datasourceProvider.getData(datasourceRequest);
// todo 处理结果,目前做一个单系列图表,后期图表组件再扩展
for (DatasetTableField y : yList) {
Series series1 = new Series();
series1.setName(y.getName());
series1.setType(view.getType());
series1.setData(new ArrayList<>());
series.add(series1);
}
for (String[] d : data) {
StringBuilder a = new StringBuilder();
BigDecimal b = new BigDecimal("0");
for (int i = 0; i < xList.size(); i++) {
if (i == xList.size() - 1) {
a.append(d[i]);
} else {
a.append(d[i]).append("\n");
}
}
x.add(a.toString());
for (int i = xList.size(); i < xList.size() + yList.size(); i++) {
int j = i - xList.size();
series.get(j).getData().add(new BigDecimal(d[i]));
}
}
Map<String, Object> map = new HashMap<>();
map.put("x", x);
map.put("series", series);
ChartViewDTO dto = new ChartViewDTO();
BeanUtils.copyBean(dto, view);
dto.setData(map);
return dto;
}
public String getSQL(String type, String table, List<DatasetTableField> xAxis, List<DatasetTableField> yAxis) {
DatasourceTypes datasourceType = DatasourceTypes.valueOf(type);
switch (datasourceType) {
case mysql:
return transMysqlSQL(table, xAxis, yAxis);
case sqlServer:
default:
return "";
}
}
public String transMysqlSQL(String table, List<DatasetTableField> xAxis, List<DatasetTableField> yAxis) {
// TODO 此处sum后期由用户前端传入
String[] field = yAxis.stream().map(y -> "sum(" + y.getOriginName() + ")").toArray(String[]::new);
String[] group = xAxis.stream().map(DatasetTableField::getOriginName).toArray(String[]::new);
return MessageFormat.format("SELECT {0},{1} FROM {2} GROUP BY {3}", StringUtils.join(group, ","), StringUtils.join(field, ","), table, StringUtils.join(group, ","));
}
}
......@@ -54,4 +54,10 @@ public class DataSetTableFieldsService {
datasetTableFieldExample.createCriteria().andTableIdEqualTo(tableId);
datasetTableFieldMapper.deleteByExample(datasetTableFieldExample);
}
public List<DatasetTableField> getListByIds(List<String> ids) {
DatasetTableFieldExample datasetTableFieldExample = new DatasetTableFieldExample();
datasetTableFieldExample.createCriteria().andIdIn(ids);
return datasetTableFieldMapper.selectByExample(datasetTableFieldExample);
}
}
......@@ -91,6 +91,29 @@ public class DataSetTableService {
return datasourceProvider.getTableFileds(datasourceRequest);
}
public Map<String, List<DatasetTableField>> getFieldsFromDE(DataSetTableRequest dataSetTableRequest) throws Exception {
DatasetTableField datasetTableField = new DatasetTableField();
datasetTableField.setTableId(dataSetTableRequest.getId());
datasetTableField.setChecked(Boolean.TRUE);
List<DatasetTableField> fields = dataSetTableFieldsService.list(datasetTableField);
List<DatasetTableField> dimension = new ArrayList<>();
List<DatasetTableField> quota = new ArrayList<>();
fields.forEach(field -> {
if (field.getDeType() == 2) {
quota.add(field);
} else {
dimension.add(field);
}
});
Map<String, List<DatasetTableField>> map = new HashMap<>();
map.put("dimension", dimension);
map.put("quota", quota);
return map;
}
public List<String[]> getData(DataSetTableRequest dataSetTableRequest) throws Exception {
Datasource ds = datasourceMapper.selectByPrimaryKey(dataSetTableRequest.getDataSourceId());
DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
......
-- chart start
CREATE TABLE IF NOT EXISTS `chart_group` (
`id` varchar(50) NOT NULL COMMENT 'ID',
`name` varchar(64) NOT NULL COMMENT '名称',
`pid` varchar(50) COMMENT '父级ID',
`level` int(10) COMMENT '当前分组处于第几级',
`type` varchar(50) COMMENT 'group or scene',
`create_by` varchar(50) COMMENT '创建人ID',
`create_time` bigint(13) COMMENT '创建时间',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
CREATE TABLE IF NOT EXISTS `chart_group`
(
`id` varchar(50) NOT NULL COMMENT 'ID',
`name` varchar(64) NOT NULL COMMENT '名称',
`pid` varchar(50) COMMENT '父级ID',
`level` int(10) COMMENT '当前分组处于第几级',
`type` varchar(50) COMMENT 'group or scene',
`create_by` varchar(50) COMMENT '创建人ID',
`create_time` bigint(13) COMMENT '创建时间',
PRIMARY KEY (`id`)
) ENGINE = InnoDB
DEFAULT CHARSET = utf8mb4;
CREATE TABLE IF NOT EXISTS `chart_view`
(
`id` varchar(50) NOT NULL COMMENT 'ID',
`name` varchar(64) COMMENT '名称',
`scene_id` varchar(50) NOT NULL COMMENT '场景ID',
`table_id` varchar(50) NOT NULL COMMENT '数据集表ID',
`type` varchar(50) COMMENT '图表类型',
`title` varchar(50) COMMENT 'EChart标题',
`x_axis` longtext COMMENT '横轴field',
`y_axis` longtext COMMENT '纵轴field',
`custom_attr` longtext COMMENT '图形属性',
`custom_style` longtext COMMENT '组件样式',
`custom_filter` longtext COMMENT '结果过滤',
`create_by` varchar(50) COMMENT '创建人ID',
`create_time` bigint(13) COMMENT '创建时间',
`update_time` bigint(13) COMMENT '更新时间',
PRIMARY KEY (`id`),
KEY `IDX_TABLE_ID` (`table_id`)
) ENGINE = InnoDB
DEFAULT CHARSET = utf8mb4;
-- chart end
export const BASE_BAR = {
title: {
text: ''
},
tooltip: {},
legend: {
data: []
},
xAxis: {
data: []
},
yAxis: {
type: 'value'
},
series: []
};
export default {
BASE_BAR,
}
......@@ -139,7 +139,7 @@
</el-form-item>
</el-form>
</el-row>
<span>{{sceneData}}</span>
<span v-show="false">{{sceneData}}</span>
<el-tree
:data="chartData"
node-key="id"
......@@ -152,7 +152,7 @@
</span>
<span>
<span @click.stop style="margin-left: 12px;">
<el-dropdown trigger="click" @command="clickMore">
<el-dropdown trigger="click" @command="clickMore" size="small">
<span class="el-dropdown-link">
<el-button
icon="el-icon-more"
......@@ -175,7 +175,7 @@
</el-tree>
<!--rename chart-->
<el-dialog :title="$t('chart.table')" :visible="editTable" :show-close="false" width="30%">
<el-dialog :title="$t('chart.chart')" :visible="editTable" :show-close="false" width="30%">
<el-form :model="tableForm" :rules="tableFormRules" ref="tableForm">
<el-form-item :label="$t('commons.name')" prop="name">
<el-input v-model="tableForm.name"></el-input>
......@@ -247,7 +247,7 @@ export default {
computed: {
sceneData: function () {
this.chartTree();
return this.$store.state.chart.sceneData;
return this.$store.state.chart.chartSceneData;
}
},
mounted() {
......@@ -340,10 +340,10 @@ export default {
});
},
saveTable(table) {
saveTable(view) {
this.$refs['tableForm'].validate((valid) => {
if (valid) {
this.$post("/chart/table/update", table, response => {
this.$post("/chart/view/save", view, response => {
this.closeTable();
this.$message({
message: this.$t('commons.save_success'),
......@@ -389,7 +389,7 @@ export default {
cancelButtonText: this.$t('chart.cancel'),
type: 'warning'
}).then(() => {
this.$post("/chart/table/delete/" + data.id, null, response => {
this.$post("/chart/view/delete/" + data.id, null, response => {
this.$message({
type: 'success',
message: this.$t('chart.delete_success'),
......@@ -431,8 +431,8 @@ export default {
chartTree() {
this.chartData = [];
if (this.currGroup) {
this.$post('/chart/table/list', {
sort: 'type asc,create_time desc,name asc',
this.$post('/chart/view/list', {
sort: 'create_time desc,name asc',
sceneId: this.currGroup.id
}, response => {
this.chartData = response.data;
......@@ -444,6 +444,7 @@ export default {
if (data.type === 'scene') {
this.sceneMode = true;
this.currGroup = data;
this.$store.commit("setSceneId", this.currGroup.id);
}
if (node.expanded) {
this.expandedArray.push(data.id);
......@@ -476,13 +477,10 @@ export default {
},
sceneClick(data, node) {
// this.$store.commit('setChart', data.id);
// this.$router.push({
// name: 'ChartGroup',
// params: {
// table: data
// }
// });
this.$store.commit('setViewId', null);
this.$store.commit('setViewId', data.id);
this.$store.commit('setTableId', data.tableId);
this.$router.push("/chart/chart-edit");
},
selectTable() {
......@@ -491,10 +489,18 @@ export default {
createChart() {
console.log(this.table);
this.selectTableFlag = false;
this.$store.commit("setTableId", null);
this.$store.commit("setTableId", this.table.id);
this.$router.push("/chart/chart-edit");
let view = {};
view.name = this.table.name;
view.sceneId = this.currGroup.id;
view.tableId = this.table.id;
this.$post('/chart/view/save', view, response => {
this.selectTableFlag = false;
this.$store.commit("setTableId", null);
this.$store.commit("setTableId", this.table.id);
this.$router.push("/chart/chart-edit");
this.$store.commit("setViewId", response.data.id);
this.chartTree();
})
},
getTable(table) {
......
......@@ -22,7 +22,9 @@ const Chart = {
state: {
chartSceneData: "",
chart: "",
tableId: ""
tableId: "",
sceneId: "",
viewId: ""
},
mutations: {
setChartSceneData(state, chartSceneData) {
......@@ -33,6 +35,12 @@ const Chart = {
},
setTableId(state, tableId) {
state.tableId = tableId;
},
setSceneId(state, sceneId) {
state.sceneId = sceneId;
},
setViewId(state, viewId) {
state.viewId = viewId;
}
}
}
......
......@@ -1549,7 +1549,18 @@ export default {
table: '表',
edit: '編輯',
create_view: '創建試圖',
data_preview: '數據預覽'
data_preview: '數據預覽',
dimension: 'Dimension',
quota: 'Quota',
title: 'Title',
show: 'Show',
chart_type: 'Chart Type',
shape_attr: 'Attribute',
module_style: 'Style',
result_filter: 'Filter',
x_axis: 'X-Axis',
y_axis: 'Y-Axis',
chart: 'Chart'
},
dataset: {
datalist: 'Data List',
......@@ -1574,18 +1585,18 @@ export default {
sql_data: 'SQL Data',
excel_data: 'Excel Data',
custom_data: 'Custom Data',
pls_slc_tbl_left:'Please select table from left',
add_db_table:'Add Table',
pls_slc_data_source:'Select Data Source',
table:'Table',
pls_slc_tbl_left: 'Please select table from left',
add_db_table: 'Add Table',
pls_slc_data_source: 'Select Data Source',
table: 'Table',
edit: 'Edit',
create_view: 'Create View',
data_preview:'Data Preview',
field_type:'Field Type',
field_name:'Field Name',
field_origin_name:'Origin Name',
field_check:'Checked',
update_info:'Update Info',
data_preview: 'Data Preview',
field_type: 'Field Type',
field_name: 'Field Name',
field_origin_name: 'Origin Name',
field_check: 'Checked',
update_info: 'Update Info',
join_view: 'Relation View',
text: 'Text',
time: 'Time',
......
export default {
commons: {
upload:'上传',
upload: '上传',
cover: '覆盖',
not_cover: '不覆盖',
import_mode: '导入模式',
......@@ -220,8 +220,8 @@ export default {
loginImage: '登陆页面右侧图片',
loginTitle: '登陆页面提示信息',
pageTitle: '页面 Title',
favicon:"Favicon(浏览器Tab页上的小图标)",
advice_size:"建议图片大小",
favicon: "Favicon(浏览器Tab页上的小图标)",
advice_size: "建议图片大小",
},
system_config: {
base_config: '基本配置',
......@@ -229,12 +229,12 @@ export default {
url: '当前站点URL',
url_tip: '例如:http://localhost:8081',
logo: "系统LOGO(显示在系统主页左上角的LOGO)",
advice_size:"建议图片大小",
title:"Title(浏览器Tab页上的显示的文字)",
favicon:"Favicon(浏览器Tab页上的小图标)",
system_name:"系统名称(显示在系统主页左上角的系统名称)",
advice_size: "建议图片大小",
title: "Title(浏览器Tab页上的显示的文字)",
favicon: "Favicon(浏览器Tab页上的小图标)",
system_name: "系统名称(显示在系统主页左上角的系统名称)",
login_image: "登录页图片(登录页中显示的图片)",
login_name:"登录页显示的系统名称"
login_name: "登录页显示的系统名称"
}
},
workspace: {
......@@ -1570,7 +1570,18 @@ export default {
table: '表',
edit: '编辑',
create_view: '创建试图',
data_preview:'数据预览'
data_preview: '数据预览',
dimension: '维度',
quota: '指标',
title: '标题',
show: '显示',
chart_type: '图表类型',
shape_attr: '图形属性',
module_style: '组件样式',
result_filter: '结果过滤器',
x_axis: '横轴',
y_axis: '纵轴',
chart:'视图'
},
dataset: {
datalist: '数据列表',
......
......@@ -1550,7 +1550,18 @@ export default {
table: '表',
edit: '編輯',
create_view: '創建試圖',
data_preview: '數據預覽'
data_preview: '數據預覽',
dimension: '維度',
quota: '指標',
title: '標題',
show: '顯示',
chart_type: '圖表類型',
shape_attr: '圖形屬性',
module_style: '組件樣式',
result_filter: '結果過濾器',
x_axis: '橫軸',
y_axis: '縱軸',
chart:'視圖'
},
dataset: {
datalist: '數據列表',
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论