| @@ -7,8 +7,8 @@ import { FiDataGrid } from "components/FiDataGrid"; | |||||
| // ==============================|| EVENT TABLE ||============================== // | // ==============================|| EVENT TABLE ||============================== // | ||||
| export default function SearchTable({ previewSearchCriteria, onPreviewGridOnReady,selectedIds = []}) { | |||||
| const [_searchCriteria, set_searchCriteria] = React.useState(previewSearchCriteria); | |||||
| export default function SearchTable({ previewSearchCriteria, onPreviewGridOnReady,selectedIds = [], previewToken }) { | |||||
| // const [_searchCriteria, set_searchCriteria] = React.useState(previewSearchCriteria); | |||||
| const navigate = useNavigate() | const navigate = useNavigate() | ||||
| // const [rows, setRows] = React.useState([]); | // const [rows, setRows] = React.useState([]); | ||||
| @@ -28,9 +28,21 @@ export default function SearchTable({ previewSearchCriteria, onPreviewGridOnRead | |||||
| } | } | ||||
| } | } | ||||
| React.useEffect(() => { | |||||
| set_searchCriteria(previewSearchCriteria); | |||||
| }, [previewSearchCriteria]); | |||||
| const doLoad = React.useMemo(() => { | |||||
| if (!selectedIds?.length) return undefined; | |||||
| return { | |||||
| url: GFIMIS_LIST, | |||||
| params: { | |||||
| ...previewSearchCriteria, | |||||
| paymentId: selectedIds.join(',') | |||||
| } | |||||
| }; | |||||
| }, [previewSearchCriteria, selectedIds, previewToken]); | |||||
| // React.useEffect(() => { | |||||
| // set_searchCriteria(previewSearchCriteria); | |||||
| // }, [previewSearchCriteria]); | |||||
| const handleEditClick = (params) => () => { | const handleEditClick = (params) => () => { | ||||
| navigate('/paymentPage/details/' + params.row.id); | navigate('/paymentPage/details/' + params.row.id); | ||||
| @@ -61,23 +73,15 @@ export default function SearchTable({ previewSearchCriteria, onPreviewGridOnRead | |||||
| return ( | return ( | ||||
| <div style={{ width: '100%' }}> | <div style={{ width: '100%' }}> | ||||
| <FiDataGrid | <FiDataGrid | ||||
| key={previewToken} | |||||
| sx={_sx} | sx={_sx} | ||||
| rowHeight={80} | rowHeight={80} | ||||
| columns={columns} | columns={columns} | ||||
| customPageSize={10} | customPageSize={10} | ||||
| onRowDoubleClick={handleEditClick} | onRowDoubleClick={handleEditClick} | ||||
| applyGridOnReady={onPreviewGridOnReady} | applyGridOnReady={onPreviewGridOnReady} | ||||
| doLoad={React.useMemo(() => { | |||||
| if (!selectedIds?.length) { | |||||
| return undefined; // ⬅️ will keep grid empty | |||||
| } | |||||
| return { | |||||
| url: GFIMIS_LIST, | |||||
| params: { ..._searchCriteria, paymentId: selectedIds.join(',') }, | |||||
| }; | |||||
| }, [_searchCriteria, selectedIds])} | |||||
| doLoad={doLoad} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -117,10 +117,10 @@ export default function SearchPaymentTable({ searchCriteria, applyGridOnReady, a | |||||
| callback: (responseData) => { | callback: (responseData) => { | ||||
| const newIds = responseData.records.map(r => r.id); | const newIds = responseData.records.map(r => r.id); | ||||
| if (selectedIds.length === 0) { | if (selectedIds.length === 0) { | ||||
| onSelectionChange(newIds); | |||||
| onSelectionChange?.(newIds); | |||||
| } else { | } else { | ||||
| const stillValid = selectedIds.filter(id => newIds.includes(id)); | const stillValid = selectedIds.filter(id => newIds.includes(id)); | ||||
| onSelectionChange(stillValid); | |||||
| onSelectionChange?.(stillValid); | |||||
| } | } | ||||
| } | } | ||||
| }), [_searchCriteria])} | }), [_searchCriteria])} | ||||
| @@ -57,6 +57,7 @@ const Index = () => { | |||||
| const [inputDate, setInputDate] = React.useState(searchCriteria.dateTo); | const [inputDate, setInputDate] = React.useState(searchCriteria.dateTo); | ||||
| const [inputDateValue, setInputDateValue] = React.useState("dd / mm / yyyy"); | const [inputDateValue, setInputDateValue] = React.useState("dd / mm / yyyy"); | ||||
| const [previewToken, setPreviewToken] = React.useState(0); | |||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| setInputDateValue(inputDate); | setInputDateValue(inputDate); | ||||
| @@ -145,11 +146,14 @@ const Index = () => { | |||||
| } | } | ||||
| function previewSearch() { | function previewSearch() { | ||||
| // trigger reload even if criteria object is identical | |||||
| const withToken = { ...searchCriteria, __ts: Date.now() }; | |||||
| if (selectedIds.length === 0) return; | |||||
| setIsPopUp(false); | setIsPopUp(false); | ||||
| setIsPreviewLoading(true); | setIsPreviewLoading(true); | ||||
| const withToken = { ...searchCriteria, __ts: Date.now() }; | |||||
| setPreviewSearchCriteria(withToken); | setPreviewSearchCriteria(withToken); | ||||
| setPreviewToken(t => t + 1); | |||||
| } | } | ||||
| function onPreviewGridOnReady(isLoading) { | function onPreviewGridOnReady(isLoading) { | ||||
| @@ -228,6 +232,7 @@ const Index = () => { | |||||
| previewSearchCriteria={previewSearchCriteria} | previewSearchCriteria={previewSearchCriteria} | ||||
| onPreviewGridOnReady={onPreviewGridOnReady} | onPreviewGridOnReady={onPreviewGridOnReady} | ||||
| selectedIds={selectedIds} | selectedIds={selectedIds} | ||||
| previewToken={previewToken} | |||||
| /> | /> | ||||
| </MainCard> | </MainCard> | ||||
| @@ -106,19 +106,19 @@ export const fileDownload = ({ url, fileId, skey, params, method, onResponse, on | |||||
| }; | }; | ||||
| const fileDownloadResponse = (response, onResponse) => { | const fileDownloadResponse = (response, onResponse) => { | ||||
| const fn = response.headers.get("content-disposition")?.split("filename=")[1]?.split('"')[1]?.trim() ?? filename; | |||||
| const cd = response.headers?.['content-disposition']; | |||||
| const fn = cd?.split('filename=')[1]?.replaceAll('"','')?.trim() || 'export.xlsx'; | |||||
| const url = URL.createObjectURL(response.data); | const url = URL.createObjectURL(response.data); | ||||
| const a = document.createElement('a'); | const a = document.createElement('a'); | ||||
| a.href = url; | a.href = url; | ||||
| a.setAttribute("download", fn); | |||||
| a.download = fn; | |||||
| document.body.appendChild(a); | document.body.appendChild(a); | ||||
| a.click(); | a.click(); | ||||
| document.body.removeChild(a); | document.body.removeChild(a); | ||||
| URL.revokeObjectURL(url); | URL.revokeObjectURL(url); | ||||
| if (onResponse) { | |||||
| onResponse(); | |||||
| } | |||||
| } | |||||
| onResponse?.(); | |||||
| }; | |||||
| export const fileUpload = ({ refType, refId, files, refCode, onSuccess, onFail, onError }) => { | export const fileUpload = ({ refType, refId, files, refCode, onSuccess, onFail, onError }) => { | ||||
| postWithFiles({ | postWithFiles({ | ||||