refactor(视图): 插件数据获取和显示

This commit is contained in:
wisonic-s 2024-07-01 19:22:21 +08:00
parent d3dd60bbc1
commit f5e5ca56a5
4 changed files with 77 additions and 5 deletions

View File

@ -352,6 +352,7 @@ public class ChartDataManage {
Dimension2SQLObj.dimension2sqlObj(sqlMeta, xAxis, FieldUtil.transFields(allFields), crossDs, dsMap);
Quota2SQLObj.quota2sqlObj(sqlMeta, yAxis, FieldUtil.transFields(allFields), crossDs, dsMap);
String querySql = SQLProvider.createQuerySQL(sqlMeta, true, needOrder, view);
querySql = SqlUtils.rebuildSQL(querySql, sqlMeta, crossDs, dsMap);
filterResult.getContext().put("querySql", querySql);
}
ChartCalcDataResult calcResult = chartHandler.calcChartResult(view, formatResult, filterResult, sqlMap, sqlMeta, calciteProvider);

View File

@ -81,7 +81,10 @@ const loadPluginCategory = data => {
while (stack?.length) {
const parent = stack.pop()
if (parent.category === category) {
parent.details.push(node)
const chart = parent.details.find(chart => chart.value === node.value)
if (!chart) {
parent.details.push(node)
}
findParent = true
}
}

View File

@ -57,6 +57,7 @@ declare interface Chart {
jumpActive: boolean
aggregate?: boolean
plugin?: CustomPlugin
isPlugin: boolean
}
declare type CustomAttr = DeepPartial<ChartAttr> | JSONString<DeepPartial<ChartAttr>>
declare type CustomStyle = DeepPartial<ChartStyle> | JSONString<DeepPartial<ChartStyle>>

View File

@ -45,6 +45,7 @@ import DeRichTextView from '@/custom-component/rich-text/DeRichTextView.vue'
import ChartEmptyInfo from '@/views/chart/components/views/components/ChartEmptyInfo.vue'
import { snapshotStoreWithOut } from '@/store/modules/data-visualization/snapshot'
import { viewFieldTimeTrans } from '@/utils/viewUtils'
import { CHART_TYPE_CONFIGS } from '@/views/chart/components/editor/util/chart'
const { wsCache } = useCache()
const chartComponent = ref<any>()
@ -473,9 +474,21 @@ const calcData = params => {
dvMainStore.setLastViewRequestInfo(params.id, params.chartExtRequest)
if (chartComponent?.value) {
loading.value = true
chartComponent?.value?.calcData?.(params, res => {
loading.value = false
})
if (view.value.isPlugin) {
chartComponent?.value?.invokeMethod({
methodName: 'calcData',
args: [
params,
res => {
loading.value = false
}
]
})
} else {
chartComponent?.value?.calcData?.(params, res => {
loading.value = false
})
}
}
}
@ -693,6 +706,55 @@ const showActionIcons = computed(() => {
}
return trackMenu.value.length > 0 || state.title_remark.show
})
const chartConfigs = ref(CHART_TYPE_CONFIGS)
const pluginLoaded = computed(() => {
let result = false
chartConfigs.value.forEach(cat => {
result = cat.details.find(chart => view.value?.type === chart.value) !== undefined
})
return result
})
// TODO
const loadPluginCategory = data => {
data.forEach(item => {
const { category, title, render, chartValue, chartTitle, icon, staticMap } = item
const node = {
render,
category,
icon,
value: chartValue,
title: chartTitle,
isPlugin: true,
staticMap
}
if (view.value?.type === node.value) {
view.value.plugin = {
isPlugin: true,
staticMap
}
}
const stack = [...chartConfigs.value]
let findParent = false
while (stack?.length) {
const parent = stack.pop()
if (parent.category === category) {
const chart = parent.details.find(chart => chart.value === node.value)
if (!chart) {
parent.details.push(node)
}
findParent = true
}
}
if (!findParent) {
stack.push({
category,
title,
display: 'show',
details: [node]
})
}
})
}
</script>
<template>
@ -761,7 +823,7 @@ const showActionIcons = computed(() => {
<!--这里去渲染不同图库的图表-->
<div v-if="chartAreaShow" style="flex: 1; overflow: hidden">
<plugin-component
v-if="view.plugin?.isPlugin"
v-if="view.isPlugin"
:jsname="view.plugin.staticMap['index']"
:scale="scale"
:dynamic-area-id="dynamicAreaId"
@ -831,6 +893,11 @@ const showActionIcons = computed(() => {
ref="openHandler"
jsname="L2NvbXBvbmVudC9lbWJlZGRlZC1pZnJhbWUvT3BlbkhhbmRsZXI="
/>
<XpackComponent
v-if="!pluginLoaded && view.isPlugin"
jsname="L2NvbXBvbmVudC9wbHVnaW5zLWhhbmRsZXIvVmlld0NhdGVnb3J5SGFuZGxlcg=="
@load-plugin-category="loadPluginCategory"
/>
</div>
</template>