diff --git a/src/components/Table/EditableTable.jsx b/src/components/Table/EditableTable.jsx index 4d9fdd8..9499467 100644 --- a/src/components/Table/EditableTable.jsx +++ b/src/components/Table/EditableTable.jsx @@ -1,31 +1,34 @@ -import { Form, Table, Button, Popconfirm } from "antd" +import { Form, Table, Button, Popconfirm } from 'antd' import { EditOutlined, SaveOutlined, PlusOutlined, CloseCircleOutlined, DeleteOutlined } from '@ant-design/icons' -import { useState, useEffect } from "react"; +import { useState, useEffect } from 'react' import { EditableCell } from './EditableCell' -import { invokeWebApiWrapperAsync } from "../factory"; +import { invokeWebApiWrapperAsync } from '../factory' const newRowKeyValue = 'newRow' -export const makeActionHandler = (action, { service, setLoader, errorMsg, onComplete }) => service && action && ((record) => invokeWebApiWrapperAsync( - async () => { - if (action === 'insert') { +export const makeActionHandler = (action, { service, setLoader, errorMsg, onComplete }) => service && action && ( + (record) => invokeWebApiWrapperAsync( + async () => { + if (action === 'insert') { + record.key = Date.now() await service.insert(record) - } else if (record.id) { + } else if (record.id) { if (action === 'update') - await service.delete(record.id) + await service.put(record.id, record) else if (action === 'delete') - await service.put(record.id, record) - } - onComplete?.() - }, - setLoader, - errorMsg -)) + await service.delete(record.id) + } + onComplete?.() + }, + setLoader, + errorMsg + ) +) export const tryAddKeys = (items) => { - if(!items?.length || !items[0]) + if (!items?.length || !items[0]) return [] - if(items[0].key) + if (items[0].key) return items return items.map((item, index) => ({...item, key: item.key ?? item.id ?? index })) } @@ -44,9 +47,9 @@ export const EditableTable = ({ const [data, setData] = useState(tryAddKeys(dataSource)) const [editingKey, setEditingKey] = useState('') - useEffect(()=>{ + useEffect(() => { setData(tryAddKeys(dataSource)) - },[dataSource]) + }, [dataSource]) const isEditing = (record) => record?.key === editingKey @@ -56,8 +59,7 @@ export const EditableTable = ({ } const cancel = () => { - if(editingKey === newRowKeyValue) - { + if (editingKey === newRowKeyValue) { const newData = [...data] const index = newData.findIndex((item) => newRowKeyValue === item.key) newData.splice(index, 1) @@ -71,6 +73,11 @@ export const EditableTable = ({ ...form.initialValues, key:newRowKeyValue } + // const newRow = { key: newRowKeyValue } + + // for (let column of columns) + // newRow[column.dataIndex] = form.initialValues?.[column.dataIndex] ?? column.initialValue + const newData = [newRow, ...data] setData(newData) edit(newRow) @@ -86,7 +93,7 @@ export const EditableTable = ({ newData.splice(index, 1, newItem) - if(item.key === newRowKeyValue) + if (item.key === newRowKeyValue) item.key = newRowKeyValue + newData.length const isAdding = editingKey === newRowKeyValue @@ -94,22 +101,22 @@ export const EditableTable = ({ setData(newData) if (isAdding) - try{ + try { onRowAdd(newItem) - }catch(err){ + } catch (err) { console.log('callback onRowAdd fault:', err) } else - try{ + try { onRowEdit(newItem) - }catch(err){ + } catch (err) { console.log('callback onRowEdit fault:', err) } - try{ - if(onChange) + try { + if (onChange) onChange(newData) - }catch(err){ + } catch (err) { console.log('callback onChange fault:', err) } @@ -127,40 +134,41 @@ export const EditableTable = ({ onRowDelete(record) - if(onChange) + if (onChange) onChange(newData) } const operationColumn = { width: 82, - title: (!!onRowAdd) &&