no message

src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js

@@ -18,6 +18,7 @@ import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
 import ForwardIcon from '@mui/icons-material/Forward';
 import {
     isORGLoggedIn,
+    isDummyLoggedIn
 } from "utils/Utils";
 
 import { useNavigate } from "react-router-dom";
@@ -37,6 +38,8 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
     const [attachment, setAttachment] = useState({});
     const [selections, setsSelections] = useState(<></>);
     const intl = useIntl();
+    const { locale } = intl;
+    const dft = locale === 'en' ?"DD MMM YYYY":"YYYY年MM月DD日";
 
     const [val, setVal] = useState({});
     const [reloadPage, setReloadPage] = useState(false);
@@ -84,18 +87,43 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
         
     }, [issueId]);
 
+    // function displayErrorMsg(errorMsg) {
+    //     return <Typography variant="errorMessage1">{errorMsg}</Typography>
+    // }
 
     const formik = useFormik({
         enableReinitialize: true,
         initialValues: loadedData,
         validationSchema: yup.object().shape({
-            contactPerson: yup.string().max(40, intl.formatMessage({ id: 'noMoreThen40Words' })).required(intl.formatMessage({ id: 'requireContactPerson' })),
+            contactPerson: yup.string().max(40, intl.formatMessage({ id: 'noMoreThen40Words' })).required(intl.formatMessage({ id: 'requireContactPerson' })).nullable(),
             tel_countryCode: yup.string().min(3, intl.formatMessage({ id: 'require3Number' })).required(intl.formatMessage({ id: 'requireDialingCode' })),
             fax_countryCode: yup.string().min(3, intl.formatMessage({ id: 'require3Number' })),
             phoneNumber: yup.string().min(8, intl.formatMessage({ id: 'require8Number' })).required(intl.formatMessage({ id: 'requireContactNumber' })),
             faxNumber: yup.string().min(8, intl.formatMessage({ id: 'require8Number' })),
             remarks: yup.string().max(100, getMaxErrStr(100)).nullable(),
             careOf: yup.string().max(60, getMaxErrStr(60)).nullable(),
+            emailAddress: yup.string().email(intl.formatMessage({ id: 'validEmailFormat' })).max(255).test('checkEmailFormat', intl.formatMessage({ id: 'requireEmail' }), function (value) {
+                if (isDummyLoggedIn()) {
+                    if (value !== undefined) {
+                        return true
+                    } else {
+                        return false
+                    }
+                }else{
+                    return true
+                }
+            }),
+            careOfDum: yup.string().max(60, getMaxErrStr(60)).test('checkCareOfDumFormat',intl.formatMessage({ id: 'requireCareOf' }), function (value) {
+                if (isDummyLoggedIn()) {
+                    if (value !== undefined) {
+                        return true
+                    } else {
+                        return false
+                    }
+                }else{
+                    return true
+                }
+            }),
         }),
         onSubmit: values => {
             if (!values.issueId) {
@@ -138,6 +166,14 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
 
     const apply = (values) => {
         setSubmitting(true)
+        let careOf = values.careOf ? values.careOf : ""
+        let remarks = values.remarks ? values.remarks : ""
+        if (isDummyLoggedIn){
+            careOf = values.careOfDum
+        }
+        if (isDummyLoggedIn){
+            remarks = values.emailAddress
+        }
         HttpUtils.postWithFiles({
             url: UrlUtils.POST_PUBLIC_NOTICE_APPLY,
             params: {
@@ -152,8 +188,8 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
                     faxNumber: values.faxNumber
                 },
                 issueId: issueId,
-                careOf: values.careOf ? values.careOf : "",
-                remarks: values.remarks ? values.remarks : "",
+                careOf: careOf,
+                remarks: remarks,
             },
             files: [attachment],
             onSuccess: function (responData) {
@@ -230,7 +266,8 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
                                             label: intl.formatMessage({ id: 'contactPerson' }) + ":",
                                             valueName: "contactPerson",
                                             form: formik,
-                                            disabled: true
+                                            disabled: !isDummyLoggedIn(),
+                                            autoFocus: isDummyLoggedIn()
                                         })}
                                     </Grid>
                                     <Grid item xs={12} md={12}>
@@ -290,18 +327,18 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
                                             </tr>
                                             <tr>
                                                 <td style={tabelStyle}><FormattedMessage id="payOnline" /></td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, "YYYY年MM月DD日")} 2:00 p.m.</td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, "YYYY年MM月DD日")} 2:30 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, dft)} 2:00 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, dft)} 2:30 p.m.</td>
                                             </tr>
                                             <tr>
                                                 <td style={tabelStyle}><FormattedMessage id="payDn" /></td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(beforeClosingDate, "YYYY年MM月DD日")} 5:00 p.m.</td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, "YYYY年MM月DD日")} 12:30 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(beforeClosingDate, dft)} 5:00 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, dft)} 12:30 p.m.</td>
                                             </tr>
                                             <tr>
                                                 <td style={tabelStyle}><FormattedMessage id="payNPGO" /></td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, "YYYY年MM月DD日")} 12:00 p.m.</td>
-                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, "YYYY年MM月DD日")} 12:30 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, dft)} 12:00 p.m.</td>
+                                                <td style={tabelStyle}>{DateUtils.dateFormat(closeDate, dft)} 12:30 p.m.</td>
                                             </tr>
                                         </table>
 
