ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: table section checkbox can not be selected

Browse Source
This commit is contained in:
chenos 2021-01-07 09:25:27 +08:00
parent 8b1bd64034
commit ee6cc5a665
1 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
packages/app/src/components/form.fields/sub-table/Table.tsx
View File

@ -42,17 +42,26 @@ export default function Table(props: SimpleTableProps) {
resourceKey: 'simple' resourceKey: 'simple'
})); }));
const [dataSource, setDataSource] = useState(value.map((item, index) => {
if (item.__id) {
return item;
};
return {...item, __id: generateIndex()};
}))
if (loading) { if (loading) {
return <Spin/> return <Spin/>
} }
// console.log('dataSource', dataSource);
return ( return (
<div> <div>
<div> <div>
<Space style={{marginBottom: 14, position: 'absolute', right: 0, top: -31}}> <Space style={{marginBottom: 14, position: 'absolute', right: 0, top: -31}}>
<Popconfirm title="确认删除吗？" onConfirm={() => { <Popconfirm title="确认删除吗？" onConfirm={() => {
console.log({selectedRowKeys}) console.log({selectedRowKeys})
const newValues = value.filter(item => selectedRowKeys.indexOf(item.__id) === -1); const newValues = dataSource.filter(item => selectedRowKeys.indexOf(item.__id) === -1);
setDataSource(newValues);
onChange(newValues); onChange(newValues);
}}> }}>
<Button size={'small'} type={'ghost'} danger>删除</Button> <Button size={'small'} type={'ghost'} danger>删除</Button>
@ -67,32 +76,28 @@ export default function Table(props: SimpleTableProps) {
</div> </div>
<Form target={target} onFinish={(values, index: number) => { <Form target={target} onFinish={(values, index: number) => {
console.log(values); console.log(values);
const newVaules = [...value]; const newVaules = [...dataSource];
if (typeof index === 'undefined') { if (typeof index === 'undefined') {
newVaules.push({...values, __id: generateIndex()}) newVaules.push({...values, __id: generateIndex()})
} else { } else {
newVaules[index] = values; newVaules[index] = values;
} }
setDataSource(newVaules);
onChange(newVaules); onChange(newVaules);
console.log(newVaules); // console.log(newVaules);
}} ref={drawerRef}/> }} ref={drawerRef}/>
<AntdTable <AntdTable
size={'small'} size={'small'}
rowKey={rowKey} rowKey={rowKey}
// loading={loading} // loading={loading}
columns={fields2columns(schema.fields||[])} columns={fields2columns(schema.fields||[])}
dataSource={value} dataSource={dataSource}
onChange={(pagination, filters, sorter, extra) => { onChange={(pagination, filters, sorter, extra) => {
}} }}
components={components({ components={components({
data: { data: {
list: value.map((item, index) => { list: dataSource,
if (item.__id) {
return item;
};
return {...item, __id: generateIndex()};
}),
}, },
mutate: (values) => { mutate: (values) => {
onChange(values.list); onChange(values.list);