center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

refactor: 富文本、表格等模版适配优化

Browse Source
This commit is contained in:
wangjiahao 2023-11-14 13:16:08 +08:00
parent 7692783af5
commit b6a4419707
18 changed files with 156 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
core/core-backend/pom.xml
View File

@ -92,6 +92,20 @@
</properties>
<dependencies>
<dependency>
<groupId>com.h2database</groupId>
<artifactId>h2</artifactId>
</dependency>
<dependency>
<groupId>io.dataease</groupId>
<artifactId>xpack-permissions</artifactId>
<version>${project.version}</version>
</dependency>
<dependency>
<groupId>io.dataease</groupId>
<artifactId>xpack-base</artifactId>
<version>${project.version}</version>
</dependency>
</dependencies>

12
core/core-backend/src/main/java/io/dataease/template/service/TemplateManageService.java
View File

@ -47,16 +47,16 @@ public class TemplateManageService implements TemplateManageApi {
request.setWithBlobs("N");
List<TemplateManageDTO> templateList = extTemplateMapper.findTemplateList(request);
if (request.getWithChildren()) {
getTreeChildren(templateList);
getTreeChildren(templateList,request.getLeafDvType());
}
return templateList;
}
public void getTreeChildren(List<TemplateManageDTO> parentTemplateList) {
public void getTreeChildren(List<TemplateManageDTO> parentTemplateList,String dvType) {
Optional.ofNullable(parentTemplateList).ifPresent(parent -> parent.forEach(parentTemplate -> {
List<TemplateManageDTO> panelTemplateDTOChildren = extTemplateMapper.findTemplateList(new TemplateManageRequest(parentTemplate.getId()));
List<TemplateManageDTO> panelTemplateDTOChildren = extTemplateMapper.findTemplateList(new TemplateManageRequest(parentTemplate.getId(),dvType));
parentTemplate.setChildren(panelTemplateDTOChildren);
getTreeChildren(panelTemplateDTOChildren);
getTreeChildren(panelTemplateDTOChildren,dvType);
}));
}
@ -140,8 +140,8 @@ public class TemplateManageService implements TemplateManageApi {
templateMapper.deleteById(id);
}
@Override
public VisualizationTemplateVO findOne(String panelId) {
VisualizationTemplate template = templateMapper.selectById(panelId);
public VisualizationTemplateVO findOne(String templateId) {
VisualizationTemplate template = templateMapper.selectById(templateId);
if(template != null){
VisualizationTemplateVO templateVO = new VisualizationTemplateVO();
BeanUtils.copyBean(templateVO,template);

5
core/core-backend/src/main/java/io/dataease/visualization/manage/VisualizationTemplateExtendDataManage.java
View File

@ -27,11 +27,10 @@ public class VisualizationTemplateExtendDataManage {
public ChartViewDTO getChartDataInfo(Long viewId, ChartViewDTO view) {
QueryWrapper queryWrapper = new QueryWrapper();
queryWrapper.ne("view_id",viewId);
queryWrapper.eq("view_id",viewId);
List<VisualizationTemplateExtendData> extendDataList = extendDataMapper.selectList(queryWrapper);
if (CollectionUtils.isNotEmpty(extendDataList)) {
ChartViewDTO chartViewTemplate = JsonUtil.parse(extendDataList.get(0).getViewDetails(),ChartViewDTO.class);
Map<String, Object> dataInfo = chartViewTemplate.getData();
ChartViewDTO chartViewTemplate = JsonUtil.parseObject(extendDataList.get(0).getViewDetails(),ChartViewDTO.class);
view.setData(chartViewTemplate.getData());
} else {
DEException.throwException("模板缓存数据中未获取指定视图数据：" + viewId);

25
core/core-backend/src/main/java/io/dataease/visualization/server/DataVisualizationServer.java
View File

@ -82,8 +82,8 @@ public class DataVisualizationServer implements DataVisualizationApi {
@Override
@XpackInteract(value = "dataVisualizationServer", original = true)
public DataVisualizationVO findById(Long dvId,String busiFlag) {
DataVisualizationVO result = extDataVisualizationMapper.findDvInfo(dvId,busiFlag);
public DataVisualizationVO findById(Long dvId, String busiFlag) {
DataVisualizationVO result = extDataVisualizationMapper.findDvInfo(dvId, busiFlag);
if (result != null) {
//获取视图信息
List<ChartViewDTO> chartViewDTOS = chartViewManege.listBySceneId(dvId);
@ -154,7 +154,7 @@ public class DataVisualizationServer implements DataVisualizationApi {
*/
@Transactional
@Override
public void deleteLogic(Long dvId,String busiFlag) {
public void deleteLogic(Long dvId, String busiFlag) {
coreVisualizationManage.delete(dvId);
}
@ -261,31 +261,34 @@ public class DataVisualizationServer implements DataVisualizationApi {
// 解析动态数据
Map<String, String> dynamicDataMap = JsonUtil.parseObject(dynamicData, Map.class);
List<ChartViewDTO> chartViews = new ArrayList<>();
Map<Long,ChartViewDTO> canvasViewInfo = new HashMap<>();
Map<Long,VisualizationTemplateExtendDataDTO> extendDataInfo = new HashMap<>();
Map<Long, ChartViewDTO> canvasViewInfo = new HashMap<>();
Map<Long, VisualizationTemplateExtendDataDTO> extendDataInfo = new HashMap<>();
for (Map.Entry<String, String> entry : dynamicDataMap.entrySet()) {
String originViewId = entry.getKey();
String originViewData = entry.getValue();
String originViewData = JsonUtil.toJSONString(entry.getValue()).toString();
ChartViewDTO chartView = JsonUtil.parseObject(originViewData, ChartViewDTO.class);
if(chartView == null){
continue;
}
Long newViewId = IDUtils.snowID();
chartView.setId(newViewId);
chartView.setSceneId(newDvId);
chartView.setTableId(null);
chartView.setDataFrom(CommonConstants.VIEW_DATA_FROM.TEMPLATE);
// 数据处理 1.替换viewId 2.加入模板view data数据
VisualizationTemplateExtendDataDTO extendDataDTO = new VisualizationTemplateExtendDataDTO(newViewId, newDvId,originViewData);
VisualizationTemplateExtendDataDTO extendDataDTO = new VisualizationTemplateExtendDataDTO(newDvId, newViewId, originViewData);
extendDataInfo.put(newViewId, extendDataDTO);
templateData = templateData.replaceAll(originViewId, newViewId.toString());
chartViewManege.save(chartView);
canvasViewInfo.put(chartView.getId(),chartView);
canvasViewInfo.put(chartView.getId(), chartView);
//插入模版数据 此处预先插入减少数据交互量
VisualizationTemplateExtendData extendData = new VisualizationTemplateExtendData();
templateExtendDataMapper.insert(BeanUtils.copyBean(extendData,extendDataDTO));
templateExtendDataMapper.insert(BeanUtils.copyBean(extendData, extendDataDTO));
}
request.setComponentData(templateData);
request.setCanvasStyleData(templateStyle);
//Store static resource into the server
staticResourceServer.saveFilesToServe(staticResource);
return new DataVisualizationVO(newDvId,name,dvType,templateStyle,templateData,canvasViewInfo,null);
return new DataVisualizationVO(newDvId, name, dvType, templateStyle, templateData, canvasViewInfo, null);
}
@Override

4
core/core-backend/src/main/resources/application-standalone.yml
View File

@ -1,8 +1,8 @@
spring:
datasource:
url: jdbc:mysql://127.0.0.1:3306/de_standalone?autoReconnect=false&useUnicode=true&characterEncoding=UTF-8&characterSetResults=UTF-8&zeroDateTimeBehavior=convertToNull&useSSL=false
url: jdbc:mysql://localhost:3306/dataease?autoReconnect=false&useUnicode=true&characterEncoding=UTF-8&characterSetResults=UTF-8&zeroDateTimeBehavior=convertToNull&useSSL=false
username: root
password: Password123@mysql
password: 123456
messages:
basename: i18n/core,i18n/permissions
flyway:

1
core/core-frontend/src/assets/svg/dv-up-arrow.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1699933113241" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4024" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M426.752 344.149333v554.666667c0 23.68 19.285333 42.666667 43.093333 42.666667h84.48a42.666667 42.666667 0 0 0 43.093334-42.666667v-554.666667h84.949333c47.232 0 62.805333-30.549333 34.56-68.266666l-153.642667-204.8c-28.501333-37.973333-74.112-37.717333-102.4 0l-153.6 204.8c-28.501333 37.973333-12.8 68.266667 34.517334 68.266666h84.949333z" fill="#3D3D3D" p-id="4025"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 716 B

2
core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue
View File

@ -301,7 +301,7 @@ const reShow = () => {
const calcData = (view: Chart, callback) => {
isError.value = false
if (view.tableId) {
if (view.tableId || view['dataFrom'] === 'template') {
const v = JSON.parse(JSON.stringify(view))
getData(v)
.then(res => {

10
core/core-frontend/src/utils/imgUtils.ts
View File

@ -4,8 +4,10 @@ import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
import { storeToRefs } from 'pinia'
import { findResourceAsBase64 } from '@/api/staticResource'
import FileSaver from 'file-saver'
import { deepCopy } from '@/utils/utils'
const dvMainStore = dvMainStoreWithOut()
const { canvasStyleData, componentData, canvasViewInfo, dvInfo } = storeToRefs(dvMainStore)
const { canvasStyleData, componentData, canvasViewInfo, canvasViewDataInfo, dvInfo } =
storeToRefs(dvMainStore)
const basePath = import.meta.env.VITE_API_BASEPATH
export function imgUrlTrans(url) {
@ -29,6 +31,10 @@ export function download2AppTemplate(downloadType, canvasDom, name, callBack?) {
try {
findStaticSource(function (staticResource) {
html2canvas(canvasDom).then(canvas => {
const canvasViewDataTemplate = deepCopy(canvasViewInfo.value)
Object.keys(canvasViewDataTemplate).forEach(viewId => {
canvasViewDataTemplate[viewId].data = canvasViewDataInfo.value[viewId]
})
const snapshot = canvas.toDataURL('image/jpeg', 0.1) // 0.1是图片质量
if (snapshot !== '') {
const templateInfo = {
@ -38,7 +44,7 @@ export function download2AppTemplate(downloadType, canvasDom, name, callBack?) {
dvType: dvInfo.value.type,
canvasStyleData: JSON.stringify(canvasStyleData.value),
componentData: JSON.stringify(componentData.value),
dynamicData: JSON.stringify(canvasViewInfo.value),
dynamicData: JSON.stringify(canvasViewDataTemplate),
staticResource: JSON.stringify(staticResource || {})
}
const blob = new Blob([JSON.stringify(templateInfo)], { type: '' })

30
core/core-frontend/src/views/chart/components/editor/common/ChartTemplateInfo.vue Normal file
View File

@ -0,0 +1,30 @@
<script lang="tsx" setup></script>
<template>
<div class="template-check-info">
<div>
<Icon class-name="item-icon" name="dv-up-arrow" />
</div>
<div>当前为模版视图，请更换数据集...</div>
</div>
</template>
<style lang="less" scoped>
.template-check-info {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
font-size: 12px;
color: #9ea6b2;
width: 100%;
height: 100%;
flex-direction: column;
}
.item-icon {
width: 50%;
height: 50%;
opacity: 0.3;
}
</style>

2
core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue
View File

@ -58,7 +58,7 @@ const containerId = 'container-' + showPosition.value + '-' + view.value.id
const viewTrack = ref(null)
const calcData = (view, callback) => {
if (view.tableId) {
if (view.tableId || view['dataFrom'] === 'template') {
state.loading = true
isError.value = false
const v = JSON.parse(JSON.stringify(view))

2
core/core-frontend/src/views/chart/components/views/components/ChartComponentS2.vue
View File

@ -78,7 +78,7 @@ const containerId = 'container-' + showPosition.value + '-' + view.value.id
const viewTrack = ref(null)
const calcData = (view: Chart, callback, resetPageInfo = true) => {
if (view.tableId) {
if (view.tableId || view['dataFrom'] === 'template') {
isError.value = false
const v = JSON.parse(JSON.stringify(view))
getData(v)

3
core/core-frontend/src/views/chart/components/views/index.vue
View File

@ -501,7 +501,8 @@ const chartAreaShow = computed(() => {
(view.value.tableId &&
(element.value['state'] === undefined || element.value['state'] === 'ready')) ||
view.value.type === 'rich-text' ||
(view.value.type === 'map' && view.value.customAttr.map.id)
(view.value.type === 'map' && view.value.customAttr.map.id) ||
view.value['dataFrom'] === 'template'
)
})

11
core/core-frontend/src/views/common/DeResourceCreateOpt.vue
View File

@ -39,7 +39,7 @@
</el-row>
<el-row v-if="state.inputType === 'new_inner_template'" class="preview">
<el-col :span="8" style="height: 100%; overflow-y: auto">
<template-all-list
<de-template-preview-list
:template-list="state.templateList"
@showCurrentTemplateInfo="showCurrentTemplateInfo"
/>
@ -68,13 +68,13 @@ import { computed, reactive, ref, watch } from 'vue'
import { imgUrlTrans } from '@/utils/imgUtils'
import { ElMessage } from 'element-plus-secondary'
import { decompression } from '@/api/visualization/dataVisualization'
import { deepCopy } from '@/utils/utils'
import DeTemplatePreviewList from '@/views/common/DeTemplatePreviewList.vue'
const { t } = useI18n()
const emits = defineEmits(['finish'])
const files = ref(null)
const props = defineProps({
editPanelOut: {
type: Object,
curCanvasType: {
type: String,
required: true
}
})
@ -148,7 +148,8 @@ const showCurrentTemplateInfo = data => {
const getTree = () => {
const request = {
level: '-1',
level: '0',
leafDvType: props.curCanvasType,
withChildren: true
}
state.loading = true

18
core/core-frontend/src/views/common/DeResourceTree.vue
View File

@ -15,6 +15,8 @@ import router from '@/router'
import { useI18n } from '@/hooks/web/useI18n'
import _ from 'lodash'
import DeResourceCreateOpt from '@/views/common/DeResourceCreateOpt.vue'
import { useCache } from '@/hooks/web/useCache'
const { wsCache } = useCache()
const dvMainStore = dvMainStoreWithOut()
const { dvInfo } = storeToRefs(dvMainStore)
@ -95,7 +97,8 @@ const state = reactive({
divided: true
}
],
resourceTypeList: []
resourceTypeList: [],
templateCreatePid: 0
})
state.resourceTypeList = [
@ -244,6 +247,7 @@ const addOperation = (
window.open(baseUrl, '_blank')
}
} else if (cmd === 'newFromTemplate') {
state.templateCreatePid = data.id
// newFromTemplate
resourceCreateOpt.value.optInit()
} else {
@ -264,8 +268,18 @@ const resourceOptFinish = () => {
getTree()
}
const resourceCreateFinish = () => {
const resourceCreateFinish = templateData => {
// do create
wsCache.set(`de-template-data`, JSON.stringify(templateData))
const baseUrl =
curCanvasType.value === 'dataV'
? '#/dvCanvas?opt=create'
: '#/dashboard?opt=create&createType=template'
if (state.templateCreatePid) {
window.open(baseUrl + `&pid=${state.templateCreatePid}`, '_blank')
} else {
window.open(baseUrl, '_blank')
}
}
const getParentKeys = (tree, targetKey, parentKeys = []) => {

59
core/core-frontend/src/views/common/DeTemplateList.vue → core/core-frontend/src/views/common/DeTemplatePreviewList.vue
View File

@ -1,6 +1,6 @@
<template>
<el-col>
<el-row style="margin-top: 5px">
<el-row style="display: inherit; margin-top: 5px">
<el-row>
<el-input
v-model="state.templateFilterText"
@ -10,7 +10,7 @@
prefix-icon="el-icon-search"
/>
</el-row>
<el-row style="margin-top: 5px">
<el-row style="display: inherit; margin-top: 5px">
<el-tree
ref="templateTree"
:default-expanded-keys="state.defaultExpandedKeys"
@ -23,23 +23,17 @@
>
<template #default="{ data }">
<span class="custom-tree-node">
<span style="display: flex; flex: 1 1 0%; width: 0px">
<span v-if="data.nodeType === 'template'">
<svg-icon icon-class="panel" class="ds-icon-scene" />
</span>
<span v-if="data.nodeType === 'folder'">
<i class="el-icon-folder" />
</span>
<span
:title="data.name"
style="
margin-left: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
"
>{{ data.name }}</span
>
<span class="custom-label">
<el-icon style="font-size: 18px" v-if="data.nodeType === 'folder'">
<Icon name="dv-folder"></Icon>
</el-icon>
<el-icon style="font-size: 18px" v-else-if="data.dvType === 'dashboard'">
<Icon name="dv-dashboard-spine"></Icon>
</el-icon>
<el-icon class="icon-screen-new" style="font-size: 18px" v-else>
<Icon name="icon_operation-analysis_outlined"></Icon>
</el-icon>
<span :title="data.name" class="custom-name">{{ data.name }}</span>
</span>
</span>
</template>
@ -57,6 +51,10 @@ const { t } = useI18n()
const emits = defineEmits(['showCurrentTemplateInfo'])
const props = defineProps({
curCanvasType: {
type: String,
required: true
},
templateList: {
type: Array,
default: function () {
@ -77,13 +75,28 @@ const filterNode = (value, data) => {
}
const nodeClick = (data, node) => {
findOne(data.id).then(res => {
emits('showCurrentTemplateInfo', res.data)
})
if (data.nodeType === 'template') {
findOne(data.id).then(res => {
emits('showCurrentTemplateInfo', res.data)
})
}
}
</script>
<style scoped>
<style scoped lang="less">
.custom-label {
display: flex;
flex: 1 1 0%;
width: 0px;
}
.custom-name {
margin-left: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.custom-tree-node {
flex: 1;
display: flex;

10
core/core-frontend/src/views/dashboard/index.vue
View File

@ -54,7 +54,7 @@ const viewEditorShow = computed(() => {
onMounted(() => {
window.addEventListener('storage', eventCheck)
initDataset()
const { resourceId, opt, pid } = window.DataEaseBi || router.currentRoute.value.query
const { resourceId, opt, pid, createType } = window.DataEaseBi || router.currentRoute.value.query
state.sourcePid = pid
if (resourceId) {
dataInitState.value = false
@ -65,6 +65,14 @@ onMounted(() => {
dataInitState.value = false
nextTick(() => {
dvMainStore.createInit('dashboard', null, pid)
// 从模版新建
if (createType === 'template') {
const deTemplateDataStr = wsCache.get(`de-template-data`)
const deTemplateData = JSON.parse(deTemplateDataStr)
dvMainStore.setComponentData(JSON.parse(deTemplateData['componentData']))
dvMainStore.setCanvasStyle(JSON.parse(deTemplateData['canvasStyleData']))
dvMainStore.setCanvasViewInfo(deTemplateData['canvasViewInfo'])
}
dataInitState.value = true
// preOpt
canvasStyleData.value.component.chartTitle.color = '#000000'

6
sdk/api/api-base/src/main/java/io/dataease/api/template/TemplateManageApi.java
View File

@ -9,7 +9,7 @@ import java.util.List;
public interface TemplateManageApi {
@PostMapping("/templateList")
List<TemplateManageDTO> templateList(TemplateManageRequest request);
List<TemplateManageDTO> templateList(@RequestBody TemplateManageRequest request);
@PostMapping("/save")
TemplateManageDTO save(@RequestBody TemplateManageRequest request);
@ -17,8 +17,8 @@ public interface TemplateManageApi {
@DeleteMapping("/delete/{id}")
void delete(@PathVariable String id);
@GetMapping("/findOne/{id}")
VisualizationTemplateVO findOne(@PathVariable String id) throws Exception;
@GetMapping("/findOne/{templateId}")
VisualizationTemplateVO findOne(@PathVariable String templateId) throws Exception;
@PostMapping("/find")
List<TemplateManageDTO> find(@RequestBody TemplateManageRequest request);

5
sdk/api/api-base/src/main/java/io/dataease/api/template/request/TemplateManageRequest.java
View File

@ -19,11 +19,14 @@ public class TemplateManageRequest extends VisualizationTemplateVO {
private Boolean withChildren = false;
private String leafDvType;
public TemplateManageRequest() {
}
public TemplateManageRequest(String pid) {
public TemplateManageRequest(String pid,String dvType) {
super.setPid(pid);
super.setDvType(dvType);
withBlobs="N";
}
}