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

do search

master
Anna Ho 1 year ago
parent
3e304e8f49
commit
615134d14a
11 changed files with 527 additions and 331 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +32
    -2
      src/pages/PublicNotice/ListPanel/BaseGrid.js
  2. +0
    -72
      src/pages/PublicNotice/ListPanel/InProgressTab.js
  3. +31
    -2
      src/pages/PublicNotice/ListPanel/PendingPaymentTab.js
  4. +0
    -78
      src/pages/PublicNotice/ListPanel/PendingPublishTab.js
  5. +32
    -0
      src/pages/PublicNotice/ListPanel/PublicNoteStatusUtils.js
  6. +169
    -0
      src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js
  7. +66
    -0
      src/pages/PublicNotice/ListPanel/SearchPublicNoticeTab.js
  8. +118
    -0
      src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
  9. +0
    -107
      src/pages/PublicNotice/ListPanel/SearchTab.js
  10. +68
    -70
      src/pages/PublicNotice/ListPanel/index.js
  11. +11
    -0
      src/utils/ComboData.js

src/pages/PublicNotice/ListPanel/SubmittedTab.js → src/pages/PublicNotice/ListPanel/BaseGrid.js View File

@@ -7,9 +7,10 @@ import {
Button Button
} from '@mui/material'; } from '@mui/material';
import * as DateUtils from "utils/DateUtils" import * as DateUtils from "utils/DateUtils"
import * as StatusUtils from "./PublicNoteStatusUtils";
// ==============================|| EVENT TABLE ||============================== // // ==============================|| EVENT TABLE ||============================== //


