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

update payment page layout

master
jason.lam 1 year ago
parent
56587ff896
commit
55ca5d036a
9 changed files with 85 additions and 139 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +16
    -31
      src/pages/DemandNote/Create/SearchForm.js
  2. +5
    -3
      src/pages/DemandNote/Create/index.js
  3. +13
    -26
      src/pages/DemandNote/Search/DataGrid.js
  4. +14
    -18
      src/pages/DemandNote/Search/SearchForm.js
  5. +4
    -2
      src/pages/DemandNote/Search/index.js
  6. +19
    -40
      src/pages/GFMIS/SearchForm.js
  7. +2
    -2
      src/pages/GFMIS/index.js
  8. +11
    -16
      src/pages/Payment/Search_GLD/SearchForm.js
  9. +1
    -1
      src/pages/Payment/Search_GLD/index.js

+ 16
- 31
src/pages/DemandNote/Create/SearchForm.js View File

@@ -1,7 +1,6 @@
// material-ui
import {
Button,
CardContent,
Grid, TextField,
Autocomplete,
Typography,
@@ -15,6 +14,8 @@ import * as UrlUtils from "utils/ApiPathConst";
import * as HttpUtils from "utils/HttpUtils";
import { useNavigate } from "react-router-dom";
import { notifyDownloadSuccess } from 'utils/CommonFunction';
import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";


// ==============================|| DASHBOARD - DEFAULT ||============================== //
@@ -35,22 +36,6 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData, _paymentCount, _p
const [issueCombo, setIssueCombo] = React.useState([]);
const navigate = useNavigate()

const _sx = {
padding: "4 2 4 2",
boxShadow: 1,
border: 1,
borderColor: '#DDD',
'& .MuiDataGrid-cell': {
borderTop: 1,
borderBottom: 1,
borderColor: "#EEE"
},
'& .MuiDataGrid-footerContainer': {
border: 1,
borderColor: "#EEE"
}
}

React.useEffect(() => {
if (issueComboData && issueComboData.length > 0) {
setIssueCombo(issueComboData);
@@ -128,20 +113,21 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData, _paymentCount, _p
<MainCard xs={12} md={12} lg={12}
border={false}
content={false}
sx={_sx}
>

<form>
{/*row 1*/}
<CardContent sx={{ px: 2.5, pt: 3 }}>
<Grid item justifyContent="space-between" alignItems="center" >
<Typography variant="h5">Please Select Gazette Issue :</Typography>
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1}} width="98%">
{/*row 1*/}
<Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
<Typography variant="h5" >
Please Select Gazette Issue :
</Typography>
</Grid>
</CardContent>
{/*row 2*/}

{/*row 2*/}
<Grid container alignItems={"center"}>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 1 }}>
<Grid container display="flex" alignItems={"center"} sx={{mb:3}}>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3 }}>
<Autocomplete
disablePortal
size="small"
@@ -178,17 +164,15 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData, _paymentCount, _p
</Button>
</Grid> */}
<Grid item sx={{ ml: 3, mr: 3 }} >
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button
size="large"
variant="contained"
onClick={onSubmit}
color="success"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Create</Typography>
>
Create
</Button>
</ThemeProvider>
</Grid>

