Merge branch 'dev-v2' into pr@dev-v2@fixDatasource

README.md

@@ -4,7 +4,6 @@
   <a href="https://www.gnu.org/licenses/gpl-3.0.html"><img src="https://img.shields.io/github/license/dataease/dataease?color=%231890FF" alt="License: GPL v3"></a>
   <a href="https://app.codacy.com/gh/dataease/dataease?utm_source=github.com&utm_medium=referral&utm_content=dataease/dataease&utm_campaign=Badge_Grade_Dashboard"><img src="https://app.codacy.com/project/badge/Grade/da67574fd82b473992781d1386b937ef" alt="Codacy"></a>
   <a href="https://github.com/dataease/dataease"><img src="https://img.shields.io/github/stars/dataease/dataease?color=%231890FF&style=flat-square" alt="Stars"></a>
-  <a href="https://app.fossa.com/projects/git%2Bgithub.com%2F1dataease%2Fdataease?ref=badge_shield"><img src="https://app.fossa.com/api/projects/git%2Bgithub.com%2Fdataease%2Fdataease.svg?type=shield" alt="FOSSA Status"></a>  
 </p>
 
 |说明|
@@ -16,9 +15,7 @@
 
 DataEase 是开源的数据可视化分析工具，帮助用户快速分析数据并洞察业务趋势，从而实现业务的改进与优化。DataEase 支持丰富的数据源连接，能够通过拖拉拽方式快速制作图表，并可以方便的与他人分享。
 
