Merge branch 'master' of https://git.2fi-solutions.com/alex/PNSPS-frontend-MaterialUI

src/pages/Payment/index.js

@@ -16,7 +16,8 @@ import {
     Grid,
     Typography,
     Stack,
-    Box
+    Box,
+    Dialog, DialogTitle, DialogContent, DialogActions,
 } from '@mui/material';
 
 //icon
@@ -64,6 +65,9 @@ const Index = () => {
     const [itemList, setItemList] = useState([]);
     const [onReady, setOnReady] = useState(false);
 
+    const [expiryDateErrText, setExpiryDateErrText] = React.useState("");
+    const [expiryDateErr, setExpiryDateErr] = React.useState(false);
+
     useEffect(() => {
         setAppIds(location.state?.appIdList ?? [])
         setTotalAmount(location.state?.amount ?? 2000)
@@ -369,7 +373,24 @@ const Index = () => {
     };
 
     const confirmPaymentHandle = () => () => {
-        setConfirmPayment(true);
+        HttpUtils.post({
+            url: UrlUtils.POST_CHECK_APP_EXPRITY_DATE,
+            params: {
+                ids: appIds
+            },
+            onSuccess: (responData) => {
+                if (responData.success == true) {
+                    setConfirmPayment(true);
+                    return;
+                }
+                let str = "";
+                responData.msg.forEach((item) => {
+                    str += "App: " + item.appNo + ", 到期日: " + DateUtils.datetimeStr_Cht(item.expiryDate) + "\n";
+                });
+                setExpiryDateErrText(str.split('\n').map(str => <>{str}<br/></>));
+                setExpiryDateErr(true);
+            }
+        });
     };
 
     const getMethodImgClass = (method) => {
@@ -524,6 +545,22 @@ const Index = () => {
 
             </Grid>
             {/*row 2*/}
+            <div>
+                <Dialog open={expiryDateErr} onClose={() => setExpiryDateErr(false)}  >
+                    <DialogTitle></DialogTitle>
+                    <Typography variant="h2" style={{ padding: '16px' }}>行動失敗</Typography>
+                    <DialogContent style={{ display: 'flex', }}>
+                        <Stack direction="column" justifyContent="space-between">
+                            {
+                                expiryDateErrText
+                            }
+                        </Stack>
+                    </DialogContent>
+                    <DialogActions>
+                        <Button onClick={() => setExpiryDateErr(false)}><Typography variant="h5">關閉</Typography></Button>
+                    </DialogActions>
+                </Dialog>
+            </div>
         </Grid >
     );
 }

src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js

@@ -24,12 +24,13 @@ import { lazy } from 'react';
 const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
 // import {useParams} from "react-router-dom";
 import * as HttpUtils from "utils/HttpUtils"
+import * as UrlUtils from "utils/ApiPathConst"
 import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";
 import * as DateUtils from "utils/DateUtils";
 import * as FormatUtils from "utils/FormatUtils";
 import {
     isORGLoggedIn,
-  } from "utils/Utils";
+} from "utils/Utils";
 
 // import BorderColorOutlinedIcon from '@mui/icons-material/BorderColorOutlined';
 // import DoneIcon from '@mui/icons-material/Done';
@@ -45,6 +46,8 @@ const ApplicationDetailCard = (
     }
 ) => {
     const [isPopUp, setIsPopUp] = useState(false);
+    const [errorText, setErrorText] = useState("");
+    const [errorPopUp, setErrorPopUp] = useState(false);
     // const params = useParams();
     const [currentApplicationDetailData, setCurrentApplicationDetailData] = useState({});
     const [fee, setFee] = useState(0);
@@ -97,6 +100,24 @@ const ApplicationDetailCard = (
         setStatus("cancel")
     };
 
+    const checkExprityDate = () => {
+        HttpUtils.post({
+            url: UrlUtils.POST_CHECK_APP_EXPRITY_DATE,
+            params: {
+                ids: [currentApplicationDetailData.id]
+            },
+            onSuccess: (responData) => {
+                if (responData.success == true) {
+                    setIsPopUp(true);
+                    return;
+                }
+                setErrorText("公共啟事申請已過期");
+                setErrorPopUp(true);
+            }
+        });
+    };
+
+
     function doPayment() {
         setIsPopUp(false);
         navigate('/paymentPage', { state: { amount: fee, appIdList: [currentApplicationDetailData.id] } });
@@ -124,8 +145,10 @@ const ApplicationDetailCard = (
                                     <Button
                                         // size="large"
                                         variant="contained"
-                                        onClick={() => { setIsPopUp(true) }}
-                                        disabled={currentApplicationDetailData.status == "rejected" || currentApplicationDetailData.status == "cancelled" || currentApplicationDetailData.status == "paid"}
+                                        onClick={() => { checkExprityDate(true) }}
+                                        disabled={currentApplicationDetailData.status == "rejected"
+                                            || currentApplicationDetailData.status == "cancelled"
+                                            || currentApplicationDetailData.status == "paid"}
                                         sx={{
                                             textTransform: 'capitalize',
                                             alignItems: 'end'
@@ -146,7 +169,7 @@ const ApplicationDetailCard = (
                                     alignItems: 'end',
                                     backgroundColor: '#ffa733'
                                 }}>
-                                <CloseIcon sx={{mb:0.5}}/>
+                                <CloseIcon sx={{ mb: 0.5 }} />
                                 <Typography ml={1} variant="h5"> 取消</Typography>
                             </Button>
                         </Stack>
@@ -500,13 +523,13 @@ const ApplicationDetailCard = (
                                                                 variant="contained"
                                                                 onClick={onDownloadClick()}
                                                                 title="下載"
-                                                                style={{display:"flex-right"}}
+                                                                style={{ display: "flex-right" }}
                                                                 sx={{
                                                                     textTransform: 'capitalize',
                                                                     alignItems: 'end',
                                                                 }}>
-                                                                <DownloadIcon sx={{mb: 0.5}}/>
-                                                                <Typography sx={{ml: 1}} variant="h5">下載</Typography>
+                                                                <DownloadIcon sx={{ mb: 0.5 }} />
+                                                                <Typography sx={{ ml: 1 }} variant="h5">下載</Typography>
                                                             </Button>
                                                         </Grid>
                                                     </Grid>
@@ -527,7 +550,7 @@ const ApplicationDetailCard = (
                                             <Typography variant="h5">{currentApplicationDetailData.careOf}</Typography>
                                         </Grid>
                                     </Grid>
-                                </Grid>: null
+                                </Grid> : null
                             }
                             <Grid item xs={12} md={6} lg={6} sx={{ mb: 1, paddingTop: 2 }}>
                                 <Grid container alignItems={"center"}>
@@ -557,6 +580,22 @@ const ApplicationDetailCard = (
                             </DialogActions>
                         </Dialog>
                     </div>
+                    <div>
+                        <Dialog open={errorPopUp} onClose={() => setErrorPopUp(false)}  >
+                            <DialogTitle></DialogTitle>
+                            <Typography variant="h2" style={{ padding: '16px' }}>行動失敗</Typography>
+                            <DialogContent style={{ display: 'flex', }}>
+                                <Stack direction="column" justifyContent="space-between">
+                                    {
+                                        errorText
+                                    }
+                                </Stack>
+                            </DialogContent>
+                            <DialogActions>
+                                <Button onClick={() => setErrorPopUp(false)}><Typography variant="h5">關閉</Typography></Button>
+                            </DialogActions>
+                        </Dialog>
+                    </div>
                 </form>
             </MainCard >
     );

src/pages/PublicNotice/ListPanel/PendingPaymentTab.js

@@ -10,13 +10,15 @@ import {
     Dialog, DialogTitle, DialogContent, DialogActions,
 } from '@mui/material';
 import { FiDataGrid } from "components/FiDataGrid";
+import * as HttpUtils from "utils/HttpUtils"
+import * as UrlUtils from "utils/ApiPathConst"
 import * as DateUtils from "utils/DateUtils"
 import * as FormatUtils from "utils/FormatUtils"
 import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";
 import { useNavigate } from "react-router-dom";
 import {
     isORGLoggedIn,
-  } from "utils/Utils";
+} from "utils/Utils";
 // ==============================|| EVENT TABLE ||============================== //
 
 export default function SubmittedTab({ rows }) {
@@ -27,6 +29,8 @@ export default function SubmittedTab({ rows }) {
     const [getCareOfList, setCareOfList] = React.useState([]);
     const [careOfComboList, setCareOfComboList] = React.useState([{}]);
     const [selectedCareOf, setSelectedCareOf] = React.useState(null);
+    const [expiryDateErrText, setExpiryDateErrText] = React.useState("");
+    const [expiryDateErr, setExpiryDateErr] = React.useState(false);
 
     //const [amount, setAmount] = React.useState(0);
     const navigate = useNavigate()
@@ -40,7 +44,7 @@ export default function SubmittedTab({ rows }) {
             key: index,
             id: obj.id,
             label: obj.careOf,
-          }));
+        }));
         //   console.log(formattedData)
         setCareOfList(formattedData)
     }, []);
