feat: input-table 的复制功能支持配置复制数据映射 (#10519)

This commit is contained in:
liaoxuezhi 2024-06-26 15:30:37 +08:00 committed by GitHub
parent 612c16895d
commit 08835ccb70
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 25 additions and 5 deletions

View File

@ -146,21 +146,26 @@ order: 54
还能通过 `copyable` 来增加一个复制按钮来复制当前行 还能通过 `copyable` 来增加一个复制按钮来复制当前行
> 6.6.0 起支持配置 `copyData` 属性,来指定复制的数据。默认值为 `{&: "$$"}`
```schema: scope="body" ```schema: scope="body"
{ {
"type": "form", "type": "form",
"api": "/api/mock2/form/saveForm", "api": "/api/mock2/form/saveForm",
"debug": true,
"body": [ "body": [
{ {
"type":"input-table", "type":"input-table",
"name":"table", "name":"table",
"addable": true, "addable": true,
"copyable": true, "copyable": true,
"copyData": {"&": "$$$$", "id": "$${'__undefined'}", "copyFrom": "$${id}"},
"editable": true, "editable": true,
"value": [ "value": [
{ {
"a": "a1", "a": "a1",
"b": "b1" "b": "b1",
"id": 1
} }
], ],
"columns":[ "columns":[
@ -917,6 +922,8 @@ order: 54
| ---------------------------- | ----------------------------------------- | --------------- | ---------------------------------------------------------------------------------------------------- | | ---------------------------- | ----------------------------------------- | --------------- | ---------------------------------------------------------------------------------------------------- |
| type | `string` | `"input-table"` | 指定为 Table 渲染器 | | type | `string` | `"input-table"` | 指定为 Table 渲染器 |
| addable | `boolean` | `false` | 是否可增加一行 | | addable | `boolean` | `false` | 是否可增加一行 |
| copyable | `boolean` | `false` | 是否可复制一行 |
| copyData | `PlainObject` | | 控制复制时的数据映射,不配置时复制整行数据 |
| childrenAddable | `boolean` | `false` | 是否可增加子级节点 | | childrenAddable | `boolean` | `false` | 是否可增加子级节点 |
| editable | `boolean` | `false` | 是否可编辑 | | editable | `boolean` | `false` | 是否可编辑 |
| removable | `boolean` | `false` | 是否可删除 | | removable | `boolean` | `false` | 是否可删除 |

View File

@ -253,6 +253,11 @@
& .label { & .label {
font-size: 90%; font-size: 90%;
} }
& > .#{$ns}Form,
& > .#{$ns}Form-item {
min-width: var(--Form-control-widthBase);
}
} }
&.is-layout-fixed td { &.is-layout-fixed td {

View File

@ -76,6 +76,12 @@ export interface TableControlSchema
*/ */
copyAddBtn?: boolean; copyAddBtn?: boolean;
/**
* {&:$$}
*
*/
copyData?: Record<string, any>;
/** /**
* *
*/ */
@ -622,20 +628,22 @@ export default class FormTable extends React.Component<TableProps, TableState> {
} }
async copyItem(index: string) { async copyItem(index: string) {
const {needConfirm} = this.props; const {needConfirm, data, copyData = {'&': '$$'}} = this.props;
let items = this.state.items.concat(); let items = this.state.items.concat();
const indexes = index.split('.').map(item => parseInt(item, 10)); const indexes = index.split('.').map(item => parseInt(item, 10));
const next = indexes.concat(); const next = indexes.concat();
next[next.length - 1] += 1; next[next.length - 1] += 1;
const originItems = items; const originItems = items;
const src = getTree(items, indexes);
const item = dataMapping(copyData, createObject(data, src));
if (needConfirm === false) { if (needConfirm === false) {
items = spliceTree(items, next, 0, getTree(items, indexes)); items = spliceTree(items, next, 0, item);
} else { } else {
// 复制相当于新增一行 // 复制相当于新增一行
// 需要同addItem一致添加__placeholder属性 // 需要同addItem一致添加__placeholder属性
items = spliceTree(items, next, 0, { items = spliceTree(items, next, 0, {
...getTree(items, indexes), ...item,
__isPlaceholder: true __isPlaceholder: true
}); });
} }
@ -650,7 +658,7 @@ export default class FormTable extends React.Component<TableProps, TableState> {
const isPrevented = await this.dispatchEvent('add', { const isPrevented = await this.dispatchEvent('add', {
index: next[next.length - 1], index: next[next.length - 1],
indexPath: next.join('.'), indexPath: next.join('.'),
item: getTree(items, next) item: item
}); });
if (isPrevented) { if (isPrevented) {
return; return;