add not accepted

src/pages/PublicNoticeDetail_GLD/ApplicationDetailCard.js

@@ -3,97 +3,44 @@ import {
     FormControl,
     Button,
     Grid,
-    // InputAdornment, 
     Typography, FormLabel,
     OutlinedInput,
     Stack
 } from '@mui/material';
-// import MainCard from "../../components/MainCard";
 const MainCard = Loadable(lazy(() => import('components/MainCard')));
 import { useForm } from "react-hook-form";
 import {
     useEffect,
     useState
 } 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"
-// import * as ApiPathConst from "utils/ApiPathConst"
 import * as StatusUtils from "../PublicNotice/ListPanel/PublicNoteStatusUtils";
 
-import BorderColorOutlinedIcon from '@mui/icons-material/BorderColorOutlined';
 import DoneIcon from '@mui/icons-material/Done';
 import CloseIcon from '@mui/icons-material/Close';
 import EditNoteIcon from '@mui/icons-material/EditNote';
 import DownloadIcon from '@mui/icons-material/Download';
-// import { Params } from '../../../node_modules/react-router-dom/dist/index';
-// import {useNavigate} from "react-router-dom";
-// import axios from "axios";
-// import { makeStyles } from '@material-ui/core/styles';
-
-// const useStyles = makeStyles({
-//     input: {
-//       '& input[type=number]': {
-//           '-moz-appearance': 'textfield'
-//       },
-//       '& input[type=number]::-webkit-outer-spin-button': {
-//           '-webkit-appearance': 'none',
-//           margin: 0
-//       },
-//       '& input[type=number]::-webkit-inner-spin-button': {
-//           '-webkit-appearance': 'none',
-//           margin: 0
-//       }
-//     },
-//   });
-  
+import ReplayIcon from '@mui/icons-material/Replay';
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 const ApplicationDetailCard = (
     { applicationDetailData,
         setStatus,
-        // setReload,
-        isEditMode,
-        setUpdateApplicationObject,
-        setiIsSave,
-        // isNewRecord
     }
 ) => {
-    // const params = useParams();
+
     const [currentApplicationDetailData, setCurrentApplicationDetailData] = useState({});
     const [companyName, setCompanyName] = useState({});
     const [verified, setVerified] = useState(null);
     const [fileDetail, setfileDetail] = useState({});
     const [onReady, setOnReady] = useState(false);
-    // const [reload, setReload] = useState(false);
-    // const classes = useStyles();
-    // const navigate = useNavigate()
-    // const params = useParams();
-
-    const [editMode, setEditMode] = useState(false);
-    const onEditClick = () => () => {
-        setEditMode(true);
-        isEditMode(true);
-    };
-
-    const onSaveClick = () => () => {
-        //upload latest data to parent
-        const values = getValues();
-        const objectData = {
-            ...values,
-        }
-        setUpdateApplicationObject({ objectData });
-        setiIsSave(true)
-    };
 
-    const { register,
-        getValues,
-        // setValue
-    } = useForm()
+    const { register } = useForm()
 
     useEffect(() => {
         //if user data from parent are not null
@@ -102,7 +49,7 @@ const ApplicationDetailCard = (
             loadApplicationDetail()
         }
     }, [applicationDetailData]);
-    
+
     useEffect(() => {
         //if state data are ready and assign to different field
         // console.log(currentApplicationDetailData)
@@ -127,24 +74,13 @@ const ApplicationDetailCard = (
         });
     };
 
-    // useEffect(() => {
-    //     if (Object.keys(applicationDetailData).length > 0) {
-    //         loadApplicationDetail()
-    //     }
-    // }, [reload]);
-
-    const reloadHandle = () => () => {
-        // setReload(true)
-        setEditMode(false)
-        location.reload(); 
-    };
 
-    const acceptedClick = () => () => {
-        setStatus("accept")
+    const reSubmitClick = () => () => {
+        setStatus("resubmit")
     };
 
-    const rejectedClick = () => () => {
-        setStatus("reject")
+    const notAcceptedClick = () => () => {
+        setStatus("notAccepted")
     };
 
     const complatedClick = () => () => {
@@ -155,7 +91,7 @@ const ApplicationDetailCard = (
         setStatus("withdraw")
     };
 
-    const onProofClick=()=>{
+    const onProofClick = () => {
         window.open("/proof/create/" + currentApplicationDetailData.id, "_blank", "noreferrer");
         window.addEventListener("focus", onFocus)
     }
@@ -183,58 +119,11 @@ const ApplicationDetailCard = (
                                 spacing={2}
                                 mb={2}
                             >
-                                {editMode ?
-                                    <>
-                                        <Button
-                                            size="large"
-                                            variant="contained"
-                                            onClick={reloadHandle()}
-                                            sx={{
-                                                textTransform: 'capitalize',
-                                                alignItems: 'end'
-                                            }}
-                                        >
-                                            Reset & Back
-                                        </Button>
-                                        <Button
-                                            size="large"
-                                            variant="contained"
-                                            onClick={onSaveClick()}
-                                            color="success"
-                                            sx={{
-                                                textTransform: 'capitalize',
-                                                alignItems: 'end'
-                                            }}
-                                        >
-                                            Save
-                                        </Button>
-                                    </> :
-                                    <>{
-                                        currentApplicationDetailData.status=="submitted"?
-                                        <Grid item sx={{ ml: 3, mr: 3 }}>
-                                            <Button
-                                                // size="large"
-                                                variant="contained"
-                                                onClick={onEditClick()}
-                                                sx={{
-                                                    textTransform: 'capitalize',
-                                                    alignItems: 'end',
-                                                }}>
-                                                <BorderColorOutlinedIcon />
-                                                <Typography ml={1}> Edit</Typography>
-                                            </Button>
-                                        </Grid>
-                                        :
-                                        null
-                                    }
-                                    </>
-                                }
-
                                 {currentApplicationDetailData.status == "accepted" ?
                                     <Button
                                         // size="large"
                                         variant="contained"
-                                        onClick={()=>{onProofClick()}}
+                                        onClick={() => { onProofClick() }}
                                         sx={{
                                             textTransform: 'capitalize',
                                             alignItems: 'end'
@@ -259,26 +148,23 @@ const ApplicationDetailCard = (
                                         <Button
                                             // size="large"
                                             variant="contained"
-                                            onClick={acceptedClick()}
-                                            sx={{
-                                                textTransform: 'capitalize',
-                                                alignItems: 'end',
-                                                backgroundColor: '#52b202'
-                                            }}>
-                                            <DoneIcon />
-                                            <Typography ml={1}> Accept</Typography>
+                                            onClick={reSubmitClick()}
+                                            color="orange"
+                                            >
+                                            <ReplayIcon />
+                                            <Typography ml={1}> Re-Submit</Typography>
                                         </Button>
                                         <Button
                                             // size="large"
                                             variant="contained"
-                                            onClick={rejectedClick()}
+                                            onClick={notAcceptedClick()}
+                                            color="error"
                                             sx={{
                                                 textTransform: 'capitalize',
                                                 alignItems: 'end',
-                                                backgroundColor: '#ffa733'
                                             }}>
                                             <CloseIcon />
-                                            <Typography ml={1}> Reject</Typography>
+                                            <Typography ml={1}>Not accepted</Typography>
                                         </Button>
                                     </> :
                                     currentApplicationDetailData.status == "paid" ?
@@ -420,7 +306,7 @@ const ApplicationDetailCard = (
 
                                         <Grid item xs={12} md={8} lg={8}>
                                             <Stack direction="row">
-                                                <FormControl variant="outlined" sx={{ width: '25%' }} disabled={!editMode} >
+                                                <FormControl variant="outlined" sx={{ width: '25%' }} disabled >
                                                     <OutlinedInput
                                                         size="small"
                                                         {...register("contactTelNo.countryCode",
@@ -439,7 +325,7 @@ const ApplicationDetailCard = (
                                                         }}
                                                     />
                                                 </FormControl>
-                                                <FormControl variant="outlined" sx={{ width: '100%' }} disabled={!editMode} >
+                                                <FormControl variant="outlined" sx={{ width: '100%' }} disabled >
                                                     <OutlinedInput
                                                         size="small"
                                                         type="tel"
@@ -474,7 +360,7 @@ const ApplicationDetailCard = (
                                         </Grid>
 
                                         <Grid item xs={12} md={9} lg={9}>
-                                            <FormControl variant="outlined" fullWidth disabled={!editMode}>
+                                            <FormControl variant="outlined" fullWidth disabled>
                                                 <OutlinedInput
                                                     fullWidth
                                                     size="small"
@@ -503,7 +389,7 @@ const ApplicationDetailCard = (
 
                                         <Grid item xs={12} md={8} lg={8}>
                                             <Stack direction="row">
-                                                <FormControl variant="outlined" sx={{ width: '25%' }} disabled={!editMode}>
+                                                <FormControl variant="outlined" sx={{ width: '25%' }} disabled>
                                                     <OutlinedInput
                                                         size="small"
                                                         {...register("contactFaxNo.countryCode",
@@ -519,12 +405,12 @@ const ApplicationDetailCard = (
                                                         }}
                                                         inputProps={{
                                                             maxLength: 3,
-                                                            type:"tel"
+                                                            type: "tel"
                                                         }}
-                                                        
+
                                                     />
                                                 </FormControl>
-                                                <FormControl variant="outlined" sx={{ width: '100%' }} disabled={!editMode}>
+                                                <FormControl variant="outlined" sx={{ width: '100%' }} disabled>
                                                     <OutlinedInput
                                                         size="small"
                                                         type="tel"
@@ -590,46 +476,6 @@ const ApplicationDetailCard = (
                                     </Grid>
                                 </Grid>
                             </Grid>
-                            {/* <Grid container direction="row" justifyContent="space-between"
-                                alignItems="center">
-                                <Grid item xs={12} md={6} lg={6} mt={1}>
-                                    <Grid container alignItems={"center"}>
-                                        <Grid item xs={12} md={12} lg={12}>
-                                            <Grid container direction="row">
-                                                <Grid item xs={12} md={3} lg={3}
-                                                    sx={{ display: 'flex', alignItems: 'center top' }}>
-                                                    <FormLabel>Remarks:</FormLabel>
-                                                </Grid>
-                                                <Grid item xs={12} md={9} lg={9} sx={{ display: 'flex', alignItems: 'center' }}>
-                                                    <Grid container direction="row" justifyContent="flex-start">
-                                                        <FormControl variant="outlined" fullWidth disabled={!editMode}>
-                                                            <OutlinedInput
-                                                                fullWidth
-                                                                multiline={true}
-                                                                // maxRows={4}
-                                                                // minRows={4}
-                                                                rows={4}
-                                                                size="small"
-                                                                {...register("remarks",
-                                                                    {
-                                                                        value: currentApplicationDetailData.remarks,
-                                                                    })}
-                                                                id='remarks'
-                                                                sx={{
-                                                                    "& .MuiInputBase-input.Mui-disabled": {
-                                                                        WebkitTextFillColor: "#000000",
-                                                                        background: "#f8f8f8",
-                                                                    },
-                                                                }}
-                                                            />
-                                                        </FormControl>
-                                                    </Grid>
-                                                </Grid>
-                                            </Grid>
-                                        </Grid>
-                                    </Grid>
-                                </Grid>
-                            </Grid> */}
                         </Grid>
                     </Grid>
                 </form>

src/pages/PublicNoticeDetail_GLD/StatusChangeDialog.js

@@ -1,7 +1,7 @@
 import {
   useEffect,
   useState
-  } from "react";
+} from "react";
 
 // material-ui
 import {
@@ -20,138 +20,190 @@ import {
 } from '@mui/material';
 import { Grid } from "../../../node_modules/@mui/material/index";
 import * as ComboData from "utils/ComboData";
-import { useFormik,FormikProvider } from 'formik';
+import { useFormik, FormikProvider } from 'formik';
 import * as yup from 'yup';
 
 
 const StatusChangeDialog = (props) => {
-  const [status, setStatus] = useState("");
+  const [content, setContent] = useState();
+  const [dialogTitle, setDialogTitle] = useState("Confirm");
+  const [prositiveBtnText, setPrositiveBtnText] = useState("Confirm");
+  const [remarks, setRemarks] = useState("");
+  const [helperText, setHelperText] = useState("");
   // const [selectedGazetteGroupInputType, setSelectedGazetteGroupInputType] = useState("");
   const groupTitleComboList = ComboData.groupTitle;
-  
+
   useEffect(() => {
     // console.log(Object.keys(!props.selectedGazetteGroup).length)
-    if(props.getStatus == "accept"){
-      setStatus("Accept")
-    }else if (props.getStatus == "reject"){
-      setStatus("Reject")
-    }else if (props.getStatus == "complete"){
-      setStatus("Complete")
-    }else if (props.getStatus == "withdraw"){
-      setStatus("Withdraw")
+    // if (props.getStatus == "resubmit") {
+    //   setStatus("Accept")
+    // } else if (props.getStatus == "reject") {
+    //   setStatus("Reject")
+    // } else if (props.getStatus == "complete") {
+    //   setStatus("Complete")
+    // } else if (props.getStatus == "withdraw") {
+    //   setStatus("Withdraw")
+    // }
+
+    if (props.getStatus == "genGazetteCode") {
+      setDialogTitle("Gen Gazette Code");
+      setPrositiveBtnText("Gen");
+      return getGazetteCodeContent()
+    } else if (props.getStatus == "notAccepted") {
+      setDialogTitle("Not Accept Reason");
+      setPrositiveBtnText("Mark Not Accept");
+      return getNotAcceptedContent();
+    } else {
+      setDialogTitle("Action Confirm");
+      setPrositiveBtnText("Confirm");
+      let str = "Are you sure you want to "+props.getStatus+" this application?"
+      return getConfirmContent(str);
     }
+
+
+
   }, [props.getStatus]);
-  
-  const acceptedHandle = () => () =>{
+
+  const acceptedHandle = () => () => {
     // console.log(selectedGazetteGroup)
-    props.setStatusWindowAccepted(true)
+    if(props.getStatus == "notAccepted"){
+      if(!remarks || remarks=="" )
+        setHelperText("Please enter reason");
+    }
+    if(!helperText){
+      props.onWindowCallback(props.getStatus,{"reason": remarks});
+    }
+      props.setStatusWindowAccepted(true);
   };
 
-  
+
   const formik = useFormik({
-      initialValues:({
-          username:'',
-      }),
-      validationSchema:yup.object().shape({
-      }),
+    initialValues: ({
+      username: '',
+    }),
+    validationSchema: yup.object().shape({
+    }),
   });
 
-  // const handleReset = () => {
-  //   setSelectedGazetteGroupInputType("")
-  //   selectedGazetteGroup({});
-  // };
-  
+
+  const getConfirmContent = (text) => {
+    setContent(<Grid container direction="row" justifyContent="center" alignItems="center">
+        <FormLabel sx={{ fontSize: "20px", color: "#000000", textAlign: "center" }}>
+          {text}
+        </FormLabel>
+    </Grid>);
+  }
+
+  const getNotAcceptedContent = () => {
+    setContent(<Grid container direction="row" justifyContent="center" alignItems="center">
+      <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, }}>
+        <TextField
+          fullWidth
+          multiline
+          row={10}
+          minRows={4}
+          maxRows={4}
+          inputProps={{ maxLength: 255 }}
+          placeholder="Please enter reason"
+          helperText={helperText}
+          onChange={(newValues)=>{
+            setRemarks(newValues);
+            setHelperText("");
+          }}
+        >
+          </TextField>
+      </Grid>
+    </Grid>
+    );
+  }
+
+  const getGazetteCodeContent = () => {
+    setContent(<Grid container direction="row" justifyContent="center" alignItems="center">
+      <Grid item xs={12} md={8} lg={8} sx={{ mb: 1, }}>
+        <Grid container alignItems={"center"}>
+          <Grid item xs={12} md={2} lg={3}
+            sx={{ display: 'flex', alignItems: 'center' }}>
+            <Typography>Target Issue:</Typography>
+          </Grid>
+          <Grid item xs={12} md={9} lg={9}>
+            <FormLabel>
+              {props.gazetteIssue + ", "}{props.issueNum + ", "}{props.issueDate}
+            </FormLabel>
+          </Grid>
+        </Grid>
+      </Grid>
+      <Grid item xs={12} md={8} lg={8} sx={{ mb: 1, height: "180px" }}>
+        <Grid container alignItems={"center"}>
+          <Grid item xs={12} md={3} lg={3}
+            sx={{ display: 'flex', alignItems: 'center' }}>
+            <Typography>Grazette Group:</Typography>
+          </Grid>
+          <Grid item xs={12} md={9} lg={9}>
+            <Autocomplete
+              disablePortal
+              id="gazetteGroup"
+              options={groupTitleComboList}
+              filterOptions={(options) => options}
+              inputValue={props.selectedGazetteGroupInputType}
+              onChange={(event, newValue) => {
+                if (newValue != null && newValue != {}) {
+                  props.setSelectedGazetteGroupInputType(newValue.label);
+                  props.setSelectedGazetteGroup(newValue);
+                  formik.setFieldValue("gazetteGroup", "")
+                } else {
+                  props.setSelectedGazetteGroupInputType("");
+                }
+              }}
+              // sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
+              renderInput={(params) => <TextField {...params} placeholder="" />}
+            />
+          </Grid>
+        </Grid>
+      </Grid>
+    </Grid>
+    );
+  }
+
   return (
-      <Dialog
-        open={props.open}
-        onClose={props.handleClose}
-        fullWidth={true}
-        maxWidth={'md'}
-      >
-        <DialogTitle >
-          <Grid container>
-            <Grid item>
-              <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
-                <Typography variant="h4">
-                  {status} Application
-                </Typography>
-              </Stack>
-            </Grid>
+    <Dialog
+      open={props.open}
+      onClose={props.handleClose}
+      fullWidth={true}
+      maxWidth={'md'}
+    >
+      <DialogTitle >
+        <Grid container>
+          <Grid item>
+            <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
+              <Typography variant="h4">
+                {dialogTitle}
+              </Typography>
+            </Stack>
           </Grid>
-        </DialogTitle>
-        <FormikProvider value={formik}>
-            <form>
-              <DialogContent>
-                <DialogContentText>
-                  {props.getStatus == "accept"?
-                    <Grid container direction="row" justifyContent="center" alignItems="center">
-                      <Grid item xs={12} md={8} lg={8} sx={{mb: 1,}}>
-                          <Grid container alignItems={"center"}>
-                              <Grid item xs={12} md={2} lg={3}
-                                  sx={{display: 'flex', alignItems: 'center'}}>
-                                  <Typography>Target Issue:</Typography>
-                              </Grid>
-                              <Grid item xs={12} md={9} lg={9}>
-                                <FormLabel>
-                                  {props.gazetteIssue+", "}{props.issueNum+", "}{props.issueDate}
-                                </FormLabel>
-                              </Grid>
-                          </Grid>
-                      </Grid>
-                      <Grid item xs={12} md={8} lg={8} sx={{mb: 1,height:"180px"}}>
-                          <Grid container alignItems={"center"}>
-                              <Grid item xs={12} md={3} lg={3}
-                                  sx={{display: 'flex', alignItems: 'center'}}>
-                                  <Typography>Grazette Group:</Typography>
-                              </Grid>
-                              <Grid item xs={12} md={9} lg={9}>
-                                <Autocomplete
-                                    disablePortal
-                                    id="gazetteGroup"
-                                    options={groupTitleComboList}
-                                    filterOptions={(options)=>options}
-                                    inputValue={props.selectedGazetteGroupInputType}
-                                    onChange={(event, newValue) => {
-                                        if (newValue!=null && newValue != {}){
-                                          props.setSelectedGazetteGroupInputType(newValue.label);
-                                            props.setSelectedGazetteGroup(newValue);
-                                            formik.setFieldValue("gazetteGroup","")
-                                        }else{
-                                          props.setSelectedGazetteGroupInputType("");
-                                        }
-                                    }}
-                                    // sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
-                                    renderInput={(params) => <TextField {...params} placeholder=""/>}
-                                />
-                              </Grid>
-                          </Grid>
-                      </Grid>
-                    </Grid>:
-                    <Grid container direction="row" justifyContent="center" alignItems="center">
-                      <Grid item xs={12} md={5} lg={5} sx={{mb: 5,}}>
-                        <FormLabel sx={{fontSize: "20px", color:"#000000",textAlign:"center"}}>
-                            Are you really {status} the Application?
-                        </FormLabel>
-                      </Grid>
-                    </Grid>                  
-                  }
-                </DialogContentText>
-              </DialogContent>
-            </form>
-        </FormikProvider>
-        <Stack direction="row" justifyContent="space-around">
-          <DialogActions>
-            <Button variant="contained"  onClick={props.handleClose} autoFocus >
-              Cancel
-            </Button>
-          </DialogActions>
-          <DialogActions>
-            <Button variant="contained" color="success" onClick={acceptedHandle()} autoFocus disabled={Object.keys(props.selectedGazetteGroup).length === 0&&status==="Accept"}>
-              {status==="Accept"?"Confirm":status}
-            </Button>
-          </DialogActions>
-        </Stack>
-      </Dialog>
+        </Grid>
+      </DialogTitle>
+      <FormikProvider value={formik}>
+        <form>
+          <DialogContent>
+            <DialogContentText>
+              {content}
+            </DialogContentText>
+          </DialogContent>
+        </form>
+      </FormikProvider>
+      <Stack direction="row" justifyContent="space-around">
+        <DialogActions>
+          <Button variant="contained" onClick={props.handleClose} autoFocus >
+            Cancel
+          </Button>
+        </DialogActions>
+        <DialogActions>
+          <Button variant="contained" color="success" onClick={acceptedHandle()} autoFocus disabled={Object.keys(props.selectedGazetteGroup).length === 0 && status === "Accept"}>
+            {prositiveBtnText}
+          </Button>
+        </DialogActions>
+      </Stack>
+    </Dialog>
   );
 };
 

src/pages/PublicNoticeDetail_GLD/index.js

@@ -1,7 +1,7 @@
 import {
   useEffect,
   useState
-  } from "react";
+} from "react";
 
 // material-ui
 import {
@@ -17,7 +17,7 @@ import {
   useParams
 } from "react-router-dom";
 import axios from "axios";
-
+import * as HttpUtils from "utils/HttpUtils";
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
 const ApplicationDetailCard = Loadable(lazy(() => import('./ApplicationDetailCard')));
 const GazetteDetailCard = Loadable(lazy(() => import('./GazetteDetailCard')));
@@ -27,7 +27,7 @@ import {
   GET_PUBLIC_NOTICE_APPLY_DETAIL,
   UPDATE_PUBLIC_NOTICE_APPLY_DETAIL,
   SET_PUBLIC_NOTICE_STATUS_ACCEPTED,
-  SET_PUBLIC_NOTICE_STATUS_REJRCTED,
+  SET_PUBLIC_NOTICE_STATUS_NOT_ACCEPT,
   SET_PUBLIC_NOTICE_STATUS_COMPLATED,
   SET_PUBLIC_NOTICE_STATUS_WITHDRAW
 } from "utils/ApiPathConst";
@@ -42,24 +42,24 @@ const PublicNoticeDetail_GLD = () => {
   // const navigate = useNavigate()
   const [applicationDetailData, setApplicationDetailData] = useState({});
   // const [refApplicationDetailData, setRefApplicationDetailData] = React.useState({});
-  const [isLoading,setLoading] = useState(false);
+  const [isLoading, setLoading] = useState(false);
   const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent')));
-  
+
   //pageTitle
   const [appNo, setAapNo] = useState("");
   const [gazetteIssue, setGazetteIssue] = useState("");
-  const [issueDate,setIssueDate] = useState("");
-  const [issueNum,setIssueNum] = useState("");
+  const [issueDate, setIssueDate] = useState("");
+  const [issueNum, setIssueNum] = useState("");
   const [groupNo, setGroupNo] = useState("");
   // const [groupTitle, setGroupTitle] = useState("");
-  
+
   //statusWindow
   const [open, setOpen] = useState(false);
   const [getStatus, setStatus] = useState("");
   const [statusWindowAccepted, setStatusWindowAccepted] = useState(false);
   const [selectedGazetteGroup, setSelectedGazetteGroup] = useState({});
   const [selectedGazetteGroupInputType, setSelectedGazetteGroupInputType] = useState("");
-  
+
   //editMode
   const [updateApplicationObject, setUpdateApplicationObject] = useState({});
   const [editMode, isEditMode] = useState(false);
@@ -70,78 +70,78 @@ const PublicNoticeDetail_GLD = () => {
     backgroundImage: `url(${titleBackgroundImg})`,
     width: '100%',
     height: '100%',
-    backgroundSize:'contain',
+    backgroundSize: 'contain',
     backgroundRepeat: 'no-repeat',
     backgroundColor: '#0C489E',
     backgroundPosition: 'right'
   }
 
-  const title = groupNo!=null?("Application / "+appNo+", "+gazetteIssue+", "+issueNum+" , "+groupNo):("Application / "+appNo+", "+gazetteIssue+", "+issueNum)
+  const title = groupNo != null ? ("Application / " + appNo + ", " + gazetteIssue + ", " + issueNum + " , " + groupNo) : ("Application / " + appNo + ", " + gazetteIssue + ", " + issueNum)
 
   useEffect(() => {
-      loadApplicationDetail()
+    loadApplicationDetail()
   }, []);
-  
+
   // useEffect(() => {
   //   if (reload){
   //     loadApplicationDetail()
   //   }
   // }, [reload]);
-  
+
   useEffect(() => {
-      if(editMode&&isSave){
-        onUpdateClick(updateApplicationObject)
-      }
+    if (editMode && isSave) {
+      onUpdateClick(updateApplicationObject)
+    }
   }, [updateApplicationObject]);
-  
+
   const loadApplicationDetail = () => {
-    if(params.id > 0){
+    if (params.id > 0) {
       axios.get(`${GET_PUBLIC_NOTICE_APPLY_DETAIL}/${params.id}`)
-          .then((response) => {
-              if (response.status === 200) {
-                setApplicationDetailData(response.data);
-                const gazetteIssueDetail = response.data.gazetteIssueDetail;
-                setAapNo(response.data.data.appNo);
-                setGazetteIssue(gazetteIssueDetail.year +" Vol "+gazetteIssueDetail.volume);
-                setIssueNum(" No. "+gazetteIssueDetail.issueNo);
-                setIssueDate(DateUtils.dateFormat(gazetteIssueDetail.issueDate, "D MMM YYYY (ddd)"));
-                setGroupNo(response.data.data.groupNo);
-                setLoading(false);
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
+        .then((response) => {
+          if (response.status === 200) {
+            setApplicationDetailData(response.data);
+            const gazetteIssueDetail = response.data.gazetteIssueDetail;
+            setAapNo(response.data.data.appNo);
+            setGazetteIssue(gazetteIssueDetail.year + " Vol " + gazetteIssueDetail.volume);
+            setIssueNum(" No. " + gazetteIssueDetail.issueNo);
+            setIssueDate(DateUtils.dateFormat(gazetteIssueDetail.issueDate, "D MMM YYYY (ddd)"));
+            setGroupNo(response.data.data.groupNo);
+            setLoading(false);
+          }
+        })
+        .catch(error => {
+          console.log(error);
+          return false;
+        });
     }
   }
 
   const onUpdateClick = (updateApplicationObject) => {
     const data = updateApplicationObject.objectData
-    if(params.id > 0 ){
-        setLoading(true);
-        axios.post(`${UPDATE_PUBLIC_NOTICE_APPLY_DETAIL}/${params.id}`,
-          {
-            contactPerson:data.contactPerson,
-            contactFaxNo:data.contactFaxNo,
-            contactTelNo:data.contactTelNo,
+    if (params.id > 0) {
+      setLoading(true);
+      axios.post(`${UPDATE_PUBLIC_NOTICE_APPLY_DETAIL}/${params.id}`,
+        {
+          contactPerson: data.contactPerson,
+          contactFaxNo: data.contactFaxNo,
+          contactTelNo: data.contactTelNo,
+        }
+      )
+        .then((response) => {
+          if (response.status === 200) {
+            location.reload();
           }
-          )
-          .then((response) => {
-              if (response.status === 200) {
-                location.reload(); 
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
+        })
+        .catch(error => {
+          console.log(error);
+          return false;
+        });
     }
   };
 
   useEffect(() => {
     // console.log(getStatus)
-    if(getStatus!==""){
+    if (getStatus !== "") {
       setOpen(true)
     }
   }, [getStatus]);
@@ -159,99 +159,128 @@ const PublicNoticeDetail_GLD = () => {
   };
 
   useEffect(() => {
-    if(statusWindowAccepted){
-      if(getStatus == "accept"){
+    if (statusWindowAccepted) {
+      if (getStatus == "accept") {
         onAcceptedClick()
-      }else if (getStatus== "reject"){
-        onRejectedClick()
-      }else if (getStatus == "complete"){
+      } else if (getStatus == "reject") {
+        onNotAcceptClick()
+      } else if (getStatus == "complete") {
         onComplatedClick()
-      }else if (getStatus == "withdraw"){
+      } else if (getStatus == "withdraw") {
         onWithdrawnClick()
       }
     }
   }, [statusWindowAccepted]);
 
+  const onWindowCallback = (status, data) => {
+    if (status == "genGazetteCode") {
+      onAcceptedClick()
+    } else if (getStatus == "notAccepted") {
+      onNotAcceptClick(data.reason);
+    } else if (getStatus == "complete") {
+      onComplatedClick()
+    } else if (getStatus == "withdraw") {
+      onWithdrawnClick()
+    }
+  }
+
   const onAcceptedClick = () => {
-    if(params.id > 0 ){
-        axios.post(`${SET_PUBLIC_NOTICE_STATUS_ACCEPTED}/${params.id}`,
-          {
-            "groupTitle": selectedGazetteGroup.title,
-            "groupNo": selectedGazetteGroup.type,
+    if (params.id > 0) {
+      axios.post(`${SET_PUBLIC_NOTICE_STATUS_ACCEPTED}/${params.id}`,
+        {
+          "groupTitle": selectedGazetteGroup.title,
+          "groupNo": selectedGazetteGroup.type,
+        }
+      )
+        .then((response) => {
+          if (response.status === 204) {
+            setOpen(false);
+            handleClose();
+            location.reload();
           }
-        )
-          .then((response) => {
-              if (response.status === 204) {
-                setOpen(false);
-                handleClose();
-                location.reload(); 
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
+        })
+        .catch(error => {
+          console.log(error);
+          return false;
+        });
     }
   };
-  
-  const onRejectedClick = () => {
-    if(params.id > 0 ){
-        axios.get(`${SET_PUBLIC_NOTICE_STATUS_REJRCTED}/${params.id}`)
-          .then((response) => {
-              if (response.status === 204) {
-                setOpen(false);
-                handleClose();
-                location.reload(); 
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
-    }
-  };
-  
+
+  const onNotAcceptClick = (reason) => {
+    if (params.id <= 0) return;
+    HttpUtils.post({
+      url: `${SET_PUBLIC_NOTICE_STATUS_NOT_ACCEPT}/${params.id}`,
+      params: {
+        reason: reason
+      },
+      onSuccess: function () {
+        location.reload();
+      }
+    });
+    //   axios.get(`${SET_PUBLIC_NOTICE_STATUS_REJRCTED}/${params.id}`)
+    //     .then((response) => {
+    //       if (response.status === 204) {
+    //         setOpen(false);
+    //         handleClose();
+    //         location.reload();
+    //       }
+    //     })
+    //     .catch(error => {
+    //       console.log(error);
+    //       return false;
+    //     });
+    // }
+  }
+
   const onComplatedClick = () => {
-    if(params.id > 0 ){
-        axios.get(`${SET_PUBLIC_NOTICE_STATUS_COMPLATED}/${params.id}`)
-          .then((response) => {
-              if (response.status === 204) {
-                setOpen(false);
-                handleClose();
-                location.reload(); 
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
+    if (params.id > 0) {
+      axios.get(`${SET_PUBLIC_NOTICE_STATUS_COMPLATED}/${params.id}`)
+        .then((response) => {
+          if (response.status === 204) {
+            setOpen(false);
+            handleClose();
+            location.reload();
+          }
+        })
+        .catch(error => {
+          console.log(error);
+          return false;
+        });
     }
   };
-  
+
   const onWithdrawnClick = () => {
-    if(params.id > 0 ){
-        axios.get(`${SET_PUBLIC_NOTICE_STATUS_WITHDRAW}/${params.id}`)
-          .then((response) => {
-              if (response.status === 204) {
-                setOpen(false);
-                handleClose();
-                location.reload(); 
-              }
-          })
-          .catch(error => {
-              console.log(error);
-              return false;
-          });
+    if (params.id > 0) {
+      axios.get(`${SET_PUBLIC_NOTICE_STATUS_WITHDRAW}/${params.id}`)
+        .then((response) => {
+          if (response.status === 204) {
+            setOpen(false);
+            handleClose();
+            location.reload();
+          }
+        })
+        .catch(error => {
+          console.log(error);
+          return false;
+        });
     }
   };
 
   return (
-    <Grid container sx={{maxnHeight: '500vh',backgroundColor:'#ffffff'}} direction="column">
-      <StatusChangeDialog open={open} handleClose={handleClose} setStatusWindowAccepted={setStatusWindowAccepted}
-        getStatus={getStatus} issueDate={issueDate} issueNum={issueNum} gazetteIssue={gazetteIssue} 
-        selectedGazetteGroup={selectedGazetteGroup} setSelectedGazetteGroup={setSelectedGazetteGroup} 
-        selectedGazetteGroupInputType={selectedGazetteGroupInputType} setSelectedGazetteGroupInputType={setSelectedGazetteGroupInputType}
-        />
+    <Grid container sx={{ maxnHeight: '500vh', backgroundColor: '#ffffff' }} direction="column">
+      <StatusChangeDialog open={open}
+        handleClose={handleClose}
+        onWindowCallback={onWindowCallback}
+        setStatusWindowAccepted={setStatusWindowAccepted}
+        getStatus={getStatus}
+        issueDate={issueDate}
+        issueNum={issueNum}
+        gazetteIssue={gazetteIssue}
+        selectedGazetteGroup={selectedGazetteGroup}
+        setSelectedGazetteGroup={setSelectedGazetteGroup}
+        selectedGazetteGroupInputType={selectedGazetteGroupInputType}
+        setSelectedGazetteGroupInputType={setSelectedGazetteGroupInputType}
+      />
       <Grid item xs={12}>
         <div style={BackgroundHead}>
           <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
@@ -260,43 +289,43 @@ const PublicNoticeDetail_GLD = () => {
         </div>
       </Grid>
       <Grid item xs={12} >
-          <Stack direction="row" height='20px' justifyContent="flex-start" alignItems="center">
-            <Typography ml={4} mt={3} variant="h4">{title}</Typography>
-          </Stack>
+        <Stack direction="row" height='20px' justifyContent="flex-start" alignItems="center">
+          <Typography ml={4} mt={3} variant="h4">{title}</Typography>
+        </Stack>
       </Grid>
       <Grid item xs={12} >
         <Grid container direction="row">
           <Grid item xs={12} md={10}>
             <Grid container direction="column">
               <Grid item xs={12} md={10}>
-                <Box xs={12} ml={4} mt={3} sx={{ p: 2, border: '3px groove grey', borderRadius: '10px'}}>
-                  {isLoading&&editMode?
-                    <LoadingComponent/>:
-                    <ApplicationDetailCard 
-                    applicationDetailData={applicationDetailData}
-                    setStatus = {setStatus}
-                    // setReload = {setReload}
-                    setUpdateApplicationObject={setUpdateApplicationObject}
-                    isEditMode = {isEditMode}
-                    setiIsSave={setiIsSave}
+                <Box xs={12} ml={4} mt={3} sx={{ p: 2, border: '3px groove grey', borderRadius: '10px' }}>
+                  {isLoading && editMode ?
+                    <LoadingComponent /> :
+                    <ApplicationDetailCard
+                      applicationDetailData={applicationDetailData}
+                      setStatus={setStatus}
+                      // setReload = {setReload}
+                      setUpdateApplicationObject={setUpdateApplicationObject}
+                      isEditMode={isEditMode}
+                      setiIsSave={setiIsSave}
                     // isNewRecord={isNewRecord}
                     />
                   }
                 </Box>
               </Grid>
               <Grid item xs={12} md={10}>
-                <Box xs={12} ml={4} mt={1} sx={{ p: 2, border: '3px groove grey', borderRadius: '10px'}}>
-                  <GazetteDetailCard 
+                <Box xs={12} ml={4} mt={1} sx={{ p: 2, border: '3px groove grey', borderRadius: '10px' }}>
+                  <GazetteDetailCard
                     // updateUserObject={updateUserObject}
                     applicationDetailData={applicationDetailData}
-                    // isCollectData={isCollectData}
-                    // isNewRecord={isNewRecord}
+                  // isCollectData={isCollectData}
+                  // isNewRecord={isNewRecord}
                   />
                 </Box>
               </Grid>
               <Grid item xs={12} md={10}>
                 <Box xs={12} ml={4} mt={3}>
-                  <TabTableDetail applicationDetailData={applicationDetailData}/>
+                  <TabTableDetail applicationDetailData={applicationDetailData} />
                 </Box>
               </Grid>
             </Grid>
@@ -304,18 +333,18 @@ const PublicNoticeDetail_GLD = () => {
           <Grid item xs={12} md={2} lg={2}>
             <Grid container>
               <Grid item xs={12} md={12}>
-                <Box xs={12} md={12} ml={1} mt={3} mr={1} height='800px' sx={{ p: 2, border: '3px groove grey', borderRadius: '10px'}}>
-                  <ClientDetailCard 
+                <Box xs={12} md={12} ml={1} mt={3} mr={1} height='800px' sx={{ p: 2, border: '3px groove grey', borderRadius: '10px' }}>
+                  <ClientDetailCard
                     // updateUserObject={updateUserObject}
                     applicationDetailData={applicationDetailData}
-                    // isCollectData={isCollectData}
-                    // isNewRecord={isNewRecord}
+                  // isCollectData={isCollectData}
+                  // isNewRecord={isNewRecord}
                   />
                 </Box>
               </Grid>
             </Grid>
           </Grid>
-        </Grid>    
+        </Grid>
       </Grid>
     </Grid>
   );

src/themes/palette.js

@@ -52,7 +52,31 @@ const Palette = (mode) => {
       background: {
         paper: paletteColor.grey[0],
         default: paletteColor.grey.A50
-      }
+      },
+      ochre: {
+        main: '#E3D026',
+        light: '#E9DB5D',
+        dark: '#A29415',
+        contrastText: '#242105',
+      },
+      red: {
+        main: '#f05b5b',
+        light: '#ff5e5e',
+        dark: '#c91616',
+        contrastText: '#fff',
+      },
+      pink: {
+        main: '#ed138a',
+        light: '#ff5e5e',
+        dark: '#ba1c73',
+        contrastText: '#fff',
+      },
+      orange: {
+        main: '#ed9740',
+        light: '#ff5e5e',
+        dark: '#b0671e',
+        contrastText: '#fff',
+      },
     }
   });
 };

src/utils/ApiPathConst.js

@@ -59,7 +59,7 @@ export const POST_ADMIN_USER_REGISTER = apiPath+'/user/registry';
 export const DELETE_USER = apiPath+'/user';
 export const GET_PUBLIC_NOTICE_APPLY_DETAIL = apiPath+'/application/application-detail';
 export const SET_PUBLIC_NOTICE_STATUS_ACCEPTED = apiPath+'/application/application-detail-status-accepted';
-export const SET_PUBLIC_NOTICE_STATUS_REJRCTED = apiPath+'/application/application-detail-status-rejected';
+export const SET_PUBLIC_NOTICE_STATUS_NOT_ACCEPT = apiPath+'/application/application-detail-status-not-accept';
 export const SET_PUBLIC_NOTICE_STATUS_CANCELLED = apiPath+'/application/application-detail-status-cancelled';
 export const SET_PUBLIC_NOTICE_STATUS_COMPLATED = apiPath+'/application/application-detail-status-complated';
 export const SET_PUBLIC_NOTICE_STATUS_WITHDRAW = apiPath+'/application/application-detail-status-withdrawn';