alex
/
PNSPS-frontend-MaterialUI
1
0
Vork 0
Code Kwesties 0 Pull-aanvragen 0 Publicaties 0 Wiki Activiteit
Bladeren bron

update revoke

master
Alex Cheung 1 jaar geleden
bovenliggende
2e39135000
commit
d07e18904e
8 gewijzigde bestanden met toevoegingen van 825 en 11 verwijderingen
Zij-aan-zij weergave
Diff opties
Statistieken weergeven Download Patch-bestand Download Diff-bestand
  1. +27
    -9
      src/layout/MainLayout/Header/index.js
  2. +16
    -0
      src/pages/PublicNotice/Details_GLD/ApplicationDetailCard.js
  3. +18
    -2
      src/pages/PublicNotice/Details_GLD/index.js
  4. +251
    -0
      src/pages/PublicNotice/Search_Mark_As_Paid_GLD/DataGrid.js
  5. +389
    -0
      src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js
  6. +113
    -0
      src/pages/PublicNotice/Search_Mark_As_Paid_GLD/index.js
  7. +7
    -0
      src/routes/GLDUserRoutes.js
  8. +4
    -0
      src/utils/ApiPathConst.js

+ 27
- 9
src/layout/MainLayout/Header/index.js Bestand weergeven

@@ -107,24 +107,39 @@ function Header(props) {
<li>
<Link className="paymentTop" ><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Payment</Typography><KeyboardArrowDownIcon sx={{ fontSize: '1vw' }} /></Link>
<ul className='dropdown'>
{
isGranted("MAINTAIN_DEMANDNOTE") ?
<li>
<Link className="exportDemandNote" to='/paymentPage/exportGDN' ><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Export for GDN</Typography></Link>
</li>
:
<></>
}

{
isGranted("MAINTAIN_PAYMENT") ?
<li>
<Link className="payment" to='/paymentPage/search'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Online Payment Record</Typography></Link>
<Link className="application" to='/application/markAsPaid/search'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Mark Payment</Typography></Link>
</li>
:
<></>
}

{
isGranted("MAINTAIN_PAYMENT") ?
<li>
<Link className="payment" to='/paymentPage/search'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Online Payment Record</Typography></Link>
</li>
:
<></>
}
{
isGranted("MAINTAIN_RECON") ?
<>
<li>
<Link className="downloadXML" to='/gfmis/search'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>GFMIS Generate XML</Typography></Link>
</li>
<li>
<Link className="reconReport" to='/paymentPage/reconReport'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Recon Report</Typography></Link>
</li>
</>

:
@@ -148,15 +163,18 @@ function Header(props) {
:
<></>
}
{
isGranted("MAINTAIN_RECON") ?
<>
<li>
<Link className="reconReport" to='/paymentPage/reconReport'><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Recon Report</Typography></Link>
</li>
</>

{
isGranted("MAINTAIN_DEMANDNOTE") ?
<li>
<Link className="exportDemandNote" to='/paymentPage/exportGDN' ><Typography style={{ opacity: 0.9 }} variant={"pnspsHeaderTitle"} sx={{ ml: 1 }}>Export for GDN</Typography></Link>
</li>
:
<></>
}

</ul>
</li>


+ 16
- 0
src/pages/PublicNotice/Details_GLD/ApplicationDetailCard.js Bestand weergeven

@@ -117,6 +117,10 @@ const ApplicationDetailCard = (
setStatus("publish")
}

const revokeClick = () => () => {
setStatus("revoke")
};

const onProofClick = () => {
if (applicationDetailData.data.groupNo) {
HttpUtils.get({
@@ -264,6 +268,18 @@ const ApplicationDetailCard = (
(
(currentApplicationDetailData.status == "paid" && currentApplicationDetailData.creditor == 0) ?
<>
<Button
// size="large"
variant="contained"
onClick={revokeClick()}
sx={{
textTransform: 'capitalize',
alignItems: 'end',
backgroundColor: '#ffa733'
}}>
<ReplayIcon />
<Typography ml={1} variant="h5">Revoke Payment</Typography>
</Button>
<Button
// size="large"
variant="contained"


+ 18
- 2
src/pages/PublicNotice/Details_GLD/index.js Bestand weergeven

@@ -33,7 +33,8 @@ import {
SET_PUBLIC_NOTICE_STATUS_WITHDRAW,
SET_PUBLIC_NOTICE_STATUS_RESUBMIT,
SET_PUBLIC_NOTICE_STATUS_REVIEWED,
SET_PUBLIC_NOTICE_STATUS_PUBLISH
SET_PUBLIC_NOTICE_STATUS_PUBLISH,
SET_PUBLIC_NOTICE_STATUS_REVOKE
} from "utils/ApiPathConst";
const StatusChangeDialog = Loadable(lazy(() => import('./StatusChangeDialog')));
import * as DateUtils from "utils/DateUtils";
@@ -187,6 +188,8 @@ const PublicNoticeDetail_GLD = () => {
onReSubmitClick(getReason);
} else if (getStatus == "publish") {
onPublishClick();
} else if (getStatus == "revoke") {
onRevokeClick();
}
}
}, [statusWindowAccepted]);
@@ -310,6 +313,19 @@ const PublicNoticeDetail_GLD = () => {
}
};

const onRevokeClick = () => {
if (params.id <= 0) return;
HttpUtils.get({
url: `${SET_PUBLIC_NOTICE_STATUS_REVOKE}/${params.id}`,
onSuccess: function () {
setOpen(false);
handleClose();
loadApplicationDetail()
notifySaveSuccess()
}
});
}

useEffect(() => {
const status = applicationDetailData.data != undefined ? applicationDetailData.data.status : ""
if (status === "submitted" && params.id > 0 && getUploadStatus) {
@@ -354,7 +370,7 @@ const PublicNoticeDetail_GLD = () => {
</Grid>
<Grid item xs={12} sm={12} md={12} lg={12}>
<Stack direction="row">
<Button title="Back" sx={{ ml: 3.5, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/application/search") }}>
<Button title="Back" sx={{ ml: 3.5, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate(-1) }}>
<ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
</Button>
<Typography ml={4} mt={3} variant="h4">{title}</Typography>


+ 251
- 0
src/pages/PublicNotice/Search_Mark_As_Paid_GLD/DataGrid.js Bestand weergeven

@@ -0,0 +1,251 @@
// material-ui
import * as React from 'react';
import {
//Link,
Button,
Grid,
Typography,
Stack,
Dialog, DialogTitle, DialogContent, DialogActions,
} from '@mui/material';
import {
// GET_PUBLIC_NOTICE_LIST,
SET_PUBLIC_NOTICE_STATUS_MARK_AS_PAID,
GET_PUBLIC_NOTICE_OFFLINE_PAYMENT_LIST } from "utils/ApiPathConst";
import * as HttpUtils from "utils/HttpUtils";
import * as DateUtils from "utils/DateUtils";
import * as FormatUtils from "utils/FormatUtils";
// import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";
import { useNavigate } from "react-router-dom";
import { FiDataGrid } from "components/FiDataGrid";
import { notifyActionSuccess, clickableLink } from 'utils/CommonFunction';
import { FormattedMessage, useIntl } from "react-intl";
import * as utils from "auth/utils"
// ==============================|| EVENT TABLE ||============================== //

export default function SearchPublicNoticeTable({ searchCriteria }) {

const [rows, setRows] = React.useState([]);
const navigate = useNavigate()

const [selectedRowItems, setSelectedRowItems] = React.useState([]);
const [isConfirmPopUp, setIsConfirmPopUp] = React.useState(false);
const [isWarningPopUp, setIsWarningPopUp] = React.useState(false);

const intl = useIntl();

const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria);
React.useEffect(() => {
set_searchCriteria(searchCriteria);
}, [searchCriteria]);


function genIssueNo(params) {
const issueNo = params.row.issueYear + " Vol. " + FormatUtils.zeroPad(params.row.issueVolume, 3) + ", No. " + FormatUtils.zeroPad(params.row.issueNo, 2) + ", " + DateUtils.dateFormat(params.row.issueDate, "D MMM YYYY (ddd)")
return issueNo
}

function genGroupNo(params) {
let groupNo = params.row.groupNo
if (groupNo != null) {
groupNo = <><br /><div>{groupNo}</div></>
}
return groupNo
}

const columns = [
{
field: 'actions',
headerName: 'Application No.',
sortable: false,
width: 150,
cellClassName: 'actions',
renderCell: (params) => {
return clickableLink('/application/' + params.id, params.row.appNo);
},
},
{
id: 'contactPerson',
field: 'contactPerson',
headerName: 'Customer Name',
flex: 1,
minWidth: 50,
renderCell: (params) => {
let company = params.row.enCompanyName != null ? params.row.enCompanyName : params.row.chCompanyName;
company = company != null ? company : "";
if (params.row.sysType != null && params.row.sysType == "dummy"){
company = params.row.contactPerson
}
return <div>
{company}
</div>;
}
},
{
id: 'issueNoAndCode',
field: 'issueNoAndCode',
headerName: 'Gazette Issue No. / Gazette Code',
sortable: false,
flex: 1.5,
minWidth: 350,
renderCell: (params) => (
<div>
{genIssueNo(params)}
{genGroupNo(params)}
</div>

)
},
{
id: 'paymentMethod',
field: 'paymentMethod',
headerName: 'Payment Method',
sortable: false,
minWidth: 250,
flex: 2,
renderCell: (params) => {
let paymentMethod = params.row.paymentMethod!=null?intl.formatMessage({ id: utils.getPaymentMethod(params.row.paymentMethod)}):""
return (<>
{paymentMethod}
</>);
}
},
{
id: 'fee',
field: 'fee',
headerName: 'Amount(HK$)',
flex: 1,
minWidth: 100,
valueGetter: (params) => {
return FormatUtils.currencyFormat(params?.value);
}
},
];

function handleRowDoubleClick(params) {
// handleEditClick(params)
navigate('/application/' + params.id);
}

const doPublish = () => {
setIsConfirmPopUp(false);
let appIdList = [];
const datas = rows?.filter((row) =>
selectedRowItems.includes(row.id)
);
// console.log(datas)
for (var i = 0; i < datas?.length; i++) {
appIdList.push(datas[i].id);
}
if (appIdList.length < 1) {
setIsWarningPopUp(true);
} else {
HttpUtils.post({
url: SET_PUBLIC_NOTICE_STATUS_MARK_AS_PAID,
params: {
ids: appIdList
},
onSuccess: () => {
searchCriteria.reload = new Date();
notifyActionSuccess("Action Success!")
location.reload()
}
});
}
}

return (<>

<div style={{ width: '100%' }}>
<Grid container direction="row" justifyContent="flex-start" alignItems="center" sx={{ p: 1 }} >
<Button
variant="contained"
onClick={() => setIsConfirmPopUp(true)}
>
Mark as Paid
</Button>
</Grid>

<FiDataGrid
checkboxSelection
disableRowSelectionOnClick
onRowSelectionModelChange={(newSelection) => {
setSelectedRowItems(newSelection);
}}
isRowSelectable={(params) => {
return (params.row.paymentMethod != "online" && params.row.status == "confirmed")
}}
columns={columns}
customPageSize={10}
getRowHeight={() => 'auto'}
onRowDoubleClick={handleRowDoubleClick}
doLoad={React.useMemo(() => ({
url: GET_PUBLIC_NOTICE_OFFLINE_PAYMENT_LIST,
params: _searchCriteria,
callback: function (responseData) {
setRows(responseData?.records);
}
}), [_searchCriteria])}
/>
</div>
<div>
<Dialog
open={isConfirmPopUp}
onClose={() => setIsConfirmPopUp(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '30vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '50vh' }
}
}}
>
<DialogTitle>
<Typography variant="h3" >
<FormattedMessage id="confirm" />
</Typography>
</DialogTitle>
<DialogContent style={{ display: 'flex', }}>
<Stack direction="column" justifyContent="space-between">
<Typography variant="h4" style={{ padding: '16px' }}>Please Confirm to mark selected application as Paid.</Typography>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setIsConfirmPopUp(false)} aria-label={intl.formatMessage({ id: 'close' })}>
<Typography variant="h5">
<FormattedMessage id="close" />
</Typography></Button>

<Button onClick={() => doPublish()} aria-label={intl.formatMessage({ id: 'confirm' })}>
<Typography variant="h5">
<FormattedMessage id="confirm" />
</Typography></Button>
</DialogActions>
</Dialog>
</div>
<div>
<Dialog
open={isWarningPopUp}
onClose={() => setIsWarningPopUp(false)}
PaperProps={{
sx: {
minWidth: '40vw',
maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '70vw' },
maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '60vh' }
}
}}
>
<DialogTitle><Typography variant="h3">Warning</Typography></DialogTitle>
<DialogContent style={{ display: 'flex', }}>
<Typography variant="h4" style={{ padding: '16px' }}>{intl.formatMessage({ id: "MSG.plzSelectApp" })}</Typography>
</DialogContent>
<DialogActions>
<Button onClick={() => setIsWarningPopUp(false)}><Typography variant="h5">OK</Typography></Button>
</DialogActions>
</Dialog>
</div>
</>

);
}

+ 389
- 0
src/pages/PublicNotice/Search_Mark_As_Paid_GLD/SearchForm.js Bestand weergeven

@@ -0,0 +1,389 @@
// material-ui
import {
Button,
Grid, TextField,
Autocomplete,
Typography
} from '@mui/material';
import MainCard from "components/MainCard";
import { useForm } from "react-hook-form";
import * as React from "react";
import * as ComboData from "utils/ComboData";
import * as DateUtils from "utils/DateUtils";
import * as FormatUtils from "utils/FormatUtils";
import { ThemeProvider } from "@emotion/react";
import { PNSPS_BUTTON_THEME } from "../../../themes/buttonConst";
import { useIntl } from "react-intl";

import {DatePicker} from "@mui/x-date-pickers/DatePicker";
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";
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const SearchPublicNoticeForm = ({ applySearch, orgComboData, searchCriteria, issueComboData
}) => {

const [type, setType] = React.useState([]);
// const [status, setStatus] = React.useState({ key: 0, label: 'All', type: 'all' });
const [orgSelected, setOrgSelected] = React.useState({});
const [orgCombo, setOrgCombo] = React.useState();
const [issueSelected, setIssueSelected] = React.useState({});
const [issueCombo, setIssueCombo] = React.useState([]);
const [selectedStatus, setSelectedStatus] = React.useState({key: 0, label: 'All', type: 'all'});

const [minDate, setMinDate] = React.useState(searchCriteria.dateFrom);
const [maxDate, setMaxDate] = React.useState(searchCriteria.dateTo);
const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy");
const [toDateValue, setToDateValue] = React.useState("dd / mm / yyyy");

React.useEffect(() => {
setFromDateValue(minDate);
}, [minDate]);

React.useEffect(() => {
setToDateValue(maxDate);
}, [maxDate]);

const intl = useIntl();
const { locale } = intl;

const marginBottom = 2.5;
const { reset, register, handleSubmit } = useForm()
const onSubmit = (data) => {
data.status = selectedStatus?.type
let typeArray = [];
let sentDateFrom = "";
let sentDateTo = "";

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 temp = {
appNo: data.appNo,
dateFrom: sentDateFrom,
dateTo: sentDateTo,
contact: data.contact,
status: (data.status === '' || data.status?.includes("all")) ? "" : data.status,
orgId: (orgSelected?.key && orgSelected?.key > 0) ? orgSelected?.key : "",
issueId: issueSelected?.id,
groupNo: data.groupNo,
};
applySearch(temp);
};

React.useEffect(() => {
if (orgComboData && orgComboData.length > 0) {
setOrgCombo(orgComboData);
}
}, [orgComboData]);

React.useEffect(() => {
if (issueComboData && issueComboData.length > 0) {
setIssueCombo(issueComboData);
}
}, [issueComboData]);

function resetForm() {
setType([]);
// setStatus({ key: 0, label: 'All', type: 'all' });
setOrgSelected({});
setIssueSelected({});
setSelectedStatus({key: 0, label: 'All', type: 'all'});
setMinDate(DateUtils.dateValue(new Date().setDate(new Date().getDate()-14)))
setMaxDate(DateUtils.dateValue(new Date()))
reset();
}

const getIssueLabel=(data)=> {
let issueYear = data.issueYear
let volume = data.volume;
let issueNo = data.issueNo;
let issueDate = data.issueDate;
if (locale === 'zh-HK') {
return issueYear
+ " 第" + volume + "卷,"
+ " 第" + issueNo + "期,"
+ " " + DateUtils.dateFormat(issueDate, "YYYY年MM月DD日")
+ " (" + DateUtils.getWeekdayStr_ZH(issueDate) + ")";
} else if (locale === 'zh-CN') {
return issueYear
+ " 第" + volume + "卷,"
+ " 第" + issueNo + "期,"
+ " " + DateUtils.dateFormat(issueDate, "YYYY年MM月DD日")
+ " (" + DateUtils.getWeekdayStr_CN(issueDate) + ")";
}
return issueYear
+ " Vol. " + FormatUtils.zeroPad(volume, 3)
+ ", No. " + FormatUtils.zeroPad(issueNo, 2)
+ ", " + DateUtils.dateFormat(issueDate, "D MMM YYYY (ddd)");
}

return (
<MainCard xs={12} md={12} lg={12}
border={false}
content={false}
sx={{ backgroundColor: '#fff' }}
>

<form onSubmit={handleSubmit(onSubmit)}>
<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: marginBottom }}>
<Typography variant="pnspsFormHeader" >
Search
</Typography>
</Grid>
{/*row 2*/}
<Grid container display="flex" alignItems={"center"}>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<TextField
fullWidth
{...register("appNo")}
id='appNo'
label={"Application No."}
defaultValue={searchCriteria.appNo}
InputLabelProps={{
shrink: true
}}
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<Grid container spacing={1}>
<Grid item xs={6}>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DemoItem components={['DatePicker']}>
<DatePicker
id="dateFrom"
// onError={(newError) => setReceiptFromError(newError)}
slotProps={{
field: { readOnly: true, },
// textField: {
// helperText: receiptFromErrorMessage,
// },
}}
format="DD/MM/YYYY"
label={"Submit Date (From)"}
value={minDate === null ? null : dayjs(minDate)}
maxDate={maxDate === null ? null : dayjs(maxDate)}
onChange={(newValue) => {
// console.log(newValue)
if(newValue!=null){
setMinDate(newValue);
}
}}
/>
</DemoItem >
</LocalizationProvider>
</Grid>
<Grid item xs={6}>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DemoItem components={['DatePicker']}>
<DatePicker
id="dateTo"
// onError={(newError) => setReceiptFromError(newError)}
slotProps={{
field: { readOnly: true, },
// textField: {
// helperText: receiptFromErrorMessage,
// },
}}
format="DD/MM/YYYY"
label={"Submit Date (To)"}
value={maxDate === null ? null : dayjs(maxDate)}
minDate={minDate === null ? null : dayjs(minDate)}
onChange={(newValue) => {
// console.log(newValue)
if(newValue!=null){
setMaxDate(newValue);
}
}}
/>
</DemoItem >
</LocalizationProvider>
</Grid>
</Grid>
</Grid>

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

</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<Autocomplete
{...register("status")}
id="status"
size="small"
options={ComboData.publicNoticeStatic_GLD}
value={selectedStatus}
onChange={(event, newValue) => {
if(newValue==null){
setSelectedStatus(ComboData.publicNoticeStatic_GLD[0]);
}else{
setSelectedStatus(newValue);
}
}}
getOptionLabel={(option) => option.label}
renderInput={(params) => (
<TextField
{...params}
label="Status"
InputLabelProps={{
shrink: true
}}
/>
)}
/>
{/* <Autocomplete
multiple
{...register("status")}
id="status"
size="small"
options={ComboData.publicNoticeStatic_GLD}
value={selectedStatus}
onChange={(event, newValue) => {
const findAllIndex = newValue.findIndex((ele) => {
return ele.type === "all"
})

if (findAllIndex > -1) {
setSelectedStatus([newValue[findAllIndex]]);
setSelectedLabelsString('all')
} else {
const selectedLabels = newValue.map(option => option.type);
const selectedLabelsString = `${selectedLabels.join(',')}`;
setSelectedStatus(newValue);
setSelectedLabelsString(selectedLabelsString);
}
}}
getOptionLabel={(option) => option.label}
renderInput={(params) => (
<TextField
{...params}
label="Status"
InputLabelProps={{
shrink: true
}}
/>
)}
/> */}
</Grid>

{
orgCombo ?
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<Autocomplete
{...register("orgId")}
disablePortal
id="orgId"
options={orgCombo}
size="small"
value={orgSelected}
getOptionLabel={(option) => option.name? option.name : ""}
inputValue={orgSelected ? orgSelected.name : ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setOrgSelected(newValue);
}else{
setOrgSelected({});
}
}}
renderInput={(params) => (
<TextField {...params}
label="Organisation"
InputLabelProps={{
shrink: true
}}
/>
)}
/>
</Grid>
: <></>
}

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: marginBottom }}>
<Autocomplete
{...register("issueId")}
disablePortal
size="small"
id="issueId"
options={issueCombo}
value={issueSelected}
inputValue={(issueSelected?.id) ? getIssueLabel(issueSelected) : ""}
getOptionLabel={(option) => getIssueLabel(option)}
onChange={(event, newValue) => {
setIssueSelected(newValue);
}}
renderInput={(params) => (
<TextField {...params}
label="Gazette Issue No."
InputLabelProps={{
shrink: true
}}
/>
)}
/>
</Grid>

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

{/*last row*/}
<Grid container maxWidth justifyContent="flex-end">
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Grid item sx={{ ml: 3 }}>
<Button
variant="contained"
color="cancel"
onClick={resetForm}
>
Reset
</Button>
</Grid>

<Grid item sx={{ ml: 3 }}>
<Button
variant="contained"
type="submit"
>
Submit
</Button>
</Grid>
</ThemeProvider>
</Grid>
</Grid>
</form>
</MainCard>
);
};

