alex
/
PNSPS-frontend-MaterialUI
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

update from date and to date field layoit

master
Alex Cheung 1 year ago
parent
e745a5cc43
commit
b95890e00e
3 changed files with 181 additions and 159 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  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 [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
const [onDownload, setOnDownload] = React.useState(false);
const marginBottom = 2.5;

const { reset, register, handleSubmit } = useForm()
const onSubmit = (data) => {
@@ -93,43 +95,50 @@ const AuditLogSearchForm = ({ applySearch, searchCriteria}) => {
</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>

{/*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 { reset, register, handleSubmit } = useForm()
const marginBottom = 2.5;

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

<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*/}
<Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
<Typography variant="pnspsFormHeader" >
@@ -56,94 +57,100 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
{/*row 2*/}

<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>



+ 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 [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);

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

@@ -177,40 +177,46 @@ const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, iss
/>
</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 item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>


Write Preview
Loading…
Cancel
Save