alex
/
PNSPS-frontend-MaterialUI
1
0
Bifurcation 0
Code Tickets 0 Demandes d'ajout 0 Versions 0 Wiki Activité
Parcourir la source

ind

master
Anna Ho il y a 2 ans
Parent
c849f0db0a
révision
88f16cefea
6 fichiers modifiés avec 528 ajouts et 188 suppressions
Vue séparée
Option de Diff
Voir les Statistiques Télécharger le Fichier Patch Télécharger le Fichier des Différences
  1. +6
    -6
      src/pages/authentication/auth-forms/CustomFormWizard.js
  2. +397
    -148
      src/pages/pnspsUserDetailPage_Individual/UserInformationCard_Individual.js
  3. +3
    -0
      src/pages/pnspsUserDetailPage_Individual/index.js
  4. +89
    -33
      src/pages/pnspsUserDetailPage_Organization/UserInformationCard_Organization.js
  5. +1
    -1
      src/utils/ApiPathConst.js
  6. +32
    -0
      src/utils/ComboData.js

+ 6
- 6
src/pages/authentication/auth-forms/CustomFormWizard.js Voir le fichier

@@ -39,6 +39,8 @@ import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';
import CancelOutlinedIcon from '@mui/icons-material/CancelOutlined';
import { Link } from 'react-router-dom';

import * as ComboData from "../../../utils/ComboData";
// ============================|| FIREBASE - REGISTER ||============================ //

const CustomFormWizard = (props) => {
@@ -68,16 +70,14 @@ const CustomFormWizard = (props) => {

const [selectedIdDocType, setSelectedIdDocType] = useState(null);
const [selectedAddress4, setSelectedAddress4] = useState(null);
const [selectedAddress5, setSelectedAddress5] = useState("香港");
const [selectedAddress5, setSelectedAddress5] = useState(ComboData.country[0]);
const [termsAndConAccept, setTermsAndConAccept] = useState(false);
const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false);
const [isValid, setisValid] = useState(false);
const idDocTypeComboList = ["passport","HKID","CNID","BR","otherCert"];
const address4ComboList =
["北區","長洲區","大埔區","大嶼山區","東區","觀塘區","黃大仙區","九龍城區","葵青區","南區","南丫島區",
"坪洲區","荃灣區","沙田區","深水埗區","屯門區","灣仔區","西貢區","油尖旺區","元朗區","中西區"];
const address5ComboList = ["香港","內地","澳門"];
const idDocTypeComboList = ComboData.idDocType;
const address4ComboList = ComboData.district;
const address5ComboList = ComboData.country;
const termsAndCon = "此網址由香港特別行政區政府物流服務署製作及管理。本署會盡力確保網址上的資料無誤，\n"
+ "但有絕對酌情權隨時刪除、暫停登載或編輯各項資料而無須給予任何理由。\n由於任何與網址"
+ "內資料有關的理由或原因，而導致出現申索、損失或損害，本署概不負責。\n使用者須自行評"


+ 397
- 148
src/pages/pnspsUserDetailPage_Individual/UserInformationCard_Individual.js Voir le fichier

@@ -1,16 +1,20 @@
// material-ui
import {
Grid, TextField, Typography, Button
Grid, TextField, Typography, Button, Autocomplete, Stack, FormHelperText, OutlinedInput
} from '@mui/material';
import MainCard from "../../components/MainCard";
import * as React from "react";
import {useForm} from "react-hook-form";
import {useEffect, useState} from "react";
import * as yup from 'yup';
//import Checkbox from "@mui/material/Checkbox";
//import LoadingComponent from "../extra-pages/LoadingComponent";

import { useFormik,FormikProvider } from 'formik';
import * as DateUtils from '../../utils/DateUtils';
import * as HttpUtils from '../../utils/HttpUtils';
import * as UrlUtils from "../../utils/ApiPathConst";
import * as ComboData from "../../utils/ComboData";
//import axios from 'axios';

//import {useParams} from "react-router-dom";
@@ -24,28 +28,60 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
const [editMode, setEditMode] = useState(false);
const [locked, setLocked] = useState(false);

const [idDocType, setIdDocType] = useState(null);
const [district, setDistrict] = useState(null);
const [country, setCountry] = useState(ComboData.country[0]);


const from = useForm({defaultValues: userData});
const {register,reset, handleSubmit} = from;




const formik = useFormik({
initialValues:(currentUserData),
validationSchema:yup.object().shape({
enName: yup.string().max(255).required('請輸入英文姓名'),
chName: yup.string().max(255).required('請輸入中文姓名'),
addressLine1: yup.string().max(255).required('請輸入第一行地址'),
addressLine2: yup.string().max(255).required('請輸入第二行地址'),
addressLine3: yup.string().max(255).required('請輸入第三行地址'),
emailAddress: yup.string().email('請輸入電郵格式').max(255).required('請輸入電郵'),
identification: yup.string().min(7,"請輸入證件號碼").required('請輸入證件號碼'),
checkDigit:yup.string().max(1).required('請輸入括號內的數字或字母'),
idDocType: yup.string().max(255).required('請輸入證件類別'),
tel_countryCode: yup.string().min(3,'請輸入3位數字').required('請輸入國際區號'),
fax_countryCode: yup.string().min(3,'請輸入3位數字'),
phoneNumber: yup.string().min(8,'請輸入8位數字').required('請輸入聯絡電話'),
faxNumber: yup.string().min(8,'請輸入8位數字'),
}),
});



useEffect(() => {
let createDate = DateUtils.datetimeStr(userData.created);
let modifiedBy = DateUtils.datetimeStr(userData.modified)+", "+userData.modifiedBy;
userData["createDate"] = createDate;
userData["modifieDate"] = modifiedBy;
userData["verifiedStatus"] = userData.verified? "Not verify yet":"Verified";
userData["verifiedStatus"] = userData.verifiedBy? DateUtils.datetimeStr(userData.verifiedDate)+", "+userData.verifiedByName: "Not verify yet";

userData["country"] = userData.address?.country;
userData["district"] = userData.address?.district;
userData["addressLine1"] = userData.address?.addressLine1;
userData["addressLine2"] = userData.address?.addressLine2;
userData["addressLine3"] = userData.address?.addressLine3;
userData["addressLine3"] = userData.address?.addressLine3;

userData["phoneNumber"] = userData.contactTel?.phoneNumber;
userData["tel_countryCode"] = userData.contactTel?.countryCode;

userData["faxNumber"] = userData.faxNo?.faxNumber;
userData["fax_countryCode"] = userData.faxNo?.countryCode;

setIdDocType(userData.idDocType);
setDistrict(userData.district);
setCountry(userData.country);
setCurrentUserData(userData);
}, [userData]);
@@ -56,29 +92,31 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
}, [currentUserData]);


