Browse Source

update from date and to date field layoit

master
Alex Cheung 1 year ago
parent
commit
b95890e00e
3 changed files with 181 additions and 159 deletions
  1. +44
    -35
      src/pages/AuditLog/AuditLogSearchForm.js
  2. +96
    -89
      src/pages/Payment/Search_GLD/SearchForm.js
  3. +41
    -35
      src/pages/Proof/Search_GLD/SearchForm.js

+ 44
- 35
src/pages/AuditLog/AuditLogSearchForm.js View File

@@ -34,6 +34,8 @@ const AuditLogSearchForm = ({ applySearch, searchCriteria}) => {
const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom); const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom);
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
const [onDownload, setOnDownload] = React.useState(false); const [onDownload, setOnDownload] = React.useState(false);
const marginBottom = 2.5;


const { reset, register, handleSubmit } = useForm() const { reset, register, handleSubmit } = useForm()
const onSubmit = (data) => { const onSubmit = (data) => {
@@ -93,43 +95,50 @@ const AuditLogSearchForm = ({ applySearch, searchCriteria}) => {
</Grid> </Grid>
<Grid item xs={9} md={5} lg={5} sx={{ ml: 3, mr: 3, mb: 3 }}></Grid> <Grid item xs={9} md={5} lg={5} sx={{ ml: 3, mr: 3, mb: 3 }}></Grid>


<Grid item xs={9} s={6} md={5} lg={5} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("modifiedFrom")}
id="modifiedFrom"
type="date"
label="Modified From"
defaultValue={searchCriteria.modifiedFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>
<Grid item xs={9} s={6} md={6} lg={6} sx={{ml:3, mr:3, mb:marginBottom}}>
<Grid container>
<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
{...register("modifiedFrom")}
id="modifiedFrom"
type="date"
label="Modified From"
defaultValue={searchCriteria.modifiedFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>


<Grid item xs={9} s={6} md={5} lg={5} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("modifiedTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
console.log(newValue)
setMaxDate(DateUtils.dateStr(newValue));
}}
id="modifiedTo"
type="date"
label="Modified To"
defaultValue={searchCriteria.modifiedTo}
/>
</Grid>
<Grid item xs={1.5} s={1.5} md={1.5} lg={1} sx={{mt:0.8, display: 'flex', justifyContent:"center", alignItems: 'flex-start'}}>
To
</Grid>


<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("modifiedTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
console.log(newValue)
setMaxDate(DateUtils.dateStr(newValue));
}}
id="modifiedTo"
type="date"
label="Modified To"
defaultValue={searchCriteria.modifiedTo}
/>
</Grid>
</Grid>
</Grid>
</Grid> </Grid>


{/*last row*/} {/*last row*/}


+ 96
- 89
src/pages/Payment/Search_GLD/SearchForm.js View File

@@ -22,6 +22,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
const [status, setStatus] = React.useState(ComboData.paymentStatus[0]); const [status, setStatus] = React.useState(ComboData.paymentStatus[0]);


const { reset, register, handleSubmit } = useForm() const { reset, register, handleSubmit } = useForm()
const marginBottom = 2.5;


const onSubmit = (data) => { const onSubmit = (data) => {
const temp = { const temp = {
@@ -46,7 +47,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
> >


<form onSubmit={handleSubmit(onSubmit)} > <form onSubmit={handleSubmit(onSubmit)} >
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1}} width="98%">
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1, mb: marginBottom}} width="98%">
{/*row 1*/} {/*row 1*/}
<Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}> <Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
<Typography variant="pnspsFormHeader" > <Typography variant="pnspsFormHeader" >
@@ -56,94 +57,100 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
{/*row 2*/} {/*row 2*/}


<Grid container display="flex" alignItems={"center"}> <Grid container display="flex" alignItems={"center"}>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("code")}
id='code'
label="App No.:"
defaultValue={searchCriteria.code}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("dateFrom")}
id="dateFrom"
type="date"
label="Trans. Date From"
defaultValue={searchCriteria.dateFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("dateTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
setMaxDate(DateUtils.dateStr(newValue));
}}
id="dateTo"
type="date"
label="Trans. Date To"
defaultValue={searchCriteria.dateTo}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("transNo")}
id='transNo'
label="Trans. No.:"
defaultValue={searchCriteria.transNo}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<Autocomplete
{...register("status")}
disablePortal={false}
size="small"
id="status"
filterOptions={(options) => options}
options={ComboData.paymentStatus}
value={status}
getOptionLabel={(option) => option.label}
inputValue={status?.label ? status?.label : ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setStatus(newValue);
}
}}
renderInput={(params) => (
<TextField {...params}
label="Status"
/>
)}
InputLabelProps={{
shrink: true
}}
/>
</Grid>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3,mb: marginBottom}}>
<TextField
fullWidth
{...register("code")}
id='code'
label="App No.:"
defaultValue={searchCriteria.code}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:marginBottom}}>
<Grid container>
<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
{...register("dateFrom")}
id="dateFrom"
type="date"
label="Trans. Date From"
defaultValue={searchCriteria.dateFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>
<Grid item xs={1.5} s={1.5} md={1.5} lg={1} sx={{mt:0.8, display: 'flex', justifyContent:"center", alignItems: 'flex-start'}}>
To
</Grid>
<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("dateTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
setMaxDate(DateUtils.dateStr(newValue));
}}
id="dateTo"
type="date"
label="Trans. Date To"
defaultValue={searchCriteria.dateTo}
/>
</Grid>
</Grid>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom}}>
<TextField
fullWidth
{...register("transNo")}
id='transNo'
label="Trans. No.:"
defaultValue={searchCriteria.transNo}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<Autocomplete
{...register("status")}
disablePortal={false}
size="small"
id="status"
filterOptions={(options) => options}
options={ComboData.paymentStatus}
value={status}
getOptionLabel={(option) => option.label}
inputValue={status?.label ? status?.label : ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setStatus(newValue);
}
}}
renderInput={(params) => (
<TextField {...params}
label="Status"
/>
)}
InputLabelProps={{
shrink: true
}}
/>
</Grid>
</Grid> </Grid>
</Grid> </Grid>




