update grid layout

src/components/FiDataGrid.js

@@ -90,37 +90,35 @@ export function FiDataGrid({ rows, columns, sx, autoHeight,
     }
 
     return (
-        <div style={{ height: 400, width: "100%" }}>
-            <DataGrid
-                {...props}
-                rows={slicedRows}
-                columns={_columns}
-                disableColumnMenu
-                rowModesModel={_rowModesModel}
-                pageSizeOptions={_pageSizeOptions}
-                editMode={_editMode}
-                autoHeight={_autoHeight}
-                hideFooterSelectedRowCount={myHideFooterSelectedRowCount}
-                filterModel={{ items: _filterItems }}
-                sx={_sx}
-                components={{
-                    noRowsOverlay: CustomNoRowsOverlay,
-                    Pagination: () => (
-                        <TablePagination
-                            count={_rows.length}
-                            page={page}
-                            rowsPerPage={pageSize}
-                            rowsPerPageOptions={[10]}
-                            labelDisplayedRows={({ from, to, count }) =>
-                                `${from}-${to} ${intl.formatMessage({ id: "of" })} ${count}`
-                            }
-                            labelRowsPerPage={intl.formatMessage({ id: "rowsPerPage" }) + ":"}
-                            onPageChange={handleChangePage}
-                            onRowsPerPageChange={handleChangePageSize}
-                        />
-                    ),
-                }}
-            />
-        </div>
+        <DataGrid
+            {...props}
+            rows={slicedRows}
+            columns={_columns}
+            disableColumnMenu
+            rowModesModel={_rowModesModel}
+            pageSizeOptions={_pageSizeOptions}
+            editMode={_editMode}
+            autoHeight={_autoHeight}
+            hideFooterSelectedRowCount={myHideFooterSelectedRowCount}
+            filterModel={{ items: _filterItems }}
+            sx={_sx}
+            components={{
+                noRowsOverlay: CustomNoRowsOverlay,
+                Pagination: () => (
+                    <TablePagination
+                        count={_rows.length}
+                        page={page}
+                        rowsPerPage={pageSize}
+                        rowsPerPageOptions={[5,10,15]}
+                        labelDisplayedRows={({ from, to, count }) =>
+                            `${from}-${to} ${intl.formatMessage({ id: "of" })} ${count}`
+                        }
+                        labelRowsPerPage={intl.formatMessage({ id: "rowsPerPage" }) + ":"}
+                        onPageChange={handleChangePage}
+                        onRowsPerPageChange={handleChangePageSize}
+                    />
+                ),
+            }}
+        />
     );
 }

src/pages/DemandNote/Create/DataGrid.js

