New file |
| | |
| | | import { TextField, useUpdate, useNotify, useRefresh, useRecordContext, useTranslate, useGetResourceLabel } from 'react-admin'; |
| | | import { TextField as MuiTextField } from '@mui/material'; |
| | | import { useState } from 'react'; |
| | | |
| | | const EditableTextField = ({ source, label, resource, isBlur }) => { |
| | | const record = useRecordContext(); |
| | | const translate = useTranslate(); |
| | | const [value, setValue] = useState(record[source]); |
| | | const [update] = useUpdate(); |
| | | const notify = useNotify(); |
| | | const refresh = useRefresh(); |
| | | label = label ? label : "" |
| | | isBlur = isBlur == undefined ? false : isBlur |
| | | |
| | | const handleBlur = () => { |
| | | isBlur ? |
| | | update( |
| | | resource, |
| | | { id: record.id, data: { [source]: value } }, |
| | | { |
| | | onSuccess: () => { |
| | | const succ = translate('common.action.updateSucc') |
| | | notify(succ, { type: 'success' }); |
| | | refresh(); |
| | | }, |
| | | onError: () => { |
| | | const failed = translate('common.action.updateSucc') |
| | | notify(failed, { type: 'error' }); |
| | | setValue(record[source]); |
| | | } |
| | | } |
| | | ) : |
| | | {} |
| | | }; |
| | | |
| | | return ( |
| | | <MuiTextField |
| | | value={value} |
| | | onChange={(e) => setValue(e.target.value)} |
| | | label={translate(label)} |
| | | onBlur={handleBlur} |
| | | fullWidth |
| | | /> |
| | | ); |
| | | }; |
| | | |
| | | |
| | | export default EditableTextField; |