+ 41
- 35
src/pages/Proof/Search_GLD/SearchForm.js View File

@@ -30,7 +30,7 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom); const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom);
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo); const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);


const marginBottom = 2.5;
const { reset, register, handleSubmit } = useForm() const { reset, register, handleSubmit } = useForm()
const onSubmit = (data) => { const onSubmit = (data) => {


@@ -177,40 +177,46 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
/> />
</Grid> </Grid>


<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("dateFrom")}
id="dateFrom"
type="date"
label="Proof Date (From)"
defaultValue={searchCriteria.dateFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("dateTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
setMaxDate(DateUtils.dateStr(newValue));
}}
id="dateTo"
type="date"
label="Proof Date(To)"
defaultValue={searchCriteria.dateTo}
/>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:marginBottom}}>
<Grid container>
<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
{...register("dateFrom")}
id="dateFrom"
type="date"
label="Proof Date (From)"
defaultValue={searchCriteria.dateFrom}
InputProps={{ inputProps: { max: maxDate } }}
onChange={(newValue) => {
setMinDate(DateUtils.dateStr(newValue));
}}
InputLabelProps={{
shrink: true
}}
/>
</Grid>
<Grid item xs={1.5} s={1.5} md={1.5} lg={1} sx={{mt:0.8, display: 'flex', justifyContent:"center", alignItems: 'flex-start'}}>
To
</Grid>
<Grid item xs={5.25} s={5.25} md={5.25} lg={5.5}>
<TextField
fullWidth
InputLabelProps={{
shrink: true
}}
{...register("dateTo")}
InputProps={{ inputProps: { min: minDate } }}
onChange={(newValue) => {
setMaxDate(DateUtils.dateStr(newValue));
}}
id="dateTo"
type="date"
label="Proof Date(To)"
defaultValue={searchCriteria.dateTo}
/>
</Grid>
</Grid>
</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 }}>


Loading…
Cancel
Save