@@ -103,7 +103,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
     ];
 
     return (
-        <div style={{ minHeight:'80vh', width: '100%' }}>
+        <div style={{ width: '100%' }}>
 
             <FiDataGrid
                 sx={_sx}

src/pages/DemandNote/Create/index.js

@@ -80,7 +80,7 @@ const Index = () => {
         !onReady ?
             <LoadingComponent/>
             :
-            <Grid container sx={{minHeight: '120vh', backgroundColor: 'backgroundColor.default'}} direction="column">
+            <Grid container sx={{backgroundColor: 'backgroundColor.default'}} direction="column">
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">

src/pages/DemandNote/Search/DataGrid.js

@@ -272,7 +272,7 @@ export default function SearchDemandNote({ recordList, reloadFun, applySearch })
     ];
 
     return (
-        <div style={{ height: '80vh', width: '100%' }}>
+        <div style={{ width: '100%' }}>
             <Grid container maxWidth justifyContent="flex-start">
                 <ThemeProvider theme={PNSPS_BUTTON_THEME}>
                 <Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>

src/pages/DemandNote/Search/index.js

@@ -94,7 +94,7 @@ const UserSearchPage_Individual = () => {
         !onReady ?
             <LoadingComponent />
             :
-            <Grid container sx={{ minHeight: '120vh', backgroundColor: 'backgroundColor.default' }} direction="column">
+            <Grid container sx={{ backgroundColor: 'backgroundColor.default' }} direction="column">
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">

src/pages/GFMIS/DataGrid.js

@@ -69,7 +69,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
     
 
     return (
-        <div style={{ minHeight:'80vh', width: '100%' }}>
+        <div style={{ width: '100%' }}>
 
             <FiDataGrid
                 sx={_sx}
@@ -78,7 +78,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
                 columns={columns}
                 initialState={{
                     pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
+                        paginationModel: { page: 0, pageSize: 10 },
                     },
                 }}
                 onRowDoubleClick={handleEditClick}

src/pages/GFMIS/index.js

@@ -100,7 +100,7 @@ const Index = () => {
         !onReady ?
             <LoadingComponent/>
             :
-            <Grid container sx={{minHeight: '120vh', backgroundColor: 'backgroundColor.default'}} direction="column">
+            <Grid container sx={{ backgroundColor: 'backgroundColor.default'}} direction="column">
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">

src/pages/Payment/Search_GLD/DataGrid.js

@@ -87,8 +87,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
     ];
 
     return (
-        <div style={{ minHeight:'80vh', width: '100%' }}>
-
+        <div style={{ width: '100%' }}>
             <FiDataGrid
                 sx={_sx}
                 rowHeight={80}

src/pages/Payment/Search_GLD/index.js

@@ -64,7 +64,7 @@ const Index = () => {
         !onReady ?
             <LoadingComponent/>
             :
-            <Grid container sx={{minHeight: '85vh', backgroundColor: 'backgroundColor.default'}} direction="column">
+            <Grid container sx={{backgroundColor: 'backgroundColor.default'}} direction="column">
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
@@ -82,7 +82,7 @@ const Index = () => {
                     />
                 </Grid>
                 {/*row 2*/}
-                <Grid style={{ height: '120vh'}} item xs={12} md={12} lg={12}>
+                <Grid item xs={12} md={12} lg={12}>
                     <MainCard elevation={0}
                             border={false}
                             content={false}

src/pages/Proof/Search_GLD/DataGrid.js

@@ -2,7 +2,6 @@
 import * as React from 'react';
 import {
     Button,
-    Box
 } from '@mui/material';
 import * as DateUtils from "utils/DateUtils";
 import * as FormatUtils from "utils/FormatUtils"
@@ -130,21 +129,19 @@ export default function SearchPublicNoticeTable({ recordList }) {
     }
 
     return (
-        <div style={{ height: '80vh', width: '100%' }}>
-            <Box sx={{ backgroundColor: "#fff", ml: 2 }} width="98%">
-                <FiDataGrid
-                    rowHeight={80}
-                    rows={rows}
-                    columns={columns}
-                    initialState={{
-                        pagination: {
-                            paginationModel: { page: 0, pageSize: 5 },
-                        },
-                    }}
-                    onRowDoubleClick={handleRowDoubleClick}
-                    getRowHeight={() => 'auto'}
-                />
-            </Box>
+        <div style={{ width: '100%' }}>
+            <FiDataGrid
+                rows={rows}
+                columns={columns}
+                pageSizeOptions={[5]}
+                initialState={{
+                    pagination: {
+                        paginationModel: { page: 0, pageSize: 10 },
+                    },
+                }}
+                onRowDoubleClick={handleRowDoubleClick}
+                getRowHeight={() => 'auto'}
+            />
         </div>
     );
 }

src/pages/Proof/Search_GLD/index.js

@@ -92,7 +92,7 @@ const UserSearchPage_Individual = () => {
         !onReady ?
             <LoadingComponent />
             :
-            <Grid container sx={{ minHeight: '120vh', backgroundColor: 'backgroundColor.default' }} direction="column"
+            <Grid container sx={{ backgroundColor: 'backgroundColor.default' }} direction="column"
             >
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>

src/pages/PublicNotice/Search_GLD/DataGrid.js

@@ -1,8 +1,7 @@
 // material-ui
 import * as React from 'react';
 import {
-    Button,
-    Box
+    Button
 } from '@mui/material';
 import * as DateUtils from "utils/DateUtils";
 import * as FormatUtils from "utils/FormatUtils";
@@ -111,20 +110,18 @@ export default function SearchPublicNoticeTable({ recordList }) {
     }
 
     return (
-        <div style={{ height: '80vh', width: '100%' }}>
-            <Box sx={{ backgroundColor: "#fff", ml: 2 }} width="98%">
-                <FiDataGrid
-                    rows={rows}
-                    columns={columns}
-                    initialState={{
-                        pagination: {
-                            paginationModel: { page: 0, pageSize: 10 },
-                        },
-                    }}
-                    getRowHeight={() => 'auto'}
-                    onRowDoubleClick={handleRowDoubleClick}
-                />
-            </Box>
+        <div style={{width: '100%' }}>
+            <FiDataGrid
+                rows={rows}
+                columns={columns}
+                initialState={{
+                    pagination: {
+                        paginationModel: { page: 0, pageSize: 10 },
+                    },
+                }}
+                getRowHeight={() => 'auto'}
+                onRowDoubleClick={handleRowDoubleClick}
+            />
         </div>
     );
 }

src/pages/PublicNotice/Search_GLD/index.js

@@ -92,7 +92,7 @@ const UserSearchPage_Individual = () => {
         !onReady ?
             <LoadingComponent />
             :
-            <Grid container sx={{ minHeight: '120vh', backgroundColor: 'backgroundColor.default' }} direction="column">
+            <Grid container sx={{ backgroundColor: 'backgroundColor.default' }}>
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>
                         <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">