From d5b4ce08afb06af73e5fcee68eb3e47f3520531b Mon Sep 17 00:00:00 2001
From: jianneng-fit2cloud <jianneng.pan@fit2cloud.com>
Date: Mon, 26 Aug 2024 16:27:38 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BE=E8=A1=A8-K=E7=BA=BF=E5=9B=BE):?=
 =?UTF-8?q?=20=E6=94=AF=E6=8C=81=E9=85=8D=E7=BD=AE=E5=9B=BE=E4=BE=8B?=
 =?UTF-8?q?=E7=9A=84=E6=96=87=E5=AD=97=E6=A0=B7=E5=BC=8F=EF=BC=8C=E5=8C=85?=
 =?UTF-8?q?=E6=8B=AC=E9=A2=9C=E8=89=B2=E5=8F=8A=E5=A4=A7=E5=B0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../editor/drag-item/DragPlaceholder.vue      | 10 ++++-
 .../views/chart/components/editor/index.vue   |  5 ++-
 .../js/panel/charts/line/stock-line.ts        | 45 +++++++++++++++++--
 3 files changed, 55 insertions(+), 5 deletions(-)

diff --git a/core/core-frontend/src/views/chart/components/editor/drag-item/DragPlaceholder.vue b/core/core-frontend/src/views/chart/components/editor/drag-item/DragPlaceholder.vue
index cfc3269e88..82555cc2bc 100644
--- a/core/core-frontend/src/views/chart/components/editor/drag-item/DragPlaceholder.vue
+++ b/core/core-frontend/src/views/chart/components/editor/drag-item/DragPlaceholder.vue
@@ -8,6 +8,10 @@ const props = defineProps({
     type: Array,
     required: true
   },
+  marginTop: {
+    type: String,
+    default: '0'
+  },
   themes: {
     type: String as PropType<EditorTheme>,
     default: 'dark'
@@ -17,7 +21,11 @@ const props = defineProps({
 
 <template>
   <div>
-    <div v-if="!props.dragList || props.dragList.length === 0" class="drag-placeholder-style">
+    <div
+      v-if="!props.dragList || props.dragList.length === 0"
+      :style="'margin-top:' + props.marginTop"
+      class="drag-placeholder-style"
+    >
       <span
         class="drag-placeholder-style-span"
         :class="{ 'drag-placeholder-style-span--dark': themes === 'dark' }"
diff --git a/core/core-frontend/src/views/chart/components/editor/index.vue b/core/core-frontend/src/views/chart/components/editor/index.vue
index 80eca7e475..de4e6bb206 100644
--- a/core/core-frontend/src/views/chart/components/editor/index.vue
+++ b/core/core-frontend/src/views/chart/components/editor/index.vue
@@ -2264,7 +2264,10 @@ const deleteChartFieldItem = id => {
                                 />
                               </template>
                             </draggable>
-                            <drag-placeholder :drag-list="view.yAxis" />
+                            <drag-placeholder
+                              :margin-top="view.type === 'stock-line' ? '9px' : '0'"
+                              :drag-list="view.yAxis"
+                            />
                           </div>
                         </el-row>
                         <!-- xAxisExtRight -->
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/line/stock-line.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/line/stock-line.ts
index 1775d25737..625a002ad5 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/line/stock-line.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/line/stock-line.ts
@@ -8,6 +8,7 @@ import { LINE_EDITOR_PROPERTY_INNER } from '@/views/chart/components/js/panel/ch
 import { useI18n } from '@/hooks/web/useI18n'
 import { valueFormatter } from '@/views/chart/components/js/formatter'
 import type { Options } from '@antv/g2plot/esm'
+import { MixOptions } from '@antv/g2plot'
 
 const { t } = useI18n()
 const DEFAULT_DATA = []
@@ -19,6 +20,7 @@ export class StockLine extends G2PlotChartView<MixOptions, Mix> {
     'background-overall-component',
     'border-style',
     'basic-style-selector',
+    'legend-selector',
     'x-axis-selector',
     'y-axis-selector',
     'title-selector',
@@ -39,7 +41,8 @@ export class StockLine extends G2PlotChartView<MixOptions, Mix> {
       'axisLine',
       'splitLine',
       'axisLabelFormatter'
-    ]
+    ],
+    'legend-selector': ['fontSize', 'color', 'show']
   }
   axis: AxisType[] = ['xAxis', 'yAxis', 'filter', 'extLabel', 'extTooltip']
   axisConfig = {
@@ -244,8 +247,8 @@ export class StockLine extends G2PlotChartView<MixOptions, Mix> {
               ['L', x - width - 1 / 2, y + height / 2],
               ['Z'],
               // 中线
-              ['M', x, y + width + 2],
-              ['L', x, x - width - 1]
+              ['M', x, y + 10 / 2],
+              ['L', x, y - 10 / 2]
             ]
           },
           style: { fill: 'red', stroke: 'red', lineWidth: 2 }
@@ -613,6 +616,41 @@ export class StockLine extends G2PlotChartView<MixOptions, Mix> {
     }
     return options
   }
+  protected configLegend(chart: Chart, options: MixOptions): MixOptions {
+    let legend = {}
+    let customStyle: CustomStyle
+    const stockPlot = options.plots.filter(item => item.type === 'stock')[0]
+    if (chart.customStyle) {
+      customStyle = parseJson(chart.customStyle)
+      // legend
+      if (customStyle.legend) {
+        const l = JSON.parse(JSON.stringify(customStyle.legend))
+        if (l.show) {
+          legend = {
+            ...stockPlot.options.legend,
+            itemName: {
+              style: {
+                fill: l.color,
+                fontSize: l.fontSize
+              }
+            }
+          }
+        } else {
+          legend = false
+        }
+      }
+    }
+    const newPlots = []
+    const stockOption = {
+      ...stockPlot.options,
+      legend: legend
+    }
+    newPlots.push({ ...stockPlot, options: stockOption })
+    return {
+      ...options,
+      plots: newPlots
+    }
+  }
 
   protected setupOptions(chart: Chart, options: MixOptions): MixOptions {
     return flow(
@@ -621,6 +659,7 @@ export class StockLine extends G2PlotChartView<MixOptions, Mix> {
       this.configXAxis,
       this.configYAxis,
       this.configTooltip,
+      this.configLegend,
       this.customConfigEmptyDataStrategy
     )(chart, options)
   }