Skip to content

Commit

Permalink
fix(descriptions): fix save and cancel are not aligned when using For…
Browse files Browse the repository at this point in the history 
…m rules

close #7559
  • Loading branch information
@chenshuai2144
chenshuai2144 committed Nov 5, 2023
1 parent cb330f9 commit ebd1898
Show file tree
Hide file tree
Showing 3 changed files with 118 additions and 91 deletions.
12 changes: 11 additions & 1 deletion packages/descriptions/src/demos/arrayDataIndex.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,17 @@ export default () => {
},
}}
>
<ProDescriptions.Item dataIndex={['info', 'id']} />
<ProDescriptions.Item
formItemProps={{
rules: [
{
required: true,
message: '此项为必填项',
},
],
}}
dataIndex={['info', 'id']}
/>
<ProDescriptions.Item
dataIndex={['info', 'date']}
label="日期"
Expand Down
21 changes: 15 additions & 6 deletions packages/descriptions/src/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -261,7 +261,7 @@ export const FieldRender: React.FC<
: undefined;
return (
<div
style={{ display: 'flex', gap: token.marginXS, alignItems: 'center' }}
style={{ display: 'flex', gap: token.marginXS, alignItems: 'baseline' }}
>
<InlineErrorFormItem
name={dataIndex}
Expand All @@ -281,11 +281,20 @@ export const FieldRender: React.FC<
/>
)}
</InlineErrorFormItem>
{editableUtils?.actionRender?.(dataIndex || index, {
cancelText: <CloseOutlined />,
saveText: <CheckOutlined />,
deleteText: false,
})}
<div
style={{
display: 'flex',
maxHeight: token.controlHeight,
alignItems: 'center',
gap: token.marginXS,
}}
>
{editableUtils?.actionRender?.(dataIndex || index, {
cancelText: <CloseOutlined />,
saveText: <CheckOutlined />,
deleteText: false,
})}
</div>
</div>
) as React.ReactNode;
};
Expand Down
176 changes: 92 additions & 84 deletions tests/descriptions/__snapshots__/editor.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ exports[`Descriptions > 📝 columns support editable test 1`] = `
style="margin: -5px 0px -5px 0px;"
>
<div
style="display: flex; gap: 8px; align-items: center;"
style="display: flex; gap: 8px; align-items: baseline;"
>
<div
class="ant-form-item"
Expand Down Expand Up @@ -91,49 +91,53 @@ exports[`Descriptions > 📝 columns support editable test 1`] = `
</div>
</div>
</div>
<a>
<span
aria-label="check"
class="anticon anticon-check"
role="img"
>
<svg
aria-hidden="true"
data-icon="check"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<div
style="display: flex; max-height: 32px; align-items: center; gap: 8px;"
>
<a>
<span
aria-label="check"
class="anticon anticon-check"
role="img"
>
<path
d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
/>
</svg>
</span>
</a>
<a>
<span
aria-label="close"
class="anticon anticon-close"
role="img"
>
<svg
aria-hidden="true"
data-icon="close"
fill="currentColor"
fill-rule="evenodd"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<svg
aria-hidden="true"
data-icon="check"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
/>
</svg>
</span>
</a>
<a>
<span
aria-label="close"
class="anticon anticon-close"
role="img"
>
<path
d="M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z"
/>
</svg>
</span>
</a>
<svg
aria-hidden="true"
data-icon="close"
fill="currentColor"
fill-rule="evenodd"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z"
/>
</svg>
</span>
</a>
</div>
</div>
</div>
</span>
Expand Down Expand Up @@ -190,7 +194,7 @@ exports[`Descriptions > 📝 renderFormItem run defaultRender 1`] = `
style="margin: -5px 0px -5px 0px;"
>
<div
style="display: flex; gap: 8px; align-items: center;"
style="display: flex; gap: 8px; align-items: baseline;"
>
<div
class="ant-form-item"
Expand Down Expand Up @@ -253,49 +257,53 @@ exports[`Descriptions > 📝 renderFormItem run defaultRender 1`] = `
</div>
</div>
</div>
<a>
<span
aria-label="check"
class="anticon anticon-check"
role="img"
>
<svg
aria-hidden="true"
data-icon="check"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<div
style="display: flex; max-height: 32px; align-items: center; gap: 8px;"
>
<a>
<span
aria-label="check"
class="anticon anticon-check"
role="img"
>
<path
d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
/>
</svg>
</span>
</a>
<a>
<span
aria-label="close"
class="anticon anticon-close"
role="img"
>
<svg
aria-hidden="true"
data-icon="close"
fill="currentColor"
fill-rule="evenodd"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<svg
aria-hidden="true"
data-icon="check"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"
/>
</svg>
</span>
</a>
<a>
<span
aria-label="close"
class="anticon anticon-close"
role="img"
>
<path
d="M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z"
/>
</svg>
</span>
</a>
<svg
aria-hidden="true"
data-icon="close"
fill="currentColor"
fill-rule="evenodd"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z"
/>
</svg>
</span>
</a>
</div>
</div>
</div>
</span>
Expand Down

0 comments on commit ebd1898

Please sign in to comment.