export default SearchPublicNoticeForm;

+ 113
- 0
src/pages/PublicNotice/Search_Mark_As_Paid_GLD/index.js Bestand weergeven

@@ -0,0 +1,113 @@
// material-ui
import {
Grid,
Typography,
Stack
} from '@mui/material';
import MainCard from "components/MainCard";
import * as React from "react";
import * as UrlUtils from "utils/ApiPathConst";
import * as HttpUtils from "utils/HttpUtils";
import * as DateUtils from "utils/DateUtils";

import Loadable from 'components/Loadable';
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
const SearchForm = Loadable(React.lazy(() => import('./SearchForm')));
const EventTable = Loadable(React.lazy(() => import('./DataGrid')));
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'

const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
width: '100%',
height: '100%',
backgroundSize: 'contain',
backgroundRepeat: 'no-repeat',
backgroundColor: '#0C489E',
backgroundPosition: 'right'
}

// ==============================|| DASHBOARD - DEFAULT ||============================== //

const UserSearchPage_Individual = () => {
const [orgCombo, setOrgCombo] = React.useState([]);
const [issueCombo, setIssueCombo] = React.useState([]);
const [searchCriteria, setSearchCriteria] = React.useState({
dateTo: DateUtils.dateValue(new Date()),
dateFrom: DateUtils.dateValue(new Date().setDate(new Date().getDate() - 14))
});
const [onReady, setOnReady] = React.useState(false);

React.useEffect(() => {
getOrgCombo();
getIssueCombo();
}, []);

React.useEffect(() => {
setOnReady(true);
}, [searchCriteria]);

function getOrgCombo() {
HttpUtils.get({
url: UrlUtils.GET_ORG_COMBO,
onSuccess: function (responseData) {
let combo = responseData;
setOrgCombo(combo);
}
});
}

function getIssueCombo() {
HttpUtils.get({
url: UrlUtils.GET_ISSUE_COMBO,
onSuccess: function (responseData) {
let combo = responseData;
setIssueCombo(combo);
}
});
}

function applySearch(input) {
setSearchCriteria(input);
}

return (
!onReady ?
<Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
<Grid item>
<LoadingComponent />
</Grid>
</Grid>
:
<Grid container sx={{ minHeight: '87vh',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" sx={{ "textShadow": "0px 0px 25px #0C489E" }}>Mark Payment</Typography>
</Stack>
</div>
</Grid>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12} sx={{mb: -1}}>
<SearchForm
applySearch={applySearch}
orgComboData={orgCombo}
issueComboData={issueCombo}
searchCriteria={searchCriteria}
/>
</Grid>
{/*row 2*/}
<Grid item xs={12} md={12} lg={12}>
<MainCard elevation={0}
border={false}
content={false}
sx={{ backgroundColor: '#fff' }}
>
<EventTable
searchCriteria={searchCriteria}
/>
</MainCard>
</Grid>
</Grid>
);
}
export default UserSearchPage_Individual;

+ 7
- 0
src/routes/GLDUserRoutes.js Bestand weergeven

@@ -10,6 +10,7 @@ import {isGranted, isGrantedAny} from "auth/utils";
const DashboardDefault = Loadable(lazy(() => import('pages/Dashboard/GLD')));
const ApplicationDetail = Loadable(lazy(() => import('pages/PublicNotice/Details_GLD')));
const ApplicationSearch = Loadable(lazy(() => import('pages/PublicNotice/Search_GLD')));
const ApplicationMarkAsPaidSearch = Loadable(lazy(() => import('pages/PublicNotice/Search_Mark_As_Paid_GLD')));
const ProofSearch = Loadable(lazy(() => import('pages/Proof/Search_GLD')));
const ProofCreate_FromApp = Loadable(lazy(() => import('pages/Proof/Create_FromApp')));
const ProofReply_GLD = Loadable(lazy(() => import('pages/Proof/Reply_GLD')));
@@ -56,6 +57,12 @@ const GLDUserRoutes = {
path: '/application/search',
element: <ApplicationSearch/>
},
isGranted(["MAINTAIN_PAYMENT"])?
{
path: '/application/markAsPaid/search',
element: <ApplicationMarkAsPaidSearch/>
}:{},

isGrantedAny(["VIEW_PROOF","MAINTAIN_PROOF"])?{
path: '/proof/search',


+ 4
- 0
src/utils/ApiPathConst.js Bestand weergeven

@@ -108,6 +108,9 @@ export const GET_PUBLIC_NOTICE_getApplyUser = apiPath+'/application/get-apply-us
export const POST_PUBLIC_NOTICE_APPLY = apiPath+'/application/apply';
export const POST_CHECK_APP_EXPRITY_DATE = apiPath+'/application/checkExprityDate';

export const GET_PUBLIC_NOTICE_OFFLINE_PAYMENT_LIST = apiPath+'/application/list-Mask-As-Paid';
export const SET_PUBLIC_NOTICE_STATUS_MARK_AS_PAID = apiPath+'/application/application-detail-status-Mark-As-Paid';

//GLD User
export const POST_ADMIN_USER_REGISTER = apiPath+'/user/registry';
export const DELETE_USER = apiPath+'/user';
@@ -124,6 +127,7 @@ export const SET_PUBLIC_NOTICE_STATUS_WITHDRAW = apiPath+'/application/applicati
export const SET_PUBLIC_NOTICE_STATUS_RESUBMIT = apiPath+'/application/application-detail-status-resubmit';
export const SET_PUBLIC_NOTICE_STATUS_REVIEWED = apiPath+'/application/application-detail-status-reviewed';
export const SET_PUBLIC_NOTICE_STATUS_PUBLISH = apiPath+'/application/application-detail-status-publish';
export const SET_PUBLIC_NOTICE_STATUS_REVOKE = apiPath+'/application/application-detail-status-Revoke-Payment';
export const SET_PUBLIC_NOTICE_STATUS_PUBLISH_BULK = apiPath+'/application/application-detail-status-publish-bulk';
export const UPDATE_PUBLIC_NOTICE_APPLY_DETAIL = apiPath+'/application/save';
export const GET_AUDIT_LOG_LIST = apiPath+'/settings/auditLogList';


Schrijf Voorbeeld
Laden…
Annuleren
Opslaan