From b1096df5860635059cd08007a7460a6613d33ecd Mon Sep 17 00:00:00 2001 From: anna Date: Tue, 21 Nov 2023 12:47:21 +0800 Subject: [PATCH] public app add list tab --- src/auth/utils.js | 2 +- .../Details_GLD/tabTableDetail/TabTable.js | 2 +- .../PublicNotice/Details_Public/index.js | 30 ++-- .../Details_Public/tabTableDetail/BaseGrid.js | 92 ------------ .../tabTableDetail/PaymentTab.js | 79 ++++++++++ .../tabTableDetail/PendingPaymentTab.js | 141 ------------------ .../Details_Public/tabTableDetail/ProofTab.js | 78 +++++----- .../tabTableDetail/StatusHistoryTab.js | 27 ++-- .../Details_Public/tabTableDetail/TabTable.js | 75 +++------- 9 files changed, 173 insertions(+), 353 deletions(-) delete mode 100644 src/pages/PublicNotice/Details_Public/tabTableDetail/BaseGrid.js create mode 100644 src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js delete mode 100644 src/pages/PublicNotice/Details_Public/tabTableDetail/PendingPaymentTab.js diff --git a/src/auth/utils.js b/src/auth/utils.js index 3825631..1699eb4 100644 --- a/src/auth/utils.js +++ b/src/auth/utils.js @@ -10,7 +10,7 @@ export const hostname = 'localhost'; const hostPort = '8090'; export const hostPath = `http://${hostname}:${hostPort}`; //export const apiPath = `http://192.168.0.112:8090/api`; -export const apiPath = `${hostPath}/api`; +export const apiPath = window.location.hostname.match("localhost")?`${hostPath}/api`:`/api`; //export const apiPath = `/api`; export const paymentPath = `https://pnspsdev.gld.gov.hk/payment`; export const iAmSmartPath = `https://`; diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js index 3dc6277..188871c 100644 --- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js +++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js @@ -76,7 +76,7 @@ const PublicNotice = ({ applicationDetailData, proofList, paymentList }) => { - + diff --git a/src/pages/PublicNotice/Details_Public/index.js b/src/pages/PublicNotice/Details_Public/index.js index 475c9ec..e747ddb 100644 --- a/src/pages/PublicNotice/Details_Public/index.js +++ b/src/pages/PublicNotice/Details_Public/index.js @@ -21,13 +21,14 @@ import axios from "axios"; import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' const ApplicationDetailCard = Loadable(lazy(() => import('./ApplicationDetailCard'))); -// const TabTableDetail = Loadable(lazy(() => import('./tabTableDetail/TabTable'))); +const StatusChangeDialog = Loadable(lazy(() => import('./StatusChangeDialog'))); +const TabTableDetail = Loadable(lazy(() => import('./tabTableDetail/TabTable'))); import { GET_PUBLIC_NOTICE_APPLY_DETAIL, SET_PUBLIC_NOTICE_STATUS_CANCELLED } from "utils/ApiPathConst"; import { useNavigate } from "react-router-dom"; -const StatusChangeDialog = Loadable(lazy(() => import('./StatusChangeDialog'))); + import ForwardIcon from '@mui/icons-material/Forward'; import { notifyActionSuccess } from "utils/CommonFunction"; @@ -39,7 +40,8 @@ const DashboardDefault = () => { const [appNo, setAapNo] = useState(""); const [gazetteIssue, setGazetteIssue] = useState(""); const [issueNum, setIssueNum] = useState(""); - // const [refApplicationDetailData, setRefApplicationDetailData] = React.useState({}); + const [proofList, setProofList] = useState([]); + const [paymentList, setPaymentList] = useState([]); const navigate = useNavigate() //statusWindow @@ -90,6 +92,8 @@ const DashboardDefault = () => { setAapNo(response.data.data.appNo); setGazetteIssue(gazetteIssueDetail.year + " Vol " + gazetteIssueDetail.volume); setIssueNum(" No. " + gazetteIssueDetail.issueNo); + setProofList(response.data.proofList); + setPaymentList(response.data.paymentList); } }) .catch(error => { @@ -164,25 +168,23 @@ const DashboardDefault = () => { {title} - {/* */} - {/* */} - {/* - - - - */} - {/* */} - {/* */} + + + + + + diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/BaseGrid.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/BaseGrid.js deleted file mode 100644 index 76042cd..0000000 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/BaseGrid.js +++ /dev/null @@ -1,92 +0,0 @@ -// material-ui -import * as React from 'react'; -import { - DataGrid, -} from "@mui/x-data-grid"; -import { - Button -} from '@mui/material'; -import * as DateUtils from "utils/DateUtils" -// ==============================|| EVENT TABLE ||============================== // - -export default function BaseGrid({rows}) { - const [rowModesModel] = React.useState({}); - - const columns = [ - { - id: 'appNo', - field: 'appNo', - headerName: 'Application No.', - flex: 1, - }, - { - id: 'created', - field: 'created', - headerName: 'Created', - flex: 1, - valueGetter:(params)=>{ - return DateUtils.datetimeStr(params?.value); - } - }, - { - id: 'contactPerson', - field: 'contactPerson', - headerName: 'Contact Person', - flex: 2, - renderCell: (params) => { - let phone = JSON.parse(params.row.contactTelNo); - let faxNo = JSON.parse(params.row.contactFaxNo); - - let contact = ""; - if (phone) { - contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber - } - - if (faxNo) { - if (contact != "") - contact = contact + ", " - contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber - } - - return (<> - {params?.value}
- {contact} - ); - } - }, - { - id: 'remarks', - field: 'remarks', - headerName: 'remarks', - flex: 3, - }, - { - field: 'actions', - type: 'actions', - headerName: '', - width: 50, - cellClassName: 'actions', - renderCell: () => { - return ; - }, - } - ]; - - return ( -
- -
- ); -} diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js new file mode 100644 index 0000000..f950eb0 --- /dev/null +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/PaymentTab.js @@ -0,0 +1,79 @@ +// material-ui +import * as React from 'react'; +import { + Button +} from '@mui/material'; +import { useNavigate } from "react-router-dom"; +import {FiDataGrid} from "components/FiDataGrid"; +import * as FormatUtils from "utils/FormatUtils" +import * as DateUtils from "utils/DateUtils" +import * as PaymentStatus from "utils/statusUtils/PaymentStatus" +// import * as StatusUtils from "./PublicNoteStatusUtils"; +// ==============================|| EVENT TABLE ||============================== // + +export default function SubmittedTab({ rows }) { + + const navigate = useNavigate() + + const handleEditClick = (params) => () => { + navigate('/paymentPage/details/' + params.row.id); + }; + + const columns = [ + { + field: 'actions', + headerName: '付款編號', + flex: 1, + cellClassName: 'actions', + renderCell: (params) => { + return ; + }, + }, + { + id: 'transDateTime', + field: 'transDateTime', + headerName: '付款日期', + flex: 1, + valueGetter: (params) => { + return DateUtils.datetimeStr(params.value); + } + }, + { + id: 'status', + field: 'status', + headerName: '付款狀況', + flex: 1, + renderCell: (params) => { + return PaymentStatus.getStatus_Cht(params); + } + }, + { + id: 'payAmount', + field: 'payAmount', + headerName: '費用', + width: 150, + valueGetter: (params) => { + return (params?.value) ? "$ " + FormatUtils.currencyFormat(params?.value) : ""; + } + }, + ]; + + return ( + <> +
+ +
+ + ); + + + +} diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/PendingPaymentTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/PendingPaymentTab.js deleted file mode 100644 index aadbee7..0000000 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/PendingPaymentTab.js +++ /dev/null @@ -1,141 +0,0 @@ -// material-ui -import * as React from 'react'; -import { - DataGrid, -} from "@mui/x-data-grid"; -import { - Stack, - Typography, - Button, - Dialog, DialogTitle, DialogContent, DialogActions -} from '@mui/material'; -import * as DateUtils from "utils/DateUtils" -// import * as StatusUtils from "./PublicNoteStatusUtils"; -// ==============================|| EVENT TABLE ||============================== // - -export default function SubmittedTab({ rows }) { - const [selectedRowItems, setSelectedRowItems] = React.useState([]); - const [isPopUp, setIsPopUp] = React.useState(false); - - - const columns = [ - { - id: 'appNo', - field: 'appNo', - headerName: '申請編號', - flex: 1, - }, - { - id: 'created', - field: 'created', - headerName: '提交日期', - flex: 1, - valueGetter: (params) => { - return DateUtils.datetimeStr(params.value); - } - }, - { - id: 'contactPerson', - field: 'contactPerson', - headerName: '聯絡人', - flex: 2, - renderCell: (params) => { - let phone = JSON.parse(params.row.contactTelNo); - let faxNo = JSON.parse(params.row.contactFaxNo); - - let contact = ""; - if (phone) { - contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber - } - - if (faxNo) { - if (contact != "") - contact = contact + ", " - contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber - } - - return (<> - {params?.value}
- {contact} - ); - } - }, - { - id: 'remarks', - field: 'remarks', - headerName: '我的備註', - flex: 3, - - }, - { - field: 'actions', - type: 'actions', - headerName: '', - width: 50, - cellClassName: 'actions', - renderCell: () => { - return ; - }, - } - ]; - - const getWindowContent = () => { - var content = []; - const datas = rows?.filter((row) => - selectedRowItems.includes(row.id) - ); - for (var i = 0; i < datas?.length; i++) { - content.push(<> - 申請編號: {datas[i].appNo}({DateUtils.datetimeStr(datas[i].created)}) - 備註: {datas[i].remarks} -

- ); - } - return content; - } - - return ( - <> -
- { - setSelectedRowItems(newSelection); - }} - /> - -
- -
- setIsPopUp(false)} > - - 確認付款 - - - {getWindowContent()} - - - - - - - -
- - ); - - - -} diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js index 621f1ab..04e27c8 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js @@ -1,73 +1,81 @@ // material-ui import * as React from 'react'; import { - DataGrid, -} from "@mui/x-data-grid"; -import { - Button + Button, } from '@mui/material'; +import { useNavigate } from "react-router-dom"; +import * as DateUtils from "utils/DateUtils"; +import * as ProofStatus from "utils/statusUtils/ProofStatus"; +import {FiDataGrid} from "components/FiDataGrid"; +import * as FormatUtils from "utils/FormatUtils" // ==============================|| EVENT TABLE ||============================== // export default function ProofTab({rows}) { - const [rowModesModel] = React.useState({}); + + const navigate = useNavigate() + + const handleEditClick = (params) => () => { + navigate('/proof/reply/' + params.row.id); + }; const columns = [ { - id: 'proofRef', - field: 'proofRef', - headerName: 'Proof Ref.', - flex: 1, + + field: 'actions', + headerName: '校對編號', + width: 200, + cellClassName: 'actions', + renderCell: (params) => { + return ; + }, }, { - id: 'proofSent', - field: 'proofSent', - headerName: 'Proof Return', + id: 'actions', + headerName: '狀態', flex: 1, + renderCell: (params) => { + return ProofStatus.getStatus_Cht(params); + }, }, { - id: 'proofReturn', - field: 'proofReturn', - headerName: 'Proof Return', + id: 'created', + field: 'created', + headerName: '校對日期', flex: 1, + valueGetter: (params) => { + return DateUtils.datetimeStr(params?.value); + } }, { - id: 'status', - field: 'status', - headerName: 'Status', + id: 'replyDate', + field: 'replyDate', + headerName: '回覆日期', flex: 1, + valueGetter: (params) => { + return params?.value?DateUtils.datetimeStr(params?.value):""; + } }, { id: 'fee', field: 'fee', - headerName: 'Fee (HKD)', - flex: 2, + headerName: '費用', + flex: 1, + valueGetter: (params) => { + return (params?.value)?"$ "+FormatUtils.currencyFormat(params?.value):""; + } }, - { - field: 'detail', - type: 'actions', - headerName: '', - width: 50, - cellClassName: 'actions', - renderCell: () => { - return ; - }, - } ]; return (
-
); diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js index 1608fa1..43ed2cc 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js @@ -1,27 +1,26 @@ // material-ui import * as React from 'react'; -import { - DataGrid, -} from "@mui/x-data-grid"; - +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"; // ==============================|| EVENT TABLE ||============================== // export default function StatusHistoryTab({rows}) { - const [rowModesModel] = React.useState({}); - const columns = [ { id: 'created', field: 'created', headerName: 'Date', - valueGetter: (params) => { - const value = params.value - return value[0]+"/"+value[1]+"/"+value[2]+" "+value[3]+":"+value[4]+":"+value[5] - }, - // valueFormatter: (params) => dayjs(params.value).format('DD/MM/YYYY'), flex: 1, + valueGetter: (params) => { + return DateUtils.datetimeStr(params?.value); + } + }, { id: 'createdBy', @@ -42,18 +41,14 @@ 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 ad361f9..d7fa71a 100644 --- a/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js +++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/TabTable.js @@ -8,98 +8,67 @@ import { } from '@mui/material'; import { TabPanel, TabContext, TabList } from '@mui/lab'; -import { - useEffect, - useState } from "react"; -// import { useNavigate } from "react-router-dom"; import * as React from "react"; -// import * as HttpUtils from "../../../utils/HttpUtils"; -// import * as UrlUtils from "../../../utils/ApiPathConst"; + import Loadable from 'components/Loadable'; import { lazy } from 'react'; -const BaseGrid = Loadable(lazy(() => import('./BaseGrid'))); -const StatusHistoryTab = Loadable(lazy(() => import('./StatusHistoryTab'))); -const LoadingComponent = Loadable(lazy(() => import('../../../extra-pages/LoadingComponent'))); +const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent'))); const ProofTab = Loadable(lazy(() => import('./ProofTab'))); +const PaymentTab = Loadable(lazy(() => import('./PaymentTab'))); // ==============================|| DASHBOARD - DEFAULT ||============================== // -const PublicNotice = ({applicationDetailData}) => { - const [submittedList, ] = useState([]); - const [inProgressList, ] = useState([]); - const [onReady,setOnReady] = useState(false); - const [selectedTab, setSelectedTab] = useState("1"); - // const navigate = useNavigate(); - const [statusHistoryList, setStatusHistoryList] = useState([]); - +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"); - // useEffect(() => { - // loadData(); - // }, []); const reloadPage = () => { window.location.reload(false); } - useEffect(() => { - //if user data from parent are not null - // console.log(applicationDetailData) - if (Object.keys(applicationDetailData).length > 0) { - setStatusHistoryList(applicationDetailData.statusHistoryList); - } - }, [applicationDetailData]); - useEffect(() => { - //if state data are ready and assign to different field - if (statusHistoryList.length > 0) { - setOnReady(true); - } - }, [statusHistoryList]); + React.useEffect(() => { + setProofList(proofList); + setOnReady(true); + }, [proofList]); - // useEffect(() => { - // setLoding(false); - // }, [submittedList]); + React.useEffect(() => { + setPaymentList(paymentList); + }, [paymentList]); const handleChange = (event, newValue) => { setSelectedTab(newValue); } - // const onBtnClick = () => { - // navigate('/publicNotice/apply') - // } - return ( !onReady ? : - + {/*col 2*/} - - - + + + - - - -