function onSubmitForm(_formData) {
function onSubmitForm() {
HttpUtils.post({
url: UrlUtils.POST_IND_USER+"/"+userData.id,
params: {
prefix: _formData.prefix,
enName: _formData.enName,
chName: _formData.chName,
idDocType: _formData.idDocType,
prefix: formik.values.prefix,
enName: formik.values.enName,
chName: formik.values.chName,
idDocType: idDocType,
contactTel: {
countryCode: _formData.tel_countryCode,
phoneNumber: _formData.phoneNumber
countryCode: formik.values.tel_countryCode,
phoneNumber: formik.values.phoneNumber
},
identification: _formData.identification,
identification: formik.values.identification,
checkDigit: formik.values.checkDigit,
faxNo:{
countryCode: _formData.fax_countryCode,
faxNumber: _formData.faxNumber
countryCode: formik.values.fax_countryCode,
faxNumber: formik.values.faxNumber
},
emailAddress:_formData.emailAddress,
emailAddress:formik.values.emailAddress,
address:{
country:_formData.country,
addressLine1: _formData.addressLine1,
addressLine2: _formData.addressLine2,
addressLine3: _formData.addressLine3,
country:country,
district:district,
addressLine1: formik.values.addressLine1,
addressLine2: formik.values.addressLine2,
addressLine3: formik.values.addressLine3,
},
},
onSuccess: function(){
@@ -93,7 +131,7 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {

const onVerifiedClick = () => {
HttpUtils.get({
url: UrlUtils.GET_IND_USER_VERIFY+"/"+id,
url: UrlUtils.GET_IND_USER_VERIFY+"/"+userData.id,
onSuccess: function(){
loadDataFun();
}
@@ -135,7 +173,66 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
Information
</Typography>

<FormikProvider value={formik}>
<form onSubmit={handleSubmit(onSubmitForm)}>


{/*top button*/}
<Grid item s={12} md={12} lg={12} sx={{mb: 3}} alignItems={"start"} justifyContent="center">
<Grid container maxWidth justifyContent="flex-start">
{editMode?
<>
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
onClick={loadDataFun}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
>
Cancel Edit
</Button>
</Grid>
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
type="submit"
color="success"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
>
Save
</Button>
</Grid>
</>
:
<>
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={onEditClick}
>
Edit
</Button>
</Grid>
</>
}
</Grid>
</Grid>
{/*end top button*/}
<Grid container spacing={1}>
<Grid item lg={4} >
@@ -164,12 +261,33 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("enName")}
id='enName'
disabled={!editMode}
/>
<Stack>
<OutlinedInput
id="enName"
type="enName"
{...register("enName")}
value={formik.values.enName}
disabled={!editMode}
name="enName"
onChange={formik.handleChange}
placeholder="與身份證明文件相同"
fullWidth
error={Boolean(formik.touched.enName && formik.errors.enName)}
onBlur={formik.handleBlur}
inputProps={{
onKeyDown: (e) => {
if (e.key === 'Enter') {
e.preventDefault();
}
},
}}
/>
{formik.touched.enName && formik.errors.enName && (
<FormHelperText error id="helper-text-enName-signup">
{formik.errors.enName}
</FormHelperText>
)}
</Stack>
</Grid>
</Grid>
</Grid>
@@ -218,12 +336,30 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("chName")}
id='chName'
disabled={!editMode}
/>
<OutlinedInput
fullWidth
disabled={!editMode}
{...register("chName")}
error={Boolean(formik.touched.chName && formik.errors.chName)}
id="chName"
type="text"
value={formik.values.chName}
name="chName"
onChange={formik.handleChange}
placeholder="與身份證明文件相同"
inputProps={{
onKeyDown: (e) => {
if (e.key === 'Enter') {
e.preventDefault();
}
},
}}
/>
{formik.touched.chName && formik.errors.chName && (
<FormHelperText error id="helper-text-chName-signup">
{formik.errors.chName}
</FormHelperText>
)}
</Grid>
</Grid>
</Grid>
@@ -255,12 +391,32 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("idDocType")}
id='idDocType'
disabled={!editMode}
/>

<Stack spacing={1} sx={{mr:{md:1},mb:{xs:0.5}}}>
<Autocomplete
fullWidth
disablePortal
id="idDocType"
{...register("idDocType")}
disabled={!editMode}
value={formik.values.idDocType}
options={ComboData.idDocType}
onBlur={formik.handleBlur}
onChange={(event, newValue) => {
setIdDocType(newValue);
}}
sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
renderInput={(params) => <TextField {...params} placeholder="證件類別"/>}
/>
{formik.touched.idDocType && (
idDocType===null?
<FormHelperText error id="helper-text-idDocType-signup">
請輸入證件類別
</FormHelperText>:''
)}
</Stack>


</Grid>
</Grid>
</Grid>
@@ -300,7 +456,7 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {

{
currentUserData.verified || editMode?
currentUserData.verifiedBy || editMode?
<Grid item xs={6}>
<TextField
fullWidth
@@ -329,7 +485,7 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
}}
onClick={onVerifiedClick}
>
Verified
Verify
</Button>
</Grid>
</>
@@ -346,17 +502,109 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
ID No.:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6} >
<TextField
{...register("identification",
{
value: currentUserData?.identification,
})}
id='identification'
disabled={!editMode}
/>
<Button lg={2} variant="contained" onClick={downloadFile} >View File</Button>
<Grid item lg={4}>
<Grid container>
{idDocType =="HKID"?
<>
<Grid item lg={8}>
<Stack fullWidth>
<OutlinedInput
disabled={!editMode}
{...register("identification")}
id="identification"
type="text"
value={formik.values.identification}
name="identification"
onChange={formik.handleChange}
placeholder="證件號碼"
//sx={{mr:1}}
error={Boolean(formik.touched.idNo && formik.errors.idNo)}
onBlur={formik.handleBlur}
inputProps={{
maxLength: idDocType =='HKID'?7:18,
onKeyDown: (e) => {
if (e.key === 'Enter') {
e.preventDefault();
}
},
}}
/>
{formik.touched.identification && formik.errors.identification && (
<FormHelperText error id="helper-text-idNo-signup">
{formik.errors.identification}
</FormHelperText>
)}
{formik.touched.checkDigit && formik.errors.checkDigit && (
<FormHelperText error id="helper-text-checkDigit-signup">
{formik.errors.checkDigit}
</FormHelperText>
)}
</Stack>
</Grid>
<Grid item lg={4}>
<Stack fullWidth >
<OutlinedInput
disabled={!editMode}
{...register("checkDigit")}
id="checkDigit"
type="text"
value={formik.values.checkDigit}
name="checkDigit"
onChange={formik.handleChange}
placeholder="( )"
// sx={{height:"53px"}}
inputProps={{
maxLength: 1,
onKeyDown: (e) => {
if (e.key === 'Enter') {
e.preventDefault();
}
},
}}
fullWidth
error={Boolean(formik.touched.checkDigit && formik.errors.checkDigit)}
onBlur={formik.handleBlur}
/>
</Stack>
</Grid>
</>:
<Grid item lg={4}>
<Stack fullWidth>
<OutlinedInput
{...register("identification")}
disabled={!editMode}
id="identification"
type="text"
value={formik.values.identification}
name="identification"
onChange={formik.handleChange}
placeholder="證件號碼"
fullWidth
sx={{mr:1}}
error={Boolean(formik.touched.identification && formik.errors.identification)}
onBlur={formik.handleBlur}
inputProps={{
onKeyDown: (e) => {
if (e.key === 'Enter') {
e.preventDefault();
}
},
}}
/>
{formik.touched.identification && formik.errors.identification && (
<FormHelperText error id="helper-text-idNo-signup">
{formik.errors.identification}
</FormHelperText>
)}
</Stack>
</Grid>
}
</Grid>
</Grid>
<Button lg={2} variant="contained" onClick={downloadFile} >View File</Button>


</Grid>
</Grid>

@@ -417,13 +665,24 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("country")}
id='country'
<Autocomplete
fullWidth
disablePortal
disabled={!editMode}
id="country"
value={country}
options={ComboData.country}
{...register("country")}
onChange={(event, newValue) => {
setCountry(newValue);
}}
sx={{"& .MuiInputBase-root": { height: "41px" },"#country":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
renderInput={(params) => <TextField {...params} placeholder="國家/地區"/>}
/>
</Grid>

</Grid>
</Grid>

@@ -452,20 +711,68 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
Status:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("status")}
id='status'
disabled
/>
</Grid>
{
editMode?
<Grid item lg={7}>
<TextField
fullWidth
{...register("status")}
id='status'
disabled
/>
</Grid>
:
<>
<Grid item lg={4}>
<TextField
fullWidth
{...register("status")}
id='status'
disabled
/>
</Grid>
{locked?
<Grid item lg={1}>
<Button
size="large"
variant="contained"
color="success"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={doUnlock}
>
Active
</Button>
</Grid>
:
<Grid item lg={1}>
<Button
size="large"
variant="contained"
color="error"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={doLock}
>
Lock
</Button>
</Grid>
}
</>
}

</Grid>
</Grid>


<Grid item lg={4}>
<Grid container alignItems={"center"}>
<Grid container alignItems={"top"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center top'}}>
Address:
@@ -502,97 +809,39 @@ const UserInformationCard_Individual = ({userData,userFile, loadDataFun}) => {
</Grid>
</Grid>
</Grid>
<Grid item lg={4}>
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
District:
</Grid>

</Grid>

{/*bottom button*/}
<Grid item s={12} md={12} lg={12} sx={{mb: 3}} alignItems={"end"} justifyContent="center">
<Grid container maxWidth justifyContent="flex-end">
{editMode?
<>
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
type="submit"
color="success"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
>
Save
</Button>
</Grid>
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
onClick={loadDataFun}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
>
Cancel & Back
</Button>
</Grid>
</>
:
<>
{locked?
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
color="primary"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={doUnlock}
>
Unlock
</Button>
</Grid>
:
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
color="primary"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={doLock}
>
Lock
</Button>
</Grid>
}
<Grid item sx={{ml: 3, mr: 3}}>
<Button
size="large"
variant="contained"
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}
onClick={onEditClick}
>
Edit
</Button>
<Grid item xs={7} s={7} md={7} lg={6}>
<Autocomplete
fullWidth
disablePortal
id="district"
{...register("district")}
value={district}
options={ComboData.district}
onChange={(event, newValue) => {
setDistrict(newValue);
}}
disabled={!editMode}
sx={{"& .MuiInputBase-root": { height: "41px" },"#district":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}}
renderInput={(params) => <TextField {...params} placeholder="區域 (只適用於香港)"/>}
/>
</Grid>
</Grid>
</Grid>
</>
}

</Grid>
</Grid>



</form>
</FormikProvider>
</MainCard>
);
};


+ 3
- 0
src/pages/pnspsUserDetailPage_Individual/index.js Voir le fichier

@@ -29,6 +29,9 @@ const UserMaintainPage_Individual = () => {
HttpUtils.get({
url: `${UrlUtils.GET_IND_USER_PATH}/${params.id}`,
onSuccess: function(response){
response.data["address"] = JSON.parse(response.data["address"]);
response.data["contactTel"] = JSON.parse(response.data["contactTel"]);
response.data["faxNo"] = JSON.parse(response.data["faxNo"]);
setUserData(response.data);
setUserFile(response.userFile)
}


+ 89
- 33
src/pages/pnspsUserDetailPage_Organization/UserInformationCard_Organization.js Voir le fichier

@@ -28,13 +28,13 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
let modifiedBy = DateUtils.datetimeStr(userData.modified)+", "+userData.modifiedBy;
userData["createDate"] = createDate;
userData["modifieDate"] = modifiedBy;
userData["verifiedStatus"] = userData.verified? "Not verify yet":"Verified";
userData["verifiedStatus"] = userData.verifiedBy? "Not verify yet":DateUtils.datetimeStr(userData.verifiedDate)+", "+userData.verifiedByName;

userData["country"] = userData.address?.country;
userData["district"] = userData.address?.district;
userData["addressLine1"] = userData.address?.addressLine1;
userData["addressLine2"] = userData.address?.addressLine2;
userData["addressLine3"] = userData.address?.addressLine3;
userData["addressLine3"] = userData.address?.addressLine3;

userData["phoneNumber"] = userData.contactTel?.phoneNumber;
userData["tel_countryCode"] = userData.contactTel?.countryCode;
@@ -55,14 +55,25 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
HttpUtils.post({
url: UrlUtils.POST_IND_USER+"/"+userData.id,
params: {
name: _formData.name,
prefix: _formData.prefix,
chName: _formData.chName,
enName: _formData.enName,
contactTel: {
countryCode: _formData.tel_countryCode,
phoneNumber: _formData.phoneNumber
},
faxNo: {
countryCode: _formData.fax_countryCode,
faxNumber: _formData.faxNumber
},
addressBus: {
country: _formData.country,
district: _formData.district,
addressLine1: _formData.addressLine1,
addressLine2: _formData.addressLine2,
addressLine3: _formData.addressLine3,
},
identification: _formData.identification,
emailAddress:_formData.emailAddress,
emailBus:_formData.emailBus,
},
onSuccess: function(){
loadDataFun();
@@ -130,14 +141,14 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
Name:
English Name:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("name")}
id='name'
{...register("enName")}
id='enName'
disabled={!editMode}
/>
</Grid>
@@ -166,14 +177,14 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
Prefix:
Chinese Name:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("prefix")}
id='prefix'
{...register("chName")}
id='chName'
disabled={!editMode}
/>
</Grid>
@@ -513,6 +524,23 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
</Grid>
</Grid>

<Grid item lg={4} >
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
Contact Person:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("contactPerson")}
id='brExpiryDateTemp'
disabled={!editMode}
/>
</Grid>
</Grid>
</Grid>
<Grid item lg={4}>
<Grid container alignItems={"center"}>
@@ -524,86 +552,114 @@ const UserInformationCard_Organization = ({userData, loadDataFun}) => {
<TextField
fullWidth
{...register("fax_countryCode")}
id='tel_countryCode'
id='fax_countryCode'
disabled={!editMode}
/>
</Grid>
<Grid item xs={4}>
<TextField
fullWidth
{...register("number")}
id='number'
{...register("faxNumber")}
id='faxNumber'
disabled={!editMode}
/>
</Grid>
</Grid>
</Grid>

<Grid item lg={4}>
<Grid item lg={4} >
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
Contact Tel:
BR Expiry Date.:
</Grid>
<Grid item xs={2}>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("tel_countryCode")}
id='tel_countryCode'
{...register("brExpiryDateTemp")}
id='brExpiryDateTemp'
disabled={!editMode}
/>
</Grid>
<Grid item xs={4}>
</Grid>
</Grid>

<Grid item lg={4}>
<Grid container alignItems={"top"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'top'}}>
<Grid item lg={12} sx={{alignItems: 'center'}}>Address :</Grid>
</Grid>

<Grid item xs={7} s={7} md={12} lg={6}>
<TextField
fullWidth
{...register("phoneNumber")}
id='phoneNumber'
{...register("addressLine1",
{
value: currentUserData?.address?.addressLine1,
})}
id='addressLine1'
disabled={!editMode}
/>
<TextField
fullWidth
{...register("addressLine2",
{
value: currentUserData?.address?.addressLine2,
})}
id='addressLine2'
disabled={!editMode}
/>
<TextField
fullWidth
{...register("addressLine3",
{
value: currentUserData?.address?.addressLine3,
})}
id='addressLine3'
disabled={!editMode}
/>
</Grid>
</Grid>
</Grid>



<Grid item lg={4}>
<Grid item lg={4} >
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
Email:
District:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("emailAddress")}
id='emailAddress'
{...register("district")}
id='district'
disabled={!editMode}
/>
</Grid>
</Grid>
</Grid>

<Grid item lg={4} >
<Grid container alignItems={"center"}>
<Grid item xs={4} s={4} md={4} lg={4}
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
BR Expiry Date.:
Country:
</Grid>

<Grid item xs={7} s={7} md={7} lg={6}>
<TextField
fullWidth
{...register("brExpiryDateTemp")}
id='brExpiryDateTemp'
{...register("country")}
id='country'
disabled={!editMode}
/>
</Grid>
</Grid>
</Grid>


</Grid>

</form>


+ 1
- 1
src/utils/ApiPathConst.js Voir le fichier

@@ -15,7 +15,7 @@ export const GET_USER_LOCK = apiPath+'/user/lock';
export const GET_USER_UNLOCK = apiPath+'/user/unlock';

export const GET_IND_USER_PATH = apiPath+'/user/ind';
export const GET_IND_USER_VERIFY = apiPath+'/user/ind/verify';
export const GET_IND_USER_VERIFY = apiPath+'/user/verify';
export const POST_IND_USER = apiPath+'/user/ind';

export const GET_ORG_USER_PATH = apiPath+'/user/org';


+ 32
- 0
src/utils/ComboData.js Voir le fichier

@@ -0,0 +1,32 @@
import * as yup from 'yup';

export const idDocType = ["passport","HKID","CNID","BR","otherCert"];
export const district = ["北區","長洲區","大埔區","大嶼山區","東區","觀塘區","黃大仙區","九龍城區","葵青區","南區","南丫島區",
"坪洲區","荃灣區","沙田區","深水埗區","屯門區","灣仔區","西貢區","油尖旺區","元朗區","中西區"];
export const country = ["香港","內地","澳門"];

export const validationSchema = ()=>{
return yup.object().shape({
username: yup.string().min(8,"用戶名稱最少8位").required('請輸入用戶名稱'),
password: yup.string().min(8,'請輸入最少8位密碼').required('請輸入密碼')
.matches(/^(?=.*[a-z])/, '請包括最少1個小寫字母')
.matches(/^(?=.*[A-Z])/, '請包括最少1個大寫字母')
.matches(/^(?=.*[0-9])/, '請包括最少1個數字')
.matches(/^(?=.*[!@#%&])/, '請包括最少1個特殊字符'),
confirmPassword: yup.string().min(8,'請最少輸入8位密碼').required('請確認密碼').oneOf([yup.ref('password'), null], '請輸入相同密碼'),
enName: yup.string().max(255).required('請輸入英文姓名'),
chName: yup.string().max(255).required('請輸入中文姓名'),
address1: yup.string().max(255).required('請輸入第一行地址'),
address2: yup.string().max(255).required('請輸入第二行地址'),
address3: yup.string().max(255).required('請輸入第三行地址'),
email: yup.string().email('請輸入電郵格式').max(255).required('請輸入電郵'),
emailConfirm: yup.string().email('請輸入電郵格式').max(255).required('請輸入電郵').oneOf([yup.ref('email'), null], '請輸入相同電郵'),
idNo: yup.string().min(7,"請輸入證件號碼").required('請輸入證件號碼'),
checkDigit:yup.string().max(1).required('請輸入括號內的數字或字母'),
idDocType: yup.string().max(255).required('請輸入證件類別'),
phoneCountryCode: yup.string().min(3,'請輸入3位數字').required('請輸入國際區號'),
faxCountryCode: yup.string().min(3,'請輸入3位數字'),
phone: yup.string().min(8,'請輸入8位數字').required('請輸入聯絡電話'),
fax: yup.string().min(8,'請輸入8位數字'),
});
}

Écrire Aperçu
Chargement…
Annuler
Enregistrer