From de75e6041e92b81fa53508f55510174ac6f2d62d Mon Sep 17 00:00:00 2001
From: cp3hnu <cp3hnu@gmail.com>
Date: Tue, 1 Apr 2025 14:13:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=BE=93=E5=85=A5=E5=8F=82=E6=95=B0?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E6=B7=BB=E5=8A=A0tooltip?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/ParameterInput/index.less  |  2 +-
 .../src/components/ParameterInput/index.tsx   |  9 ++++-
 .../src/stories/ParameterInput.stories.tsx    | 39 +++++++++++++++++++
 3 files changed, 47 insertions(+), 3 deletions(-)

diff --git a/react-ui/src/components/ParameterInput/index.less b/react-ui/src/components/ParameterInput/index.less
index fff69eb1..ff0a21f7 100644
--- a/react-ui/src/components/ParameterInput/index.less
+++ b/react-ui/src/components/ParameterInput/index.less
@@ -22,7 +22,7 @@
     border-radius: 4px;
 
     &__value {
-      .singleLine();
+      //.singleLine();
       margin-right: 8px;
       font-size: @font-size-input;
       line-height: 1.5714285714285714;
diff --git a/react-ui/src/components/ParameterInput/index.tsx b/react-ui/src/components/ParameterInput/index.tsx
index 32672b98..08cf8649 100644
--- a/react-ui/src/components/ParameterInput/index.tsx
+++ b/react-ui/src/components/ParameterInput/index.tsx
@@ -6,7 +6,7 @@
 
 import { CommonTabKeys } from '@/enums';
 import { CloseOutlined } from '@ant-design/icons';
-import { ConfigProvider, Form, Input } from 'antd';
+import { ConfigProvider, Form, Input, Typography } from 'antd';
 import { RuleObject } from 'antd/es/form';
 import classNames from 'classnames';
 import './index.less';
@@ -120,7 +120,12 @@ function ParameterInput({
         >
           {valueObj?.showValue ? (
             <div className="parameter-input__content">
-              <span className="parameter-input__content__value">{valueObj?.showValue}</span>
+              <Typography.Text
+                className="parameter-input__content__value"
+                ellipsis={{ tooltip: valueObj.showValue }}
+              >
+                {valueObj.showValue}
+              </Typography.Text>
               <CloseOutlined
                 className="parameter-input__content__close-icon"
                 onClick={handleRemove}
diff --git a/react-ui/src/stories/ParameterInput.stories.tsx b/react-ui/src/stories/ParameterInput.stories.tsx
index 3ca116c8..ba4407d0 100644
--- a/react-ui/src/stories/ParameterInput.stories.tsx
+++ b/react-ui/src/stories/ParameterInput.stories.tsx
@@ -76,6 +76,45 @@ export const Select: Story = {
   },
 };
 
+export const Ellipse: Story = {
+  args: {
+    placeholder: '请输入工作目录',
+    style: { width: 300 },
+    canInput: true,
+    size: 'large',
+  },
+  render: function Render(args) {
+    const [value, setValue] = useState<ParameterInputValue | undefined>('');
+
+    const onClick = () => {
+      const value = {
+        value: 'storybook',
+        showValue:
+          'storybookstorybookstorybookstorybookstorybookstorybookstorybookstorybookstorybookstorybook',
+        fromSelect: true,
+        otherValue: 'others',
+      };
+      setValue(value);
+      action('onChange')(value);
+    };
+    return (
+      <>
+        <ParameterInput
+          {...args}
+          value={value}
+          onChange={(value) => {
+            setValue(value);
+            action('onChange')(value);
+          }}
+        ></ParameterInput>
+        <Button type="primary" style={{ display: 'block', marginTop: 10 }} onClick={onClick}>
+          模拟从全局参数选择
+        </Button>
+      </>
+    );
+  },
+};
+
 export const Disabled: Story = {
   args: {
     placeholder: '请输入工作目录',