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

core/core-backend/src/main/java/io/dataease/chart/manage/ChartDataManage.java

@@ -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);

core/core-frontend/src/custom-component/component-group/UserViewGroup.vue

@@ -81,7 +81,10 @@ const loadPluginCategory = data => {
     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
       }
     }

core/core-frontend/src/models/chart/chart.d.ts

@@ -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>>

core/core-frontend/src/views/chart/components/views/index.vue

@@ -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,11 +474,23 @@ const calcData = params => {
   dvMainStore.setLastViewRequestInfo(params.id, params.chartExtRequest)
   if (chartComponent?.value) {
     loading.value = true
+    if (view.value.isPlugin) {
+      chartComponent?.value?.invokeMethod({
+        methodName: 'calcData',
+        args: [
+          params,
+          res => {
+            loading.value = false
+          }
+        ]
+      })
+    } else {
       chartComponent?.value?.calcData?.(params, res => {
         loading.value = false
       })
     }
   }
+}
 
 const showChartView = (...libs: ChartLibraryType[]) => {
   if (view.value?.render && view.value?.type) {
@@ -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>