| @@ -5,17 +5,19 @@ import { FiDataGrid } from "components/FiDataGrid"; | |||
| import EditIcon from '@mui/icons-material/Edit'; | |||
| import { useEffect } from "react"; | |||
| import { useNavigate } from "react-router-dom"; | |||
| import {GET_EMAIL_LIST} from "utils/ApiPathConst"; | |||
| // ==============================|| EVENT TABLE ||============================== // | |||
| export default function EmailTemplateTable({ recordList }) { | |||
| const [rows, setRows] = React.useState(recordList); | |||
| export default function EmailTemplateTable({ responseData }) { | |||
| const [_responseData, set_responseData] = React.useState(responseData); | |||
| const navigate = useNavigate() | |||
| useEffect(() => { | |||
| setRows(recordList); | |||
| }, [recordList]); | |||
| set_responseData(responseData); | |||
| }, [responseData]); | |||
| const handleEditClick = (id) => () => { | |||
| navigate('/setting/emailTemplate/' + id); | |||
| @@ -91,11 +93,14 @@ export default function EmailTemplateTable({ recordList }) { | |||
| return ( | |||
| <div style={{ height: "fit-content", width: '100%' }}> | |||
| <FiDataGrid | |||
| rows={rows} | |||
| columns={columns} | |||
| customPageSize={5} | |||
| customPageSize={10} | |||
| onRowDoubleClick={handleRowDoubleClick} | |||
| getRowHeight={() => 'auto'} | |||
| doLoad={{ | |||
| url:GET_EMAIL_LIST, | |||
| params: _responseData | |||
| }} | |||
| /> | |||
| </div> | |||
| ); | |||
| @@ -5,9 +5,7 @@ import { | |||
| Stack, | |||
| Button, | |||
| } from '@mui/material'; | |||
| import * as UrlUtils from "utils/ApiPathConst"; | |||
| import * as React from "react"; | |||
| import * as HttpUtils from "utils/HttpUtils"; | |||
| import Loadable from 'components/Loadable'; | |||
| const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent'))); | |||
| @@ -25,33 +23,25 @@ const BackgroundHead = { | |||
| backgroundPosition: 'right' | |||
| } | |||
| import { useNavigate } from "react-router"; | |||
| import {PNSPS_LONG_BUTTON_THEME} from "../../../themes/buttonConst"; | |||
| import {ThemeProvider} from "@emotion/react"; | |||
| import { PNSPS_LONG_BUTTON_THEME } from "../../../themes/buttonConst"; | |||
| import { ThemeProvider } from "@emotion/react"; | |||
| // ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
| const Index = () => { | |||
| const [record, setRecord] = React.useState([]); | |||
| const [responseData, setResponseData] = React.useState({}); | |||
| const [onReady, setOnReady] = React.useState(false); | |||
| const navigate = useNavigate() | |||
| React.useLayoutEffect(() => { | |||
| loadForm(); | |||
| setResponseData({}); | |||
| }, []); | |||
| React.useLayoutEffect(() => { | |||
| setOnReady(true); | |||
| }, [record]); | |||
| }, [responseData]); | |||
| const loadForm = () => { | |||
| HttpUtils.get({ | |||
| url: UrlUtils.GET_EMAIL_LIST, | |||
| onSuccess: (responseData) => { | |||
| setRecord(responseData); | |||
| } | |||
| }); | |||
| } | |||
| return ( | |||
| !onReady ? | |||
| @@ -62,7 +52,7 @@ const Index = () => { | |||
| </Grid> | |||
| : | |||
| ( | |||
| <Grid container sx={{ minHeight: '87vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" > | |||
| <Grid container sx={{ minHeight: '87vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" > | |||
| <Grid item xs={12} width="100%"> | |||
| <div style={BackgroundHead} width="100%"> | |||
| <Stack direction="row" height='70px'> | |||
| @@ -77,24 +67,24 @@ const Index = () => { | |||
| content={false} | |||
| > | |||
| <EmailTemplateTable | |||
| recordList={record} | |||
| responseData={responseData} | |||
| /> | |||
| </MainCard> | |||
| </Grid> | |||
| <Grid container direction="row" | |||
| justifyContent="space-between" | |||
| alignItems="center"> | |||
| <Grid item xs={3} md={3} sx={{ mb:3, ml: 3, mr: 1 }}> | |||
| <Grid item xs={3} md={3} sx={{ mb: 3, ml: 3, mr: 1 }}> | |||
| <ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}> | |||
| <Button | |||
| variant="contained" | |||
| onClick={()=>{navigate('/setting/emailTemplate/-1')}} | |||
| startIcon={<AddCircleOutlineIcon/>} | |||
| > | |||
| <Button | |||
| variant="contained" | |||
| onClick={() => { navigate('/setting/emailTemplate/-1') }} | |||
| startIcon={<AddCircleOutlineIcon />} | |||
| > | |||
| New Email Template | |||
| New Email Template | |||
| </Button> | |||
| </Button> | |||
| </ThemeProvider> | |||
| </Grid> | |||
| </Grid> | |||
| @@ -1,23 +1,19 @@ | |||
| // material-ui | |||
| import * as React from 'react'; | |||
| // import { GridActionsCellItem, } from "@mui/x-data-grid"; | |||
| import { FiDataGrid } from "components/FiDataGrid"; | |||
| // import EditIcon from '@mui/icons-material/Edit'; | |||
| import { useEffect } from "react"; | |||
| import { dateStr } from "utils/DateUtils"; | |||
| // import { useNavigate } from "react-router-dom"; | |||
| import {GET_ISSUE} from "utils/ApiPathConst"; | |||
| // ==============================|| EVENT TABLE ||============================== // | |||
| export default function GazetteIssueTable({ recordList }) { | |||
| const [rows, setRows] = React.useState(recordList); | |||
| export default function GazetteIssueTable({ searchCriteria }) { | |||
| const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); | |||
| // const navigate = useNavigate() | |||
| React.useEffect(() => { | |||
| set_searchCriteria(searchCriteria); | |||
| }, [searchCriteria]); | |||
| useEffect(() => { | |||
| // console.log(recordList) | |||
| setRows(recordList); | |||
| }, [recordList]); | |||
| const columns = [ | |||
| { | |||
| @@ -88,11 +84,14 @@ export default function GazetteIssueTable({ recordList }) { | |||
| return ( | |||
| <div style={{ height: "fit-content", width: '100%' }}> | |||
| <FiDataGrid | |||
| rows={rows} | |||
| columns={columns} | |||
| customPageSize={20} | |||
| customPageSize={10} | |||
| // onRowDoubleClick={handleRowDoubleClick} | |||
| getRowHeight={() => 'auto'} | |||
| doLoad={{ | |||
| url: GET_ISSUE, | |||
| params: _searchCriteria, | |||
| }} | |||
| /> | |||
| </div> | |||
| ); | |||
| @@ -35,13 +35,11 @@ import { notifySaveSuccess } from 'utils/CommonFunction'; | |||
| // ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
| const Index = () => { | |||
| const [record, setRecord] = React.useState([]); | |||
| const [comboData, setComboData] = React.useState([]); | |||
| const [holidayComboData, setHolidayComboData] = React.useState([]); | |||
| const [onReady, setOnReady] = React.useState(false); | |||
| const [onSearchReady, setOnSearchReady] = React.useState(false); | |||
| const [onExportReady, setOnExportReady] = React.useState(false); | |||
| // const navigate = useNavigate() | |||
| const [searchCriteria, setSearchCriteria] = React.useState({ | |||
| year: dateStr_Year(new Date()), | |||
| // dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)), | |||
| @@ -61,24 +59,9 @@ const Index = () => { | |||
| React.useEffect(() => { | |||
| // console.log(searchCriteria) | |||
| setOnSearchReady(false) | |||
| loadForm(); | |||
| loadCombo(); | |||
| }, [searchCriteria]); | |||
| function loadForm() { | |||
| HttpUtils.get({ | |||
| url: UrlUtils.GET_ISSUE, | |||
| params: searchCriteria, | |||
| onSuccess: (responseData) => { | |||
| // console.log(comboData) | |||
| setRecord(responseData); | |||
| if (comboData.length == 0) { | |||
| loadCombo(); | |||
| }else{ | |||
| setOnSearchReady(true) | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| function loadCombo() { | |||
| HttpUtils.get({ | |||
| @@ -246,7 +229,7 @@ const Index = () => { | |||
| content={false} | |||
| > | |||
| <GazetteIssueTable | |||
| recordList={record} | |||
| searchCriteria={searchCriteria} | |||
| /> | |||
| </MainCard> | |||
| </Grid> | |||