@flatbiz/antd 5.0.0 → 5.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/drag-editable-card/index.d.ts +6 -3
- package/dist/drag-editable-card/index.js +17 -231
- package/dist/drag-editable-card/index.js.map +1 -1
- package/dist/easy-table/index.css +1 -1
- package/dist/editable-card/index.d.ts +10 -8
- package/dist/editable-card/index.js +1 -1
- package/dist/{editable-card-C2W7M00M.js → editable-card-BmTHD2vj.js} +13 -11
- package/dist/editable-card-BmTHD2vj.js.map +1 -0
- package/dist/editable-card-C7QR8MKV.js +231 -0
- package/dist/editable-card-C7QR8MKV.js.map +1 -0
- package/dist/index.d.ts +384 -101
- package/dist/index.js +9 -1
- package/dist/index.js.map +1 -1
- package/dist/number-range-B_WHzUn5.js +133 -0
- package/dist/number-range-B_WHzUn5.js.map +1 -0
- package/dist/number-range-form-item/index.css +1 -0
- package/dist/number-range-form-item/index.d.ts +73 -0
- package/dist/number-range-form-item/index.js +17 -0
- package/dist/number-range-form-item/index.js.map +1 -0
- package/package.json +18 -7
- package/dist/editable-card-C2W7M00M.js.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DateFormatType, TAny, TNoopDefine, TPlainObject } from '@flatbiz/utils';
|
|
2
2
|
import { IAllProps } from '@tinymce/tinymce-react';
|
|
3
|
-
import { AlertProps, ButtonProps, CardProps, CascaderProps, CheckboxProps, CollapseProps, ColorPickerProps, DatePicker, DrawerProps, DropdownProps, FormInstance, FormItemProps, FormListFieldData, FormListOperation, FormProps, GetProps, InputNumberProps, InputProps, MentionProps, ModalProps, PaginationProps, PopconfirmProps, PopoverProps, RadioGroupProps, RowProps, SelectProps, SpaceProps, SwitchProps, TableProps, TabsProps, TagProps, TimePickerProps, TimeRangePickerProps, TooltipProps, TreeProps, TreeSelectProps, UploadProps } from 'antd';
|
|
3
|
+
import { AlertProps, ButtonProps, CardProps, CascaderProps, CheckboxProps, CollapseProps, ColorPickerProps, DatePicker, DrawerProps, DropdownProps, FormInstance, FormItemProps, FormListFieldData, FormListOperation, FormProps, GetProps, InputNumber, InputNumberProps, InputProps, MentionProps, ModalProps, PaginationProps, PopconfirmProps, PopoverProps, RadioGroupProps, RowProps, SelectProps, SpaceProps, SwitchProps, TableProps, TabsProps, TagProps, TimePickerProps, TimeRangePickerProps, TooltipProps, TreeProps, TreeSelectProps, UploadProps } from 'antd';
|
|
4
4
|
import { ConfigProviderProps } from 'antd/es/config-provider';
|
|
5
5
|
import { PickerProps } from 'antd/es/date-picker/generatePicker';
|
|
6
6
|
import { FormListProps } from 'antd/es/form';
|
|
@@ -249,6 +249,7 @@ export type TFbaLocale = {
|
|
|
249
249
|
cancelText?: string;
|
|
250
250
|
};
|
|
251
251
|
};
|
|
252
|
+
export declare const types: () => void;
|
|
252
253
|
export type ConfigProviderWrapperProps = Omit<ConfigProviderProps, "locale"> & {
|
|
253
254
|
locale?: TLocale;
|
|
254
255
|
/** 自定义国际化数据 */
|
|
@@ -1315,6 +1316,350 @@ export type DragCollapseFormListProps = {
|
|
|
1315
1316
|
* ```
|
|
1316
1317
|
*/
|
|
1317
1318
|
export declare const DragCollapseFormList: (props: DragCollapseFormListProps) => import("react").JSX.Element;
|
|
1319
|
+
export type FormWrapperProps<Values = any> = TFormLayoutPreClassNameProps & FormProps<Values> & {
|
|
1320
|
+
children: ReactNode;
|
|
1321
|
+
};
|
|
1322
|
+
/**
|
|
1323
|
+
* Form 包装组件,添加对formItem的布局控制
|
|
1324
|
+
* ```
|
|
1325
|
+
* 1. 内置布局样式使用 preDefinedClassName.form
|
|
1326
|
+
* ```
|
|
1327
|
+
*/
|
|
1328
|
+
export declare const FormWrapper: (props: FormWrapperProps) => import("react").JSX.Element;
|
|
1329
|
+
export type EasyFormProps = Omit<FormWrapperProps, "children"> & {
|
|
1330
|
+
/**
|
|
1331
|
+
* 定义一行显示几列(当外层宽度尺寸大于 992px(lg) 时,一行显示几列), 默认值:3
|
|
1332
|
+
* ```
|
|
1333
|
+
* 1. 当外层宽度尺寸小于992px(lg),为xs、sm、md情况下不受column值影响(column=1除外)
|
|
1334
|
+
* 2. 宽度尺寸定义
|
|
1335
|
+
* xs: 宽度 < 576px
|
|
1336
|
+
* sm: 宽度 ≥ 576px
|
|
1337
|
+
* md: 宽度 ≥ 768px
|
|
1338
|
+
* lg: 宽度 ≥ 992px
|
|
1339
|
+
* xl: 宽度 ≥ 1200px
|
|
1340
|
+
* xxl: 宽度 ≥ 1600px
|
|
1341
|
+
* 3. 列数尺寸定义
|
|
1342
|
+
* {
|
|
1343
|
+
* 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },
|
|
1344
|
+
* 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },
|
|
1345
|
+
* 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },
|
|
1346
|
+
* 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },
|
|
1347
|
+
* };
|
|
1348
|
+
* ```
|
|
1349
|
+
*/
|
|
1350
|
+
column?: 1 | 2 | 3 | 4;
|
|
1351
|
+
/**
|
|
1352
|
+
* 强制定义一行显示几列,不考虑响应式
|
|
1353
|
+
* ```
|
|
1354
|
+
* 1. 优先级大于column
|
|
1355
|
+
* 2. 建议优先使用column配置
|
|
1356
|
+
* ```
|
|
1357
|
+
*/
|
|
1358
|
+
forceColumn?: 1 | 2 | 3 | 4;
|
|
1359
|
+
/**
|
|
1360
|
+
* Form显示宽度,可数值、可百分比;在小屏幕尺寸(xs、sm)上无效
|
|
1361
|
+
*/
|
|
1362
|
+
width?: number | string;
|
|
1363
|
+
/** 网格间距 */
|
|
1364
|
+
gridGutter?: BoxRowProps["gutter"];
|
|
1365
|
+
children: ReactNode;
|
|
1366
|
+
/**
|
|
1367
|
+
* 是否为纯净模式,对EasyForm的子节点不做任何包装处理
|
|
1368
|
+
*/
|
|
1369
|
+
isPure?: boolean;
|
|
1370
|
+
/**
|
|
1371
|
+
* true: 不使用Antd Form包裹,可在Form、EasyForm、FormWrapper内部使用
|
|
1372
|
+
*/
|
|
1373
|
+
nonuseFormWrapper?: boolean;
|
|
1374
|
+
};
|
|
1375
|
+
/**
|
|
1376
|
+
* 简单Form布局,可自定义网格布局
|
|
1377
|
+
* ```
|
|
1378
|
+
* 1. demo:https://fex.qa.tcshuke.com/docs/admin/main/form/grid
|
|
1379
|
+
* 2. EasyForm的children列表会进行网格化布局,可通过设置 isPure = true设置纯净模式(对EasyForm的子节点不做任何包装处理)
|
|
1380
|
+
* 3. EasyForm可嵌套使用,嵌套内部的<EasyForm />节点Form相关属性失效,例如属性form、initialValues等都失效
|
|
1381
|
+
* <EasyForm form={form}>
|
|
1382
|
+
* ....
|
|
1383
|
+
* <EasyForm>...</EasyForm>
|
|
1384
|
+
* ....
|
|
1385
|
+
* <EasyForm>...</EasyForm>
|
|
1386
|
+
* ....
|
|
1387
|
+
* </EasyForm>
|
|
1388
|
+
* 4. 布局网格以当前组件的宽度来计算的,不是屏幕宽度
|
|
1389
|
+
* 5. EasyForm 子节点包含 hidden = true 会被忽略
|
|
1390
|
+
* 6. 通过 column 可定义一行显示几列FormItem
|
|
1391
|
+
* 7. 通过 labelItemVertical 可定义 formitem 竖直布局
|
|
1392
|
+
* 8. 通过 formItemGap 可定义 formItem竖直方向间隙
|
|
1393
|
+
* 9. 通过 forceColumn 可强制定义一行显示几列,不考虑响应式
|
|
1394
|
+
* 10. 通过 labelWidth 可控制Form内部所有label的宽度(可实现整齐效果)
|
|
1395
|
+
* 11. 自定义栅格占位格数,见下方`例如`
|
|
1396
|
+
|
|
1397
|
+
* 例如
|
|
1398
|
+
* <EasyForm column={3}>
|
|
1399
|
+
* <FormItemWrapper name="field1" label="条件1">
|
|
1400
|
+
* <Input placeholder="请输入" allowClear={true} />
|
|
1401
|
+
* </FormItemWrapper>
|
|
1402
|
+
* <!-- !!自定义栅格占位格数第一种方式:可通过使用 BoxGrid.Col 包裹元素来自定义网格占比 -->
|
|
1403
|
+
* <BoxGrid.Col span={24}>
|
|
1404
|
+
* <FormItemWrapper name="field5" label="条件5">
|
|
1405
|
+
* <Input placeholder="请输入" allowClear={true} />
|
|
1406
|
+
* </FormItemWrapper>
|
|
1407
|
+
* </BoxGrid.Col>
|
|
1408
|
+
* <!-- !!自定义栅格占位格数第二种方式:如果为FormItemWrapper组件,可设置span属性 -->
|
|
1409
|
+
* <FormItemWrapper name="field6" label="条件6" span={24}>
|
|
1410
|
+
* <Input placeholder="请输入" allowClear={true} />
|
|
1411
|
+
* </FormItemWrapper>
|
|
1412
|
+
* <FormItemWrapper noStyle span={24}>
|
|
1413
|
+
* <Button>按钮</Buttone>
|
|
1414
|
+
* </FormItemWrapper>
|
|
1415
|
+
* </EasyForm>
|
|
1416
|
+
* ```
|
|
1417
|
+
*/
|
|
1418
|
+
export declare const EasyForm: (props: EasyFormProps) => import("react").JSX.Element;
|
|
1419
|
+
export type EditableCardDataIndex = string | string[];
|
|
1420
|
+
export interface EditableCardOperation {
|
|
1421
|
+
index: number;
|
|
1422
|
+
add: (defaultValue: TPlainObject, insertIndex?: number) => void;
|
|
1423
|
+
remove: (index: number) => void;
|
|
1424
|
+
/** 同一级内移动 */
|
|
1425
|
+
move: (fromIndex: number, toIndex: number) => void;
|
|
1426
|
+
/** 是否可编辑 */
|
|
1427
|
+
editable: boolean;
|
|
1428
|
+
/**
|
|
1429
|
+
* 设置当前卡片指定字段值
|
|
1430
|
+
*/
|
|
1431
|
+
setCurrentRowField: (dataIndexConfigs: {
|
|
1432
|
+
name: EditableCardDataIndex;
|
|
1433
|
+
value?: TAny;
|
|
1434
|
+
}[]) => void;
|
|
1435
|
+
/** 获取当前卡片表单数据 */
|
|
1436
|
+
getCurrentRowData: () => TPlainObject;
|
|
1437
|
+
/**
|
|
1438
|
+
* 当前卡片表单 name
|
|
1439
|
+
* ```
|
|
1440
|
+
* 值为 field.name
|
|
1441
|
+
* ```
|
|
1442
|
+
*/
|
|
1443
|
+
rowFormItemName: string | number;
|
|
1444
|
+
/**
|
|
1445
|
+
* 当前卡片表单完整 name
|
|
1446
|
+
* ```
|
|
1447
|
+
* 例如:['dataList', 0]
|
|
1448
|
+
* ```
|
|
1449
|
+
*/
|
|
1450
|
+
rowFormItemCompleteName: Array<string | number>;
|
|
1451
|
+
/** 当前卡片表单验证,需要自行指定nameList(dataIndex数组) */
|
|
1452
|
+
validateRowFields: (nameList: EditableCardDataIndex[]) => Promise<void>;
|
|
1453
|
+
forceUpdate: () => void;
|
|
1454
|
+
}
|
|
1455
|
+
/** 卡片内字段配置 */
|
|
1456
|
+
export type EditableCardColumnItem = {
|
|
1457
|
+
/**
|
|
1458
|
+
* 字段key值
|
|
1459
|
+
* ```
|
|
1460
|
+
* 例如:
|
|
1461
|
+
* dataIndex: 'abc'
|
|
1462
|
+
* dataIndex: ['abc', 'xyz']
|
|
1463
|
+
* ```
|
|
1464
|
+
*/
|
|
1465
|
+
dataIndex: EditableCardDataIndex;
|
|
1466
|
+
/** 是否可编辑 */
|
|
1467
|
+
editable: boolean | ((operation: Pick<EditableCardOperation, "index" | "getCurrentRowData">, index: number) => boolean);
|
|
1468
|
+
/**
|
|
1469
|
+
* 布局占用网格数目(最大数值24)
|
|
1470
|
+
* ```
|
|
1471
|
+
* 1. 一行总共等分24份
|
|
1472
|
+
* ```
|
|
1473
|
+
*/
|
|
1474
|
+
gridNumber?: number;
|
|
1475
|
+
/** 标题 */
|
|
1476
|
+
title?: ReactElement | string;
|
|
1477
|
+
/**
|
|
1478
|
+
* Form.Item props
|
|
1479
|
+
*/
|
|
1480
|
+
formItemProps?: Omit<FormItemWrapperProps, "children" | "name"> | ((operation: EditableCardOperation) => Omit<FormItemWrapperProps, "children" | "name">);
|
|
1481
|
+
/**
|
|
1482
|
+
* 通过 operation.editable 来判断渲染结构,其中render返回的根节点会作为 Form.Item 的children
|
|
1483
|
+
* ```
|
|
1484
|
+
* 例如
|
|
1485
|
+
* render: (operation) => {
|
|
1486
|
+
* if (operation.editable) {
|
|
1487
|
+
* return <Input placeholder="请输入" />;
|
|
1488
|
+
* }
|
|
1489
|
+
* return <Tag>{value}</Tag>;
|
|
1490
|
+
* }
|
|
1491
|
+
*
|
|
1492
|
+
* 如果需要额外布局,可通过 formItemProps.wrapper 实现
|
|
1493
|
+
* formItemProps: (operation) => {
|
|
1494
|
+
* return {
|
|
1495
|
+
* wrapper: (children) => {
|
|
1496
|
+
* return (
|
|
1497
|
+
* <FlexLayout fullIndex={[0]} direction="horizontal" gap={10}>
|
|
1498
|
+
* <div>{children}</div>
|
|
1499
|
+
* <div>额外布局</div>
|
|
1500
|
+
* </FlexLayout>
|
|
1501
|
+
* );
|
|
1502
|
+
* },
|
|
1503
|
+
* };
|
|
1504
|
+
* },
|
|
1505
|
+
* render: (operation) => {
|
|
1506
|
+
* if (operation.editable) {
|
|
1507
|
+
* return <Input placeholder="请输入" />;
|
|
1508
|
+
* }
|
|
1509
|
+
* return <Tag>{value}</Tag>;
|
|
1510
|
+
* }
|
|
1511
|
+
* ```
|
|
1512
|
+
*/
|
|
1513
|
+
render?: (operation: EditableCardOperation) => ReactElement;
|
|
1514
|
+
/**
|
|
1515
|
+
* 会在 title 之后展示一个 icon
|
|
1516
|
+
*/
|
|
1517
|
+
tips?: string;
|
|
1518
|
+
/** 为表格header中的字段添加必填标识,如果未配置 formItemProps.rules,内部会新增一条required rule */
|
|
1519
|
+
required?: boolean;
|
|
1520
|
+
/**
|
|
1521
|
+
* 隐藏域设置
|
|
1522
|
+
* ```
|
|
1523
|
+
* 如果是动态隐藏,并且在逻辑切换后无效果,可尝试执行 operation.forceUpdate()
|
|
1524
|
+
* ```
|
|
1525
|
+
*/
|
|
1526
|
+
hidden?: (operation: EditableCardOperation, index: number) => boolean;
|
|
1527
|
+
/** 直接移除,不再执行render,优先级高于 hidden */
|
|
1528
|
+
remove?: (operation: EditableCardOperation, index: number) => boolean;
|
|
1529
|
+
};
|
|
1530
|
+
export type EditableCardProps = {
|
|
1531
|
+
className?: string;
|
|
1532
|
+
style?: CSSProperties;
|
|
1533
|
+
/** 卡片内字段配置 */
|
|
1534
|
+
columns: EditableCardColumnItem[];
|
|
1535
|
+
/**
|
|
1536
|
+
* 当前Edittable处在formList内部时(必填),完整formItem的name
|
|
1537
|
+
* ```
|
|
1538
|
+
* 例如 处在formList内部
|
|
1539
|
+
* 1. formListName=[0,dataList]
|
|
1540
|
+
* 2. formListCompleteName=[xxxList, 0, dataList]
|
|
1541
|
+
* ```
|
|
1542
|
+
*/
|
|
1543
|
+
formListCompleteName?: Array<string | number>;
|
|
1544
|
+
/** Form.List name */
|
|
1545
|
+
formListName: Array<string | number> | string;
|
|
1546
|
+
/**
|
|
1547
|
+
* Form.List rules
|
|
1548
|
+
* ```
|
|
1549
|
+
rules={[
|
|
1550
|
+
{
|
|
1551
|
+
validator: async (_, names) => {
|
|
1552
|
+
if (!names || names.length < 2) {
|
|
1553
|
+
return Promise.reject(new Error('At least 2 passengers'));
|
|
1554
|
+
}
|
|
1555
|
+
},
|
|
1556
|
+
},
|
|
1557
|
+
]}
|
|
1558
|
+
* ```
|
|
1559
|
+
*/
|
|
1560
|
+
rules?: FormListProps["rules"];
|
|
1561
|
+
/**`默认新增按钮`新增行默认值,hiddenFooterBtn != true 有效 */
|
|
1562
|
+
addRowDefaultValues?: () => TPlainObject;
|
|
1563
|
+
/** 隐藏底部`新增`按钮 */
|
|
1564
|
+
hiddenFooterBtn?: boolean;
|
|
1565
|
+
addRowBtnName?: string;
|
|
1566
|
+
/** 顶部区域渲染 */
|
|
1567
|
+
contentBeforeRender?: (formListOperation: FormListOperation, nextRowIndex: number) => ReactElement | null;
|
|
1568
|
+
/** 底部区域渲染 */
|
|
1569
|
+
contentAfterRender?: (formListOperation: FormListOperation, nextRowIndex: number) => ReactElement | null;
|
|
1570
|
+
/** 设置默认卡片名称,设置 onCustomWrapper 后失效 */
|
|
1571
|
+
onCustomGroupName?: (index: number) => string | ReactElement;
|
|
1572
|
+
/** 自定义卡片包裹,同时可自定义删除按钮、新增按钮 */
|
|
1573
|
+
onCustomWrapper?: (children: ReactElement, extraData: {
|
|
1574
|
+
operation: FormListOperation;
|
|
1575
|
+
fields: FormListFieldData[];
|
|
1576
|
+
fieldItem: FormListFieldData;
|
|
1577
|
+
index: number;
|
|
1578
|
+
required?: boolean;
|
|
1579
|
+
key: string;
|
|
1580
|
+
}) => ReactElement;
|
|
1581
|
+
/** 设置必填,但只有一条数据时,隐藏默认删除按钮 */
|
|
1582
|
+
required?: boolean;
|
|
1583
|
+
/** 默认卡片样式 */
|
|
1584
|
+
cardClassName?: string;
|
|
1585
|
+
/** 默认卡片样式 */
|
|
1586
|
+
cardStyle?: CSSProperties;
|
|
1587
|
+
/**
|
|
1588
|
+
* 每个卡片内容都使用了 EasyForm 包裹,此处可设置 EasyFormProps
|
|
1589
|
+
* ```
|
|
1590
|
+
* 可使用 EasyForm 中 FormItem布局
|
|
1591
|
+
* ```
|
|
1592
|
+
*/
|
|
1593
|
+
cardEasyFormProps?: Omit<EasyFormProps, "nonuseFormWrapper" | "isPure" | "children">;
|
|
1594
|
+
/**
|
|
1595
|
+
* 默认卡片右侧布局,设置 onCustomWrapper 后失效
|
|
1596
|
+
* ```
|
|
1597
|
+
* 1. 通过before 、after自定义删除按钮左右布局
|
|
1598
|
+
* cardExtraRender={(extraData)=>{
|
|
1599
|
+
* return {
|
|
1600
|
+
* before: [<div>1</div>, <div>2</div>],
|
|
1601
|
+
* after: [<div>3</div>, <div>4</div>],
|
|
1602
|
+
* }
|
|
1603
|
+
* }}
|
|
1604
|
+
* 2. 返回ReactElement,可自定义右侧布局
|
|
1605
|
+
* cardExtraRender={(extraData)=>{
|
|
1606
|
+
* return <div>111</div>
|
|
1607
|
+
* }}
|
|
1608
|
+
* ```
|
|
1609
|
+
*/
|
|
1610
|
+
cardExtraRender?: (extraData: {
|
|
1611
|
+
operation: FormListOperation;
|
|
1612
|
+
fields: FormListFieldData[];
|
|
1613
|
+
fieldItem: FormListFieldData;
|
|
1614
|
+
index: number;
|
|
1615
|
+
required?: boolean;
|
|
1616
|
+
key: string;
|
|
1617
|
+
}) => {
|
|
1618
|
+
before?: ReactElement[];
|
|
1619
|
+
after?: ReactElement[];
|
|
1620
|
+
} | ReactElement;
|
|
1621
|
+
};
|
|
1622
|
+
export type DragEditableCardProps = Omit<EditableCardProps, "onCustomWrapper"> & {
|
|
1623
|
+
/**
|
|
1624
|
+
* 拖拽图标自定义,默认使用 DragOutlined 图标
|
|
1625
|
+
*/
|
|
1626
|
+
dragIcon?: ReactElement;
|
|
1627
|
+
/** 禁用拖拽 */
|
|
1628
|
+
disabledDrag?: boolean;
|
|
1629
|
+
/**
|
|
1630
|
+
* 表格数据唯一值字段Key
|
|
1631
|
+
* ```
|
|
1632
|
+
* ```
|
|
1633
|
+
*/
|
|
1634
|
+
uidFieldKey: string;
|
|
1635
|
+
/**
|
|
1636
|
+
* 拖拽结束事件
|
|
1637
|
+
* ```
|
|
1638
|
+
* dataSource: 拖拽完成后的数据源
|
|
1639
|
+
* dragData
|
|
1640
|
+
* 1. activeId 拖拽ID
|
|
1641
|
+
* 2. activeIndex 拖拽起始表格数组索引值
|
|
1642
|
+
* 3. overIndex 拖拽结束表格数组索引值
|
|
1643
|
+
* ```
|
|
1644
|
+
*/
|
|
1645
|
+
onDragChange?: (dataSource: TPlainObject[], dragData: {
|
|
1646
|
+
activeId: string | number;
|
|
1647
|
+
overId?: string | number;
|
|
1648
|
+
activeIndex: number;
|
|
1649
|
+
overIndex: number;
|
|
1650
|
+
}) => void;
|
|
1651
|
+
/**
|
|
1652
|
+
* 拖拽触发位置,默认在左侧
|
|
1653
|
+
*/
|
|
1654
|
+
dragTriggerPosition?: "left" | "right";
|
|
1655
|
+
};
|
|
1656
|
+
/**
|
|
1657
|
+
* 可拖拽编辑卡片
|
|
1658
|
+
* ```
|
|
1659
|
+
* 1. 卡片数组必须有唯一值字段,通过参数 uidFieldKey 告诉组件
|
|
1660
|
+
* ```
|
|
1661
|
+
*/
|
|
1662
|
+
export declare const DragEditableCard: (props: DragEditableCardProps) => import("react").JSX.Element;
|
|
1318
1663
|
export type TipsWrapperProps = {
|
|
1319
1664
|
gap?: number;
|
|
1320
1665
|
className?: string;
|
|
@@ -2212,106 +2557,6 @@ export declare const dynamicNode: {
|
|
|
2212
2557
|
};
|
|
2213
2558
|
remove: (elementId?: string) => void;
|
|
2214
2559
|
};
|
|
2215
|
-
export type FormWrapperProps<Values = any> = TFormLayoutPreClassNameProps & FormProps<Values> & {
|
|
2216
|
-
children: ReactNode;
|
|
2217
|
-
};
|
|
2218
|
-
/**
|
|
2219
|
-
* Form 包装组件,添加对formItem的布局控制
|
|
2220
|
-
* ```
|
|
2221
|
-
* 1. 内置布局样式使用 preDefinedClassName.form
|
|
2222
|
-
* ```
|
|
2223
|
-
*/
|
|
2224
|
-
export declare const FormWrapper: (props: FormWrapperProps) => import("react").JSX.Element;
|
|
2225
|
-
export type EasyFormProps = Omit<FormWrapperProps, "children"> & {
|
|
2226
|
-
/**
|
|
2227
|
-
* 定义一行显示几列(当外层宽度尺寸大于 992px(lg) 时,一行显示几列), 默认值:3
|
|
2228
|
-
* ```
|
|
2229
|
-
* 1. 当外层宽度尺寸小于992px(lg),为xs、sm、md情况下不受column值影响(column=1除外)
|
|
2230
|
-
* 2. 宽度尺寸定义
|
|
2231
|
-
* xs: 宽度 < 576px
|
|
2232
|
-
* sm: 宽度 ≥ 576px
|
|
2233
|
-
* md: 宽度 ≥ 768px
|
|
2234
|
-
* lg: 宽度 ≥ 992px
|
|
2235
|
-
* xl: 宽度 ≥ 1200px
|
|
2236
|
-
* xxl: 宽度 ≥ 1600px
|
|
2237
|
-
* 3. 列数尺寸定义
|
|
2238
|
-
* {
|
|
2239
|
-
* 1: { xs: 24, sm: 24, md: 24, lg: 24, xl: 24, xxl: 24 },
|
|
2240
|
-
* 2: { xs: 24, sm: 12, md: 12, lg: 12, xl: 12, xxl: 12 },
|
|
2241
|
-
* 3: { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 8 },
|
|
2242
|
-
* 4: { xs: 24, sm: 12, md: 12, lg: 6, xl: 6, xxl: 6 },
|
|
2243
|
-
* };
|
|
2244
|
-
* ```
|
|
2245
|
-
*/
|
|
2246
|
-
column?: 1 | 2 | 3 | 4;
|
|
2247
|
-
/**
|
|
2248
|
-
* 强制定义一行显示几列,不考虑响应式
|
|
2249
|
-
* ```
|
|
2250
|
-
* 1. 优先级大于column
|
|
2251
|
-
* 2. 建议优先使用column配置
|
|
2252
|
-
* ```
|
|
2253
|
-
*/
|
|
2254
|
-
forceColumn?: 1 | 2 | 3 | 4;
|
|
2255
|
-
/**
|
|
2256
|
-
* Form显示宽度,可数值、可百分比;在小屏幕尺寸(xs、sm)上无效
|
|
2257
|
-
*/
|
|
2258
|
-
width?: number | string;
|
|
2259
|
-
/** 网格间距 */
|
|
2260
|
-
gridGutter?: BoxRowProps["gutter"];
|
|
2261
|
-
children: ReactNode;
|
|
2262
|
-
/**
|
|
2263
|
-
* 是否为纯净模式,对EasyForm的子节点不做任何包装处理
|
|
2264
|
-
*/
|
|
2265
|
-
isPure?: boolean;
|
|
2266
|
-
/**
|
|
2267
|
-
* true: 不使用Antd Form包裹,可在Form、EasyForm、FormWrapper内部使用
|
|
2268
|
-
*/
|
|
2269
|
-
nonuseFormWrapper?: boolean;
|
|
2270
|
-
};
|
|
2271
|
-
/**
|
|
2272
|
-
* 简单Form布局,可自定义网格布局
|
|
2273
|
-
* ```
|
|
2274
|
-
* 1. demo:https://fex.qa.tcshuke.com/docs/admin/main/form/grid
|
|
2275
|
-
* 2. EasyForm的children列表会进行网格化布局,可通过设置 isPure = true设置纯净模式(对EasyForm的子节点不做任何包装处理)
|
|
2276
|
-
* 3. EasyForm可嵌套使用,嵌套内部的<EasyForm />节点Form相关属性失效,例如属性form、initialValues等都失效
|
|
2277
|
-
* <EasyForm form={form}>
|
|
2278
|
-
* ....
|
|
2279
|
-
* <EasyForm>...</EasyForm>
|
|
2280
|
-
* ....
|
|
2281
|
-
* <EasyForm>...</EasyForm>
|
|
2282
|
-
* ....
|
|
2283
|
-
* </EasyForm>
|
|
2284
|
-
* 4. 布局网格以当前组件的宽度来计算的,不是屏幕宽度
|
|
2285
|
-
* 5. EasyForm 子节点包含 hidden = true 会被忽略
|
|
2286
|
-
* 6. 通过 column 可定义一行显示几列FormItem
|
|
2287
|
-
* 7. 通过 labelItemVertical 可定义 formitem 竖直布局
|
|
2288
|
-
* 8. 通过 formItemGap 可定义 formItem竖直方向间隙
|
|
2289
|
-
* 9. 通过 forceColumn 可强制定义一行显示几列,不考虑响应式
|
|
2290
|
-
* 10. 通过 labelWidth 可控制Form内部所有label的宽度(可实现整齐效果)
|
|
2291
|
-
* 11. 自定义栅格占位格数,见下方`例如`
|
|
2292
|
-
|
|
2293
|
-
* 例如
|
|
2294
|
-
* <EasyForm column={3}>
|
|
2295
|
-
* <FormItemWrapper name="field1" label="条件1">
|
|
2296
|
-
* <Input placeholder="请输入" allowClear={true} />
|
|
2297
|
-
* </FormItemWrapper>
|
|
2298
|
-
* <!-- !!自定义栅格占位格数第一种方式:可通过使用 BoxGrid.Col 包裹元素来自定义网格占比 -->
|
|
2299
|
-
* <BoxGrid.Col span={24}>
|
|
2300
|
-
* <FormItemWrapper name="field5" label="条件5">
|
|
2301
|
-
* <Input placeholder="请输入" allowClear={true} />
|
|
2302
|
-
* </FormItemWrapper>
|
|
2303
|
-
* </BoxGrid.Col>
|
|
2304
|
-
* <!-- !!自定义栅格占位格数第二种方式:如果为FormItemWrapper组件,可设置span属性 -->
|
|
2305
|
-
* <FormItemWrapper name="field6" label="条件6" span={24}>
|
|
2306
|
-
* <Input placeholder="请输入" allowClear={true} />
|
|
2307
|
-
* </FormItemWrapper>
|
|
2308
|
-
* <FormItemWrapper noStyle span={24}>
|
|
2309
|
-
* <Button>按钮</Buttone>
|
|
2310
|
-
* </FormItemWrapper>
|
|
2311
|
-
* </EasyForm>
|
|
2312
|
-
* ```
|
|
2313
|
-
*/
|
|
2314
|
-
export declare const EasyForm: (props: EasyFormProps) => import("react").JSX.Element;
|
|
2315
2560
|
export type TEasyTableTableColumn<T> = ColumnsType<T>[0] & {
|
|
2316
2561
|
/**
|
|
2317
2562
|
* @description 请使用 tipsWrapperProps 属性配置
|
|
@@ -2749,6 +2994,19 @@ export declare const EasyTable: import("react").ForwardRefExoticComponent<EasyTa
|
|
|
2749
2994
|
/** 设置启用初始化请求 */
|
|
2750
2995
|
setEnabledInitRequest: (cacheKey: string) => void;
|
|
2751
2996
|
};
|
|
2997
|
+
/**
|
|
2998
|
+
* 使用FormList实现可编辑卡片
|
|
2999
|
+
* ```
|
|
3000
|
+
* 1. 必须在外部包裹Form组件
|
|
3001
|
+
* 2. 行内需要联动逻辑可使用 column.render.operation.setCurrentRowField 方法
|
|
3002
|
+
* 3. 可使用DragEditableCard组件实现拖拽排序
|
|
3003
|
+
* 4. 设置EditableCard disabled后,通过 LabelValueRender 组件展示数据,可通过 disabledRenderProps 配置布局
|
|
3004
|
+
*
|
|
3005
|
+
* demo
|
|
3006
|
+
* https://fex.qa.tcshuke.com/docs/admin/main/form/grid
|
|
3007
|
+
* ```
|
|
3008
|
+
*/
|
|
3009
|
+
export declare const EditableCard: (props: EditableCardProps) => import("react").JSX.Element;
|
|
2752
3010
|
export interface EditableFieldProps {
|
|
2753
3011
|
className?: string;
|
|
2754
3012
|
style?: CSSProperties;
|
|
@@ -3806,6 +4064,31 @@ export interface ModalActionProps {
|
|
|
3806
4064
|
* ```
|
|
3807
4065
|
*/
|
|
3808
4066
|
export declare const ModalAction: (props: ModalActionProps) => import("react").JSX.Element;
|
|
4067
|
+
type InputNumberProps$1 = GetProps<typeof InputNumber>;
|
|
4068
|
+
export type NumberRangeFormItemProps = Omit<FormItemWrapperProps, "name" | "rules"> & {
|
|
4069
|
+
minFormItemName: FormItemNamePath;
|
|
4070
|
+
maxFormItemName: FormItemNamePath;
|
|
4071
|
+
/** 是否必填 */
|
|
4072
|
+
required?: boolean;
|
|
4073
|
+
/** 必填验证异常文案 */
|
|
4074
|
+
requiredRuleMessage?: string | [
|
|
4075
|
+
string,
|
|
4076
|
+
string
|
|
4077
|
+
];
|
|
4078
|
+
/** 范围验证异常文案 */
|
|
4079
|
+
rangeRuleMessage?: string | [
|
|
4080
|
+
string,
|
|
4081
|
+
string
|
|
4082
|
+
];
|
|
4083
|
+
minInputNumberProps?: Omit<InputNumberProps$1, "value">;
|
|
4084
|
+
maxInputNumberProps?: Omit<InputNumberProps$1, "value">;
|
|
4085
|
+
/** 最小值与最大值输入是否可以相同 */
|
|
4086
|
+
isInputEqual?: boolean;
|
|
4087
|
+
};
|
|
4088
|
+
/**
|
|
4089
|
+
* 数字输入范围组件
|
|
4090
|
+
*/
|
|
4091
|
+
export declare const NumberRangeFormItem: (props: NumberRangeFormItemProps) => import("react").JSX.Element;
|
|
3809
4092
|
export type PageFixedFooterProps = {
|
|
3810
4093
|
className?: string;
|
|
3811
4094
|
style?: CSSProperties;
|
package/dist/index.js
CHANGED
|
@@ -34,6 +34,7 @@ import './dialog-loading/index.css';
|
|
|
34
34
|
import './dialog-modal/index.css';
|
|
35
35
|
import './drag-collapse-form-list/index.css';
|
|
36
36
|
import './drag-collapse/index.css';
|
|
37
|
+
import './drag-editable-card/index.css';
|
|
37
38
|
import './drag-editable-table-pro/index.css';
|
|
38
39
|
import './drag-editable-table/index.css';
|
|
39
40
|
import './drag-form-list/index.css';
|
|
@@ -42,6 +43,7 @@ import './dropdown-menu-wrapper/index.css';
|
|
|
42
43
|
import './dynamic-node/index.css';
|
|
43
44
|
import './easy-form/index.css';
|
|
44
45
|
import './easy-table/index.css';
|
|
46
|
+
import './editable-card/index.css';
|
|
45
47
|
import './editable-field-provider/index.css';
|
|
46
48
|
import './editable-field/index.css';
|
|
47
49
|
import './editable-table-pro/index.css';
|
|
@@ -72,6 +74,7 @@ import './local-loading/index.css';
|
|
|
72
74
|
import './mention-editor/index.css';
|
|
73
75
|
import './mentions-wrapper/index.css';
|
|
74
76
|
import './modal-action/index.css';
|
|
77
|
+
import './number-range-form-item/index.css';
|
|
75
78
|
import './page-fixed-footer/index.css';
|
|
76
79
|
import './page404/index.css';
|
|
77
80
|
import './pagination-wrapper/index.css';
|
|
@@ -116,6 +119,7 @@ import './tips-title/index.css';
|
|
|
116
119
|
import './tips-wrapper/index.css';
|
|
117
120
|
import './tree-selector-wrapper/index.css';
|
|
118
121
|
import './tree-wrapper/index.css';
|
|
122
|
+
import './types/index.css';
|
|
119
123
|
import './upload-wrapper/index.css';
|
|
120
124
|
import './x-mind-preview/index.css';
|
|
121
125
|
import './index.css';
|
|
@@ -156,6 +160,7 @@ export { d as dialogLoading } from './dialog-loading-DdKI0dnm.js';
|
|
|
156
160
|
export { d as dialogModal } from './dialog-modal-DbTrsUc2.js';
|
|
157
161
|
export { D as DragCollapse } from './drag-collapse-wL7wIgVO.js';
|
|
158
162
|
export { D as DragCollapseFormList } from './drag-collapse-DU_JhQTz.js';
|
|
163
|
+
export { D as DragEditableCard } from './editable-card-C7QR8MKV.js';
|
|
159
164
|
export { D as DragEditableTable } from './drag-DVV-pdrI.js';
|
|
160
165
|
export { D as DragEditableTablePro } from './drag-BOT05TxF.js';
|
|
161
166
|
export { D as DragFormList } from './drag-form-list-BGqbBKJM.js';
|
|
@@ -164,6 +169,7 @@ export { D as DropdownMenuWrapper } from './dropdown-menu-wrapper-F5A3o-Jt.js';
|
|
|
164
169
|
export { d as dynamicNode } from './dynamic-node-B_An5owN.js';
|
|
165
170
|
export { E as EasyForm } from './form-Bz0Gi7wm.js';
|
|
166
171
|
export { EasyTable } from './easy-table/index.js';
|
|
172
|
+
export { E as EditableCard } from './editable-card-BmTHD2vj.js';
|
|
167
173
|
export { E as EditableField } from './editable-field-XVZ1Rqdm.js';
|
|
168
174
|
export { E as EditableFieldProvider } from './editable-field-provider-DqKcZQYP.js';
|
|
169
175
|
export { E as EditableTable } from './editable-table-Ch7M44bV.js';
|
|
@@ -194,6 +200,7 @@ export { LocalLoading } from './local-loading/index.js';
|
|
|
194
200
|
export { M as MentionEditor } from './mention-editor-GK6I91p1.js';
|
|
195
201
|
export { M as MentionsWrapper } from './mentions-CZv5lHej.js';
|
|
196
202
|
export { M as ModalAction } from './modal-action-eYHh8gcR.js';
|
|
203
|
+
export { N as NumberRangeFormItem } from './number-range-B_WHzUn5.js';
|
|
197
204
|
export { P as PageFixedFooter } from './page-fixed-footer-BHBJsfnh.js';
|
|
198
205
|
export { P as Page404 } from './page404-CVcO-6Fc.js';
|
|
199
206
|
export { P as PaginationWrapper } from './pagination-BNbiyV-n.js';
|
|
@@ -238,6 +245,7 @@ export { T as TipsTitle } from './tips-title-DWwc8kJv.js';
|
|
|
238
245
|
export { T as TipsWrapper } from './tips-wrapper-Bf9nfZq3.js';
|
|
239
246
|
export { T as TreeSelectorWrapper } from './tree-selector-wrapper-Jh2ePDFB.js';
|
|
240
247
|
export { TreeWrapper } from './tree-wrapper/index.js';
|
|
248
|
+
export { types } from './types/index.js';
|
|
241
249
|
export { U as UploadWrapper } from './upload-wrapper-CSmbSn4P.js';
|
|
242
250
|
export { X as XMindPreview } from './x-mind-preview-BxHDc_lA.js';
|
|
243
251
|
import './_rollupPluginBabelHelpers-BYm17lo8.js';
|
|
@@ -307,11 +315,11 @@ import '@ant-design/icons/es/icons/ExclamationCircleFilled.js';
|
|
|
307
315
|
import '@ant-design/icons/es/icons/DownOutlined.js';
|
|
308
316
|
import '@ant-design/icons/es/icons/UpOutlined.js';
|
|
309
317
|
import 'react-is';
|
|
318
|
+
import '@ant-design/icons/es/icons/PlusOutlined.js';
|
|
310
319
|
import '@ant-design/icons/es/icons/CloseOutlined.js';
|
|
311
320
|
import '@ant-design/icons/es/icons/CheckOutlined.js';
|
|
312
321
|
import '@ant-design/icons/es/icons/EditOutlined.js';
|
|
313
322
|
import './context-HuMVSP3b.js';
|
|
314
|
-
import '@ant-design/icons/es/icons/PlusOutlined.js';
|
|
315
323
|
import '@dimjs/lang/is-boolean';
|
|
316
324
|
import './use-responsive-point-Bp3D3lZT.js';
|
|
317
325
|
import '@ant-design/icons/es/icons/QuestionCircleFilled.js';
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|