export default function SubmittedTab({rows}) {
export default function BaseGrid({rows}) {
const [rowModesModel] = React.useState({}); const [rowModesModel] = React.useState({});


const columns = [ const columns = [
@@ -28,17 +29,46 @@ export default function SubmittedTab({rows}) {
return DateUtils.datetimeStr(params?.value); return DateUtils.datetimeStr(params?.value);
} }
}, },
{
id: 'contactPerson',
field: 'contactPerson',
headerName: '聯絡人',
flex: 2,
renderCell: (params) => {
let phone = JSON.parse(params.row.contactTelNo);
let faxNo = JSON.parse(params.row.contactFaxNo);

let contact = "";
if (phone) {
contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber
}

if (faxNo) {
if (contact != "")
contact = contact + ", "
contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber
}

return (<>
{params?.value}<br />
{contact}
</>);
}
},
{ {
id: 'remarks', id: 'remarks',
field: 'remarks', field: 'remarks',
headerName: '我的備註', headerName: '我的備註',
flex: 1,
flex: 3,
}, },
{ {
id: 'status', id: 'status',
field: 'status', field: 'status',
headerName: '狀態', headerName: '狀態',
flex: 1, flex: 1,
renderCell: (params) => {
return [StatusUtils.getStatus(params)]
},
}, },
{ {
field: 'actions', field: 'actions',

+ 0
- 72
src/pages/PublicNotice/ListPanel/InProgressTab.js View File

@@ -1,72 +0,0 @@
// material-ui
import * as React from 'react';
import {
DataGrid,
} from "@mui/x-data-grid";
import {
Button
} from '@mui/material';
import * as DateUtils from "../../../utils/DateUtils"
// ==============================|| EVENT TABLE ||============================== //

export default function SubmittedTab({ rows }) {
const [rowModesModel] = React.useState({});

const columns = [
{
id: 'appNo',
field: 'appNo',
headerName: '申請編號',
flex: 1,
},
{
id: 'created',
field: 'created',
headerName: '提交日期',
flex: 1,
valueGetter: (params) => {
return DateUtils.datetimeStr(params.value);
}
},
{
id: 'remarks',
field: 'remarks',
headerName: '我的備註',
flex: 1,
},
{
id: 'status',
field: 'status',
headerName: '狀態',
flex: 1,
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 50,
cellClassName: 'actions',
renderCell: () => {
return <Button onClick={() => { }}>查看詳細</Button>;
},
}
];

return (
<div style={{ height: 400, width: '100%' }}>
<DataGrid
rows={rows}
columns={columns}
editMode="row"
rowModesModel={rowModesModel}
initialState={{
pagination: {
paginationModel: { page: 0, pageSize: 5 },
},
}}
pageSizeOptions={[5, 10]}
autoHeight={true}
/>
</div>
);
}

+ 31
- 2
src/pages/PublicNotice/ListPanel/PendingPaymentTab.js View File

@@ -10,7 +10,7 @@ import {
Dialog, DialogTitle, DialogContent, DialogActions Dialog, DialogTitle, DialogContent, DialogActions
} from '@mui/material'; } from '@mui/material';
import * as DateUtils from "utils/DateUtils" import * as DateUtils from "utils/DateUtils"
import * as StatusUtils from "./PublicNoteStatusUtils";
// ==============================|| EVENT TABLE ||============================== // // ==============================|| EVENT TABLE ||============================== //


export default function SubmittedTab({ rows }) { export default function SubmittedTab({ rows }) {
@@ -34,11 +34,37 @@ export default function SubmittedTab({ rows }) {
return DateUtils.datetimeStr(params.value); return DateUtils.datetimeStr(params.value);
} }
}, },
{
id: 'contactPerson',
field: 'contactPerson',
headerName: '聯絡人',
flex: 2,
renderCell: (params) => {
let phone = JSON.parse(params.row.contactTelNo);
let faxNo = JSON.parse(params.row.contactFaxNo);

let contact = "";
if (phone) {
contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber
}

if (faxNo) {
if (contact != "")
contact = contact + ", "
contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber
}

return (<>
{params?.value}<br />
{contact}
</>);
}
},
{ {
id: 'remarks', id: 'remarks',
field: 'remarks', field: 'remarks',
headerName: '我的備註', headerName: '我的備註',
flex: 1,
flex: 3,


}, },
{ {
@@ -46,6 +72,9 @@ export default function SubmittedTab({ rows }) {
field: 'status', field: 'status',
headerName: '狀態', headerName: '狀態',
flex: 1, flex: 1,
renderCell: (params) => {
return [StatusUtils.getStatus(params)]
},
}, },
{ {
field: 'actions', field: 'actions',


+ 0
- 78
src/pages/PublicNotice/ListPanel/PendingPublishTab.js View File

@@ -1,78 +0,0 @@
// material-ui
import * as React from 'react';
import {
DataGrid,
} from "@mui/x-data-grid";
import {
Button
} from '@mui/material';
import * as DateUtils from "utils/DateUtils"
// ==============================|| EVENT TABLE ||============================== //

export default function SubmittedTab({rows}) {
const [rowModesModel] = React.useState({});

const columns = [
{
id: 'appNo',
field: 'appNo',
headerName: '申請編號',
flex: 1,
},
{
id: 'created',
field: 'created',
headerName: '提交日期',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
id: 'remarks',
field: 'remarks',
headerName: '我的備註',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
id: 'status',
field: 'status',
headerName: '狀態',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 50,
cellClassName: 'actions',
renderCell: () => {
return <Button onClick={()=>{}}>查看詳細</Button>;
},
}
];

return (
<div style={{height: 400, width: '100%'}}>
<DataGrid
rows={rows}
columns={columns}
editMode="row"
rowModesModel={rowModesModel}
initialState={{
pagination: {
paginationModel: {page: 0, pageSize: 5},
},
}}
pageSizeOptions={[5, 10]}
autoHeight = {true}
/>
</div>
);
}

+ 32
- 0
src/pages/PublicNotice/ListPanel/PublicNoteStatusUtils.js View File

@@ -0,0 +1,32 @@


export function getStatus(params) {
switch (params.row.status) {
case "submitted":
return getStatusTag({ color: "#f5a83d", text: "已提交" })
case "rejected":
return getStatusTag({ color: "#d9372b", text: "已拒絕" })
case "cancelled":
return getStatusTag({ color: "#757373", text: "已取消" })
case "accepted":
return getStatusTag({ color: "#22a13f", text: "已接受" })
case "confirmed":
return getStatusTag({ color: "#22a13f", text: "已確認" })
case "paid":
return getStatusTag({ color: "#22a13f", text: "已付費" })
case "published":
return getStatusTag({ color: "#f5a83d", text: "已發表" })
case "withdrawn":
return getStatusTag({ color: "#8a8784", text: "已撤銷" })
default:
return getStatusTag({ text: params.row.status })
}


}

export function getStatusTag({ color = "#000", textColor = "#FFF", text = "" }) {
return (
<div style={{ "border-radius": "25px", "background": color, "color": textColor, "padding": "5px 10px 5px 10px" }}><b>{text}</b></div>
)
}

+ 169
- 0
src/pages/PublicNotice/ListPanel/SearchPublicNoticeForm.js View File

@@ -0,0 +1,169 @@
// material-ui
import {
Button,
CardContent,
Grid, TextField,
Autocomplete
} 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";
// ==============================|| DASHBOARD - DEFAULT ||============================== //


const SearchPublicNoticeForm = ({ applySearch }) => {

const [type, setType] = React.useState([]);
const [status, setStatus] = React.useState();

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

let typeArray = [];

for (let i = 0; i < type.length; i++) {
typeArray.push(type[i].label);
}

const temp = {
appNo: data.appNo,
dateFrom: data.dateFrom,
dateTo: data.dateTo,
contact: data.contact,
status: status?.type,
};
applySearch(temp);
};

function resetForm() {
setType([]);
setStatus();
reset();
}

return (
<MainCard xs={12} md={12} lg={12}
border={false}
content={false}>

<form onSubmit={handleSubmit(onSubmit)}>
{/*row 1*/}
<CardContent sx={{ px: 2.5, pt: 3 }}>
<Grid item justifyContent="space-between" alignItems="center">
Search Form
</Grid>
</CardContent>

{/*row 2*/}
<Grid container alignItems={"center"}>
<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("appNo")}
id='appNo'
label="申請編號"
/>
</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="提交日期(從)"
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")}
id="dateTo"
type="date"
label="提交日期(到)"
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<TextField
fullWidth
{...register("contact")}
id="contact"
label="聯絡人"
/>
</Grid>

<Grid item xs={9} s={6} md={5} lg={3} sx={{ ml: 3, mr: 3, mb: 3 }}>
<Autocomplete
{...register("status")}
disablePortal
id="status"
options={ComboData.publicNoticeStatic}
value={status}
onChange={(event, newValue) => {
if (newValue !== null) {
setStatus(newValue);
}
}}
renderInput={(params) => (
<TextField {...params}
label="狀態"
/>
)}
/>
</Grid>
{/*<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>*/}
{/* <TextField*/}
{/* fullWidth*/}
{/* {...register("subDivisionId")}*/}
{/* id="subDivision"*/}
{/* label="Sub-Division"*/}
{/* />*/}
{/*</Grid>*/}

</Grid>


{/*last row*/}
<Grid container maxWidth justifyContent="flex-end">

<Grid item sx={{ ml: 3, mr: 3, mb: 3, mt: 3 }}>
<Button
size="large"
variant="contained"
onClick={resetForm}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
Clear
</Button>
</Grid>

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

export default SearchPublicNoticeForm;

+ 66
- 0
src/pages/PublicNotice/ListPanel/SearchPublicNoticeTab.js View File

@@ -0,0 +1,66 @@
// material-ui
import {
Grid
} from '@mui/material';
import MainCard from "components/MainCard";
import {GET_PUBLIC_NOTICE_LIST} from "utils/ApiPathConst";
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";

import Loadable from 'components/Loadable';
const SearchForm = Loadable(React.lazy(() => import('./SearchPublicNoticeForm')));
const EventTable = Loadable(React.lazy(() => import('./SearchPublicNoticeTable')));

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

const UserSearchPage_Individual = () => {

const [record,setRecord] = React.useState([]);
const [searchCriteria, setSearchCriteria] = React.useState({});

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

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

function getUserList(){
HttpUtils.get({
url: GET_PUBLIC_NOTICE_LIST,
params: searchCriteria,
onSuccess: function(responseData){
setRecord(responseData);
}
});
}

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

return (
<Grid container rowSpacing={4.5} columnSpacing={2.75}>
{/*row 1*/}
<Grid item xs={12} md={12} lg={12}>
<SearchForm applySearch={applySearch}/>
</Grid>
{/*row 2*/}
<Grid item xs={12} md={12} lg={12}>
<MainCard elevation={0}
border={false}
content={false}
>
<EventTable
recordList={record}
/>
</MainCard>
</Grid>

</Grid>

);
};

export default UserSearchPage_Individual;

+ 118
- 0
src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js View File

@@ -0,0 +1,118 @@
// material-ui
import * as React from 'react';
import {
DataGrid,
} from "@mui/x-data-grid";
import {
Button
} from '@mui/material';
import { useEffect } from "react";
import * as DateUtils from "utils/DateUtils";
import * as StatusUtils from "./PublicNoteStatusUtils";
// ==============================|| EVENT TABLE ||============================== //

export default function SearchPublicNoticeTable({ recordList }) {
const [rows, setRows] = React.useState(recordList);
const [rowModesModel] = React.useState({});

useEffect(() => {
setRows(recordList);
}, [recordList]);

const columns = [
{
id: 'appNo',
field: 'appNo',
headerName: '申請編號',
flex: 1,
},
{
id: 'created',
field: 'created',
headerName: '提交日期',
flex: 1,
valueGetter: (params) => {
return DateUtils.datetimeStr(params?.value);
}
},
{
id: 'contactPerson',
field: 'contactPerson',
headerName: '聯絡人',
flex: 2,
renderCell: (params) => {
let phone = JSON.parse(params.row.contactTelNo);
let faxNo = JSON.parse(params.row.contactFaxNo);

let contact = "";
if (phone) {
contact = "電話: " + phone?.countryCode + " " + phone?.phoneNumber
}

if (faxNo) {
if (contact != "")
contact = contact + ", "
contact = contact + "傳真:" + faxNo?.countryCode + " " + faxNo?.faxNumber
}

return (<>
{params?.value}<br />
{contact}
</>);
}
},
{
id: 'remarks',
field: 'remarks',
headerName: '我的備註',
flex: 3,
},
{
id: 'status',
field: 'status',
headerName: '狀態',
width: 100,
renderCell: (params) => {
return [StatusUtils.getStatus(params)]
},
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 100,
cellClassName: 'actions',
renderCell: () => {
return <Button onClick={() => { }}>查看詳細</Button>;
},
}
];


return (
<div style={{ height: 400, width: '100%' }}>

<DataGrid
rows={rows}
columns={columns}
editMode="row"
rowModesModel={rowModesModel}
initialState={{
pagination: {
paginationModel: { page: 0, pageSize: 5 },
},
}}
pageSizeOptions={[5, 10]}
autoHeight
sx={{
boxShadow: 1,
border: 1,
borderColor: '#DDD',
'& .super-app-theme--header': {
backgroundColor: '#EEE',
},
}}
/>
</div>
);
}

+ 0
- 107
src/pages/PublicNotice/ListPanel/SearchTab.js View File

@@ -1,107 +0,0 @@
// material-ui
import * as React from 'react';
import {
OutlinedInput,
Button
} from '@mui/material';
import {
DataGrid,
GridActionsCellItem,
} from "@mui/x-data-grid";
import * as Icon from '../../../utils/IconUtils';
import * as DateUtils from "../../../utils/DateUtils"
// ==============================|| EVENT TABLE ||============================== //

export default function SubmittedTab({rows}) {
const [rowModesModel] = React.useState({});

const columns = [
{
id: 'appNo',
field: 'appNo',
headerName: '申請編號',
flex: 1,
},
{
id: 'created',
field: 'created',
headerName: '提交日期',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
id: 'remarks',
field: 'remarks',
headerName: '我的備註',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
id: 'status',
field: 'status',
headerName: '狀態',
flex: 1,
valueGetter:(params)=>{
return DateUtils.datetimeStr(params.value);
}
},
{
field: 'actions',
type: 'actions',
headerName: '',
width: 50,
cellClassName: 'actions',
getActions: (params) => {
return [
<GridActionsCellItem
key="OutSave"
icon={<Icon.Download/>}
label="查看詳細"
className="textPrimary"
onClick={onDownloadClick(params.id, params.row.skey, params.row.filename)}
color="primary"
/>]
},
}
];

const doSearch=()=>{

}

return (
<div style={{height: 400, width: '100%'}}>

<center>
<div>
<OutlinedInput
style={{width: 400}}
id="chName-signup"
type="text"
name="chName"
placeholder="搜尋..."
/>
<Button variant="contained" onClick={()=>{doSearch()}}>搜尋</Button>
</div>
</center>
<DataGrid
rows={rows}
columns={columns}
editMode="row"
rowModesModel={rowModesModel}
initialState={{
pagination: {
paginationModel: {page: 0, pageSize: 5},
},
}}
pageSizeOptions={[5, 10]}
autoHeight = {true}
/>
</div>
);
}

+ 68
- 70
src/pages/PublicNotice/ListPanel/index.js View File

@@ -1,54 +1,52 @@
// material-ui // material-ui
import { import {
Grid,
Typography,
Tab,
Grid,
Typography,
Tab,
Box, Box,
Button Button
} from '@mui/material'; } from '@mui/material';


import {TabPanel, TabContext, TabList } from '@mui/lab';
import {useEffect, useState} from "react";
import {useNavigate} from "react-router-dom";
import { TabPanel, TabContext, TabList } from '@mui/lab';
import { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import * as React from "react"; import * as React from "react";
import * as HttpUtils from "../../../utils/HttpUtils"; import * as HttpUtils from "../../../utils/HttpUtils";
import * as UrlUtils from "../../../utils/ApiPathConst"; import * as UrlUtils from "../../../utils/ApiPathConst";


import Loadable from 'components/Loadable'; import Loadable from 'components/Loadable';
import { lazy } from 'react'; import { lazy } from 'react';
const SubmittedTab = Loadable(lazy(() => import('./SubmittedTab')));
const InProgressTab = Loadable(lazy(() => import('./InProgressTab')));
const PendingPaymentTab = Loadable(lazy(() => import('./PendingPaymentTab')));
const PendingPublishTab = Loadable(lazy(() => import('./PendingPublishTab')));
const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
const SearchTab = Loadable(lazy(() => import('./SearchTab')));
const BaseGrid = Loadable(lazy(() => import('./BaseGrid')));
const PendingPaymentTab = Loadable(lazy(() => import('./PendingPaymentTab')));
const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent')));
const SearchTab = Loadable(lazy(() => import('./SearchPublicNoticeTab')));




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


const PublicNotice = () => { const PublicNotice = () => {
const [submittedList, setSubmittedList] = useState([]);
const [inProgressList, setInProgressList] = useState([]);
const [pendingPaymentList, setPendingPaymentList] = useState([]);
const [pendingPublishList, setPendingPublishList] = useState([]);
const [submittedList, setSubmittedList] = useState([]);
const [inProgressList, setInProgressList] = useState([]);
const [pendingPaymentList, setPendingPaymentList] = useState([]);
const [pendingPublishList, setPendingPublishList] = useState([]);
const [isLoading, setLoding] = useState(true); const [isLoading, setLoding] = useState(true);
const [selectedTab, setSelectedTab] = useState("1"); const [selectedTab, setSelectedTab] = useState("1");
const navigate=useNavigate();
const navigate = useNavigate();




useEffect(()=>{
useEffect(() => {
loadData(); loadData();
},[]);
}, []);


const reloadPage=()=>{
const reloadPage = () => {
window.location.reload(false); window.location.reload(false);
} }


const loadData = ()=>{
const loadData = () => {
setLoding(true); setLoding(true);
HttpUtils.get({ HttpUtils.get({
url: `${UrlUtils.GET_PUBLIC_NOTICE_LIST_ListByStatus}`, url: `${UrlUtils.GET_PUBLIC_NOTICE_LIST_ListByStatus}`,
onSuccess: function(response){
onSuccess: function (response) {
setSubmittedList(response["submitted"]); setSubmittedList(response["submitted"]);
setInProgressList(response["inProgress"]); setInProgressList(response["inProgress"]);
setPendingPaymentList(response["pendingPayment"]); setPendingPaymentList(response["pendingPayment"]);
@@ -58,71 +56,71 @@ const PublicNotice = () => {
}; };


useEffect(() => { useEffect(() => {
setLoding(false);
setLoding(false);
}, [submittedList]); }, [submittedList]);


const handleChange = (event, newValue)=>{
const handleChange = (event, newValue) => {
setSelectedTab(newValue); setSelectedTab(newValue);
} }


const onBtnClick=()=>{
const onBtnClick = () => {
navigate('/publicNotice/apply') navigate('/publicNotice/apply')
} }


return ( return (
isLoading ? isLoading ?
<LoadingComponent/>
<LoadingComponent />
: :
<Grid container rowSpacing={4.5} columnSpacing={2.75}> <Grid container rowSpacing={4.5} columnSpacing={2.75}>
<Grid item xs={12} sx={{mb: -2.25}}>
<Grid item xs={12} sx={{ mb: -2.25 }}>
<Typography variant="h5">我的公共啟事</Typography> <Typography variant="h5">我的公共啟事</Typography>
</Grid> </Grid>
<Grid item xs={12} sx={{mb: -2.25}}>
<Button variant="contained" onClick={()=>{onBtnClick()}}>申請公共啟事</Button>
<Grid item xs={12} sx={{ mb: -2.25 }}>
<Button variant="contained" onClick={() => { onBtnClick() }}>申請公共啟事</Button>
</Grid> </Grid>
{/*col 2*/} {/*col 2*/}
<Grid item xs={12}> <Grid item xs={12}>
<TabContext value={selectedTab}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<TabList onChange={handleChange} aria-label="lab API tabs example">
<Tab label={"已提交("+submittedList.length+")"} value="1" />
<Tab label={"處理中("+inProgressList.length+")"} value="2" />
<Tab label={"待付款("+pendingPaymentList.length+")"} value="3" />
<Tab label={"待發佈("+pendingPublishList.length+")"} value="4" />
<Tab label="搜尋申請記錄" value="5" />
</TabList>
</Box>
<TabPanel value="1">
<SubmittedTab
rows={submittedList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="2">
<InProgressTab
rows={inProgressList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="3">
<PendingPaymentTab
rows={pendingPaymentList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="4">
<PendingPublishTab
rows={pendingPublishList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="5">
<SearchTab
rows={pendingPublishList}
reloadFunction={reloadPage}
/>
</TabPanel>
</TabContext>
<TabContext value={selectedTab}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<TabList onChange={handleChange} aria-label="lab API tabs example">
<Tab label={"已提交(" + submittedList.length + ")"} value="1" />
<Tab label={"處理中(" + inProgressList.length + ")"} value="2" />
<Tab label={"待付款(" + pendingPaymentList.length + ")"} value="3" />
<Tab label={"待發佈(" + pendingPublishList.length + ")"} value="4" />
<Tab label="搜尋申請記錄" value="5" />
</TabList>
</Box>
<TabPanel value="1">
<BaseGrid
rows={submittedList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="2">
<BaseGrid
rows={inProgressList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="3">
<PendingPaymentTab
rows={pendingPaymentList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="4">
<BaseGrid
rows={pendingPublishList}
reloadFunction={reloadPage}
/>
</TabPanel>
<TabPanel value="5">
<SearchTab
rows={pendingPublishList}
reloadFunction={reloadPage}
/>
</TabPanel>
</TabContext>
</Grid> </Grid>
</Grid> </Grid>
); );


+ 11
- 0
src/utils/ComboData.js View File

@@ -10,3 +10,14 @@ export const district = ['北區', '長洲區', '大埔區', '大嶼山區', '
export const country = ["香港","內地","澳門"]; 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 = [
{ key: 1, label: '已提交', type: 'submitted' },
{ key: 2, label: '已拒絕', type: 'rejected' },
{ key: 3, label: '已取消', type: 'cancelled' },
{ key: 4, label: '已接受', type: 'accepted' },
{ key: 5, label: '已確認', type: 'confirmed' },
{ key: 6, label: '已付費', type: 'paid' },
{ key: 7, label: '已發表', type: 'published' },
{ key: 8, label: '已撤銷', type: 'withdrawn' },
];

Write Preview
Loading…
Cancel
Save