update search button

src/components/FiDataGrid.js

@@ -11,7 +11,7 @@ import { TablePagination, Typography } from '@mui/material';
 
 export function FiDataGrid({ rows, columns, sx, autoHeight,
     hideFooterSelectedRowCount, rowModesModel, editMode,
-    pageSizeOptions, filterItems, customPageSize, doLoad, ...props }) {
+    pageSizeOptions, filterItems, customPageSize, doLoad, applyGridOnReady, ...props }) {
     const intl = useIntl();
     const [_rows, set_rows] = useState([]);
     const [_doLoad, set_doLoad] = useState({});
@@ -135,6 +135,7 @@ export function FiDataGrid({ rows, columns, sx, autoHeight,
                     _doLoad.callback(responseData);
                 }
                 setLoading(false)
+                applyGridOnReady(false)
             },
             onError: function (error){
                 console.log(error)

src/pages/Payment/Search_GLD/DataGrid.js

@@ -9,7 +9,7 @@ import { FiDataGrid } from "components/FiDataGrid";
 import { clickableLink } from 'utils/CommonFunction';
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPaymentTable({ searchCriteria }) {
+export default function SearchPaymentTable({ searchCriteria, applyGridOnReady }) {
     const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria);
     const navigate = useNavigate()
 
@@ -96,6 +96,7 @@ export default function SearchPaymentTable({ searchCriteria }) {
                 columns={columns}
                 customPageSize={10}
                 onRowDoubleClick={handleEditClick}
+                applyGridOnReady={applyGridOnReady}
                 // doLoad={{
                 //     url:PAYMENT_LIST,
                 //     params:_searchCriteria,

src/pages/Payment/Search_GLD/SearchForm.js

@@ -19,7 +19,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
+const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => {
 
     const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom);
     const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
@@ -215,6 +215,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                         <Button
                             variant="contained"
                             type="submit"
+                            disabled={onGridReady}
                         >
                             Submit
                         </Button>

src/pages/Payment/Search_GLD/index.js

@@ -33,15 +33,21 @@ const Index = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)),
     });
     const [onReady, setOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         setOnReady(true);
     }, [searchCriteria]);
 
     function applySearch(input) {
+        setGridOnReady(true)
         setSearchCriteria(input);
     }
 
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
+
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
@@ -63,8 +69,9 @@ const Index = () => {
                 {/*row 1*/}
                 <Grid item xs={12} md={12} lg={12} sx={{mb:-1}}>
                     <SearchForm 
-                    applySearch={applySearch}
-                    searchCriteria={searchCriteria}
+                        applySearch={applySearch}
+                        searchCriteria={searchCriteria}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -76,6 +83,7 @@ const Index = () => {
                     >
                         <EventTable
                             searchCriteria={searchCriteria}
+                            applyGridOnReady={applyGridOnReady}
                         />
                     </MainCard>
                 </Grid>

src/pages/Payment/Search_Public/DataGrid.js

@@ -14,7 +14,7 @@ import { clickableLink } from 'utils/CommonFunction';
 import {PAYMENT_LIST} from "utils/ApiPathConst";
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPublicNoticeTable({ searchCriteria }) {
+export default function SearchPublicNoticeTable({ searchCriteria, applyGridOnReady }) {
     const navigate = useNavigate()
     const theme = useTheme();
     const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));
@@ -110,6 +110,7 @@ export default function SearchPublicNoticeTable({ searchCriteria }) {
                 columns={columns}
                 customPageSize={10}
                 onRowDoubleClick={handleEditDoubleClick}
+                applyGridOnReady={applyGridOnReady}
                 // doLoad={{
                 //     url: PAYMENT_LIST,
                 //     params: _searchCriteria,

src/pages/Payment/Search_Public/SearchForm.js

@@ -21,7 +21,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
+const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => {
     const intl = useIntl();
     const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom);
     const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
@@ -240,6 +240,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                             variant="contained"
                             type="submit"
                             aria-label={intl.formatMessage({id: 'submit'})}
+                            disabled={onGridReady}
                         >
                             <FormattedMessage id="submit"/>
                         </Button>

src/pages/Payment/Search_Public/index.js

@@ -33,15 +33,21 @@ const Index = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)),
     });
     const [onReady, setOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         setOnReady(true);
     }, [searchCriteria]);
 
     function applySearch(input) {
+        setGridOnReady(true)
         setSearchCriteria(input);
     }
 
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
+
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
@@ -63,8 +69,9 @@ const Index = () => {
                 {/*row 1*/}
                 <Grid item xs={12} md={12} lg={12}>
                     <SearchForm 
-                    applySearch={applySearch}
-                    searchCriteria={searchCriteria}
+                        applySearch={applySearch}
+                        searchCriteria={searchCriteria}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -76,6 +83,7 @@ const Index = () => {
                     >
                         <EventTable
                             searchCriteria={searchCriteria}
+                            applyGridOnReady={applyGridOnReady}
                         />
                     </MainCard>
                 </Grid>

src/pages/Proof/Search_GLD/DataGrid.js

@@ -9,7 +9,7 @@ import { FiDataGrid } from "components/FiDataGrid";
 import { clickableLink } from 'utils/CommonFunction';
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPublicNoticeTable({searchCriteria}) {
+export default function SearchPublicNoticeTable({searchCriteria, applyGridOnReady}) {
 
     const navigate = useNavigate()
 
@@ -121,6 +121,7 @@ export default function SearchPublicNoticeTable({searchCriteria}) {
                 customPageSize={10}
                 getRowHeight={() => 'auto'}
                 onRowDoubleClick={handleRowDoubleClick}
+                applyGridOnReady={applyGridOnReady}
                 // doLoad={{
                 //     url: LIST_PROOF,
                 //     params: _searchCriteria,

src/pages/Proof/Search_GLD/SearchForm.js

@@ -21,7 +21,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData
+const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData, onGridReady
 }) => {
 
     const [type, setType] = React.useState([]);
@@ -395,6 +395,7 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                             <Button
                                 variant="contained"
                                 type="submit"
+                                disabled={onGridReady}
                                >
                                 Submit
                             </Button>

src/pages/Proof/Search_GLD/index.js

@@ -37,6 +37,7 @@ const UserSearchPage_Individual = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14)),
     });
     const [onReady, setOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         getOrgCombo();
@@ -69,9 +70,14 @@ const UserSearchPage_Individual = () => {
     }
 
     function applySearch(input) {
+        setGridOnReady(true)
         setSearchCriteria(input);
     }
 
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
+
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
@@ -95,6 +101,7 @@ const UserSearchPage_Individual = () => {
                         orgComboData={orgCombo}
                         issueComboData={issueCombo}
                         searchCriteria={searchCriteria}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -107,6 +114,7 @@ const UserSearchPage_Individual = () => {
                     >
                         <EventTable
                             searchCriteria={searchCriteria}
+                            applyGridOnReady={applyGridOnReady}
                         />
                     </MainCard>
                 </Grid>

src/pages/Proof/Search_Public/DataGrid.js

@@ -17,7 +17,7 @@ import { useIntl } from "react-intl";
 import { clickableLink } from 'utils/CommonFunction';
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPublicNoticeTable({ searchCriteria }) {
+export default function SearchPublicNoticeTable({ searchCriteria, applyGridOnReady }) {
 
     const navigate = useNavigate()
     const theme = useTheme();
@@ -191,6 +191,7 @@ export default function SearchPublicNoticeTable({ searchCriteria }) {
                 customPageSize={10}
                 getRowHeight={() => "auto"}
                 onRowDoubleClick={handleRowDoubleClick}
+                applyGridOnReady={applyGridOnReady}
                 doLoad={React.useMemo(() => ({
                     url: LIST_PROOF,
                     params: _searchCriteria,

src/pages/Proof/Search_Public/SearchForm.js

@@ -22,7 +22,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData
+const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, onGridReady
 }) => {
     const intl = useIntl();
     const { locale } = intl;
@@ -360,6 +360,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData
                             variant="contained"
                             type="submit"
                             aria-label={intl.formatMessage({id: 'submit'})}
+                            disabled={onGridReady}
                         >
                             <FormattedMessage id="submit"/>
                         </Button>

src/pages/Proof/Search_Public/index.js

@@ -37,6 +37,7 @@ const UserSearchPage_Individual = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)),
     });
     const [onReady, setOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         getIssueCombo();
@@ -59,9 +60,14 @@ const UserSearchPage_Individual = () => {
     
 
     function applySearch(input) {
+        setGridOnReady(true)
         setSearchCriteria(input);
     }
 
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
+
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
@@ -83,9 +89,10 @@ const UserSearchPage_Individual = () => {
                 {/*row 1*/}
                 <Grid item xs={12} md={12} lg={12}>
                     <SearchForm 
-                    applySearch={applySearch}
-                    issueComboData={issueCombo}
-                    searchCriteria={searchCriteria}
+                        applySearch={applySearch}
+                        issueComboData={issueCombo}
+                        searchCriteria={searchCriteria}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -96,7 +103,8 @@ const UserSearchPage_Individual = () => {
                             sx={{width: "-webkit-fill-available"}}
                     >
                         <EventTable
-                        searchCriteria={searchCriteria}
+                            searchCriteria={searchCriteria}
+                            applyGridOnReady={applyGridOnReady}
                         />
                     </MainCard>
                 </Grid>

src/pages/PublicNotice/Search_GLD/DataGrid.js

@@ -20,7 +20,7 @@ import { FormattedMessage, useIntl } from "react-intl";
 import * as utils from "auth/utils"
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPublicNoticeTable({ searchCriteria }) {
+export default function SearchPublicNoticeTable({ searchCriteria, applyGridOnReady }) {
 
     const [rows, setRows] = React.useState([]);
     const navigate = useNavigate()
@@ -184,11 +184,14 @@ export default function SearchPublicNoticeTable({ searchCriteria }) {
                 customPageSize={10}
                 getRowHeight={() => 'auto'}
                 onRowDoubleClick={handleRowDoubleClick}
+                applyGridOnReady = {applyGridOnReady}
                 doLoad={React.useMemo(() => ({
                     url: GET_PUBLIC_NOTICE_LIST,
                     params: _searchCriteria,
+                    applyGridOnReady: applyGridOnReady,
                     callback: function (responseData) {
                         setRows(responseData?.records);
+                        // applyGridOnReady(false)
                     }
                 }), [_searchCriteria, reload])}
             />

src/pages/PublicNotice/Search_GLD/SearchForm.js

@@ -21,7 +21,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData
+const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData, onGridReady
 }) => {
 
     const [type, setType] = React.useState([]);
@@ -375,6 +375,7 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 <Button
                                     variant="contained"
                                     type="submit"
+                                    disabled={onGridReady}
                                 >
                                     Submit
                                 </Button>

src/pages/PublicNotice/Search_GLD/index.js

@@ -36,7 +36,7 @@ const UserSearchPage_Individual = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14))
     });
     const [onReady, setOnReady] = React.useState(false);
-    // const [onGridReady, setGridOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         getOrgCombo();
@@ -68,14 +68,13 @@ const UserSearchPage_Individual = () => {
     }
 
     function applySearch(input) {
-        // setGridOnReady(false);
+        setGridOnReady(true);
         setSearchCriteria(input);
     }
 
-    // function setSearchReady(input) {
-    //     setGridOnReady(input);
-    // }
-
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
 
     return (
         !onReady ?
@@ -100,7 +99,7 @@ const UserSearchPage_Individual = () => {
                         orgComboData={orgCombo}
                         issueComboData={issueCombo}
                         searchCriteria={searchCriteria}
-                        // setSearchReady={setSearchReady}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -112,7 +111,7 @@ const UserSearchPage_Individual = () => {
                     >
                         <EventTable
                             searchCriteria={searchCriteria}
-                            // onGridReady={onGridReady}
+                            applyGridOnReady={applyGridOnReady}
                     />
                     </MainCard>
                 </Grid>

src/pages/PublicNotice/Search_Mark_As_Paid_GLD/DataGrid.js

@@ -23,7 +23,7 @@ import { FormattedMessage, useIntl } from "react-intl";
 import * as utils from "auth/utils"
 // ==============================|| EVENT TABLE ||============================== //
 
-export default function SearchPublicNoticeTable({ searchCriteria }) {
+export default function SearchPublicNoticeTable({ searchCriteria, applyGridOnReady }) {
 
     const [rows, setRows] = React.useState([]);
     const navigate = useNavigate()
@@ -180,6 +180,7 @@ export default function SearchPublicNoticeTable({ searchCriteria }) {
                 customPageSize={10}
                 getRowHeight={() => 'auto'}
                 onRowDoubleClick={handleRowDoubleClick}
+                applyGridOnReady={applyGridOnReady}
                 doLoad={React.useMemo(() => ({
                     url: GET_PUBLIC_NOTICE_OFFLINE_PAYMENT_LIST,
                     params: _searchCriteria,

src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js

@@ -21,7 +21,7 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo";
 import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
 import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData
+const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData, onGridReady
 }) => {
 
     const [type, setType] = React.useState([]);
@@ -374,6 +374,7 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
                                 <Button
                                     variant="contained"
                                     type="submit"
+                                    disabled={onGridReady}
                                 >
                                     Submit
                                 </Button>

src/pages/PublicNotice/Search_Mark_As_Paid_GLD/index.js

@@ -36,6 +36,7 @@ const UserSearchPage_Individual = () => {
         dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14))
     });
     const [onReady, setOnReady] = React.useState(false);
+    const [onGridReady, setGridOnReady] = React.useState(false);
 
     React.useEffect(() => {
         getOrgCombo();
@@ -67,9 +68,14 @@ const UserSearchPage_Individual = () => {
     }
 
     function applySearch(input) {
+        setGridOnReady(true)
         setSearchCriteria(input);
     }
 
+    function applyGridOnReady(input) {
+        setGridOnReady(input);
+    }
+
     return (
         !onReady ?
             <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
@@ -93,6 +99,7 @@ const UserSearchPage_Individual = () => {
                         orgComboData={orgCombo}
                         issueComboData={issueCombo}
                         searchCriteria={searchCriteria}
+                        onGridReady={onGridReady}
                     />
                 </Grid>
                 {/*row 2*/}
@@ -104,6 +111,7 @@ const UserSearchPage_Individual = () => {
                     >
                         <EventTable
                             searchCriteria={searchCriteria}
+                            applyGridOnReady={applyGridOnReady}
                         />
                     </MainCard>
                 </Grid>