@@ -9,13 +9,17 @@ import MainCard from "components/MainCard"; | |||||
import { useForm } from "react-hook-form"; | import { useForm } from "react-hook-form"; | ||||
import * as React from "react"; | import * as React from "react"; | ||||
import * as ComboData from "utils/ComboData"; | import * as ComboData from "utils/ComboData"; | ||||
import * as DateUtils from "utils/DateUtils"; | |||||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | // ==============================|| DASHBOARD - DEFAULT ||============================== // | ||||
const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => { | |||||
const [type, setType] = React.useState([]); | const [type, setType] = React.useState([]); | ||||
const [status, setStatus] = React.useState(); | |||||
const [status, setStatus] = React.useState({ key: 0, label: '全部', type: 'all' }); | |||||
const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom); | |||||
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); | |||||
const { reset, register, handleSubmit } = useForm() | const { reset, register, handleSubmit } = useForm() | ||||
const onSubmit = (data) => { | const onSubmit = (data) => { | ||||
@@ -31,14 +35,14 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
dateFrom: data.dateFrom, | dateFrom: data.dateFrom, | ||||
dateTo: data.dateTo, | dateTo: data.dateTo, | ||||
contact: data.contact, | contact: data.contact, | ||||
status: status?.type, | |||||
status: (status?.type&&status?.type!= 'all')?status?.type:"", | |||||
}; | }; | ||||
applySearch(temp); | applySearch(temp); | ||||
}; | }; | ||||
function resetForm() { | function resetForm() { | ||||
setType([]); | setType([]); | ||||
setStatus(); | |||||
setStatus({ key: 0, label: '全部', type: 'all' }); | |||||
reset(); | reset(); | ||||
} | } | ||||
@@ -63,6 +67,10 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
{...register("appNo")} | {...register("appNo")} | ||||
id='appNo' | id='appNo' | ||||
label="申請編號" | label="申請編號" | ||||
defaultValue={searchCriteria.appNo} | |||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -73,6 +81,11 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
id="dateFrom" | id="dateFrom" | ||||
type="date" | type="date" | ||||
label="提交日期(從)" | label="提交日期(從)" | ||||
defaultValue={searchCriteria.dateFrom} | |||||
InputProps={{inputProps: { max: maxDate} }} | |||||
onChange={(newValue)=>{ | |||||
setMinDate(DateUtils.dateStr(newValue)); | |||||
}} | |||||
InputLabelProps={{ | InputLabelProps={{ | ||||
shrink: true | shrink: true | ||||
}} | }} | ||||
@@ -89,6 +102,11 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
id="dateTo" | id="dateTo" | ||||
type="date" | type="date" | ||||
label="提交日期(到)" | label="提交日期(到)" | ||||
defaultValue={searchCriteria.dateTo} | |||||
InputProps={{inputProps: { min: minDate} }} | |||||
onChange={(newValue)=>{ | |||||
setMaxDate(DateUtils.dateStr(newValue)); | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -98,6 +116,10 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
{...register("contact")} | {...register("contact")} | ||||
id="contact" | id="contact" | ||||
label="聯絡人" | label="聯絡人" | ||||
defaultValue={searchCriteria.contact} | |||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -106,8 +128,10 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
{...register("status")} | {...register("status")} | ||||
disablePortal | disablePortal | ||||
id="status" | id="status" | ||||
filterOptions={(options)=>options} | |||||
options={ComboData.publicNoticeStatic} | options={ComboData.publicNoticeStatic} | ||||
value={status} | |||||
values={status} | |||||
inputValue={status?.label} | |||||
onChange={(event, newValue) => { | onChange={(event, newValue) => { | ||||
if (newValue !== null) { | if (newValue !== null) { | ||||
setStatus(newValue); | setStatus(newValue); | ||||
@@ -118,6 +142,9 @@ const SearchPublicNoticeForm = ({ applySearch }) => { | |||||
label="狀態" | label="狀態" | ||||
/> | /> | ||||
)} | )} | ||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
{/*<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>*/} | {/*<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>*/} | ||||
@@ -6,6 +6,7 @@ import MainCard from "components/MainCard"; | |||||
import {GET_PUBLIC_NOTICE_LIST} from "utils/ApiPathConst"; | import {GET_PUBLIC_NOTICE_LIST} from "utils/ApiPathConst"; | ||||
import * as React from "react"; | import * as React from "react"; | ||||
import * as HttpUtils from "utils/HttpUtils"; | import * as HttpUtils from "utils/HttpUtils"; | ||||
import * as DateUtils from "utils/DateUtils"; | |||||
import Loadable from 'components/Loadable'; | import Loadable from 'components/Loadable'; | ||||
const SearchForm = Loadable(React.lazy(() => import('./SearchPublicNoticeForm'))); | const SearchForm = Loadable(React.lazy(() => import('./SearchPublicNoticeForm'))); | ||||
@@ -16,7 +17,10 @@ const EventTable = Loadable(React.lazy(() => import('./SearchPublicNoticeTable') | |||||
const UserSearchPage_Individual = () => { | const UserSearchPage_Individual = () => { | ||||
const [record,setRecord] = React.useState([]); | const [record,setRecord] = React.useState([]); | ||||
const [searchCriteria, setSearchCriteria] = React.useState({}); | |||||
const [searchCriteria, setSearchCriteria] = React.useState({ | |||||
dateTo: DateUtils.dateStr(new Date()), | |||||
dateFrom: DateUtils.dateStr(new Date().setDate(new Date().getDate()-14)), | |||||
}); | |||||
React.useEffect(() => { | React.useEffect(() => { | ||||
getUserList(); | getUserList(); | ||||
@@ -44,7 +48,10 @@ const UserSearchPage_Individual = () => { | |||||
<Grid container rowSpacing={4.5} columnSpacing={2.75}> | <Grid container rowSpacing={4.5} columnSpacing={2.75}> | ||||
{/*row 1*/} | {/*row 1*/} | ||||
<Grid item xs={12} md={12} lg={12}> | <Grid item xs={12} md={12} lg={12}> | ||||
<SearchForm applySearch={applySearch}/> | |||||
<SearchForm | |||||
applySearch={applySearch} | |||||
searchCriteria={searchCriteria} | |||||
/> | |||||
</Grid> | </Grid> | ||||
{/*row 2*/} | {/*row 2*/} | ||||
<Grid item xs={12} md={12} lg={12}> | <Grid item xs={12} md={12} lg={12}> | ||||
@@ -80,7 +80,7 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
id: 'status', | id: 'status', | ||||
field: 'status', | field: 'status', | ||||
headerName: 'Status', | headerName: 'Status', | ||||
width: 100, | |||||
width: 150, | |||||
renderCell: (params) => { | renderCell: (params) => { | ||||
return [StatusUtils.getStatusEng(params)] | return [StatusUtils.getStatusEng(params)] | ||||
}, | }, | ||||
@@ -113,6 +113,8 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
autoHeight | autoHeight | ||||
sx={{ | sx={{ | ||||
paddingLeft: 4, | |||||
paddingRight: 4, | |||||
boxShadow: 1, | boxShadow: 1, | ||||
border: 1, | border: 1, | ||||
borderColor: '#DDD', | borderColor: '#DDD', | ||||
@@ -9,17 +9,20 @@ import MainCard from "components/MainCard"; | |||||
import { useForm } from "react-hook-form"; | import { useForm } from "react-hook-form"; | ||||
import * as React from "react"; | import * as React from "react"; | ||||
import * as ComboData from "utils/ComboData"; | import * as ComboData from "utils/ComboData"; | ||||
import * as DateUtils from "utils/DateUtils"; | |||||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | // ==============================|| DASHBOARD - DEFAULT ||============================== // | ||||
const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria }) => { | |||||
const [type, setType] = React.useState([]); | const [type, setType] = React.useState([]); | ||||
const [status, setStatus] = React.useState(); | |||||
const [orgLabel, setOrgLabel] = React.useState(); | |||||
const [orgId, setOrgId] = React.useState(); | |||||
const [status, setStatus] = React.useState({ key: 0, label: 'All', type: 'all' }); | |||||
const [orgSelected, setOrgSelected] = React.useState({}); | |||||
const [orgCombo, setOrgCombo] = React.useState(); | const [orgCombo, setOrgCombo] = React.useState(); | ||||
const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom); | |||||
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); | |||||
const { reset, register, handleSubmit } = useForm() | const { reset, register, handleSubmit } = useForm() | ||||
const onSubmit = (data) => { | const onSubmit = (data) => { | ||||
@@ -35,8 +38,8 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
dateFrom: data.dateFrom, | dateFrom: data.dateFrom, | ||||
dateTo: data.dateTo, | dateTo: data.dateTo, | ||||
contact: data.contact, | contact: data.contact, | ||||
status: status?.type, | |||||
orgId: orgId?.key, | |||||
status: (status?.type&&status?.type!= 'all')?status?.type:"", | |||||
orgId: (orgSelected?.key&&orgSelected?.key>0)?orgSelected?.key:"", | |||||
}; | }; | ||||
applySearch(temp); | applySearch(temp); | ||||
}; | }; | ||||
@@ -49,10 +52,8 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
function resetForm() { | function resetForm() { | ||||
setType([]); | setType([]); | ||||
setStatus(); | |||||
setOrgId(); | |||||
setOrgLabel(""); | |||||
//orgComboRef.current.clearValue(); | |||||
setStatus({ key: 0, label: 'All', type: 'all' }); | |||||
setOrgSelected({}); | |||||
reset(); | reset(); | ||||
} | } | ||||
@@ -77,6 +78,10 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
{...register("appNo")} | {...register("appNo")} | ||||
id='appNo' | id='appNo' | ||||
label="App No." | label="App No." | ||||
defaultValue={searchCriteria.appNo} | |||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -87,6 +92,11 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
id="dateFrom" | id="dateFrom" | ||||
type="date" | type="date" | ||||
label="Submit Date(From)" | label="Submit Date(From)" | ||||
defaultValue={searchCriteria.dateFrom} | |||||
InputProps={{inputProps: { max: maxDate} }} | |||||
onChange={(newValue)=>{ | |||||
setMinDate(DateUtils.dateStr(newValue)); | |||||
}} | |||||
InputLabelProps={{ | InputLabelProps={{ | ||||
shrink: true | shrink: true | ||||
}} | }} | ||||
@@ -100,9 +110,14 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
shrink: true | shrink: true | ||||
}} | }} | ||||
{...register("dateTo")} | {...register("dateTo")} | ||||
InputProps={{inputProps: { min: minDate} }} | |||||
onChange={(newValue)=>{ | |||||
setMaxDate(DateUtils.dateStr(newValue)); | |||||
}} | |||||
id="dateTo" | id="dateTo" | ||||
type="date" | type="date" | ||||
label="Submit Date(To)" | label="Submit Date(To)" | ||||
defaultValue={searchCriteria.dateTo} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -112,7 +127,12 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
{...register("contact")} | {...register("contact")} | ||||
id="contact" | id="contact" | ||||
label="Conact Person" | label="Conact Person" | ||||
defaultValue={searchCriteria.contact} | |||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}> | <Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}> | ||||
@@ -120,8 +140,10 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
{...register("status")} | {...register("status")} | ||||
disablePortal | disablePortal | ||||
id="status" | id="status" | ||||
filterOptions={(options)=>options} | |||||
options={ComboData.publicNoticeStaticEng} | options={ComboData.publicNoticeStaticEng} | ||||
value={status} | value={status} | ||||
inputValue={status?.label} | |||||
onChange={(event, newValue) => { | onChange={(event, newValue) => { | ||||
if (newValue !== null) { | if (newValue !== null) { | ||||
setStatus(newValue); | setStatus(newValue); | ||||
@@ -132,6 +154,9 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
label="Status" | label="Status" | ||||
/> | /> | ||||
)} | )} | ||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
@@ -143,20 +168,22 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData }) => { | |||||
disablePortal | disablePortal | ||||
id="orgId" | id="orgId" | ||||
options={orgCombo} | options={orgCombo} | ||||
inputValue={orgLabel} | |||||
value={orgSelected} | |||||
inputValue={(orgSelected?.label)?orgSelected?.label: ""} | |||||
onChange={(event, newValue) => { | onChange={(event, newValue) => { | ||||
if (newValue !== null) { | if (newValue !== null) { | ||||
setOrgId(newValue); | |||||
setOrgLabel(newValue.label); | |||||
} else { | |||||
setOrgLabel(""); | |||||
setOrgSelected(newValue); | |||||
} | } | ||||
}} | }} | ||||
renderInput={(params) => ( | renderInput={(params) => ( | ||||
<TextField {...params} | <TextField {...params} | ||||
label="Organization" | label="Organization" | ||||
InputLabelProps={{ | |||||
shrink: true | |||||
}} | |||||
/> | /> | ||||
)} | )} | ||||
/> | /> | ||||
</Grid> | </Grid> | ||||
: <></> | : <></> | ||||
@@ -6,6 +6,7 @@ import MainCard from "components/MainCard"; | |||||
import * as UrlUtils from "utils/ApiPathConst"; | import * as UrlUtils from "utils/ApiPathConst"; | ||||
import * as React from "react"; | import * as React from "react"; | ||||
import * as HttpUtils from "utils/HttpUtils"; | import * as HttpUtils from "utils/HttpUtils"; | ||||
import * as DateUtils from "utils/DateUtils"; | |||||
import Loadable from 'components/Loadable'; | import Loadable from 'components/Loadable'; | ||||
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent'))); | const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent'))); | ||||
@@ -18,7 +19,10 @@ const UserSearchPage_Individual = () => { | |||||
const [record,setRecord] = React.useState([]); | const [record,setRecord] = React.useState([]); | ||||
const [orgCombo,setOrgCombo] = React.useState([]); | const [orgCombo,setOrgCombo] = React.useState([]); | ||||
const [searchCriteria, setSearchCriteria] = React.useState({}); | |||||
const [searchCriteria, setSearchCriteria] = React.useState({ | |||||
dateTo: DateUtils.dateStr(new Date()), | |||||
dateFrom: DateUtils.dateStr(new Date().setDate(new Date().getDate()-14)), | |||||
}); | |||||
const [onReady, setOnReady] = React.useState(false); | const [onReady, setOnReady] = React.useState(false); | ||||
React.useEffect(() => { | React.useEffect(() => { | ||||
@@ -68,6 +72,7 @@ const UserSearchPage_Individual = () => { | |||||
<SearchForm | <SearchForm | ||||
applySearch={applySearch} | applySearch={applySearch} | ||||
orgComboData={orgCombo} | orgComboData={orgCombo} | ||||
searchCriteria={searchCriteria} | |||||
/> | /> | ||||
</Grid> | </Grid> | ||||
{/*row 2*/} | {/*row 2*/} | ||||
@@ -12,6 +12,7 @@ export const country = ["香港","內地","澳門"]; | |||||
export const accountFilter = [{ id: 1, key: 1, label: 'Active', type: 'active' }, { id: 2, key: 2, label: 'Locked', type: 'locked' }, { id: 3, key: 3, label: 'Not verified', type: 'notVerified' }]; | export const accountFilter = [{ id: 1, key: 1, label: 'Active', type: 'active' }, { id: 2, key: 2, label: 'Locked', type: 'locked' }, { id: 3, key: 3, label: 'Not verified', type: 'notVerified' }]; | ||||
export const publicNoticeStatic = [ | export const publicNoticeStatic = [ | ||||
{ key: 0, label: '全部', type: 'all' }, | |||||
{ key: 1, label: '已提交', type: 'submitted' }, | { key: 1, label: '已提交', type: 'submitted' }, | ||||
{ key: 2, label: '已拒絕', type: 'rejected' }, | { key: 2, label: '已拒絕', type: 'rejected' }, | ||||
{ key: 3, label: '已取消', type: 'cancelled' }, | { key: 3, label: '已取消', type: 'cancelled' }, | ||||
@@ -23,6 +24,7 @@ export const publicNoticeStatic = [ | |||||
]; | ]; | ||||
export const publicNoticeStaticEng = [ | export const publicNoticeStaticEng = [ | ||||
{ key: 0, label: 'All', type: 'all' }, | |||||
{ key: 1, label: 'Submitted', type: 'submitted' }, | { key: 1, label: 'Submitted', type: 'submitted' }, | ||||
{ key: 2, label: 'Rejected', type: 'rejected' }, | { key: 2, label: 'Rejected', type: 'rejected' }, | ||||
{ key: 3, label: 'Cancelled', type: 'cancelled' }, | { key: 3, label: 'Cancelled', type: 'cancelled' }, | ||||