Skip to content

Commit

Permalink
fix: modal box form layout is normal
Browse files Browse the repository at this point in the history
closes: open-v2x#22
  • Loading branch information
LongLSL committed Aug 1, 2022
1 parent 11b8a43 commit 808c9ba
Show file tree
Hide file tree
Showing 5 changed files with 25 additions and 11 deletions.
17 changes: 10 additions & 7 deletions src/components/ParameterInfo/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -81,13 +81,16 @@ const ParameterInfo: React.FC<{ parameterInfo: Config.ParameterInfo | undefined
<ProCard key={title} colSpan={12} bordered>
<div className="parameter-title t-center">{title}</div>
<Row gutter={[16, 14]}>
{children.map(({ key, span, label, render, unit }) => (
<Col key={key} span={span}>
<span>{label}</span>
{render?.(parameterInfo[groupKey]?.[key]) || parameterInfo[groupKey]?.[key]}
{unit ?? ` ${t('bars/s')}`}
</Col>
))}
{children.map(({ key, span, label, render, unit }) => {
const value = parameterInfo[groupKey]?.[key];
return (
<Col key={key} span={span}>
<span>{label}</span>
{render?.(value) || value || '-'}
{value ? unit ?? ` ${t('bars/s')}` : ''}
</Col>
);
})}
</Row>
</ProCard>
))}
Expand Down
8 changes: 6 additions & 2 deletions src/global.less
Original file line number Diff line number Diff line change
Expand Up @@ -253,8 +253,12 @@ body,
.ant-pro-form-group {
padding: 0 20px;

.ant-form-item .ant-form-item-label label {
color: #70727a;
.ant-pro-form-group-container {
flex-wrap: nowrap;

.ant-form-item .ant-form-item-label label {
color: #70727a;
}
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ const RunningInfo: React.FC<{ runningInfo: Config.QueryStatusDetails | undefined
{children.map(({ key, span, label }) => (
<Col key={key} span={span}>
<span>{label}</span>
{runningInfo[groupKey]?.[key]}
{runningInfo[groupKey]?.[key] || '-'}
</Col>
))}
</Row>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,10 @@
}
}

> .ant-space.ant-pro-form-group-container {
flex-wrap: wrap !important;
}

&:nth-child(3) > .ant-space .ant-space-item {
width: calc(50% - 16px);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,10 @@ const ParameterInfo: React.FC<ParameterInfoType> = ({ infoMap, info }) => {
return (
<>
{infoMap.map(({ key, label, unit, render }) => {
const text = `${label}${render?.(info![key]) || info![key] || ''} ${unit ?? t('bars/s')}`;
const value = info![key];
const text = `${label}${render?.(value) || value || '-'} ${
value ? unit ?? t('bars/s') : ''
}`;
return (
<div key={key} className="ellipsis">
<Tooltip title={text}>{text}</Tooltip>
Expand Down

0 comments on commit 808c9ba

Please sign in to comment.