@@ -361,14 +398,26 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
                                     </Grid>
                                     {isORGLoggedIn() ?
                                         <>
-                                            <Grid item xs={12} md={12} lg={12}>
-                                                {FieldUtils.getCarOfField({
-                                                    label: intl.formatMessage({ id: 'careOf' }) + ":",
-                                                    valueName: "careOf",
-                                                    form: formik,
-                                                    // disabled: true
-                                                })}
-                                            </Grid>
+                                            {isDummyLoggedIn()?
+                                                <Grid item xs={12} md={12} lg={12}>
+                                                    {FieldUtils.getCarOfField({
+                                                        label: intl.formatMessage({ id: 'careOf' }) + ":",
+                                                        valueName: "careOfDum",
+                                                        form: formik,
+                                                        // disabled: true
+                                                    })}
+                                                </Grid>
+                                            :    
+                                                <Grid item xs={12} md={12} lg={12}>
+                                                    {FieldUtils.getCarOfField({
+                                                        label: intl.formatMessage({ id: 'careOf' }) + ":",
+                                                        valueName: "careOf",
+                                                        form: formik,
+                                                        // disabled: true
+                                                    })}
+                                                </Grid>
+                                            
+                                            }
                                             <Grid item xs={12} md={12} lg={12} sx={{ mb: 3 }}>
                                                 <Typography display="inline" variant="subtitle1" sx={{ color: 'primary.primary' }}>
                                                     <FormattedMessage id="noteOnClientRemark" />
@@ -379,14 +428,26 @@ const PublicNoticeApplyForm = ({ loadedData, _selections , gazetteIssueList}) =>
                                         null
 
                                     }
-                                    <Grid item xs={12} md={12} lg={12}>
-                                        {FieldUtils.getTextArea({
-                                            label: intl.formatMessage({ id: 'extraMark' }) + ":",
-                                            valueName: "remarks",
-                                            form: formik,
-                                            inputProps: { maxLength: 255 }
-                                        })}
-                                    </Grid>
+
+                                    {
+                                        isDummyLoggedIn()?
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                {FieldUtils.getTextField({
+                                                    label: intl.formatMessage({ id: 'userContactEmail' }),
+                                                    valueName: "emailAddress",
+                                                    form: formik
+                                                })}
+                                            </Grid>
+                                        :
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                {FieldUtils.getTextArea({
+                                                    label: intl.formatMessage({ id: 'extraMark' }) + ":",
+                                                    valueName: "remarks",
+                                                    form: formik,
+                                                    inputProps: { maxLength: 255 }
+                                                })}
+                                            </Grid>
+                                    }
 
                                     <Grid item xs={12}>
                                         <Typography variant="h6" height="100%" >

src/translations/en.json

@@ -339,6 +339,7 @@
   "payReceipt": "Payment receipt",
   "contactPerson": "Contact Person",
   "requireContactPerson": "Please enter contact person",
+  "requireCareOf": "Please enter client remark",
   "search": "Search",
   "searchForm": "Search Form",
   "cancel": "Cancel",

src/translations/zh-CN.json

@@ -353,6 +353,7 @@
   "payReceipt": "付款收据",
   "contactPerson": "联络人",
   "requireContactPerson": "请输入联络人",
+  "requireCareOf": "请输入客戶備註",
   "search": "搜寻",
   "searchForm": "搜寻表格",
   "cancel": "取消",

src/translations/zh-HK.json

@@ -356,6 +356,7 @@
   "payReceipt": "付款收據",
   "contactPerson": "聯絡人",
   "requireContactPerson": "請輸入聯絡人",
+  "requireCareOf": "請輸入客戶備註",
   "search": "搜尋",
   "searchForm": "搜尋表格",
   "cancel": "取消",

src/utils/FieldUtils.js

@@ -26,7 +26,7 @@ export const getDateField = ({ label, valueName, form, disabled }) => {
     </Grid>;
 }
 
-export const getTextField = ({ label, valueName, form, disabled }) => {
+export const getTextField = ({ label, valueName, form, disabled, autoFocus }) => {
     return <Grid container alignItems={"center"} sx={{mb:2}}>
         <Grid item xs={12} sm={12} md={12} lg={12}>
             <Grid container spacing={1}>
@@ -39,7 +39,8 @@ export const getTextField = ({ label, valueName, form, disabled }) => {
                         type: "text",
                         valueName: valueName,
                         form: form,
-                        disabled: disabled
+                        disabled: disabled,
+                        autoFocus:autoFocus
                     })}
                 </Grid>
             </Grid>
@@ -203,7 +204,7 @@ export const getComboField = ({ label, dataList, valueName, form, disabled, getO
     </Grid>;
 }
 
-export const initField = ({ type, valueName, form, disabled, multiline, handleChange, placeholder, inputProps, InputProps, width, ...props }) => {
+export const initField = ({ type, valueName, form, disabled, autoFocus, multiline, handleChange, placeholder, inputProps, InputProps, width, ...props }) => {
     let err = Boolean(form.errors[valueName]);
 
     return <TextField
@@ -220,6 +221,7 @@ export const initField = ({ type, valueName, form, disabled, multiline, handleCh
         onChange={handleChange ? handleChange : form.handleChange}
         value={form.values[valueName]}
         disabled={disabled}
+        autoFocus={autoFocus}
         sx={{
             width: width ? width : '100%'
         }}

src/utils/Utils.js

@@ -88,6 +88,11 @@ export const isCreditorLoggedIn = () =>{
         return JSON.parse(localStorage.getItem('userData')).creditor
     }
 } 
+export const isDummyLoggedIn = () =>{
+    if (localStorage.getItem('userData') != null){
+        return JSON.parse(localStorage.getItem('userData')).role === 'dummy'
+    }
+} 
 /**
  ** This function is used for demo purpose route navigation
  ** In real app you won't need this function because your app will navigate to same route for each users regardless of ability