From b8243c4615080b7a54102dceede103dc5006008d Mon Sep 17 00:00:00 2001 From: anna Date: Wed, 24 Apr 2024 14:56:14 +0800 Subject: [PATCH] fix bug --- .../Details_GLD/tabTableDetail/PaymentTab.js | 10 ++-- .../Details_GLD/tabTableDetail/ProofTab.js | 4 +- .../tabTableDetail/StatusHistoryTab.js | 12 ++--- .../Details_GLD/tabTableDetail/TabTable.js | 14 ++---- .../Details_Public/ApplicationDetailCard.js | 23 +++------- .../PublicNotice/Details_Public/index.js | 46 +++++++++++-------- .../tabTableDetail/PaymentTab.js | 24 ++++++++-- .../Details_Public/tabTableDetail/ProofTab.js | 15 ++++-- .../tabTableDetail/StatusHistoryTab.js | 39 ++++++++++++---- .../Details_Public/tabTableDetail/TabTable.js | 44 +++++++----------- 10 files changed, 124 insertions(+), 107 deletions(-) diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js index 4903cd6..124bc79 100644 --- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js +++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js @@ -1,5 +1,5 @@ // material-ui -import * as React from 'react'; +import {useState, useEffect, useMemo} from 'react'; import { useMediaQuery } from '@mui/material'; @@ -17,11 +17,11 @@ export default function SubmittedTab({ appId, setCount }) { const theme = useTheme(); const isMdOrLg = useMediaQuery(theme.breakpoints.up('md')); - const [_appId, set_appId] = React.useState({}); - React.useEffect(() => { + const [_appId, set_appId] = useState({}); + useEffect(() => { set_appId(appId); }, [appId]); - React.useEffect(() => { + useEffect(() => { set_appId(appId); }, []); @@ -73,7 +73,7 @@ export default function SubmittedTab({ appId, setCount }) { ({ + doLoad={useMemo(() => ({ url: GET_PUBLIC_NOTICE_APPLY_DETAIL_PAYMENT+"/"+_appId, params: {}, callback: function (responseData) { diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js index 251c873..296100b 100644 --- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js +++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js @@ -1,5 +1,5 @@ // material-ui -import * as React from 'react'; +import {useMemo} from 'react'; import { useMediaQuery, } from '@mui/material'; @@ -104,7 +104,7 @@ export default function ProofTab({appId, setCount}) { ({ + doLoad={useMemo(() => ({ url: GET_PUBLIC_NOTICE_APPLY_DETAIL_PROOF+"/"+appId, params: {}, callback: function (responseData) { diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js index 70dc1c8..44402f9 100644 --- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js +++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js @@ -1,10 +1,6 @@ // material-ui -import * as React from 'react'; +import {useState,useEffect } from 'react'; import {FiDataGrid} from "components/FiDataGrid"; -// import dayjs from "dayjs"; -// import { -// Button -// } from '@mui/material'; import * as DateUtils from "utils/DateUtils" import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils"; import {useTheme} from "@emotion/react"; @@ -18,11 +14,11 @@ export default function StatusHistoryTab({appId, setCount}) { const theme = useTheme(); const isMdOrLg = useMediaQuery(theme.breakpoints.up('md')); - const [_appId, set_appId] = React.useState({}); - React.useEffect(() => { + const [_appId, set_appId] = useState({}); + useEffect(() => { set_appId(appId); }, [appId]); - React.useEffect(() => { + useEffect(() => { set_appId(appId); }, []); diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js index a48fe44..26a0361 100644 --- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js +++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js @@ -8,11 +8,9 @@ import { } from '@mui/material'; import { TabPanel, TabContext, TabList } from '@mui/lab'; -import * as React from "react"; - +import {useState, useEffect, lazy} from "react"; import Loadable from 'components/Loadable'; -import { lazy } from 'react'; const LoadingComponent = Loadable(lazy(() => import('../../../extra-pages/LoadingComponent'))); const ProofTab = Loadable(lazy(() => import('./ProofTab'))); const PaymentTab = Loadable(lazy(() => import('./PaymentTab'))); @@ -22,15 +20,11 @@ const StatusHistoryTab = Loadable(lazy(() => import('./StatusHistoryTab'))); // ==============================|| DASHBOARD - DEFAULT ||============================== // const PublicNotice = ({ appId, proofCount, paymentCount, statusHistoryCount, setProofCount, setPaymentCount, setStatusHistoryCount }) => { - // const [_proofCount, setProofCount] = React.useState(proofCount); - // const [_paymentCount, setPaymentCount] = React.useState(paymentCount); - // const [_statusHistoryCount, setStatusHistoryCount] = React.useState(statusHistoryCount); - - const [onReady, setOnReady] = React.useState(false); - const [selectedTab, setSelectedTab] = React.useState("1"); + const [onReady, setOnReady] = useState(false); + const [selectedTab, setSelectedTab] = useState("1"); - React.useEffect(() => { + useEffect(() => { setOnReady(true); }, [appId]); diff --git a/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js b/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js index c1624d3..702160b 100644 --- a/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js +++ b/src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js @@ -15,12 +15,12 @@ import { useForm } from "react-hook-form"; import { useNavigate } from "react-router-dom"; import { useEffect, - useState + useState, + lazy } from "react"; // import Checkbox from "@mui/material/Checkbox"; import Loadable from 'components/Loadable'; -import { lazy } from 'react'; const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent'))); // import {useParams} from "react-router-dom"; import * as HttpUtils from "utils/HttpUtils" @@ -39,24 +39,21 @@ import EditNoteIcon from '@mui/icons-material/EditNote'; import DownloadIcon from '@mui/icons-material/Download'; import { PNSPS_BUTTON_THEME } from "../../../themes/buttonConst"; import { ThemeProvider } from "@emotion/react"; -import * as React from "react"; import { FormattedMessage, useIntl } from "react-intl"; // ==============================|| DASHBOARD - DEFAULT ||============================== // const ApplicationDetailCard = ( { applicationDetailData, setStatus, - // updateUserObject, - // isNewRecord + fee } ) => { const [isPopUp, setIsPopUp] = useState(false); const [errorText, setErrorText] = useState(""); const [errorPopUp, setErrorPopUp] = useState(false); - const [paymentHoldedErrText, setPaymentHoldedErrText] = React.useState(""); - const [paymentHoldedErr, setPaymentHoldedErr] = React.useState(false); + const [paymentHoldedErrText, setPaymentHoldedErrText] = useState(""); + const [paymentHoldedErr, setPaymentHoldedErr] = useState(false); // const params = useParams(); const [currentApplicationDetailData, setCurrentApplicationDetailData] = useState({}); - const [fee, setFee] = useState(0); const [companyName, setCompanyName] = useState({}); const [fileDetail, setfileDetail] = useState({}); const [onReady, setOnReady] = useState(false); @@ -71,26 +68,20 @@ const ApplicationDetailCard = ( useEffect(() => { //if user data from parent are not null // console.log(applicationDetailData) - if (Object.keys(applicationDetailData).length > 0 && applicationDetailData.data !== null) { + if (Object.keys(applicationDetailData)?.length > 0 && applicationDetailData.data !== null) { setCurrentApplicationDetailData(applicationDetailData.data); setCompanyName(applicationDetailData.companyName); setfileDetail(applicationDetailData.fileDetail); setIssueNum(applicationDetailData.gazetteIssueDetail.volume + "/" + applicationDetailData.gazetteIssueDetail.issueYear + " No. " + applicationDetailData.gazetteIssueDetail.issueNo); setIssueDate(DateUtils.dateFormat(applicationDetailData.gazetteIssueDetail.issueDate, "D MMM YYYY (ddd)")); - - for (let i = 0; i < applicationDetailData.proofList.length; i++) { - if (applicationDetailData.proofList[i].action == true) { - setFee(applicationDetailData.proofList[i].fee); - } - } } }, [applicationDetailData]); useEffect(() => { //if state data are ready and assign to different field // console.log(currentApplicationDetailData) - if (Object.keys(currentApplicationDetailData).length > 0) { + if (Object.keys(currentApplicationDetailData)?.length > 0) { setOnReady(true); } }, [currentApplicationDetailData]); diff --git a/src/pages/PublicNotice/Details_Public/index.js b/src/pages/PublicNotice/Details_Public/index.js index c3f655a..faa8f04 100644 --- a/src/pages/PublicNotice/Details_Public/index.js +++ b/src/pages/PublicNotice/Details_Public/index.js @@ -1,6 +1,7 @@ import React, { useEffect, - useState + useState, + lazy } from "react"; // material-ui @@ -12,7 +13,6 @@ import { Button } from '@mui/material'; import Loadable from 'components/Loadable'; -import { lazy } from 'react'; import { // useNavigate, useParams @@ -31,7 +31,7 @@ import { useNavigate } from "react-router-dom"; import ForwardIcon from '@mui/icons-material/Forward'; import { notifyActionSuccess } from "utils/CommonFunction"; -import {FormattedMessage, useIntl} from "react-intl"; +import { FormattedMessage, useIntl } from "react-intl"; // ==============================|| Body - DEFAULT ||============================== // @@ -41,8 +41,6 @@ const DashboardDefault = () => { const [appNo, setAapNo] = useState(""); const [gazetteIssue, setGazetteIssue] = useState(""); const [issueNum, setIssueNum] = useState(""); - const [proofList, setProofList] = useState([]); - const [paymentList, setPaymentList] = useState([]); const navigate = useNavigate() const intl = useIntl(); //statusWindow @@ -50,6 +48,10 @@ const DashboardDefault = () => { const [getStatus, setStatus] = useState(""); const [statusWindowAccepted, setStatusWindowAccepted] = useState(false); + const [proofCount, setProofCount] = useState(0); + const [paymentCount, setPaymentCount] = useState(0); + const [fee, setFee] = useState(0); + const title = appNo + ", " + gazetteIssue + ", " + issueNum const _sx = { @@ -92,8 +94,10 @@ const DashboardDefault = () => { setAapNo(response.data.data.appNo); setGazetteIssue(gazetteIssueDetail.issueYear + " Vol " + gazetteIssueDetail.volume); setIssueNum(" No. " + gazetteIssueDetail.issueNo); - setProofList(response.data.proofList); - setPaymentList(response.data.paymentList); + + setProofCount(response.data.proofCount); + setPaymentCount(response.data.paymentCount); + setFee(response.data.fee); } }) .catch(error => { @@ -154,21 +158,21 @@ const DashboardDefault = () => {
- - + +
- + @@ -176,18 +180,22 @@ const DashboardDefault = () => { - + - - + + diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js index 3a55cb5..bb02e72 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js @@ -1,5 +1,5 @@ // material-ui -import * as React from 'react'; +import {useState, useEffect, useMemo} from 'react'; import { useMediaQuery } from '@mui/material'; @@ -10,10 +10,10 @@ import * as PaymentStatus from "utils/statusUtils/PaymentStatus" import {useTheme} from "@emotion/react"; import {useIntl} from "react-intl"; import { clickableLink } from 'utils/CommonFunction'; -// import * as StatusUtils from "./PublicNoteStatusUtils"; +import {GET_PUBLIC_NOTICE_APPLY_DETAIL_PAYMENT } from "utils/ApiPathConst" // ==============================|| EVENT TABLE ||============================== // -export default function SubmittedTab({ rows }) { +export default function SubmittedTab({ appId, setCount }) { const theme = useTheme(); const isMdOrLg = useMediaQuery(theme.breakpoints.up('md')); @@ -21,6 +21,14 @@ export default function SubmittedTab({ rows }) { const { locale } = intl; + const [_appId, set_appId] = useState({}); + useEffect(() => { + set_appId(appId); + }, [appId]); + useEffect(() => { + set_appId(appId); + }, []); + const columns = [ { field: 'actions', @@ -67,9 +75,15 @@ export default function SubmittedTab({ rows }) { <>
({ + url: GET_PUBLIC_NOTICE_APPLY_DETAIL_PAYMENT+"/"+_appId, + params: {}, + callback: function (responseData) { + setCount(responseData?.count); + } + }), [appId])} />
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js index e26625d..3990fb0 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js @@ -1,5 +1,5 @@ // material-ui -import * as React from 'react'; +import {useMemo} from 'react'; import { useMediaQuery, } from '@mui/material'; @@ -10,9 +10,10 @@ import * as FormatUtils from "utils/FormatUtils" import {useTheme} from "@emotion/react"; import {useIntl} from "react-intl"; import { clickableLink } from 'utils/CommonFunction'; +import {GET_PUBLIC_NOTICE_APPLY_DETAIL_PROOF } from "utils/ApiPathConst" // ==============================|| EVENT TABLE ||============================== // -export default function ProofTab({rows}) { +export default function ProofTab({appId, setCount}) { const intl = useIntl(); const theme = useTheme(); const isMdOrLg = useMediaQuery(theme.breakpoints.up('md')); @@ -74,9 +75,15 @@ export default function ProofTab({rows}) { return (
({ + url: GET_PUBLIC_NOTICE_APPLY_DETAIL_PROOF+"/"+appId, + params: {}, + callback: function (responseData) { + setCount(responseData?.count); + } + }), [appId])} />
); diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js index 8a06c52..7a5850b 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js @@ -1,22 +1,33 @@ // material-ui import * as React from 'react'; import {FiDataGrid} from "components/FiDataGrid"; -// import dayjs from "dayjs"; -// import { -// Button -// } from '@mui/material'; import * as DateUtils from "utils/DateUtils" import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils"; +import {GET_PUBLIC_NOTICE_APPLY_DETAIL_STATUS_HISTORY } from "utils/ApiPathConst" + // ==============================|| EVENT TABLE ||============================== // -export default function StatusHistoryTab({rows}) { +export default function StatusHistoryTab({appId, setCount}) { + + const theme = useTheme(); + const isMdOrLg = useMediaQuery(theme.breakpoints.up('md')); + + const [_appId, set_appId] = useState({}); + useEffect(() => { + set_appId(appId); + }, [appId]); + useEffect(() => { + set_appId(appId); + }, []); + const columns = [ { id: 'created', field: 'created', headerName: 'Date', - flex: 1, + width: isMdOrLg ? 'auto' : 160, + flex: isMdOrLg ? 1 : undefined, valueGetter: (params) => { return DateUtils.datetimeStr(params?.value); } @@ -26,13 +37,15 @@ export default function StatusHistoryTab({rows}) { id: 'createdBy', field: 'createdBy', headerName: 'Changed By', - flex: 1, + width: isMdOrLg ? 'auto' : 160, + flex: isMdOrLg ? 1 : undefined, }, { id: 'status', field: 'status', headerName: 'Status', - flex: 1, + width: isMdOrLg ? 'auto' : 160, + flex: isMdOrLg ? 1 : undefined, renderCell: (params) => { return [StatusUtils.getStatusEng(params)] }, @@ -42,9 +55,15 @@ export default function StatusHistoryTab({rows}) { return (
); diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js index 5ad915f..6fee327 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js @@ -8,12 +8,11 @@ import { } from '@mui/material'; import { TabPanel, TabContext, TabList } from '@mui/lab'; -import * as React from "react"; +import { useState, useEffect, lazy } from "react"; import Loadable from 'components/Loadable'; -import { lazy } from 'react'; -import {useIntl} from "react-intl"; +import { useIntl } from "react-intl"; const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent'))); const ProofTab = Loadable(lazy(() => import('./ProofTab'))); const PaymentTab = Loadable(lazy(() => import('./PaymentTab'))); @@ -21,26 +20,15 @@ const PaymentTab = Loadable(lazy(() => import('./PaymentTab'))); // ==============================|| DASHBOARD - DEFAULT ||============================== // -const PublicNotice = ({ proofList, paymentList }) => { - const [_proofList, setProofList] = React.useState([]); - const [_paymentList, setPaymentList] = React.useState([]); - const [onReady, setOnReady] = React.useState(false); - const [selectedTab, setSelectedTab] = React.useState("1"); - const intl = useIntl(); - - const reloadPage = () => { - window.location.reload(false); - } +const PublicNotice = ({ appId, proofCount, paymentCount, setProofCount, setPaymentCount }) => { + const [onReady, setOnReady] = useState(false); + const [selectedTab, setSelectedTab] = useState("1"); + const intl = useIntl(); - React.useEffect(() => { - setProofList(proofList); + useEffect(() => { setOnReady(true); - }, [proofList]); - - React.useEffect(() => { - setPaymentList(paymentList); - }, [paymentList]); + }, [appId]); const handleChange = (event, newValue) => { setSelectedTab(newValue); @@ -57,26 +45,26 @@ const PublicNotice = ({ proofList, paymentList }) => {