From 671f033eb04dc7814ef26c294435ff0a97c613bb Mon Sep 17 00:00:00 2001
From: jianneng-fit2cloud <jianneng.pan@fit2cloud.com>
Date: Thu, 6 Jun 2024 11:26:29 +0800
Subject: [PATCH] =?UTF-8?q?style(=E5=9B=BE=E8=A1=A8-=E5=AF=B9=E7=A7=B0?=
 =?UTF-8?q?=E6=9D=A1=E5=BD=A2=E5=9B=BE):=20=E5=9E=82=E7=9B=B4=E6=96=B9?=
 =?UTF-8?q?=E5=90=91=E6=97=B6=E8=BD=B4=E7=BA=BF=E7=9A=84=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/DualYAxisSelector.vue          |  2 ++
 .../components/DualYAxisSelectorInner.vue     | 25 ++++++++++++++++---
 .../editor-style/components/XAxisSelector.vue | 14 +++++++++--
 .../js/panel/charts/bar/bidirectional-bar.ts  |  3 ++-
 4 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelector.vue
index d517d7e56e..8b55883384 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelector.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelector.vue
@@ -101,6 +101,7 @@ onMounted(() => {
         :themes="themes"
         type="left"
         :chart-type="chart.type"
+        :layout="chart.customAttr.basicStyle.layout"
         @on-change-y-axis-form="changeAxisStyle"
       />
     </el-tab-pane>
@@ -120,6 +121,7 @@ onMounted(() => {
         :themes="themes"
         type="right"
         :chart-type="chart.type"
+        :layout="chart.customAttr.basicStyle.layout"
         @on-change-y-axis-form="changeSubAxisStyle"
       />
     </el-tab-pane>
diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelectorInner.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelectorInner.vue
index a950e0d2a3..c859c97e7e 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelectorInner.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/DualYAxisSelectorInner.vue
@@ -14,6 +14,7 @@ const props = withDefaults(
     propertyInner?: Array<string>
     type?: 'left' | 'right'
     chartType?: string
+    layout?: string
   }>(),
   {
     themes: 'dark',
@@ -75,6 +76,14 @@ const init = () => {
 
 const showProperty = prop => props.propertyInner?.includes(prop)
 
+const isBidirectionalBar = computed(() => {
+  return props.chartType === 'bidirectional-bar'
+})
+
+const isVerticalLayout = computed(() => {
+  return props.layout === 'vertical'
+})
+
 onMounted(() => {
   init()
 })
@@ -99,9 +108,19 @@ onMounted(() => {
         size="small"
         @change="changeAxisStyle('position')"
       >
-        <div v-if="chartType === 'bidirectional-bar'">
-          <el-radio :effect="props.themes" label="right">{{ t('chart.text_pos_top') }}</el-radio>
-          <el-radio :effect="props.themes" label="left">{{ t('chart.text_pos_bottom') }}</el-radio>
+        <div v-if="isBidirectionalBar">
+          <div v-if="isVerticalLayout">
+            <el-radio :effect="props.themes" label="left">{{ t('chart.text_pos_left') }}</el-radio>
+            <el-radio :effect="props.themes" label="right">{{
+              t('chart.text_pos_right')
+            }}</el-radio>
+          </div>
+          <div v-else>
+            <el-radio :effect="props.themes" label="right">{{ t('chart.text_pos_top') }}</el-radio>
+            <el-radio :effect="props.themes" label="left">{{
+              t('chart.text_pos_bottom')
+            }}</el-radio>
+          </div>
         </div>
         <div v-else>
           <el-radio :effect="props.themes" label="left">{{ t('chart.text_pos_left') }}</el-radio>
diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/XAxisSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/XAxisSelector.vue
index bd357bd5e2..cc8b6151e2 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/XAxisSelector.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/XAxisSelector.vue
@@ -100,6 +100,14 @@ const init = () => {
 
 const showProperty = prop => props.propertyInner?.includes(prop)
 
+const isBidirectionalBar = computed(() => {
+  return props.chart.type === 'bidirectional-bar'
+})
+
+const isHorizontalLayout = computed(() => {
+  return props.chart.customAttr.basicStyle.layout === 'horizontal'
+})
+
 onMounted(() => {
   init()
 })
@@ -124,8 +132,10 @@ onMounted(() => {
         size="small"
         @change="changeAxisStyle('position')"
       >
-        <div v-if="chart.type === 'bidirectional-bar'">
-          <el-radio :effect="props.themes" label="top">{{ t('chart.text_pos_left') }}</el-radio>
+        <div v-if="isBidirectionalBar">
+          <el-radio :effect="props.themes" label="top">{{
+            isHorizontalLayout ? t('chart.text_pos_left') : t('chart.text_pos_top')
+          }}</el-radio>
           <el-radio :effect="props.themes" label="bottom">{{
             t('chart.text_pos_center')
           }}</el-radio>
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
index f5ce555ec9..9da46bd810 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
@@ -325,8 +325,9 @@ export class BidirectionalHorizontalBar extends G2PlotChartView<
         valueExt: undefined
       }
     }
+    const layoutHorizontal = options.layout === 'horizontal'
     // 处理横轴标题方向不对
-    if (yAxis && yAxis['title']) {
+    if (yAxis && yAxis['title'] && layoutHorizontal) {
       yAxis['title'].autoRotate = false
     }
     const yAxisTmp = parseJson(chart.customStyle).yAxis