feat(form): add `alwaysShowLines` prop
允许设置Form折叠时始终保持显示状态的行数 close: #1051
This commit is contained in:
parent
61d853e6a5
commit
93f9a19aa1
|
|
@ -3,6 +3,7 @@
|
|||
### ✨ Features
|
||||
|
||||
- **BasicTree** 添加搜索功能相关属性和方法
|
||||
- **BasicForm** 新增`alwaysShowLines`用于设置折叠时保留显示的行数
|
||||
|
||||
### 🐛 Bug Fixes
|
||||
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ export default function ({
|
|||
}
|
||||
return { isAdvanced: advanceState.isAdvanced, itemColSum };
|
||||
}
|
||||
if (itemColSum > BASIC_COL_LEN) {
|
||||
if (itemColSum > BASIC_COL_LEN * (unref(getProps).alwaysShowLines || 1)) {
|
||||
return { isAdvanced: advanceState.isAdvanced, itemColSum };
|
||||
} else {
|
||||
// The first line is always displayed
|
||||
|
|
|
|||
|
|
@ -59,6 +59,8 @@ export const basicProps = {
|
|||
rulesMessageJoinLabel: propTypes.bool.def(true),
|
||||
// 超过3行自动折叠
|
||||
autoAdvancedLine: propTypes.number.def(3),
|
||||
// 不受折叠影响的行数
|
||||
alwaysShowLines: propTypes.number.def(1),
|
||||
|
||||
// 是否显示操作按钮
|
||||
showActionButtonGroup: propTypes.bool.def(true),
|
||||
|
|
|
|||
|
|
@ -97,6 +97,8 @@ export interface FormProps {
|
|||
autoFocusFirstItem?: boolean;
|
||||
// Automatically collapse over the specified number of rows
|
||||
autoAdvancedLine?: number;
|
||||
// Always show lines
|
||||
alwaysShowLines?: number;
|
||||
// Whether to show the operation button
|
||||
showActionButtonGroup?: boolean;
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<BasicForm @register="register" />
|
||||
</CollapseContainer>
|
||||
|
||||
<CollapseContainer title="超过3行自动收起" class="mt-4">
|
||||
<CollapseContainer title="超过3行自动收起,折叠时保留2行" class="mt-4">
|
||||
<BasicForm @register="register1" />
|
||||
</CollapseContainer>
|
||||
</PageWrapper>
|
||||
|
|
@ -160,14 +160,26 @@
|
|||
compact: true,
|
||||
showAdvancedButton: true,
|
||||
});
|
||||
const extraSchemas: FormSchema[] = [];
|
||||
for (let i = 14; i < 30; i++) {
|
||||
extraSchemas.push({
|
||||
field: 'field' + i,
|
||||
component: 'Input',
|
||||
label: '字段' + i,
|
||||
colProps: {
|
||||
span: 8,
|
||||
},
|
||||
});
|
||||
}
|
||||
const [register1] = useForm({
|
||||
labelWidth: 120,
|
||||
schemas: [...getSchamas(), ...getAppendSchemas()],
|
||||
schemas: [...getSchamas(), ...getAppendSchemas(), ...extraSchemas],
|
||||
actionColOptions: {
|
||||
span: 24,
|
||||
},
|
||||
compact: true,
|
||||
showAdvancedButton: true,
|
||||
alwaysShowLines: 2,
|
||||
});
|
||||
return {
|
||||
register,
|
||||
|
|
|
|||
Loading…
Reference in New Issue