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

update table

master
jason.lam 1 year ago
parent
9b4b87c11b
commit
ad113beeae
10 changed files with 65 additions and 32 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -0
      src/pages/DemandNote/Details/ApplicationDetailCard.js
  2. +1
    -1
      src/pages/Proof/Reply_GLD/ProofForm.js
  3. +7
    -4
      src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
  4. +2
    -1
      src/pages/PublicNotice/Details_GLD/ApplicationDetailCard.js
  5. +11
    -11
      src/pages/PublicNotice/Details_GLD/index.js
  6. +10
    -4
      src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js
  7. +16
    -6
      src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js
  8. +11
    -3
      src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js
  9. +1
    -1
      src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js
  10. +5
    -1
      src/utils/FieldUtils.js

+ 1
- 0
src/pages/DemandNote/Details/ApplicationDetailCard.js View File

@@ -159,6 +159,7 @@ const ApplicationDetailCard = ({ data }) => {
// fullWidth
id='fileName'
variant="h5"
sx={{ wordBreak: 'break-word' }}
>
{appDetail.appFilename}
</Typography>


+ 1
- 1
src/pages/Proof/Reply_GLD/ProofForm.js View File

@@ -50,7 +50,7 @@ const FormPanel = ({ formData, isOverTime }) => {
<Typography variant="h5">Reply Date: {DateUtils.datetimeStr(formik.values.replyDate)}</Typography>
</Grid>
<Grid item xs={12} md={12} textAlign="left">
<Typography variant="h5">Reply: {formik.values.action ? (<span style={{ color: 'green' }}>Ready for printing (correct manuscript).</span>) : (<span style={{ color: 'red' }}>Not ready for printing (requires modification).</span>)}</Typography>
<Typography variant="h5" >Reply: {formik.values.action ? (<span style={{ color: 'green' }}>Ready for printing (correct manuscript).</span>) : (<span style={{ color: 'red' }}>Not ready for printing (requires modification).</span>)}</Typography>
</Grid>
{
formik.values.action ?


+ 7
- 4
src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js View File

@@ -21,6 +21,8 @@ import {

import { useNavigate } from "react-router-dom";
import { notifyActionSuccess } from 'utils/CommonFunction';
import {PNSPS_LONG_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";

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

@@ -132,7 +134,7 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
</Stack>
</div>
</Grid>
<Grid item xs={12} width="60%">
<Grid item xs={12} width={{xs:"90%", sm:"90%", md:"60%", lg:"60%"}}>
<Button title="返回" sx={{ ml: 0, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/publicNotice") }}>
<ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
</Button>
@@ -180,7 +182,7 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
sx={{ display: 'flex', alignItems: 'center' }}>
<Typography variant="h5">目標期數:</Typography>
</Grid>
<Grid item xs={12} md={6} lg={6}>
<Grid item xs={12} md={9} lg={6}>
<RadioGroup
aria-labelledby="demo-radio-buttons-group-label"
id="issueId"
@@ -204,7 +206,7 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
sx={{ display: 'flex', alignItems: 'center' }}>
<Typography variant="h5">稿件檔案 ({"檔案大小應<10MB"}):</Typography>
</Grid>
<Grid item xs={12} md={3} lg={3}>
<Grid item xs={12} md={6} lg={6} sx={{ wordBreak: 'break-word' }}>
<input
id="uploadFileBtn"
name="file"
@@ -248,11 +250,12 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
</Grid>
<Grid item xs={12}>
<center>
<ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
<Button
variant="contained"
type="submit"
size="large"
>申請公共啟事</Button>
</ThemeProvider>
</center>
</Grid>
</Grid>


+ 2
- 1
src/pages/PublicNotice/Details_GLD/ApplicationDetailCard.js View File

@@ -475,7 +475,7 @@ const ApplicationDetailCard = (
<Grid container direction="row">
<Grid item xs={12} md={3} lg={3}
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel><Typography variant="h5">Manuscript File:</Typography></FormLabel>
<FormLabel><Typography variant="h5" >Manuscript File:</Typography></FormLabel>
</Grid>
<Grid item xs={12} md={9} lg={9} sx={{ display: 'flex', alignItems: 'center' }}>
<Grid container direction="row" justifyContent="flex-start">
@@ -485,6 +485,7 @@ const ApplicationDetailCard = (
// fullWidth
id='fileName'
variant="h5"
sx={{ wordBreak: 'break-word' }}
>
{fileDetail.filename}
</Typography>


+ 11
- 11
src/pages/PublicNotice/Details_GLD/index.js View File

@@ -301,7 +301,7 @@ const PublicNoticeDetail_GLD = () => {
}, [getUploadStatus]);

return (
<Grid container sx={{ maxHeight: '500vh', backgroundColor: 'backgroundColor.default' }} direction="column">
<Grid container sx={{ maxHeight: '500vh',width:"100%", backgroundColor: 'backgroundColor.default' }} direction="column">
<StatusChangeDialog open={open}
handleClose={handleClose}
setReason={setReason}
@@ -316,7 +316,7 @@ const PublicNoticeDetail_GLD = () => {
selectedGazetteGroupInputType={selectedGazetteGroupInputType}
setSelectedGazetteGroupInputType={setSelectedGazetteGroupInputType}
/>
<Grid item xs={12}>
<Grid item xs={12} >
<div style={BackgroundHead}>
<Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
<Typography ml={15} color='#FFF' variant="h4">Application</Typography>
@@ -338,10 +338,10 @@ const PublicNoticeDetail_GLD = () => {
</Grid> */}
<Grid item xs={12} >
<Grid container direction="row">
<Grid item xs={12} md={10} lg={10} xl={10}>
<Grid item xs={12} md={12} lg={9} xl={9}>
<Grid container direction="column">
<Grid item xs={12} md={10} lg={10} xl={10}>
<Box xs={12} ml={4} mt={3} sx={{ p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
<Box xs={12} sx={{ ml:2 , mt:3, mr:{xs:2, sm:2}, p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
{isLoading && editMode ?
<LoadingComponent /> :
<ApplicationDetailCard
@@ -357,8 +357,8 @@ const PublicNoticeDetail_GLD = () => {
}
</Box>
</Grid>
<Grid item xs={12} md={10} lg={10} xl={10}>
<Box xs={12} ml={4} mt={3} sx={{ p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<Grid item xs={12} md={12} lg={12} xl={12}>
<Box xs={12} sx={{ml:2, mt:3, mr:{xs:2, sm:2}, p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<GazetteDetailCard
// updateUserObject={updateUserObject}
applicationDetailData={applicationDetailData}
@@ -368,8 +368,8 @@ const PublicNoticeDetail_GLD = () => {
/>
</Box>
</Grid>
<Grid item xs={12} md={10} lg={10} xl={10}>
<Box xs={12} ml={4} mt={3} sx={{ p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<Grid item xs={12} md={12} lg={12} xl={12}>
<Box xs={12} sx={{ml:2, mt:3, mr:{sm:2}, p: 0, borderRadius: '10px',width: {xs:'92vw', sm:'96.5vw', md:"auto"}, backgroundColor: '#ffffff' }}>
<TabTableDetail
applicationDetailData={applicationDetailData}
proofList={proofList}
@@ -380,10 +380,10 @@ const PublicNoticeDetail_GLD = () => {
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={2} lg={2} xl={2}>
<Grid item xs={12} md={12} lg={3} xl={3}>
<Grid container>
<Grid item xs={12} md={12}>
<Box xs={12} md={12} ml={3} mt={3} mr={1} height='800px' sx={{ p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<Box xs={12} md={12} height='800px' sx={{ ml:2, mt:3, mr:{xs:2, sm:2}, p: 2, borderRadius: '10px', backgroundColor: '#ffffff' }}>
<ClientDetailCard
// updateUserObject={updateUserObject}
applicationDetailData={applicationDetailData}


+ 10
- 4
src/pages/PublicNotice/Details_GLD/tabTableDetail/PaymentTab.js View File

@@ -1,19 +1,22 @@
// material-ui
import * as React from 'react';
import {
Button
Button, useMediaQuery
} from '@mui/material';
import { useNavigate } from "react-router-dom";
import {FiDataGrid} from "components/FiDataGrid";
import * as FormatUtils from "utils/FormatUtils"
import * as DateUtils from "utils/DateUtils"
import * as PaymentStatus from "utils/statusUtils/PaymentStatus"
import {useTheme} from "@emotion/react";
// import * as StatusUtils from "./PublicNoteStatusUtils";
// ==============================|| EVENT TABLE ||============================== //

export default function SubmittedTab({ rows }) {

const navigate = useNavigate()
const theme = useTheme();
const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));

const handleEditClick = (params) => () => {
navigate('/paymentPage/details/' + params.row.id);
@@ -23,7 +26,8 @@ export default function SubmittedTab({ rows }) {
{
field: 'actions',
headerName: 'Trans. No.',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
cellClassName: 'actions',
renderCell: (params) => {
return <Button onClick={handleEditClick(params)}><u>{params.row.transNo}</u></Button>;
@@ -33,7 +37,8 @@ export default function SubmittedTab({ rows }) {
id: 'transDateTime',
field: 'transDateTime',
headerName: 'Trans. Date',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
valueGetter: (params) => {
return DateUtils.datetimeStr(params.value);
}
@@ -42,7 +47,8 @@ export default function SubmittedTab({ rows }) {
id: 'status',
field: 'status',
headerName: 'Status',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
renderCell: (params) => {
return PaymentStatus.getStatus_Eng(params);
}


+ 16
- 6
src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js View File

@@ -1,7 +1,7 @@
// material-ui
import * as React from 'react';
import {
Button,
Button, useMediaQuery,
} from '@mui/material';
import {
GridActionsCellItem,
@@ -14,11 +14,14 @@ import {FiDataGrid} from "components/FiDataGrid";
import * as FormatUtils from "utils/FormatUtils"
import * as HttpUtils from "utils/HttpUtils"
import * as UrlUtils from "utils/ApiPathConst"
import {useTheme} from "@emotion/react";
// ==============================|| EVENT TABLE ||============================== //

export default function ProofTab({rows}) {

const navigate = useNavigate()
const theme = useTheme();
const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));

const handleEditClick = (params) => () => {
navigate('/proof/reply/' + params.row.id);
@@ -35,7 +38,8 @@ export default function ProofTab({rows}) {
field: 'refNo',
headerName: 'Proof No.',
width: 200,
width: isMdOrLg ? 'auto' : 200,
flex: isMdOrLg ? 1 : undefined,
cellClassName: 'actions',
renderCell: (params) => {
return <Button onClick={handleEditClick(params)}><u>{params.row.refNo}</u></Button>;
@@ -44,7 +48,8 @@ export default function ProofTab({rows}) {
{
field: 'status',
headerName: 'Status',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
renderCell: (params) => {
return ProofStatus.getStatus_Eng(params);
},
@@ -52,7 +57,9 @@ export default function ProofTab({rows}) {
{
field: 'created',
headerName: 'Proof Date',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,

valueGetter: (params) => {
return DateUtils.datetimeStr(params?.value);
}
@@ -60,7 +67,8 @@ export default function ProofTab({rows}) {
{
field: 'replyDate',
headerName: 'Confirmed/Return Date',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
valueGetter: (params) => {
return params?.value?DateUtils.datetimeStr(params?.value):"";
}
@@ -68,7 +76,9 @@ export default function ProofTab({rows}) {
{
field: 'fee',
headerName: 'Fee',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,

valueGetter: (params) => {
return (params?.value)?"$ "+FormatUtils.currencyFormat(params?.value):"";
}


+ 11
- 3
src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js View File

@@ -7,16 +7,22 @@ import {FiDataGrid} from "components/FiDataGrid";
// } from '@mui/material';
import * as DateUtils from "utils/DateUtils"
import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";
import {useTheme} from "@emotion/react";
import {useMediaQuery} from "@mui/material";

// ==============================|| EVENT TABLE ||============================== //

export default function StatusHistoryTab({rows}) {
const theme = useTheme();
const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));

const columns = [
{
id: 'created',
field: 'created',
headerName: 'Date',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
valueGetter: (params) => {
return DateUtils.datetimeStr(params?.value);
}
@@ -26,13 +32,15 @@ export default function StatusHistoryTab({rows}) {
id: 'createdBy',
field: 'createdBy',
headerName: 'Changed By',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
},
{
id: 'status',
field: 'status',
headerName: 'Status',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
renderCell: (params) => {
return [StatusUtils.getStatusEng(params)]
},


+ 1
- 1
src/pages/PublicNotice/Details_GLD/tabTableDetail/TabTable.js View File

@@ -74,7 +74,7 @@ const PublicNotice = ({ applicationDetailData, proofList, paymentList }) => {
{/*col 2*/}
<Grid item xs={12}>
<TabContext value={selectedTab}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<Box sx={{ borderBottom: 1, borderColor: 'divider', overflowX: 'auto' }}>
<TabList onChange={handleChange} aria-label="lab API tabs example">
<Tab label={"Proof(" + _proofList?.length + ") "} value="1" />
<Tab label={"Payment(" + _paymentList.length + ") "} value="2" />


+ 5
- 1
src/utils/FieldUtils.js View File

@@ -60,6 +60,9 @@ export const getTextArea = ({ label, valueName, form, disabled, inputProps, ...p
minRows: 4,
maxRows: 4,
inputProps: inputProps,
InputProps: {
style: { minHeight:'42.5px', maxHeight: '50vh',height: 'auto' },
},
props
})}
</Grid>
@@ -170,7 +173,7 @@ export const getComboField = ({ label, dataList, valueName, form, disabled, getO
</Grid>;
}

export const initField = ({ type, valueName, form, disabled, multiline, handleChange, placeholder, inputProps, width, ...props }) => {
export const initField = ({ type, valueName, form, disabled, multiline, handleChange, placeholder, inputProps, InputProps, width, ...props }) => {
let err = Boolean(form.errors[valueName]);

return <TextField
@@ -181,6 +184,7 @@ export const initField = ({ type, valueName, form, disabled, multiline, handleCh
type={type}
placeholder={placeholder}
inputProps={inputProps}
InputProps={InputProps}
error={err}
helperText={form.errors[valueName] ? form.errors[valueName] : ''}
onChange={handleChange ? handleChange : form.handleChange}


Write Preview
Loading…
Cancel
Save