feat(图表): 添加指标名称位置配置选项

在指标组件中新增名称位置(top/bottom)配置功能，并更新多语言支持

core/core-frontend/src/custom-component/indicator/DeIndicator.vue

@@ -255,6 +255,7 @@ const showSuffix = ref<boolean>(DEFAULT_INDICATOR_STYLE.suffixEnable)
 const suffixContent = ref('')
 
 const indicatorNameShow = ref(false)
+const indicatorNamePositionBottom = ref(true)
 
 const indicatorNameWrapperStyle = reactive<CSSProperties>({
   'margin-top': DEFAULT_INDICATOR_NAME_STYLE.nameValueSpacing + 'px'
@@ -369,8 +370,10 @@ const renderChart = async view => {
       }
       indicatorNameWrapperStyle['margin-top'] =
         (indicatorName.nameValueSpacing ?? DEFAULT_INDICATOR_NAME_STYLE.nameValueSpacing) + 'px'
+      indicatorNamePositionBottom.value = indicatorName.namePosition !== 'top'
     } else {
       indicatorNameShow.value = false
+      indicatorNamePositionBottom.value = false
     }
   }
 }
@@ -595,11 +598,16 @@ defineExpose({
       @trackClick="trackClick"
       :is-data-v-mobile="dataVMobile"
     />
+    <div v-if="indicatorNameShow && !indicatorNamePositionBottom">
+      <span :style="indicatorNameClass">{{ resultName }}</span>
+      <div :style="indicatorNameWrapperStyle"></div>
+    </div>
     <div>
       <span :style="indicatorClass">{{ formattedResult }}</span>
       <span :style="indicatorSuffixClass" v-if="showSuffix">{{ suffixContent }}</span>
     </div>
-    <div :style="indicatorNameWrapperStyle" v-if="indicatorNameShow">
+    <div v-if="indicatorNameShow && indicatorNamePositionBottom">
+      <div :style="indicatorNameWrapperStyle"></div>
       <span :style="indicatorNameClass">{{ resultName }}</span>
     </div>
   </div>

core/core-frontend/src/locales/en.ts

@@ -1821,6 +1821,9 @@ export default {
     dimension_text_style: 'Name style',
     dimension_letter_space: 'Name letter spacing',
     name_value_spacing: 'Name/value spacing',
+    name_position: 'Position',
+    name_position_top: 'Top',
+    name_position_bottom: 'Bottom',
     font_family: 'Font',
     letter_space: 'Letter spacing',
     font_shadow: 'Font shadow',

core/core-frontend/src/locales/tw.ts

@@ -1777,6 +1777,9 @@ export default {
     dimension_text_style: '名稱樣式',
     dimension_letter_space: '名稱字間距',
     name_value_spacing: '名稱/值間距',
+    name_position: '位置',
+    name_position_top: '上方',
+    name_position_bottom: '下方',
     font_family: '字體',
     letter_space: '字間距',
     font_shadow: '字體陰影',

core/core-frontend/src/locales/zh-CN.ts

@@ -1785,6 +1785,9 @@ export default {
     dimension_text_style: '名称样式',
     dimension_letter_space: '名称字间距',
     name_value_spacing: '名称/值间距',
+    name_position: '位置',
+    name_position_top: '上方',
+    name_position_bottom: '下方',
     font_family: '字体',
     letter_space: '字间距',
     font_shadow: '字体阴影',

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

@@ -1301,6 +1301,10 @@ declare interface ChartIndicatorNameStyle {
    * 指标/名称间距
    */
   nameValueSpacing: number
+  /**
+   * 指标名称位置
+   */
+  namePosition?: 'top' | 'bottom'
 }
 
 /**

core/core-frontend/src/views/chart/components/editor/editor-style/components/IndicatorNameSelector.vue

@@ -45,6 +45,11 @@ const fontFamily = CHART_FONT_FAMILY_ORIGIN.concat(
 )
 const fontLetterSpace = CHART_FONT_LETTER_SPACE
 
+const namePositionList = [
+  { name: t('chart.name_position_top'), value: 'top' },
+  { name: t('chart.name_position_bottom'), value: 'bottom' }
+]
+
 const state = reactive({
   indicatorNameForm: JSON.parse(JSON.stringify(DEFAULT_INDICATOR_NAME_STYLE)),
   basicStyleForm: {} as ChartBasicStyle
@@ -275,6 +280,27 @@ defineExpose({ getFormData })
           @change="changeTitleStyle('nameValueSpacing')"
         />
       </el-form-item>
+      <el-form-item
+        class="form-item name-value-spacing-input"
+        :class="'form-item-' + themes"
+        :label="t('chart.name_position')"
+      >
+        <el-select
+          :effect="themes"
+          v-model="state.indicatorNameForm.namePosition"
+          size="small"
+          style="width: 100%"
+          @change="changeTitleStyle('namePosition')"
+        >
+          <el-option
+            class="custom-style-option"
+            v-for="option in namePositionList"
+            :key="option.value"
+            :label="option.name"
+            :value="option.value"
+          />
+        </el-select>
+      </el-form-item>
     </el-form>
   </div>
 </template>

core/core-frontend/src/views/chart/components/editor/util/chart.ts

@@ -548,7 +548,8 @@ export const DEFAULT_INDICATOR_NAME_STYLE: ChartIndicatorNameStyle = {
   fontFamily: 'Microsoft YaHei',
   letterSpace: 0,
   fontShadow: false,
-  nameValueSpacing: 0
+  nameValueSpacing: 0,
+  namePosition: 'bottom'
 }
 
 export const DEFAULT_TITLE_STYLE_BASE: ChartTextStyle = {