update warnng with careOf

src/assets/style/styles.css

@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+HK|Noto+Sans+SC&display=swap');
+@import url('https://fonts.googleapis.com/css?family=Noto+Sans+HK|Noto+Sans+SC&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
 
 html,

src/pages/PublicNotice/ListPanel/PendingPaymentTab.js

@@ -33,7 +33,7 @@ export default function SubmittedTab({ rows }) {
 
     React.useEffect(() => {
         // const careOfList = rows.map(obj => obj.careOf);
-        console.log(rows)
+        // console.log(rows)
         // console.log(careOfList)
         setRowList(rows)
         const formattedData = rows.filter(obj => obj.careOf !== null).map((obj, index) => ({
@@ -41,12 +41,12 @@ export default function SubmittedTab({ rows }) {
             id: obj.id,
             label: obj.careOf,
           }));
-          console.log(formattedData)
+        //   console.log(formattedData)
         setCareOfList(formattedData)
     }, []);
 
     React.useEffect(() => {
-        console.log(getCareOfList)
+        // console.log(getCareOfList)
         setCareOfComboList(getCareOfList)
     }, [getCareOfList]);
 
@@ -198,10 +198,24 @@ export default function SubmittedTab({ rows }) {
             navigate('/paymentPage', { state: { amount: totalAmount, appIdList: appIdList } });
         }else{
             setCheckCareOf(true);
-            console.log("The selected applications should be from the same Care of.")
+            // console.log("The selected applications should be from the same Care of.")
         }
     }
 
+    function afterWarningPayment() {
+        let totalAmount = 0;
+        let appIdList = [];
+        const datas = rows?.filter((row) =>
+            selectedRowItems.includes(row.id)
+        );
+        // console.log(datas)
+        for (var i = 0; i < datas?.length; i++) {
+            totalAmount += datas[i].fee;
+            appIdList.push(datas[i].id);
+        }
+        navigate('/paymentPage', { state: { amount: totalAmount, appIdList: appIdList } });
+    }
+
     return (
         <>
             <div style={{ minHeight: 400, width: '100%', padding: 4 }}>
@@ -264,16 +278,17 @@ export default function SubmittedTab({ rows }) {
             <div>
                 <Dialog open={checkCareOf} onClose={() => setCheckCareOf(false)}  >
                     <DialogTitle></DialogTitle>
-                    {/* <Typography variant="h2" style={{ padding: '16px' }}>確認付款</Typography> */}
+                    <Typography variant="h2" style={{ padding: '16px' }}>Warning</Typography>
                     <DialogContent style={{ display: 'flex', }}>
                         <Stack direction="column" justifyContent="space-between">
                             <Typography variant="h5" color="error">
-                                The selected applications should be from the same Care of.
+                               You have been selected different Care of applications. Are you want to pay?
                             </Typography>
                         </Stack>
                     </DialogContent>
                     <DialogActions>
-                        <Button onClick={() => setCheckCareOf(false)}><Typography variant="h5">確認</Typography></Button>
+                        <Button onClick={() => setCheckCareOf(false)}><Typography variant="h5">Close</Typography></Button>
+                        <Button onClick={() => afterWarningPayment()}><Typography variant="h5">確認</Typography></Button>
                     </DialogActions>
                 </Dialog>
             </div>