diff --git a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js index 99655bb..0f442e1 100644 --- a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js +++ b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js @@ -23,6 +23,20 @@ import {DemoItem} from "@mui/x-date-pickers/internals/demo"; import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider"; import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs"; +const getDefaultDateFrom = () => DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14)); +const getDefaultDateTo = () => DateUtils.dateValue(new Date()); + +const isSubmitDateEmpty = (value) => + value == null || value === "" || value === "dd / mm / yyyy"; + +const isBlank = (value) => value == null || String(value).trim() === ""; + +const toDayjsOrNull = (value) => { + if (isSubmitDateEmpty(value)) return null; + const d = dayjs(value); + return d.isValid() ? d : null; +}; + // ==============================|| DASHBOARD - DEFAULT ||============================== // const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => { const intl = useIntl(); @@ -33,9 +47,19 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy"); const [toDateValue, setToDateValue] = React.useState("dd / mm / yyyy"); + const prevHasOtherRef = React.useRef(null); // const [selectedLabelsString, setSelectedLabelsString] = React.useState(''); - const { reset, register, handleSubmit } = useForm() + const { reset, register, handleSubmit, watch } = useForm({ + defaultValues: { + appNo: searchCriteria.appNo || "", + careOf: searchCriteria.careOf || "", + contact: searchCriteria.contact || "" + } + }); + const appNo = watch("appNo"); + const careOf = watch("careOf"); + const contact = watch("contact"); const marginBottom = 2.5; React.useEffect(() => { @@ -70,6 +94,38 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => setToDateValue(maxDate); }, [maxDate]); + const clearSubmitDates = () => { + setMinDate(null); + setMaxDate(null); + }; + + const restoreDefaultSubmitDates = () => { + setMinDate(getDefaultDateFrom()); + setMaxDate(getDefaultDateTo()); + }; + + const hasOtherCriteria = (textFields = {}) => { + if (!isBlank(textFields.appNo)) return true; + if (!isBlank(textFields.contact)) return true; + if (!isBlank(textFields.careOf)) return true; + if (status?.type && status.type !== "all" && status.type !== "") return true; + return false; + }; + + React.useEffect(() => { + const hasOther = hasOtherCriteria({ appNo, contact, careOf }); + if (prevHasOtherRef.current === null) { + prevHasOtherRef.current = hasOther; + return; + } + if (hasOther && !prevHasOtherRef.current) { + clearSubmitDates(); + } else if (!hasOther && prevHasOtherRef.current) { + restoreDefaultSubmitDates(); + } + prevHasOtherRef.current = hasOther; + }, [appNo, contact, careOf, status]); + const onSubmit = (data) => { data.status = status.type; let typeArray = []; @@ -80,9 +136,24 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => typeArray.push(type[i].label); } - if (fromDateValue != "dd / mm / yyyy" && toDateValue != "dd / mm / yyyy") { - sentDateFrom = DateUtils.dateValue(fromDateValue) - sentDateTo = DateUtils.dateValue(toDateValue) + const hasOther = hasOtherCriteria({ + appNo: data.appNo, + contact: data.contact, + careOf: data.careOf + }); + const datesEmpty = isSubmitDateEmpty(fromDateValue) || isSubmitDateEmpty(toDateValue) + || minDate == null || maxDate == null; + + if (!hasOther && datesEmpty) { + const dateFrom = getDefaultDateFrom(); + const dateTo = getDefaultDateTo(); + setMinDate(dateFrom); + setMaxDate(dateTo); + sentDateFrom = dateFrom; + sentDateTo = dateTo; + } else if (!datesEmpty) { + sentDateFrom = DateUtils.dateValue(fromDateValue); + sentDateTo = DateUtils.dateValue(toDateValue); } const temp = { @@ -105,8 +176,8 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => function resetForm() { setType([]); setStatus(localStorage.getItem('userData').creditor?ComboData.publicNoticeStatic_Creditor[0]:ComboData.publicNoticeStatic[0]); - const dateFrom = DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14)); - const dateTo = DateUtils.dateValue(new Date()); + const dateFrom = getDefaultDateFrom(); + const dateTo = getDefaultDateTo(); setMinDate(dateFrom); setMaxDate(dateTo); reset({ @@ -114,6 +185,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => careOf: "", contact: "" }); + prevHasOtherRef.current = false; localStorage.setItem('searchCriteria', ""); // Reset form criteria and sorting first, then reload with backend default sort applySearch({ @@ -161,23 +233,22 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => setReceiptFromError(newError)} + onError={() => {}} slotProps={{ - field: { readOnly: true, }, - // textField: { - // helperText: receiptFromErrorMessage, - // }, + field: { readOnly: true, clearable: true }, + textField: { + InputLabelProps: { shrink: true }, + error: false, + helperText: null + }, }} format="DD/MM/YYYY" aria-label={intl.formatMessage({id: 'submitDateFrom'})} label={intl.formatMessage({id: 'submitDateFrom'})} - value={minDate === null ? null : dayjs(minDate)} - maxDate={maxDate === null ? null : dayjs(maxDate)} + value={toDayjsOrNull(minDate)} + maxDate={toDayjsOrNull(maxDate)} onChange={(newValue) => { - // console.log(newValue) - if(newValue!=null){ - setMinDate(newValue); - } + setMinDate(newValue && newValue.isValid?.() ? newValue : null); }} /> @@ -189,22 +260,21 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, onGridReady }) => setReceiptFromError(newError)} + onError={() => {}} slotProps={{ - field: { readOnly: true, }, - // textField: { - // helperText: receiptFromErrorMessage, - // }, + field: { readOnly: true, clearable: true }, + textField: { + InputLabelProps: { shrink: true }, + error: false, + helperText: null + }, }} format="DD/MM/YYYY" label={intl.formatMessage({id: 'submitDateTo'})} - value={maxDate === null ? null : dayjs(maxDate)} - minDate={minDate === null ? null : dayjs(minDate)} + value={toDayjsOrNull(maxDate)} + minDate={toDayjsOrNull(minDate)} onChange={(newValue) => { - // console.log(newValue) - if(newValue!=null){ - setMaxDate(newValue); - } + setMaxDate(newValue && newValue.isValid?.() ? newValue : null); }} /> diff --git a/src/pages/PublicNotice/Search_GLD/SearchForm.js b/src/pages/PublicNotice/Search_GLD/SearchForm.js index 2d26630..135153b 100644 --- a/src/pages/PublicNotice/Search_GLD/SearchForm.js +++ b/src/pages/PublicNotice/Search_GLD/SearchForm.js @@ -21,6 +21,21 @@ import dayjs from "dayjs"; import {DemoItem} from "@mui/x-date-pickers/internals/demo"; import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider"; import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs"; + +const getDefaultDateFrom = () => DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14)); +const getDefaultDateTo = () => DateUtils.dateValue(new Date()); + +const isSubmitDateEmpty = (value) => + value == null || value === "" || value === "dd / mm / yyyy"; + +const isBlank = (value) => value == null || String(value).trim() === ""; + +const toDayjsOrNull = (value) => { + if (isSubmitDateEmpty(value)) return null; + const d = dayjs(value); + return d.isValid() ? d : null; +}; + // ==============================|| DASHBOARD - DEFAULT ||============================== // const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, onGridReady }) => { @@ -37,6 +52,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy"); const [toDateValue, setToDateValue] = React.useState("dd / mm / yyyy"); + const prevHasOtherRef = React.useRef(null); React.useEffect(() => { if(searchCriteria.status!=undefined){ @@ -64,7 +80,53 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o const { locale } = intl; const marginBottom = 2.5; - const { reset, register, handleSubmit } = useForm() + const { reset, register, handleSubmit, watch } = useForm({ + defaultValues: { + appNo: searchCriteria.appNo || "", + contact: searchCriteria.contact || "", + groupNo: searchCriteria.groupNo || "" + } + }); + const appNo = watch("appNo"); + const contact = watch("contact"); + const groupNo = watch("groupNo"); + + const clearSubmitDates = () => { + setMinDate(null); + setMaxDate(null); + }; + + const restoreDefaultSubmitDates = () => { + setMinDate(getDefaultDateFrom()); + setMaxDate(getDefaultDateTo()); + }; + + const hasOtherCriteria = (textFields = {}) => { + if (!isBlank(textFields.appNo)) return true; + if (!isBlank(textFields.contact)) return true; + if (!isBlank(textFields.groupNo)) return true; + if (groupSelected?.title) return true; + if (orgSelected?.key && orgSelected.key > 0) return true; + if (issueSelected?.id) return true; + if (selectedStatus?.type && selectedStatus.type !== "all" && selectedStatus.type !== "") return true; + if (selectedMode?.type && selectedMode.type !== "all" && selectedMode.type !== "") return true; + return false; + }; + + React.useEffect(() => { + const hasOther = hasOtherCriteria({ appNo, contact, groupNo }); + if (prevHasOtherRef.current === null) { + prevHasOtherRef.current = hasOther; + return; + } + if (hasOther && !prevHasOtherRef.current) { + clearSubmitDates(); + } else if (!hasOther && prevHasOtherRef.current) { + restoreDefaultSubmitDates(); + } + prevHasOtherRef.current = hasOther; + }, [appNo, contact, groupNo, groupSelected, orgSelected, issueSelected, selectedStatus, selectedMode]); + const onSubmit = (data) => { // localStorage.setItem('searchCriteria',"") data.status = selectedStatus?.type @@ -76,10 +138,25 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o for (let i = 0; i < type.length; i++) { typeArray.push(type[i].label); } - - if (fromDateValue != "dd / mm / yyyy" && toDateValue != "dd / mm / yyyy") { - sentDateFrom = DateUtils.dateValue(fromDateValue) - sentDateTo = DateUtils.dateValue(toDateValue) + + const hasOther = hasOtherCriteria({ + appNo: data.appNo, + contact: data.contact, + groupNo: data.groupNo + }); + const datesEmpty = isSubmitDateEmpty(fromDateValue) || isSubmitDateEmpty(toDateValue) + || minDate == null || maxDate == null; + + if (!hasOther && datesEmpty) { + const dateFrom = getDefaultDateFrom(); + const dateTo = getDefaultDateTo(); + setMinDate(dateFrom); + setMaxDate(dateTo); + sentDateFrom = dateFrom; + sentDateTo = dateTo; + } else if (!datesEmpty) { + sentDateFrom = DateUtils.dateValue(fromDateValue); + sentDateTo = DateUtils.dateValue(toDateValue); } const temp = { @@ -121,8 +198,8 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o setGroupSelected({}); setSelectedStatus({key: 0, label: 'All', type: 'all'}); setSelectedMode({key: 0, label: 'All', type: 'all'}); - const dateFrom = DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14)); - const dateTo = DateUtils.dateValue(new Date()); + const dateFrom = getDefaultDateFrom(); + const dateTo = getDefaultDateTo(); setMinDate(dateFrom); setMaxDate(dateTo); reset({ @@ -130,6 +207,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o contact:"", groupNo:"" }); + prevHasOtherRef.current = false; localStorage.setItem('searchCriteria',""); // Reset form criteria and sorting first, then reload with backend default sort applySearch({ @@ -209,22 +287,21 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o setReceiptFromError(newError)} + onError={() => {}} slotProps={{ - field: { readOnly: true, }, - // textField: { - // helperText: receiptFromErrorMessage, - // }, + field: { readOnly: true, clearable: true }, + textField: { + InputLabelProps: { shrink: true }, + error: false, + helperText: null + }, }} format="DD/MM/YYYY" label={"Submit Date (From)"} - value={minDate === null ? null : dayjs(minDate)} - maxDate={maxDate === null ? null : dayjs(maxDate)} + value={toDayjsOrNull(minDate)} + maxDate={toDayjsOrNull(maxDate)} onChange={(newValue) => { - // console.log(newValue) - if(newValue!=null){ - setMinDate(newValue); - } + setMinDate(newValue && newValue.isValid?.() ? newValue : null); }} /> @@ -236,22 +313,21 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria, issueComboData, o setReceiptFromError(newError)} + onError={() => {}} slotProps={{ - field: { readOnly: true, }, - // textField: { - // helperText: receiptFromErrorMessage, - // }, + field: { readOnly: true, clearable: true }, + textField: { + InputLabelProps: { shrink: true }, + error: false, + helperText: null + }, }} format="DD/MM/YYYY" label={"Submit Date (To)"} - value={maxDate === null ? null : dayjs(maxDate)} - minDate={minDate === null ? null : dayjs(minDate)} + value={toDayjsOrNull(maxDate)} + minDate={toDayjsOrNull(minDate)} onChange={(newValue) => { - // console.log(newValue) - if(newValue!=null){ - setMaxDate(newValue); - } + setMaxDate(newValue && newValue.isValid?.() ? newValue : null); }} />