From 49ed6a9bcb4d1583df484b580ce993ef5ecd690c Mon Sep 17 00:00:00 2001
From: hailin <hailin.zhao@gdzx.xyz>
Date: Sun, 5 Apr 2026 03:13:14 -0700
Subject: [PATCH] fix: axis title auto-visible on input + add show/hide
 switches

- Typing axis title text auto-sets titleVisible=true
- Added switches for: show axis, show axis title, show grid lines

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../components/configPanel/AxisConfig.tsx     | 29 ++++++++++++-------
 1 file changed, 19 insertions(+), 10 deletions(-)

diff --git a/frontend/src/frameworks/components/configPanel/AxisConfig.tsx b/frontend/src/frameworks/components/configPanel/AxisConfig.tsx
index e5288b7..2869a55 100644
--- a/frontend/src/frameworks/components/configPanel/AxisConfig.tsx
+++ b/frontend/src/frameworks/components/configPanel/AxisConfig.tsx
@@ -15,6 +15,7 @@ export default function AxisConfig({ axis }: AxisConfigProps) {
   const { chart, setStyle } = useChartConfig();
   const key = axis === 'x' ? 'xAxis' : 'yAxis';
   const axisStyle = chart?.style?.[key];
+  const label = axis === 'x' ? 'X轴' : 'Y轴';
 
   const update = useCallback(
     (partial: Partial<AxisStyle>) => {
@@ -28,12 +29,28 @@ export default function AxisConfig({ axis }: AxisConfigProps) {
 
   return (
     <Space direction="vertical" style={{ width: '100%' }} size={12}>
+      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+        <Text style={{ fontSize: 12 }}>显示{label}</Text>
+        <Switch
+          size="small"
+          checked={axisStyle.visible}
+          onChange={(checked) => update({ visible: checked })}
+        />
+      </div>
+      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+        <Text style={{ fontSize: 12 }}>显示轴标题</Text>
+        <Switch
+          size="small"
+          checked={axisStyle.titleVisible}
+          onChange={(checked) => update({ titleVisible: checked })}
+        />
+      </div>
       <div>
         <Text style={{ fontSize: 12 }}>轴标题</Text>
         <Input
           value={axisStyle.titleText}
-          onChange={(e) => update({ titleText: e.target.value })}
-          placeholder={`${axis.toUpperCase()}轴标题`}
+          onChange={(e) => update({ titleText: e.target.value, titleVisible: true })}
+          placeholder={`${label}标题`}
           size="small"
           style={{ marginTop: 4 }}
         />
@@ -56,14 +73,6 @@ export default function AxisConfig({ axis }: AxisConfigProps) {
           style={{ marginTop: 4 }}
         />
       </div>
-      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-        <Text style={{ fontSize: 12 }}>显示轴线</Text>
-        <Switch
-          size="small"
-          checked={axisStyle.visible}
-          onChange={(checked) => update({ visible: checked })}
-        />
-      </div>
     </Space>
   );
 }