| @@ -4,6 +4,7 @@ import { | |||||
| Typography, | Typography, | ||||
| Button, | Button, | ||||
| RadioGroup, | RadioGroup, | ||||
| Dialog, DialogTitle, DialogContent, DialogActions | |||||
| } from '@mui/material'; | } from '@mui/material'; | ||||
| import { useFormik } from 'formik'; | import { useFormik } from 'formik'; | ||||
| import * as yup from 'yup'; | import * as yup from 'yup'; | ||||
| @@ -18,7 +19,8 @@ import {useNavigate} from "react-router-dom"; | |||||
| // ==============================|| DASHBOARD - DEFAULT ||============================== // | // ==============================|| DASHBOARD - DEFAULT ||============================== // | ||||
| const PublicNoticeApplyForm = ({loadedData, selections}) => { | const PublicNoticeApplyForm = ({loadedData, selections}) => { | ||||
| //const [formData, setFormData] = React.useState([]); | |||||
| const [isWarningPopUp, setIsWarningPopUp] = React.useState(false); | |||||
| const [warningText, setWarningText] = React.useState(""); | |||||
| const [attachment, setAttachment] = React.useState({}); | const [attachment, setAttachment] = React.useState({}); | ||||
| const navigate=useNavigate(); | const navigate=useNavigate(); | ||||
| @@ -30,17 +32,28 @@ const PublicNoticeApplyForm = ({loadedData, selections}) => { | |||||
| enableReinitialize:true, | enableReinitialize:true, | ||||
| initialValues:loadedData, | initialValues:loadedData, | ||||
| validationSchema:yup.object().shape({ | validationSchema:yup.object().shape({ | ||||
| group: yup.string().max(255), | |||||
| groupTitle: yup.string().max(255), | |||||
| groupNo: yup.string().max(255), | |||||
| contactPerson: yup.string().max(40).nullable(), | |||||
| contactPerson: yup.string().max(40).required('請輸入聯絡人'), | |||||
| tel_countryCode: yup.string().min(3,'請輸入3位數字').required('請輸入國際區號'), | tel_countryCode: yup.string().min(3,'請輸入3位數字').required('請輸入國際區號'), | ||||
| fax_countryCode: yup.string().min(3,'請輸入3位數字'), | fax_countryCode: yup.string().min(3,'請輸入3位數字'), | ||||
| phoneNumber: yup.string().min(8,'請輸入8位數字').required('請輸入聯絡電話'), | phoneNumber: yup.string().min(8,'請輸入8位數字').required('請輸入聯絡電話'), | ||||
| faxNumber: yup.string().min(8,'請輸入8位數字').required('請輸入8位數字'), | |||||
| faxNumber: yup.string().min(8,'請輸入8位數字'), | |||||
| remarks: yup.string().max(255).nullable(), | remarks: yup.string().max(255).nullable(), | ||||
| }), | }), | ||||
| onSubmit:values=>{ | onSubmit:values=>{ | ||||
| if(!values.issueId){ | |||||
| setWarningText("請選擇目標期數"); | |||||
| setIsWarningPopUp(true); | |||||
| return; | |||||
| } | |||||
| if(!attachment){ | |||||
| setWarningText("請選擇上傳文件"); | |||||
| setIsWarningPopUp(true); | |||||
| return; | |||||
| }else if(attachment.size >= (10*1024*1034)){ | |||||
| setWarningText("上傳文件大小應<10MB"); | |||||
| setIsWarningPopUp(true); | |||||
| return; | |||||
| } | |||||
| console.log(values); | console.log(values); | ||||
| HttpUtils.postWithFiles({ | HttpUtils.postWithFiles({ | ||||
| url: UrlUtils.POST_PUBLIC_NOTICE_APPLY, | url: UrlUtils.POST_PUBLIC_NOTICE_APPLY, | ||||
| @@ -133,7 +146,7 @@ const PublicNoticeApplyForm = ({loadedData, selections}) => { | |||||
| <Grid container alignItems={"center"}> | <Grid container alignItems={"center"}> | ||||
| <Grid item lg={4} | <Grid item lg={4} | ||||
| sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | ||||
| 上傳文件: | |||||
| 上傳文件 ({"檔案大小應<10MB"}): | |||||
| </Grid> | </Grid> | ||||
| <Grid item lg={4}> | <Grid item lg={4}> | ||||
| {attachment.name} | {attachment.name} | ||||
| @@ -143,7 +156,7 @@ const PublicNoticeApplyForm = ({loadedData, selections}) => { | |||||
| id="uploadFileBtn" | id="uploadFileBtn" | ||||
| name="file" | name="file" | ||||
| type="file" | type="file" | ||||
| accept="image/png, image/jpeg" | |||||
| accept="image/png, image/jpeg.doc,.pdf,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" | |||||
| style={{ display: 'none' }} | style={{ display: 'none' }} | ||||
| onChange={(event)=> { | onChange={(event)=> { | ||||
| readFile(event) | readFile(event) | ||||
| @@ -180,6 +193,17 @@ const PublicNoticeApplyForm = ({loadedData, selections}) => { | |||||
| </Grid> | </Grid> | ||||
| </form> | </form> | ||||
| <div> | |||||
| <Dialog open={isWarningPopUp} onClose={() => setIsWarningPopUp(false)} > | |||||
| <DialogTitle>Warning</DialogTitle> | |||||
| <DialogContent style={{ display: 'flex', }}> | |||||
| <Typography variant="h3" style={{ padding: '16px' }}>{warningText}</Typography> | |||||
| </DialogContent> | |||||
| <DialogActions> | |||||
| <Button onClick={() => setIsWarningPopUp(false)}>OK</Button> | |||||
| </DialogActions> | |||||
| </Dialog> | |||||
| </div> | |||||
| </Grid> | </Grid> | ||||
| ); | ); | ||||
| }; | }; | ||||