@@ -51,11 +55,11 @@ export default function SubmittedTab({ rows }) {
     }, [getCareOfList]);
 
     React.useEffect(() => {
-        if(selectedCareOf != null){
+        if (selectedCareOf != null) {
             const afteSelectedList = [];
             afteSelectedList.push(rows.find(obj => obj.id === selectedCareOf.id));
             setRowList(afteSelectedList)
-        }else{
+        } else {
             setRowList(rows)
         }
     }, [selectedCareOf]);
@@ -64,6 +68,37 @@ export default function SubmittedTab({ rows }) {
         navigate('/publicNotice/' + params.id);
     };
 
+    const handlePaymentBtn = () => {
+        let appIdList = [];
+        const datas = rows?.filter((row) =>
+            selectedRowItems.includes(row.id)
+        );
+        // console.log(datas)
+        for (var i = 0; i < datas?.length; i++) {
+            appIdList.push(datas[i].id);
+        }
+        HttpUtils.post({
+            url: UrlUtils.POST_CHECK_APP_EXPRITY_DATE,
+            params: {
+                ids: appIdList
+            },
+            onSuccess: (responData) => {
+                if (responData.success == true) {
+                    setIsPopUp(true);
+                    return;
+                }
+                let str = "";
+                responData.msg.forEach((item) => {
+                    str += "App: " + item.appNo + ", 到期日: " + DateUtils.datetimeStr_Cht(item.expiryDate) + "\n";
+                });
+                setExpiryDateErrText(str.split('\n').map(str => <>{str}<br/></>));
+                setExpiryDateErr(true);
+            }
+        });
+
+
+    };
+
     const columns = [
         {
             id: 'appNo',
@@ -109,18 +144,18 @@ export default function SubmittedTab({ rows }) {
         {
             id: 'remarks',
             field: 'remarks',
-            headerName:  isORGLoggedIn()?"Care Of / 我的備註":"我的備註",
+            headerName: isORGLoggedIn() ? "Care Of / 我的備註" : "我的備註",
             flex: 3,
             renderCell: (params) => (
-                isORGLoggedIn()? 
-                <div>
-                  <Typography>Care Of: {params.row.careOf}</Typography>
-                  <Typography>我的備註: {params.row.remarks}</Typography>
-                </div>:
-                <div>
-                    <Typography>{params.row.remarks}</Typography>
-                </div>
-              )
+                isORGLoggedIn() ?
+                    <div>
+                        <Typography>Care Of: {params.row.careOf}</Typography>
+                        <Typography>我的備註: {params.row.remarks}</Typography>
+                    </div> :
+                    <div>
+                        <Typography>{params.row.remarks}</Typography>
+                    </div>
+            )
         },
         {
             id: 'fee',
@@ -192,11 +227,11 @@ export default function SubmittedTab({ rows }) {
         }
         const firstCareOf = datas[0].careOf;
         const areAllCareOfEqual = datas.every(obj => obj.careOf === firstCareOf);
-        
 
-        if (appIdList.length>0&&areAllCareOfEqual){
+
+        if (appIdList.length > 0 && areAllCareOfEqual) {
             navigate('/paymentPage', { state: { amount: totalAmount, appIdList: appIdList } });
-        }else{
+        } else {
             setCheckCareOf(true);
             // console.log("The selected applications should be from the same Care of.")
         }
@@ -219,7 +254,7 @@ export default function SubmittedTab({ rows }) {
     return (
         <>
             <div style={{ minHeight: 400, width: '100%', padding: 4 }}>
-                {isORGLoggedIn()?
+                {isORGLoggedIn() ?
                     <Grid container direction="row" justifyContent="flex-start" alignItems="center" >
                         <Grid item xs={3} md={1}>
                             <Typography variant="h5">Care Of:</Typography>
@@ -237,7 +272,7 @@ export default function SubmittedTab({ rows }) {
                                 renderInput={(params) => <TextField {...params} />}
                             />
                         </Grid>
-                    </Grid>:null
+                    </Grid> : null
                 }
                 <FiDataGrid
                     checkboxSelection
@@ -255,8 +290,8 @@ export default function SubmittedTab({ rows }) {
                     onRowDoubleClick={handleRowDoubleClick}
                     getRowHeight={() => 'auto'}
                 />
-                <br/>
-                <Button variant="contained" onClick={() => { setIsPopUp(true) }}><Typography variant="h5">付款</Typography></Button>
+                <br />
+                <Button variant="contained" onClick={() => { handlePaymentBtn() }}><Typography variant="h5">付款</Typography></Button>
             </div>
 
             <div>
@@ -282,16 +317,33 @@ export default function SubmittedTab({ rows }) {
                     <DialogContent style={{ display: 'flex', }}>
                         <Stack direction="column" justifyContent="space-between">
                             <Typography variant="h5" color="error">
-                               You have been selected different Care of applications. Are you want to pay?
+                                You have been selected different Care of applications. Are you want to pay?
                             </Typography>
                         </Stack>
                     </DialogContent>
                     <DialogActions>
-                        <Button onClick={() => setCheckCareOf(false)}><Typography variant="h5">Close</Typography></Button>
+                        <Button onClick={() => setCheckCareOf(false)}><Typography variant="h5">關閉</Typography></Button>
                         <Button onClick={() => afterWarningPayment()}><Typography variant="h5">確認</Typography></Button>
                     </DialogActions>
                 </Dialog>
             </div>
+
+            <div>
+                <Dialog open={expiryDateErr} onClose={() => setExpiryDateErr(false)}  >
+                    <DialogTitle></DialogTitle>
+                    <Typography variant="h2" style={{ padding: '16px' }}>行動失敗</Typography>
+                    <DialogContent style={{ display: 'flex', }}>
+                        <Stack direction="column" justifyContent="space-between">
+                            {
+                                expiryDateErrText
+                            }
+                        </Stack>
+                    </DialogContent>
+                    <DialogActions>
+                        <Button onClick={() => setExpiryDateErr(false)}><Typography variant="h5">關閉</Typography></Button>
+                    </DialogActions>
+                </Dialog>
+            </div>
         </>
     );
 

src/utils/ApiPathConst.js

@@ -60,6 +60,7 @@ export const GET_PUBLIC_NOTICE_LIST = apiPath+'/application/list';
 export const GET_PUBLIC_NOTICE_LIST_ListByStatus = apiPath+'/application/status-list';
 export const GET_PUBLIC_NOTICE_getApplyUser = apiPath+'/application/get-apply-user';
 export const POST_PUBLIC_NOTICE_APPLY = apiPath+'/application/apply';
+export const POST_CHECK_APP_EXPRITY_DATE = apiPath+'/application/checkExprityDate';
 
 //GLD User
 export const POST_ADMIN_USER_REGISTER = apiPath+'/user/registry';