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

update card

master
jason.lam 1 year ago
parent
65a4d5371c
commit
da5845fcb9
2 changed files with 32 additions and 25 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +20
    -18
      src/pages/Proof/Reply_Public/ProofForm.js
  2. +12
    -7
      src/pages/Proof/Reply_Public/UploadFileTable.js

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

@@ -22,6 +22,8 @@ import { useNavigate } from "react-router-dom";
import * as DateUtils from "utils/DateUtils" import * as DateUtils from "utils/DateUtils"
import Loadable from 'components/Loadable'; import Loadable from 'components/Loadable';
import { notifyActionSuccess } from 'utils/CommonFunction'; import { notifyActionSuccess } from 'utils/CommonFunction';
import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
const UploadFileTable = Loadable(React.lazy(() => import('./UploadFileTable'))); const UploadFileTable = Loadable(React.lazy(() => import('./UploadFileTable')));


// ==============================|| DASHBOARD - DEFAULT ||============================== // // ==============================|| DASHBOARD - DEFAULT ||============================== //
@@ -147,8 +149,8 @@ const FormPanel = ({ formData }) => {


{ {
formik.values.replyDate ? formik.values.replyDate ?
<Grid container direction="column" sx={{ paddingLeft: 4, paddingRight: 4 }} spacing={1}>
<Grid item xs={12} md={12} textAlign="left">
<Grid container direction="column" sx={{ paddingLeft: 0, paddingRight: 0 }}>
<Grid item xs={12} sm={12} md={12} lg={8} textAlign="left">
<Typography variant="h5">校對回覆日期: {DateUtils.datetimeStr_Cht(formik.values.replyDate)}</Typography> <Typography variant="h5">校對回覆日期: {DateUtils.datetimeStr_Cht(formik.values.replyDate)}</Typography>
</Grid> </Grid>
<Grid item xs={12} md={12} textAlign="left"> <Grid item xs={12} md={12} textAlign="left">
@@ -158,7 +160,7 @@ const FormPanel = ({ formData }) => {
formik.values.action ? formik.values.action ?
null null
: :
<Grid item xs={12} md={12} textAlign="left">
<Grid item xs={12} md={12} textAlign="left" sx={{ width:'95%', maxWidth: {xs:'70vw', sm:'72vw', md:'75vw',lg:'80vw'}}}>
<FileList <FileList
lang="ch" lang="ch"
refId={params.id} refId={params.id}
@@ -177,13 +179,13 @@ const FormPanel = ({ formData }) => {
: :
( (
isOverTime() ? isOverTime() ?
<Grid container direction="column" sx={{ paddingLeft: 4, paddingRight: 4 }} spacing={1}>
<Grid container direction="column" sx={{ paddingLeft: 0, paddingRight: 0 }} spacing={1}>
<Grid item xs={12} md={12} textAlign="left"> <Grid item xs={12} md={12} textAlign="left">
<Typography variant="h5">回覆逾時，請重新申請。</Typography> <Typography variant="h5">回覆逾時，請重新申請。</Typography>
</Grid> </Grid>
</Grid> </Grid>
: :
<Grid container direction="column" sx={{ paddingLeft: 4, paddingRight: 4 }} spacing={1}>
<Grid container direction="column" sx={{ paddingLeft: 0, paddingRight: 0 }} spacing={1}>


<Grid item xs={12} md={12}> <Grid item xs={12} md={12}>
<RadioGroup <RadioGroup
@@ -217,31 +219,33 @@ const FormPanel = ({ formData }) => {
type="file" type="file"
accept=".pdf" accept=".pdf"
style={{ display: 'none' }} style={{ display: 'none' }}
disabled={attachments.length >= (formik.values.groupType == "Private Bill" ? 2 : 1)}
disabled={attachments.length >= (formik.values.groupType === "Private Bill" ? 2 : 1)}
onChange={(event) => { onChange={(event) => {
readFile(event) readFile(event)
}} }}
/> />
<label htmlFor="uploadFileBtn"> <label htmlFor="uploadFileBtn">
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button <Button
color="save"
component="span" component="span"
variant="contained" variant="contained"
size="large"
disabled={attachments.length >= (formik.values.groupType == "Private Bill" ? 2 : 1)}
disabled={attachments.length >= (formik.values.groupType === "Private Bill" ? 2 : 1)}
> >
<Typography variant="h5">上載</Typography>
上載
</Button> </Button>
</ThemeProvider>
</label> </label>
</Grid> </Grid>




<Grid item xs={12} md={12} textAlign="left">
<Grid item xs={12} md={12} textAlign="left" sx={{ width:'95%', maxWidth: {xs:'70vw', sm:'72vw', md:'75vw',lg:'80vw'}}} >
<UploadFileTable key="uploadTable" recordList={attachments} setRecordList={setAttachments} /> <UploadFileTable key="uploadTable" recordList={attachments} setRecordList={setAttachments} />
</Grid> </Grid>
</> </>
} }


<Grid item xs={12} md={12} lg={12}>
<Grid item xs={12} sm={12} md={12} lg={12}>
<Stack direction="row" alignItems="center"> <Stack direction="row" alignItems="center">
<FormLabel sx={{ paddingRight: 2, paddingBottom: 3, textAlign: "center" }}> <FormLabel sx={{ paddingRight: 2, paddingBottom: 3, textAlign: "center" }}>
<Typography variant="h5">簽署：</Typography> <Typography variant="h5">簽署：</Typography>
@@ -261,7 +265,7 @@ const FormPanel = ({ formData }) => {
WebkitTextFillColor: "#000000", WebkitTextFillColor: "#000000",
background: "#f8f8f8", background: "#f8f8f8",
}, },
width: '50%'
width: '70%'
} }
} }
/> />
@@ -271,17 +275,15 @@ const FormPanel = ({ formData }) => {




<Grid item xs={12} md={12} textAlign="left"> <Grid item xs={12} md={12} textAlign="left">
<ThemeProvider theme={PNSPS_BUTTON_THEME}>
<Button <Button
size="large"
variant="contained" variant="contained"
color="success" color="success"
type="submit" type="submit"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<Typography variant="h5">提交回覆</Typography>
>
提交回覆
</Button> </Button>
</ThemeProvider>
</Grid> </Grid>


</Grid> </Grid>


+ 12
- 7
src/pages/Proof/Reply_Public/UploadFileTable.js View File

@@ -10,15 +10,18 @@ import {useEffect} from "react";
// import {useNavigate} from "react-router-dom"; // import {useNavigate} from "react-router-dom";
// import { useTheme } from '@mui/material/styles'; // import { useTheme } from '@mui/material/styles';
import { import {
Box,
Stack
Stack, useMediaQuery
} from '@mui/material'; } from '@mui/material';
import {useTheme} from "@emotion/react";
// ==============================|| EVENT TABLE ||============================== // // ==============================|| EVENT TABLE ||============================== //


export default function UploadFileTable({recordList, setRecordList,}) { export default function UploadFileTable({recordList, setRecordList,}) {
const [rows, setRows] = React.useState(recordList); const [rows, setRows] = React.useState(recordList);
const [rowModesModel,setRowModesModel] = React.useState({}); const [rowModesModel,setRowModesModel] = React.useState({});
const theme = useTheme();
const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));

// const theme = useTheme(); // const theme = useTheme();


// const navigate = useNavigate() // const navigate = useNavigate()
@@ -74,7 +77,8 @@ export default function UploadFileTable({recordList, setRecordList,}) {
id: 'name', id: 'name',
field: 'name', field: 'name',
headerName: '檔案名稱', headerName: '檔案名稱',
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
}, },
{ {
id: 'size', id: 'size',
@@ -84,13 +88,14 @@ export default function UploadFileTable({recordList, setRecordList,}) {
// console.log(params) // console.log(params)
return Math.ceil(params.value/1024)+" KB"; return Math.ceil(params.value/1024)+" KB";
}, },
flex: 1,
width: isMdOrLg ? 'auto' : 160,
flex: isMdOrLg ? 1 : undefined,
}, },
]; ];


return ( return (
<Box
style={{ height: '200px', width: '75%' }}
<div
style={{ height: '200px', width: '95%',overflowX: 'auto', }}
> >
<DataGrid <DataGrid
rows={rows} rows={rows}
@@ -106,6 +111,6 @@ export default function UploadFileTable({recordList, setRecordList,}) {
disableColumnSelector disableColumnSelector
hideFooter hideFooter
/> />
</Box>
</div>
); );
} }

Write Preview
Loading…
Cancel
Save