update UI

src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js

@@ -142,24 +142,24 @@ const ApplicationDetailCard = (
                 const latestData = {};
 
                 responseData.forEach(item => {
-                const { appId, timeDiff } = item;
-                if (latestData[appId] === undefined || timeDiff < latestData[appId].timeDiff) {
-                    latestData[appId] = item;
-                }
+                    const { appId, timeDiff } = item;
+                    if (latestData[appId] === undefined || timeDiff < latestData[appId].timeDiff) {
+                        latestData[appId] = item;
+                    }
                 });
                 const latestDataObjects = Object.values(latestData);
-                
+
                 const filteredData = latestDataObjects.filter(item => item.timeDiff > 20 || item.status !== "APPR");
                 const filteredAppIds = filteredData.map(item => item.appId);
-                
+
                 const appIdsNotInData = appIdList.filter(appId => !latestDataObjects.some(item => item.appId === appId));
                 const combinedAppIdsArray = [...appIdsNotInData, ...filteredAppIds];
-                
+
                 const readyToPayment = appIdList.every(appId => combinedAppIdsArray.includes(appId));
-                if (readyToPayment){
+                if (readyToPayment) {
                     setIsPopUp(true);
                     return;
-                }else{
+                } else {
                     const appIdsInData = appIdList.filter(appId => !combinedAppIdsArray.some(item => item === appId));
                     const HoldingApplication = latestDataObjects.filter(item => appIdsInData.includes(item.appId));
                     const resultString = HoldingApplication.map(item => item.appNo).join(' , ');
@@ -211,11 +211,11 @@ const ApplicationDetailCard = (
                                     onClick={cancelledClick()}
                                     color="edit"
                                     disabled={currentApplicationDetailData.status == "rejected"
-                                    || currentApplicationDetailData.status == "cancelled"
-                                    || (!currentApplicationDetailData.creditor 
-                                        && currentApplicationDetailData.status == "paid")
-                                    || (currentApplicationDetailData.creditor 
-                                        && currentApplicationDetailData.status == "confirmed")
+                                        || currentApplicationDetailData.status == "cancelled"
+                                        || (!currentApplicationDetailData.creditor
+                                            && currentApplicationDetailData.status == "paid")
+                                        || (currentApplicationDetailData.creditor
+                                            && currentApplicationDetailData.status == "confirmed")
                                     }
                                     title={intl.formatMessage({ id: 'cancel' })}
                                     startIcon={<CloseIcon />}
@@ -505,12 +505,23 @@ const ApplicationDetailCard = (
                                                 <Grid item xs={12} md={3} lg={3}
                                                     sx={{ display: 'flex', alignItems: 'center' }}>
                                                     <FormLabel><Typography variant="pnspsFormParagraph">
-                                                        <FormattedMessage id="currencyPrice" />(HK$):
+                                                        <FormattedMessage id="currencyAmount" />(HK$):
                                                     </Typography></FormLabel>
                                                 </Grid>
 
                                                 <Grid item xs={12} md={9} lg={9}>
-                                                    <FormLabel><Typography variant="pnspsFormParagraph">{FormatUtils.currencyFormat(fee)}</Typography></FormLabel>
+                                                    <FormControl variant="outlined" fullWidth disabled>
+                                                        <OutlinedInput
+                                                            size="small"
+                                                            value={FormatUtils.currencyFormat(fee)}
+                                                            sx={{
+                                                                "& .MuiInputBase-input.Mui-disabled": {
+                                                                    WebkitTextFillColor: "#000000",
+                                                                    background: "#f8f8f8",
+                                                                },
+                                                            }}
+                                                        />
+                                                    </FormControl>
                                                 </Grid>
                                             </Grid>
                                         </Grid>
@@ -618,7 +629,18 @@ const ApplicationDetailCard = (
                                             <FormLabel><Typography variant="pnspsFormParagraph"><FormattedMessage id="careOf" />:</Typography></FormLabel>
                                         </Grid>
                                         <Grid item xs={12} md={9} lg={9}>
-                                            <Typography variant="pnspsFormParagraph">{currentApplicationDetailData.careOf}</Typography>
+                                            <FormControl variant="outlined" sx={{ width: '100%' }} disabled>
+                                                <OutlinedInput
+                                                    size="small"
+                                                    value={currentApplicationDetailData.careOf}
+                                                    sx={{
+                                                        "& .MuiInputBase-input.Mui-disabled": {
+                                                            WebkitTextFillColor: "#000000",
+                                                            background: "#f8f8f8",
+                                                        },
+                                                    }}
+                                                />
+                                            </FormControl>
                                         </Grid>
                                     </Grid>
                                 </Grid> : null
@@ -632,7 +654,18 @@ const ApplicationDetailCard = (
                                         </Typography></FormLabel>
                                     </Grid>
                                     <Grid item xs={12} md={9} lg={9}>
-                                        <Typography variant="pnspsFormParagraph">{currentApplicationDetailData.remarks}</Typography>
+                                        <FormControl variant="outlined" sx={{ width: '100%' }} disabled>
+                                            <OutlinedInput
+                                                size="small"
+                                                value={currentApplicationDetailData.remarks}
+                                                sx={{
+                                                    "& .MuiInputBase-input.Mui-disabled": {
+                                                        WebkitTextFillColor: "#000000",
+                                                        background: "#f8f8f8",
+                                                    },
+                                                }}
+                                            />
+                                        </FormControl>
                                     </Grid>
                                 </Grid>
                             </Grid>