| @@ -22,7 +22,7 @@ | |||||
| border-radius: 4px; | border-radius: 4px; | ||||
| &__value { | &__value { | ||||
| .singleLine(); | |||||
| //.singleLine(); | |||||
| margin-right: 8px; | margin-right: 8px; | ||||
| font-size: @font-size-input; | font-size: @font-size-input; | ||||
| line-height: 1.5714285714285714; | line-height: 1.5714285714285714; | ||||
| @@ -6,7 +6,7 @@ | |||||
| import { CommonTabKeys } from '@/enums'; | import { CommonTabKeys } from '@/enums'; | ||||
| import { CloseOutlined } from '@ant-design/icons'; | 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 { RuleObject } from 'antd/es/form'; | ||||
| import classNames from 'classnames'; | import classNames from 'classnames'; | ||||
| import './index.less'; | import './index.less'; | ||||
| @@ -120,7 +120,12 @@ function ParameterInput({ | |||||
| > | > | ||||
| {valueObj?.showValue ? ( | {valueObj?.showValue ? ( | ||||
| <div className="parameter-input__content"> | <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 | <CloseOutlined | ||||
| className="parameter-input__content__close-icon" | className="parameter-input__content__close-icon" | ||||
| onClick={handleRemove} | onClick={handleRemove} | ||||
| @@ -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 = { | export const Disabled: Story = { | ||||
| args: { | args: { | ||||
| placeholder: '请输入工作目录', | placeholder: '请输入工作目录', | ||||