change date search

src/pages/DemandNote/Search_Public/SearchForm.js

@@ -132,7 +132,7 @@ const SearchDemandNoteForm = ({ applySearch, searchCriteria, issueComboData
             sentDateTo: sentDateTo,
             status: (selectedStatus?.type && selectedStatus?.type != 'all') ? selectedStatus?.type : "",
         };
-        console.log(temp)
+        // console.log(temp)
         applySearch(temp);
     };
 
@@ -276,7 +276,8 @@ const SearchDemandNoteForm = ({ applySearch, searchCriteria, issueComboData
                                     shrink: true
                                 }}
                                 {...register("dateTo")}
-                                InputProps={{ inputComponent: ToDateInputComponent,
+                                InputProps={{ 
+                                    inputComponent: ToDateInputComponent,
                                     inputProps: { min: minDate }
                                 }}
                                 onChange={(newValue) => {

src/pages/Payment/Search_Public/SearchForm.js

@@ -14,8 +14,24 @@ import * as ComboData from "utils/ComboData";
 import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
 import {ThemeProvider} from "@emotion/react";
 import {FormattedMessage, useIntl} from "react-intl";
+import { makeStyles } from '@mui/styles';
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
-
+const useStyles = makeStyles(() => ({
+    root: {
+      position: "relative"
+    },
+    display: {
+      position: "absolute",
+      top: 2,
+      left: 12,
+      bottom: 2,
+      background: "white",
+      pointerEvents: "none",
+      right: 50,
+      display: "flex",
+      alignItems: "center"
+    },
+  }));
 
 const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
     const intl = useIntl();
@@ -23,6 +39,68 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
     const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
     const [status, setStatus] = React.useState(ComboData.paymentStatus[0]);
 
+    const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy");
+    const [toDateValue, setToDateValue] = React.useState("dd / mm / yyyy");
+
+    React.useEffect(() => {
+        // console.log(minDate)
+        const dateFrom = DateUtils.dateValue(new Date().setDate(new Date().getDate()-14))
+        if (minDate != dateFrom){
+            setFromDateValue(minDate);
+        }
+    }, [minDate]);
+    
+    React.useEffect(() => {
+        const dateTo = DateUtils.dateValue(new Date())
+        if (maxDate != dateTo){
+            setToDateValue(maxDate);
+        }
+    }, [maxDate]);
+
+    function FormDateInputComponent({inputRef, ...props }) {
+        const classes = useStyles();
+        return (
+            <>
+            <div className={classes.display}>
+                {DateUtils.dateStr(fromDateValue)=="Invalid Date"?
+                    fromDateValue
+                :
+                    DateUtils.dateStr(fromDateValue)}
+            </div>
+            <input
+                // className={classes.input}
+                ref={inputRef}
+                {...props}
+                // onChange={handleChange}
+                value={fromDateValue}
+                max= {maxDate}
+            />
+            </>
+        );
+    }
+
+    function ToDateInputComponent({inputRef, ...props }) {
+        const classes = useStyles();
+        return (
+            <>
+            <div className={classes.display}>
+                {DateUtils.dateStr(toDateValue)=="Invalid Date"?
+                    toDateValue
+                :
+                    DateUtils.dateStr(toDateValue)}
+            </div>
+            <input
+                // className={classes.input}
+                ref={inputRef}
+                {...props}
+                // onChange={handleChange}
+                value={toDateValue}
+                min = {minDate}
+            />
+            </>
+        );
+    }
+
     const _sx = {
         padding: "4 2 4 2",
         boxShadow: 1,
@@ -42,17 +120,27 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
     const { reset, register, handleSubmit } = useForm()
 
     const onSubmit = (data) => {
+        let sentDateFrom = "";
+        let sentDateTo = "";
+        if( fromDateValue!="dd / mm / yyyy"&&toDateValue!="dd / mm / yyyy"){
+            sentDateFrom = DateUtils.dateValue(fromDateValue)
+            sentDateTo = DateUtils.dateValue(toDateValue)
+        }
         const temp = {
             code: data.code,
             transNo: data.transNo,
-            dateFrom: data.dateFrom,
-            dateTo: data.dateTo,
+            dateFrom: sentDateFrom,
+            dateTo: sentDateTo,
             status : (status?.type && status?.type != 'all') ? status?.type : "",
         };
         applySearch(temp);
     };
 
     function resetForm() {
+        setMinDate(DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)))
+        setMaxDate(DateUtils.dateValue(new Date()))
+        setFromDateValue("dd / mm / yyyy")
+        setToDateValue("dd / mm / yyyy")
         reset();
     }
 
@@ -100,9 +188,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                                     type="date"
                                     label={intl.formatMessage({id: 'payDateFrom'})}
                                     defaultValue={searchCriteria.dateFrom}
-                                    InputProps={{ inputProps: { max: maxDate } }}
+                                    InputProps={{
+                                        inputComponent: FormDateInputComponent,
+                                    }}
                                     onChange={(newValue) => {
-                                        setMinDate(DateUtils.dateValue(newValue));
+                                        setMinDate(newValue.target.value);
                                     }}
                                     InputLabelProps={{
                                         shrink: true
@@ -117,9 +207,11 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
                                         shrink: true
                                     }}
                                     {...register("dateTo")}
-                                    InputProps={{ inputProps: { min: minDate } }}
+                                    InputProps={{
+                                        inputComponent: ToDateInputComponent,
+                                    }}
                                     onChange={(newValue) => {
-                                        setMaxDate(DateUtils.dateValue(newValue));
+                                        setMaxDate(newValue.target.value);
                                     }}
                                     id="dateTo"
                                     type="date"

src/pages/User/DetailsPage_Individual/index.js

@@ -118,6 +118,7 @@ const UserMaintainPage_Individual = () => {
                     response.data["preferLocale"] = getObjectByType(ComboData.Locale, "type", response.data?.preferLocale);
                     // console.log(response.data)
                     setFormData(response.data);
+                    setLoding(false);
                 }
             });
         }

src/pages/User/DetailsPage_Organization/index.js

@@ -177,6 +177,7 @@ const UserMaintainPage_Organization = () => {
                     //response.data["orgId"] = response.data.brExpiryDate?DateUtils.dateValue(response.data.brExpiryDate):"";
                     setUserData(response.data);
                     setOrgData(response.orgList);
+                    setLoding(false);
                     // console.log(response.data)
                 }
             });

src/translations/zh-CN.json

@@ -2,7 +2,7 @@
   "en": "English",
   "zh-HK": "繁體中文",
   "zh-CN": "简体中文",
-  "language":"語言",
+  "language":"语言",
 
   "PNSPS": "公共启事提交及缴费系统",
   "HKSARGOV": "香港特别行政区政府",