<Grid item sx={{ ml: 3, mr: 3 }} >
@@ -199,6 +183,7 @@ const SearchPublicNoticeForm = ({ applySearch, issueComboData, _paymentCount, _p
<Typography variant="h5">Pending Publish: {publishCount}</Typography>
</Grid>
</Grid>
</Grid>
</form>
<div>
<Dialog open={isFailPopUp} onClose={() => setIsFailPopUp(false)} >


+ 5
- 3
src/pages/DemandNote/Create/index.js View File

@@ -80,16 +80,18 @@ const Index = () => {
!onReady ?
<LoadingComponent/>
:
<Grid container sx={{minHeight: '85vh',backgroundColor:'#ffffff'}} direction="column">
<Grid container sx={{minHeight: '85vh', backgroundColor: 'backgroundColor.default'}} direction="column">
<Grid item xs={12}>
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
<Typography ml={15} color='#FFF' variant="h4">Create Demand Note</Typography>
<Typography ml={15} color='#FFF' variant="h4">
Create Demand Note
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12}>
<Grid item xs={12} md={12} lg={12} sx={{mb:-1}}>
<SearchForm
applySearch={applySearch}
issueComboData={issueCombo}


+ 13
- 26
src/pages/DemandNote/Search/DataGrid.js View File

@@ -18,6 +18,8 @@ import { notifyDownloadSuccess } from 'utils/CommonFunction';

import * as UrlUtils from "utils/ApiPathConst";
import * as HttpUtils from "utils/HttpUtils";
import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
// ==============================|| EVENT TABLE ||============================== //

export default function SearchDemandNote({ recordList, reloadFun, applySearch }) {
@@ -272,6 +274,7 @@ export default function SearchDemandNote({ recordList, reloadFun, applySearch })
return (
<div style={{ height: '100%', width: '100%' }}>
<Grid container maxWidth justifyContent="flex-start">
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<input
id="uploadFileBtn"
@@ -295,62 +298,46 @@ export default function SearchDemandNote({ recordList, reloadFun, applySearch })
<Button
component="span"
variant="contained"
size="large"
>
<Typography variant="h5">Attach DN</Typography>
Attach DN
</Button>
</label>
</Grid>
<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Button
size="large"
variant="contained"
onClick={findReadyToSend}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Ready Send</Typography>
>
Ready Send
</Button>
</Grid>
<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Button
size="large"
variant="contained"
onClick={() => setSendPopUp(true)}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Send DN</Typography>
>
Send DN
</Button>
</Grid>

<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Button
size="large"
variant="contained"
onClick={() => exportXml()}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Export XML</Typography>
>
Export XML
</Button>
</Grid>

<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Button
size="large"
variant="contained"
onClick={() => setConfirmPopUp(true)}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Mark as Paid</Typography>
>
Mark as Paid
</Button>
</Grid>
</ThemeProvider>
</Grid>
<Box sx={{ backgroundColor: "#fff", ml: 2 }} width="98%">
<FiDataGrid


+ 14
- 18
src/pages/DemandNote/Search/SearchForm.js View File

@@ -1,7 +1,6 @@
// material-ui
import {
Button,
CardContent,
Grid, TextField,
Autocomplete,
Typography
@@ -12,6 +11,8 @@ import * as React from "react";
import * as ComboData from "utils/ComboData";
import * as DateUtils from "utils/DateUtils";
import * as FormatUtils from "utils/FormatUtils";
import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
// ==============================|| DASHBOARD - DEFAULT ||============================== //


@@ -88,14 +89,12 @@ const SearchDemandNoteForm = ({ applySearch, orgComboData, searchCriteria, issue
>

<form onSubmit={handleSubmit(onSubmit)}>
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 3, mb: 3 }} width="98%">
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1 }} width="98%">
{/*row 1*/}
<Grid item xs={12}>
<CardContent sx={{ px: 2.5, pt: 3 }}>
<Grid item justifyContent="space-between" alignItems="center">
<Typography variant="h5">Search Form</Typography>
</Grid>
</CardContent>
<Grid item justifyContent="space-between" alignItems="center" sx={{mt:1, ml:3,mb:2.5}}>
<Typography variant="h5" >
Search Form
</Typography>
</Grid>
{/*row 2*/}
<Grid container display="flex" alignItems={"center"}>
@@ -261,28 +260,25 @@ const SearchDemandNoteForm = ({ applySearch, orgComboData, searchCriteria, issue

{/*last row*/}
<Grid container maxWidth justifyContent="flex-end">
<Grid item sx={{ ml: 3, mr: 3 }}>
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Grid item sx={{ ml: 3, mb:3 }}>
<Button
size="large"
variant="contained"
onClick={resetForm}
>
<Typography variant="h5">Clear</Typography>
Clear
</Button>
</Grid>

<Grid item sx={{ ml: 3, mr: 3}}>
<Grid item sx={{ ml: 3, mr: 3, mb:3}}>
<Button
size="large"
variant="contained"
type="submit"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Submit</Typography>
>
Submit
</Button>
</Grid>
</ThemeProvider>
</Grid>
</Grid>
</form>


+ 4
- 2
src/pages/DemandNote/Search/index.js View File

@@ -98,12 +98,14 @@ const UserSearchPage_Individual = () => {
<Grid item xs={12}>
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
<Typography ml={15} color='#FFF' variant="h4">Demand Note</Typography>
<Typography ml={15} color='#FFF' variant="h4">
Demand Note
</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12}>
<Grid item xs={12} md={12} lg={12} sx={{mb: -1}}>
<SearchForm
applySearch={applySearch}
orgComboData={orgCombo}


+ 19
- 40
src/pages/GFMIS/SearchForm.js View File

@@ -1,7 +1,6 @@
// material-ui
import {
Button,
CardContent,
Grid, TextField,
// Autocomplete,
Typography
@@ -10,6 +9,8 @@ import MainCard from "components/MainCard";
import { useForm } from "react-hook-form";
import * as React from "react";
import * as DateUtils from "utils/DateUtils";
import {PNSPS_BUTTON_THEME} from "../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
// import * as ComboData from "utils/ComboData";
// ==============================|| DASHBOARD - DEFAULT ||============================== //

@@ -20,22 +21,6 @@ const SearchPublicNoticeForm = ({ applySearch, generateXML, searchCriteria }) =>
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
// const [status, setStatus] = React.useState(ComboData.paymentStatus[0]);

const _sx = {
padding: "4 2 4 2",
boxShadow: 1,
border: 1,
borderColor: '#DDD',
'& .MuiDataGrid-cell': {
borderTop: 1,
borderBottom: 1,
borderColor: "#EEE"
},
'& .MuiDataGrid-footerContainer': {
border: 1,
borderColor: "#EEE"
}
}

const { register, handleSubmit, getValues } = useForm()

const onSubmit = (data) => {
@@ -67,20 +52,19 @@ const SearchPublicNoticeForm = ({ applySearch, generateXML, searchCriteria }) =>
<MainCard xs={12} md={12} lg={12}
border={false}
content={false}
sx={_sx}
>

<form onSubmit={handleSubmit(onSubmit)}>
{/*row 1*/}
<CardContent sx={{ px: 2.5, pt: 3 }}>
<Grid item justifyContent="space-between" alignItems="center" >
<Typography variant="h5">Credit Date</Typography>
<form onSubmit={handleSubmit(onSubmit)} >
<Grid container sx={{ backgroundColor: '#ffffff', ml: 2, mt: 1}} width="98%">
{/*row 1*/}
<Grid item justifyContent="space-between" alignItems="center" sx={{mt:1,ml:3,mb:2.5}}>
<Typography variant="h5" >
Credit Date
</Typography>
</Grid>
</CardContent>

{/*row 2*/}
<Grid container alignItems="center">
{/*row 2*/}

<Grid container display="flex" alignItems={"center"}>
<Grid item xs={9} s={6} md={4} lg={4} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
@@ -121,31 +105,26 @@ const SearchPublicNoticeForm = ({ applySearch, generateXML, searchCriteria }) =>
</Grid> */}
</Grid>
<Grid container justifyContent="flex-end" direction="row" alignItems="center" spacing={3}>
<Grid item sx={{ ml: 3, mr: 3, mb: 3, }} >
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Grid item sx={{ ml: 3, mb: 3, }} >
<Button
size="large"
variant="contained"
type="submit"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Preview</Typography>
>
Preview
</Button>
</Grid>

<Grid item sx={{ ml: 3, mr: 3, mb: 3, }} >
<Button
size="large"
variant="contained"
onClick={generateHandler}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Generate</Typography>
>
Generate
</Button>
</Grid>
</ThemeProvider>
</Grid>
</Grid>
</form>
</MainCard>


+ 2
- 2
src/pages/GFMIS/index.js View File

@@ -100,7 +100,7 @@ const Index = () => {
!onReady ?
<LoadingComponent/>
:
<Grid container sx={{minHeight: '85vh',backgroundColor:'#ffffff'}} direction="column">
<Grid container sx={{minHeight: '85vh', backgroundColor: 'backgroundColor.default'}} direction="column">
<Grid item xs={12}>
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
@@ -109,7 +109,7 @@ const Index = () => {
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12}>
<Grid item xs={12} md={12} lg={12} sx={{mb:-1}}>
<SearchForm
applySearch={applySearch}
generateXML={generateXML}


+ 11
- 16
src/pages/Payment/Search_GLD/SearchForm.js View File

@@ -10,6 +10,8 @@ import { useForm } from "react-hook-form";
import * as React from "react";
import * as DateUtils from "utils/DateUtils";
import * as ComboData from "utils/ComboData";
import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
// ==============================|| DASHBOARD - DEFAULT ||============================== //


@@ -44,7 +46,7 @@ const SearchPublicNoticeForm = ({ applySearch, searchCriteria }) => {
>

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

{/*last row*/}
<Grid container maxWidth justifyContent="flex-end">
<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Grid item sx={{ ml: 3, mb: 3}}>
<Button
size="large"
variant="contained"
onClick={resetForm}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Reset</Typography>
>
Reset
</Button>
</Grid>

<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Grid item sx={{ ml: 3, mr: 3, mb: 3 }}>
<Button
size="large"
variant="contained"
type="submit"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">Submit</Typography>
>
Submit
</Button>
</Grid>
</ThemeProvider>
</Grid>
</form>
</MainCard>


+ 1
- 1
src/pages/Payment/Search_GLD/index.js View File

@@ -75,7 +75,7 @@ const Index = () => {
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12}>
<Grid item xs={12} md={12} lg={12} sx={{mb:-1}}>
<SearchForm
applySearch={applySearch}
searchCriteria={searchCriteria}


Write Preview
Loading…
Cancel
Save