openstack/skyline-console
Code Issues Proposed changes

fix: add middleComponent prop in KeyValueInput component

Browse Source 
1. add middleComponent prop in KeyValueInput component to support show default equal sign or others

Change-Id: I29bdfb3df6c859b2522b2a10a21173defce7765e
This commit is contained in:
zhangke
2022-12-05 15:13:24 +08:00
parent b4f23fd78c
commit 719e26ebaa
1 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/FormItem/KeyValueInput/index.jsx
View File

@@ -26,6 +26,7 @@ export default class index extends Component {
valueReadonly: PropTypes.bool, valueReadonly: PropTypes.bool,
keySpan: PropTypes.number, keySpan: PropTypes.number,
valueSpan: PropTypes.number, valueSpan: PropTypes.number,
middleComponent: PropTypes.node,
}; };
static defaultProps = { static defaultProps = {
@@ -36,6 +37,7 @@ export default class index extends Component {
}, },
keyReadonly: false, keyReadonly: false,
valueReadonly: false, valueReadonly: false,
middleComponent: <PauseOutlined rotate={90} />,
}; };
constructor(props) { constructor(props) {
@@ -87,7 +89,10 @@ export default class index extends Component {
valueSpan, valueSpan,
keyPlaceholder = t('Please input key'), keyPlaceholder = t('Please input key'),
valuePlaceholder = t('Please input value'), valuePlaceholder = t('Please input value'),
middleComponent,
} = this.props; } = this.props;
const style = { textAlign: 'center', lineHeight: '30px', margin: '0 10px' };
const component = <div style={style}>{middleComponent}</div>;
return ( return (
<Row> <Row>
<Col span={keySpan || 4}> <Col span={keySpan || 4}>
@@ -99,9 +104,7 @@ export default class index extends Component {
required required
/> />
</Col> </Col>
<Col span={1} style={{ textAlign: 'center', lineHeight: '30px' }}> {component}
<PauseOutlined rotate={90} />
</Col>
<Col span={valueSpan || 8}> <Col span={valueSpan || 8}>
<Input <Input
value={value} value={value}