-**DataEase 的工作原理：**
+![DataEase 概览图](https://github.com/dataease/dataease/assets/41712985/ef020c86-68e0-43a3-8054-f51463eae361)
-
-![image](https://github.com/dataease/dataease/assets/41712985/68d46fac-985e-4d1d-8548-2baadf9cd2e8)
 
 **DataEase 的优势：**
 

core/core-frontend/src/components/collapse-switch-item/src/CollapseSwitchItem.vue

@@ -49,7 +49,7 @@ const switchValue = computed({
           :effect="themes"
           size="small"
           v-model="switchValue"
-          @click.stop="e => onSwitchChange(e)"
+          @click.stop="onSwitchChange"
         />
       </div>
     </template>
@@ -63,5 +63,18 @@ const switchValue = computed({
   align-items: center;
   padding-right: 8px;
   flex-grow: 1;
+  :deep(.ed-switch.is-checked .ed-switch__core > .ed-switch__action) {
+    left: calc(100% - 12px);
+  }
+  :deep(span.ed-switch__core) {
+    min-width: 24px;
+    border: none;
+    height: 6px;
+    border-radius: 3px;
+    .ed-switch__action {
+      left: 0;
+      box-shadow: 0 2px 4px rgba(31, 35, 41, 0.12);
+    }
+  }
 }
 </style>

core/core-frontend/src/store/modules/data-visualization/dvMain.ts

@@ -577,7 +577,11 @@ export const dvMainStore = defineStore('dataVisualization', {
           } else {
             viewInfo[propertyInfo.custom][propertyInfo.property] = propertyInfo.value
           }
-          useEmitt().emitter.emit('renderChart-' + viewId, viewInfo)
+          if (['tablePageMode', 'tablePageSize'].includes(propertyInfo.subProp)) {
+            useEmitt().emitter.emit('calcData-' + viewId, viewInfo)
+          } else {
+            useEmitt().emitter.emit('renderChart-' + viewId, viewInfo)
+          }
         })
       } else {
         this.componentData.forEach(component => {

core/core-frontend/src/utils/DeShortcutKey.ts

@@ -83,6 +83,11 @@ const checkDialog = () => {
       haveDialog = true
     }
   })
+  document.querySelectorAll('.ed-popover').forEach(element => {
+    if (window.getComputedStyle(element).getPropertyValue('display') != 'none') {
+      haveDialog = true
+    }
+  })
   // 富文本单框
   if (document.querySelector('.tox-dialog-wrap')) {
     haveDialog = true

core/core-frontend/src/views/chart/components/js/panel/charts/line/line.ts

@@ -5,7 +5,7 @@ import {
 import { Line as G2Line, LineOptions } from '@antv/g2plot/esm/plots/line'
 import { getPadding } from '../../common/common_antv'
 import { flow, hexColorToRGBA, parseJson } from '@/views/chart/components/js/util'
-import { cloneDeep } from 'lodash-es'
+import { cloneDeep, isEmpty } from 'lodash-es'
 import { valueFormatter } from '@/views/chart/components/js/formatter'
 import {
   LINE_AXIS_TYPE,
@@ -214,11 +214,67 @@ export class Line extends G2PlotChartView<LineOptions, G2Line> {
     return tmpOptions
   }
 
+  protected configTooltip(chart: Chart, options: LineOptions): LineOptions {
+    const customAttr: DeepPartial<ChartAttr> = parseJson(chart.customAttr)
+    const tooltipAttr = customAttr.tooltip
+    if (!tooltipAttr.show) {
+      return {
+        ...options,
+        tooltip: false
+      }
+    }
+    const xAxisExt = chart.xAxisExt
+    const formatterMap = tooltipAttr.seriesTooltipFormatter
+      ?.filter(i => i.show)
+      .reduce((pre, next) => {
+        pre[next.id] = next
+        return pre
+      }, {}) as Record<string, SeriesFormatter>
+    const tooltip: LineOptions['tooltip'] = {
+      showTitle: true,
+      customItems(originalItems) {
+        if (!tooltipAttr.seriesTooltipFormatter?.length) {
+          return originalItems
+        }
+        const head = originalItems[0]
+        // 非原始数据
+        if (!head.data.quotaList) {
+          return originalItems
+        }
+        const result = []
+        originalItems
+          .filter(item => formatterMap[item.data.quotaList[0].id])
+          .forEach(item => {
+            const formatter = formatterMap[item.data.quotaList[0].id]
+            const value = valueFormatter(parseFloat(item.value as string), formatter.formatterCfg)
+            let name = isEmpty(formatter.chartShowName) ? formatter.name : formatter.chartShowName
+            if (xAxisExt?.length > 0) {
+              name = item.data.category
+            }
+            result.push({ ...item, name, value })
+          })
+        head.data.dynamicTooltipValue?.forEach(item => {
+          const formatter = formatterMap[item.fieldId]
+          if (formatter) {
+            const value = valueFormatter(parseFloat(item.value), formatter.formatterCfg)
+            const name = isEmpty(formatter.chartShowName) ? formatter.name : formatter.chartShowName
+            result.push({ color: 'grey', name, value })
+          }
+        })
+        return result
+      }
+    }
+    return {
+      ...options,
+      tooltip
+    }
+  }
+
   protected setupOptions(chart: Chart, options: LineOptions): LineOptions {
     return flow(
       this.configTheme,
       this.configLabel,
-      this.configMultiSeriesTooltip,
+      this.configTooltip,
       this.configBasicStyle,
       this.configCustomColors,
       this.configLegend,

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

@@ -108,18 +108,21 @@ const renderChartFromDialog = (viewInfo: Chart, chartDataInfo) => {
   chartData.value = chartDataInfo
   renderChart(viewInfo, false)
 }
-const renderChart = (view: Chart, resetPageInfo: boolean) => {
+const renderChart = (viewInfo: Chart, resetPageInfo: boolean) => {
-  if (!view) {
+  if (!viewInfo) {
     return
   }
   // view 为引用对象 需要存库 view.data 直接赋值会导致保存不必要的数据
   const chart = {
-    ...defaultsDeep(view, cloneDeep(BASE_VIEW_CONFIG)),
+    ...defaultsDeep(viewInfo, cloneDeep(BASE_VIEW_CONFIG)),
     data: chartData.value
   } as ChartObj
   setupPage(chart, resetPageInfo)
   myChart?.destroy()
-  const chartView = chartViewManager.getChartView(view.render, view.type) as S2ChartView<any>
+  const chartView = chartViewManager.getChartView(
+    viewInfo.render,
+    viewInfo.type
+  ) as S2ChartView<any>
   myChart = chartView.drawChart({
     container: containerId,
     chart: toRaw(chart),