Стилистические изменения

This commit is contained in:
Александр Сироткин 2021-12-13 10:28:10 +05:00
parent 4afa7810ff
commit 78c7f78935
4 changed files with 70 additions and 56 deletions

View File

@ -1,26 +1,29 @@
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(
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) {
if (action === 'update')
await service.delete(record.id)
else if (action === 'delete')
await service.put(record.id, record)
else if (action === 'delete')
await service.delete(record.id)
}
onComplete?.()
},
setLoader,
errorMsg
))
)
)
export const tryAddKeys = (items) => {
if (!items?.length || !items[0])
@ -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)
@ -133,34 +140,35 @@ export const EditableTable = ({
const operationColumn = {
width: 82,
title: (!!onRowAdd) && <Button
title: !!onRowAdd && (
<Button
onClick={addNewRow}
disabled={editingKey !== ''}
icon={<PlusOutlined/>}
/>,
/>
),
dataIndex: 'operation',
render: (_, record) => {
const editable = isEditing(record)
return editable
?(<span>
render: (_, record) => isEditing(record) ? (
<span>
<Button onClick={() => save(record)} icon={<SaveOutlined/>}/>
<Button onClick={cancel} icon={<CloseCircleOutlined/>}/>
</span>
) : (
<span>
{onRowEdit && (
<Button
onClick={() => save(record)}
icon={<SaveOutlined/>}/>
<Button
onClick={cancel}
icon={<CloseCircleOutlined/>}/>
</span>)
:(<span>
{onRowEdit&&<Button
disabled={editingKey !== ''}
onClick={() => edit(record)}
icon={<EditOutlined/>}/>}
{onRowDelete&&
<Popconfirm title="Удалить?" onConfirm={()=>deleteRow(record)}>
icon={<EditOutlined/>}
/>
)}
{onRowDelete && (
<Popconfirm title={'Удалить?'} onConfirm={() => deleteRow(record)}>
<Button icon={<DeleteOutlined/>}/>
</Popconfirm>}
</span>)
},
</Popconfirm>
)}
</span>
),
}
const handleColumn = (col) => {

View File

@ -3,6 +3,7 @@ import { Select, Table as RawTable } from 'antd'
import { OptionsType } from 'rc-select/lib/interface'
import { tryAddKeys } from './EditableTable'
import { makeNumericSorter, makeStringSorter} from './sorters'
import { Rule } from 'rc-field-form/lib/interface'
export { makeDateSorter, makeNumericSorter, makeStringSorter} from './sorters'
export { EditableTable, makeActionHandler } from './EditableTable'
export { DatePickerWrapper } from './DatePickerWrapper'
@ -55,7 +56,7 @@ interface columnPropsOther {
// css класс для <FormItem/>, если требуется
formItemClass?: string
// массив правил валидации значений https://ant.design/components/form/#Rule
formItemRules?: any[]
formItemRules?: Rule[]
// дефолтное значение при добавлении новой строки
initialValue?: string|number

View File

@ -1,13 +1,13 @@
import React from 'react'
type PointerIconColors = {
export type PointerIconColors = {
online?: string
active?: string
inactive?: string
unknown?: string
}
interface PointerIconProps {
export interface PointerIconProps {
width?: string | number
height?: string | number
online?: boolean

View File

@ -0,0 +1,5 @@
export type { PointerIconColors, PointerIconProps } from './PointerIcon'
export type { WellIconColors, WellIconProps } from './WellIcon'
export { PointerIcon } from './PointerIcon'
export { WellIcon } from './WellIcon'