Browse Source

update proof reply

master
jason.lam 1 year ago
parent
commit
f3edc59062
3 changed files with 64 additions and 68 deletions
  1. +29
    -23
      src/pages/Proof/Reply_Public/ApplicationDetails.js
  2. +1
    -1
      src/pages/Proof/Reply_Public/ProofForm.js
  3. +34
    -44
      src/pages/Proof/Reply_Public/index.js

+ 29
- 23
src/pages/Proof/Reply_Public/ApplicationDetails.js View File

@@ -119,7 +119,7 @@ const ApplicationDetailCard = ({ formData, }) => {
</Grid> </Grid>
</Grid> </Grid>
</Grid> </Grid>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: 1 }}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: {xs:0, sm:0, md:1, lg:1} }}>
<Grid container alignItems={"center"}> <Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3} <Grid item xs={12} md={3} lg={3}
sx={{ display: 'flex', alignItems: 'center' }}> sx={{ display: 'flex', alignItems: 'center' }}>
@@ -147,7 +147,7 @@ const ApplicationDetailCard = ({ formData, }) => {
</Grid> </Grid>
</Grid> </Grid>
</Grid> </Grid>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: 1 }}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: {xs:0, sm:0, md:1, lg:1} }}>
<Grid container alignItems={"center"}> <Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3} <Grid item xs={12} md={3} lg={3}
sx={{ display: 'flex', alignItems: 'center' }}> sx={{ display: 'flex', alignItems: 'center' }}>
@@ -178,29 +178,36 @@ const ApplicationDetailCard = ({ formData, }) => {
</Grid> </Grid>
</Grid> </Grid>


<Grid container direction="row" justifyContent="space-between"
alignItems="center">
<Grid container
direction="row"
justifyContent="space-between"
alignItems="center"
width="auto"
>


<Grid item xs={12} md={6} lg={6} sx={{ mb: 1, }}>
<Grid item xs={12} sm={12} md={6} lg={6} sx={{mb: 1}}>
<Grid container alignItems={"center"}> <Grid container alignItems={"center"}>
<Grid item xs={12} md={12} lg={12} sx={{ display: 'flex', alignItems: 'center' }}>
<Grid item xs={12} sm={12} md={12} lg={12} sx={{ alignItems: 'center',wordBreak: 'break-word' }}>
<Typography><Typography variant="h5">請下載下列印刷稿檔案,並仔細校對:</Typography></Typography> <Typography><Typography variant="h5">請下載下列印刷稿檔案,並仔細校對:</Typography></Typography>
</Grid> </Grid>
<Grid item xs={12} sm={12} md={12} lg={12} sx={{ width:'95%', maxWidth: {xs:'70vw', sm:'72vw', md:'75vw',lg:'80vw'}}}>
<FileList
lang="ch"
refId={params.id}
refType={"proof"}
dateHideable={true}
disablePagination
disableSelectionOnClick
disableColumnMenu
disableColumnSelector
hideFooter
/>
</Grid>
</Grid> </Grid>
<FileList
lang="ch"
refId={params.id}
refType={"proof"}
dateHideable={true}
disablePagination
disableSelectionOnClick
disableColumnMenu
disableColumnSelector
hideFooter
/>

</Grid> </Grid>


<Grid item xs={12} md={4} lg={4} sx={{ mb: 1, }}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, }}>
<Grid container alignItems={"center"}> <Grid container alignItems={"center"}>
<Grid item xs={12} md={12} lg={12} <Grid item xs={12} md={12} lg={12}
sx={{ display: 'flex', alignItems: 'center' }}> sx={{ display: 'flex', alignItems: 'center' }}>
@@ -209,17 +216,16 @@ const ApplicationDetailCard = ({ formData, }) => {
<Grid item xs={12} md={12} lg={12} sx={{ mb: 4, display: 'flex', alignItems: 'center' }}> <Grid item xs={12} md={12} lg={12} sx={{ mb: 4, display: 'flex', alignItems: 'center' }}>
<Typography variant="h5">&emsp;{DateUtils.datetimeStr_Cht(data.returnBeforeDate)} 前</Typography> <Typography variant="h5">&emsp;{DateUtils.datetimeStr_Cht(data.returnBeforeDate)} 前</Typography>
</Grid> </Grid>
<Grid item xs={12} md={3} lg={3}
<Grid item xs={12} sm={3} md={3} lg={3}
sx={{ mb: 1, display: 'flex', alignItems: 'center' }}> sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>
<Typography variant="h5">應繳費用:</Typography> <Typography variant="h5">應繳費用:</Typography>
</Grid> </Grid>
<Grid item xs={12} md={9} lg={9} sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>
<Typography variant="h2" style={{ color: "#0049B8", fontWeight: "bold", }}>{FormatUtils.currencyFormat(data.fee)}</Typography>
<Grid item xs={12} sm={9} md={9} lg={9} sx={{ mb: 1, display: 'flex', alignItems: 'center' }}>
<Typography variant="h4" style={{ color: "#0049B8", fontWeight: "bold", }}>{FormatUtils.currencyFormat(data.fee)}</Typography>
</Grid> </Grid>
<Grid item xs={0} md={3} lg={3} sx={{ mb: 4, display: 'flex', alignItems: 'center' }}></Grid>
<Grid item xs={12} md={9} lg={9} sx={{ mb: 4, display: 'flex', alignItems: 'center' }}> <Grid item xs={12} md={9} lg={9} sx={{ mb: 4, display: 'flex', alignItems: 'center' }}>
{ {
formik.values.groupType == "Private Bill"
formik.values.groupType === "Private Bill"
? ?
<Typography variant="h5">( {data.noOfPages} 頁 x $6,552 )</Typography> <Typography variant="h5">( {data.noOfPages} 頁 x $6,552 )</Typography>
: :


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

@@ -135,7 +135,7 @@ const FormPanel = ({ formData }) => {




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




+ 34
- 44
src/pages/Proof/Reply_Public/index.js View File

@@ -3,7 +3,6 @@ import {
Grid, Grid,
Typography, Typography,
Stack, Stack,
Box,
Button Button
} from '@mui/material'; } from '@mui/material';
import * as UrlUtils from "utils/ApiPathConst"; import * as UrlUtils from "utils/ApiPathConst";
@@ -20,6 +19,7 @@ const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/Loa
const ApplicationDetails = Loadable(React.lazy(() => import('./ApplicationDetails'))); const ApplicationDetails = Loadable(React.lazy(() => import('./ApplicationDetails')));
const ProofForm = Loadable(React.lazy(() => import('./ProofForm'))); const ProofForm = Loadable(React.lazy(() => import('./ProofForm')));
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
import MainCard from "../../../components/MainCard";
const BackgroundHead = { const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`, backgroundImage: `url(${titleBackgroundImg})`,
width: '100%', width: '100%',
@@ -39,22 +39,6 @@ const Index = () => {
const [record, setRecord] = React.useState(); const [record, setRecord] = React.useState();
const [onReady, setOnReady] = React.useState(false); const [onReady, setOnReady] = React.useState(false);


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(() => { React.useEffect(() => {
loadForm(); loadForm();
}, []); }, []);
@@ -98,7 +82,7 @@ const Index = () => {
<LoadingComponent /> <LoadingComponent />
: :
( (
<Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid container sx={{ width: '100%', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
<Grid item xs={12} width="100%"> <Grid item xs={12} width="100%">
<div style={BackgroundHead} width="100%"> <div style={BackgroundHead} width="100%">
<Stack direction="row" height='70px'> <Stack direction="row" height='70px'>
@@ -106,38 +90,44 @@ const Index = () => {
</Stack> </Stack>
</div> </div>
</Grid> </Grid>
<Grid item xs={12} width="95%">
<Button title="返回" sx={{ ml: 1.5, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/proof/search") }}>
<Grid item xs={12} width="100%">
<Button title="返回" sx={{ mt: 2.5, ml: 3 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/proof/search") }}>
<ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} /> <ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
</Button> </Button>
</Grid> </Grid>
{/*row 1*/} {/*row 1*/}
<Grid item xs={12} md={12} >
<Grid container justifyContent="flex-start" alignItems="center" >
<center>
<Grid item xs={12} md={12} sx={{ pt: 2 }}>
<Box xs={12} md={12} sx={{ border: '0px groove grey', borderRadius: '10px', ..._sx }}>
<ApplicationDetails
formData={record}
style={{
display: "flex",
height: "100%",
flex: 1
}}
/>
</Box>
</Grid>
<Grid item xs={12} md={12} sx={{ pt: 1, pb: 2 }}>
<Box xs={12} md={12} sx={{ border: '0px groove grey', borderRadius: '10px', ..._sx }}>
<ProofForm
formData={record}
/>
</Box>
</Grid>
</center>
</Grid>
<Grid item xs={12} sm={12} md={12} lg={12} sx={{ width:'100%', mt:2, mb: -3}}>
<MainCard
sx={{
mr:2,
boxShadow: 1,
border: 1,
borderColor: '#DDD',
}}
border= '1px groove grey'
>
<ApplicationDetails
formData={record}
/>
</MainCard>
</Grid> </Grid>

{/*row 2*/} {/*row 2*/}
<Grid item xs={12} sm={12} md={12} lg={12} sx={{ width:'100%', mt: 2, mb: 2}}>
<MainCard
sx={{
boxShadow: 1,
border: 1,
borderColor: '#DDD',
}}
border= '1px groove grey'
// sx={..._sx}
>
<ProofForm
formData={record}
/>
</MainCard>
</Grid>
</Grid > </Grid >






Loading…
Cancel
Save