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

update combo

master
jason.lam 1 year ago
parent
899deb36a6
commit
09813db4c1
15 changed files with 101 additions and 51 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +3
    -1
      src/pages/Organization/DetailPage/OrganizationCard.js
  2. +4
    -2
      src/pages/Organization/DetailPage/index.js
  3. +1
    -1
      src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js
  4. +2
    -2
      src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
  5. +5
    -3
      src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js
  6. +4
    -2
      src/pages/User/DetailsPage_Individual/index.js
  7. +3
    -1
      src/pages/User/DetailsPage_Organization/UserInformationCard_Organization.js
  8. +9
    -7
      src/pages/authentication/auth-forms/BusCustomFormWizard.js
  9. +14
    -11
      src/pages/authentication/auth-forms/CustomFormWizard.js
  10. +2
    -2
      src/pages/authentication/auth-forms/IAmSmartFormWizard.js
  11. +1
    -0
      src/translations/en.json
  12. +1
    -0
      src/translations/zh-CN.json
  13. +1
    -0
      src/translations/zh-HK.json
  14. +33
    -19
      src/utils/ComboData.js
  15. +18
    -0
      src/utils/CommonFunction.js

+ 3
- 1
src/pages/Organization/DetailPage/OrganizationCard.js View File

@@ -363,6 +363,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
valueName: "country",
disabled: (!editMode && !createMode),
dataList: ComboData.country,
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "hongKong" }),
form: formik
})}
</Grid>
@@ -372,7 +373,8 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
label: FieldUtils.notNullFieldLabel("District:"),
valueName: "district",
disabled: (!editMode && !createMode),
dataList: ComboData.district(intl),
dataList: ComboData.district,
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "hongKong" }),
form: formik
})}
</Grid>


+ 4
- 2
src/pages/Organization/DetailPage/index.js View File

@@ -13,6 +13,8 @@ const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/Loa
import ForwardIcon from '@mui/icons-material/Forward';
import { useNavigate, useParams } from 'react-router-dom';
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
import {getObjectByValue} from "../../../utils/CommonFunction";
import * as ComboData from "../../../utils/ComboData";

const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
@@ -46,8 +48,8 @@ const OrganizationDetailPage = () => {
HttpUtils.get({
url: UrlUtils.GET_ORG_PATH + "/" + params.id,
onSuccess: function (response) {
response.data["country"] = response.data.addressTemp?.country;
response.data["district"] = response.data.addressTemp?.district;
response.data["country"] = getObjectByValue(ComboData.country, "key", response.data.address?.country);
response.data["district"] = getObjectByValue(ComboData.district, "key", response.data.address?.district);
response.data["addressLine1"] = response.data.addressTemp?.addressLine1;
response.data["addressLine2"] = response.data.addressTemp?.addressLine2;
response.data["addressLine3"] = response.data.addressTemp?.addressLine3;


+ 1
- 1
src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js View File

@@ -236,7 +236,7 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
{FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel("District:"),
valueName: "district",
dataList: ComboData.district(intl),
dataList: ComboData.district,
form: formik
})}
</Grid>


+ 2
- 2
src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js View File

@@ -160,7 +160,7 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
</Grid>
<Grid item xs={12} md={12}>
{FieldUtils.getPhoneField({
label: "聯繫電話:",
label: intl.formatMessage({id: 'userContactNumber'}) + ":",
disabled: true,
valueName: {
code: "tel_countryCode",
@@ -171,7 +171,7 @@ const PublicNoticeApplyForm = ({ loadedData, selections }) => {
</Grid>
<Grid item xs={12} md={12}>
{FieldUtils.getPhoneField({
label: "聯繫傳真:",
label: intl.formatMessage({id: 'contactFaxNumber'}) + ":",
disabled: true,
valueName: {
code: "fax_countryCode",


+ 5
- 3
src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js View File

@@ -75,8 +75,8 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => {
},
emailAddress: values.emailAddress,
address: {
country: values.country,
district: values.district,
country: values.country.key,
district: values.district.key,
addressLine1: values.addressLine1,
addressLine2: values.addressLine2,
addressLine3: values.addressLine3,
@@ -411,6 +411,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => {
{FieldUtils.getComboField({
label: "Country:",
valueName: "country",
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "hongKong" }),
dataList: ComboData.country,
disabled: (!editMode),
form: formik
@@ -498,7 +499,8 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => {
{FieldUtils.getComboField({
label: "District:",
valueName: "district",
dataList: ComboData.district(intl),
dataList: ComboData.district,
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "islandCombo" }),
disabled: (!editMode),
form: formik
})}


+ 4
- 2
src/pages/User/DetailsPage_Individual/index.js View File

@@ -22,6 +22,8 @@ const BackgroundHead = {
}
import Loadable from 'components/Loadable';
import { useNavigate } from "react-router-dom";
import {getObjectByValue} from "../../../utils/CommonFunction";
import * as ComboData from "../../../utils/ComboData";
const LoadingComponent = Loadable(React.lazy(() => import('../../extra-pages/LoadingComponent')));
const UserInformationCard = Loadable(React.lazy(() => import('./UserInformationCard_Individual')));

@@ -54,8 +56,8 @@ const UserMaintainPage_Individual = () => {
response.data["modifieDate"] = modifiedBy;
response.data["verifiedStatus"] = response.data.verifiedBy ? DateUtils.datetimeStr(response.data.verifiedDate) + ", " + response.data.verifiedByName : "Not verified";

response.data["country"] = response.data.address?.country;
response.data["district"] = response.data.address?.district;
response.data["country"] = getObjectByValue(ComboData.country, "key", response.data.address?.country);
response.data["district"] = getObjectByValue(ComboData.district, "key", response.data.address?.district);
response.data["addressLine1"] = response.data.address?.addressLine1;
response.data["addressLine2"] = response.data.address?.addressLine2;
response.data["addressLine3"] = response.data.address?.addressLine3;


+ 3
- 1
src/pages/User/DetailsPage_Organization/UserInformationCard_Organization.js View File

@@ -525,6 +525,7 @@ const UserInformationCard_Organization = ({ userData, loadDataFun, orgData }) =>
label: "Country:",
valueName: "country",
dataList: ComboData.country,
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "hongKong" }),
disabled: true,
form: formik
})}
@@ -564,7 +565,8 @@ const UserInformationCard_Organization = ({ userData, loadDataFun, orgData }) =>
{FieldUtils.getComboField({
label: "District:",
valueName: "district",
dataList: ComboData.district(intl),
dataList: ComboData.district,
getOptionLabel: (option) => intl.formatMessage({ id: option.type? option.type : "islandCombo" }),
disabled: true,
form: formik
})}


+ 9
- 7
src/pages/authentication/auth-forms/BusCustomFormWizard.js View File

@@ -89,7 +89,7 @@ const BusCustomFormWizard = (props) => {
};

const [selectedAddress4, setSelectedAddress4] = useState(null);
const [selectedAddress5, setSelectedAddress5] = useState(ComboData.country(intl)[0]);
const [selectedAddress5, setSelectedAddress5] = useState(ComboData.country[0]);
const [termsAndConAccept, setTermsAndConAccept] = useState(false);
const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false);
const [isValid, setisValid] = useState(false);
@@ -101,8 +101,8 @@ const BusCustomFormWizard = (props) => {
const [checkEmail, setCheckEmail] = useState(false)
const [checkEmailBlur, setCheckEmailBlur] = useState(false)

const address4ComboList = ComboData.district(intl);
const address5ComboList = ComboData.country(intl);
const address4ComboList = ComboData.district;
const address5ComboList = ComboData.country;
const termsAndCon = "此網址由香港特別行政區政府物流服務署製作及管理。本署會盡力確保網址上的資料無誤，\n"
+ "但有絕對酌情權隨時刪除、暫停登載或編輯各項資料而無須給予任何理由。\n由於任何與網址"
+ "內資料有關的理由或原因，而導致出現申索、損失或損害，本署概不負責。\n使用者須自行評"
@@ -546,7 +546,7 @@ const BusCustomFormWizard = (props) => {
const handleReset = (resetForm) => {
resetForm();
setSelectedAddress4("")
setSelectedAddress5(ComboData.country(intl)[0])
setSelectedAddress5(ComboData.country[0])
setCheckCountry(false)
setFileList([])
setFileListData([])
@@ -972,6 +972,7 @@ const BusCustomFormWizard = (props) => {
value={selectedAddress4}
options={address4ComboList}
disabled={checkCountry}
getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
onChange={(event, newValue) => {
setSelectedAddress4(newValue);
}}
@@ -986,10 +987,11 @@ const BusCustomFormWizard = (props) => {
id="address5-combo"
value={selectedAddress5}
options={address5ComboList}
getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setSelectedAddress5(newValue);
if (newValue === intl.formatMessage({id: 'hongKong'})) {
if (newValue.type === 'hongKong') {
setCheckCountry(false)
} else {
setSelectedAddress4("");
@@ -1534,7 +1536,7 @@ const BusCustomFormWizard = (props) => {
{formik.values.address3}
</Typography>
: null}
{selectedAddress5 === "香港" ?
{selectedAddress5.label === "hongKong" ?
<Stack direction="row">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
<FormattedMessage id="region"/>:
@@ -1549,7 +1551,7 @@ const BusCustomFormWizard = (props) => {
<FormattedMessage id="regionOrCountry"/>:
</Typography>
<Typography variant="pnspsFormHeader">
{selectedAddress5}
{intl.formatMessage({id: selectedAddress5.label})}
</Typography>
</Stack>
</Stack>


+ 14
- 11
src/pages/authentication/auth-forms/CustomFormWizard.js View File

@@ -89,7 +89,8 @@ const CustomFormWizard = (props) => {
const [selectedIdDocInputType, setSelectedIdDocInputType] = useState("");
// const [selectedIdDocLabel, setSelectedIdDocLabel] = useState(null);
const [selectedAddress4, setSelectedAddress4] = useState(null);
const [selectedAddress5, setSelectedAddress5] = useState(ComboData.country(intl)[0]);
console.log(ComboData.country[0]);
const [selectedAddress5, setSelectedAddress5] = useState(ComboData.country[0]);
const [termsAndConAccept, setTermsAndConAccept] = useState(false);
const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false);
const [isValid, setisValid] = useState(false);
@@ -102,8 +103,6 @@ const CustomFormWizard = (props) => {
const [checkEmailBlur, setCheckEmailBlur] = useState(false)

const idDocTypeComboList = ComboData.idDocType;
const address4ComboList = ComboData.district(intl);
const address5ComboList = ComboData.country(intl);
const termsAndCon = "此網址由香港特別行政區政府物流服務署製作及管理。本署會盡力確保網址上的資料無誤，\n"
+ "但有絕對酌情權隨時刪除、暫停登載或編輯各項資料而無須給予任何理由。\n由於任何與網址"
+ "內資料有關的理由或原因，而導致出現申索、損失或損害，本署概不負責。\n使用者須自行評"
@@ -315,8 +314,8 @@ const CustomFormWizard = (props) => {
const _onSubmit = () => {
setLoding(true);
values.idDocType = selectedIdDocType.type
values.address4 = selectedAddress4
values.address5 = selectedAddress5
values.address4 = selectedAddress4.key
values.address5 = selectedAddress5.key
const userAddress = {
"addressLine1": "",
"addressLine2": "",
@@ -638,7 +637,7 @@ const CustomFormWizard = (props) => {
const handleReset = (resetForm) => {
resetForm();
setSelectedAddress4("")
setSelectedAddress5(ComboData.country(intl)[0])
setSelectedAddress5(ComboData.country[0])
setCheckCountry(false)
setSelectedIdDocType({})
setSelectedIdDocInputType("");
@@ -1176,8 +1175,9 @@ const CustomFormWizard = (props) => {
disablePortal
id="address4-combo"
value={selectedAddress4}
options={address4ComboList}
options={ComboData.district}
disabled={checkCountry}
getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
onChange={(event, newValue) => {
setSelectedAddress4(newValue);
}}
@@ -1191,11 +1191,12 @@ const CustomFormWizard = (props) => {
disablePortal
id="address5-combo"
value={selectedAddress5}
options={address5ComboList}
options={ComboData.country}
getOptionLabel={(option) => option.type? intl.formatMessage({ id: option.type }) : ""}
onChange={(event, newValue) => {
if (newValue !== null) {
setSelectedAddress5(newValue);
if (newValue === intl.formatMessage({id: 'hongKong'})) {
if (newValue.type === 'hongKong') {
setCheckCountry(false)
} else {
setSelectedAddress4("");
@@ -1707,7 +1708,7 @@ const CustomFormWizard = (props) => {
{formik.values.address3}
</Typography>
: null}
{selectedAddress5 == ("香港") ?
{selectedAddress5.label === "hongKong" ?
<Stack direction="row">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
<FormattedMessage id="region"/>:
@@ -1719,7 +1720,9 @@ const CustomFormWizard = (props) => {
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address5-signup">
<FormattedMessage id="regionOrCountry"/>:
</Typography>
<Typography variant="pnspsFormHeader">{selectedAddress5}</Typography>
<Typography variant="pnspsFormHeader">
{intl.formatMessage({id: selectedAddress5.label})}
</Typography>
</Stack>
</Stack>
</Stack>


+ 2
- 2
src/pages/authentication/auth-forms/IAmSmartFormWizard.js View File

@@ -64,7 +64,7 @@ const CustomFormWizard = (props) => {
const [checkEmail, setCheckEmail] = useState(false)
const [checkEmailBlur, setCheckEmailBlur] = useState(false)

const address4ComboList = ComboData.district(intl);
const address4ComboList = ComboData.district;
const address5ComboList = ComboData.country;
const termsAndCon = "此網址由香港特別行政區政府物流服務署製作及管理。本署會盡力確保網址上的資料無誤，\n"
+ "但有絕對酌情權隨時刪除、暫停登載或編輯各項資料而無須給予任何理由。\n由於任何與網址"
@@ -522,7 +522,7 @@ const CustomFormWizard = (props) => {
onChange={(event, newValue) => {
if (newValue !== null) {
setSelectedAddress5(newValue);
if (newValue === intl.formatMessage({id: 'hongKong'})) {
if (newValue.type === 'hongKong') {
setCheckCountry(false)
} else {
setSelectedAddress4("");


+ 1
- 0
src/translations/en.json View File

@@ -75,6 +75,7 @@
"emailUsed": "This email has been registered, please use another email",
"emailSent": "A verification email will be sent to your email address. Please follow the instructions to complete the verification and log in to the system.",
"userContactNumber": "Contact Number",
"contactFaxNumber": "Contact Fax",
"requiredValidNumber": "Please enter a valid contact number",
"requireContactNumber": "Please enter your contact number",
"require3Number": "Please enter an 3-digit number",


+ 1
- 0
src/translations/zh-CN.json View File

@@ -75,6 +75,7 @@
"emailUsed": "此电邮已被注册，请使用其他电邮",
"emailSent": "验证电邮将发送到你的电邮地址，请依指示完成验证及登入系统。",
"userContactNumber": "联络电话",
"contactFaxNumber": "联络传真",
"requiredValidNumber": "请输入有效联络电话",
"requireContactNumber": "请输入联络电话",
"require3Number": "请输入3位数字",


+ 1
- 0
src/translations/zh-HK.json View File

@@ -75,6 +75,7 @@
"emailUsed": "此電郵已被注冊，請使用其他電郵",
"emailSent": "驗證電郵將發送到你的電郵地址，請依指示完成驗證及登入系統。",
"userContactNumber": "聯絡電話",
"contactFaxNumber": "聯絡傳真",
"requiredValidNumber": "請輸入有效聯絡電話",
"requireContactNumber": "請輸入聯絡電話",
"require3Number": "請輸入3位數字",


+ 33
- 19
src/utils/ComboData.js View File

@@ -1,25 +1,39 @@
export const idDocType = [
{ key: 1, label: 'passport', type: 'passport' },
{ key: 2, label: 'HKIDcard', type: 'HKID' },
{ key: 3, label: 'mainlandIDCard', type: 'CNID' },
{ key: 4, label: 'proCert', type: 'otherCert' }
{ id:1, key: 1, label: 'passport', type: 'passport' },
{ id:2, key: 2, label: 'HKIDcard', type: 'HKID' },
{ id:3, key: 3, label: 'mainlandIDCard', type: 'CNID' },
{ id:4, key: 4, label: 'proCert', type: 'otherCert' }
];
export const district = (intl) =>{
return [
'islandCombo', 'kwaiTsingCombo', 'northCombo', 'saiKungCombo',
'shaTinCombo', 'taiPoCombo', 'tsuenWanCombo', 'tuenMunCombo',
'yuenLongCombo', 'kowloonCityCombo', 'kwunTongCombo', 'shamShuiPoCombo',
'wongTaiSinCombo', 'yauTsimMongCombo', 'centralAndWesternCombo', 'easternCombo',
'southernCombo', 'wanChaiCombo', 'lantauIslandCombo', 'lammaIslandCombo',
'pengChauCombo'
].map((district) => intl.formatMessage({id: district}));
};

export const country = (intl) => {
return ["hongKong", "mainland", "macau"]
.map((country) => intl.formatMessage({ id: country }));
};
export const district = [
{ id: 1, key: 1, label: '離島區', type: 'islandCombo' },
{ id: 2, key: 2, label: '葵青區', type: 'kwaiTsingCombo' },
{ id: 3, key: 3, label: '北區', type: 'northCombo' },
{ id: 4, key: 4, label: '西貢區', type: 'saiKungCombo' },
{ id: 5, key: 5, label: '沙田區', type: 'shaTinCombo' },
{ id: 6, key: 6, label: '大埔區', type: 'taiPoCombo' },
{ id: 7, key: 7, label: '荃灣區', type: 'tsuenWanCombo' },
{ id: 8, key: 8, label: '屯門區', type: 'tuenMunCombo' },
{ id: 9, key: 9, label: '元朗區', type: 'yuenLongCombo' },
{ id: 10, key: 10, label: '九龍城區', type: 'kowloonCityCombo' },
{ id: 11, key: 11, label: '觀塘區', type: 'kwunTongCombo' },
{ id: 12, key: 12, label: '深水埗區', type: 'shamShuiPoCombo' },
{ id: 13, key: 13, label: '黃大仙區', type: 'wongTaiSinCombo' },
{ id: 14, key: 14, label: '油尖旺區', type: 'yauTsimMongCombo' },
{ id: 15, key: 15, label: '中西區', type: 'centralAndWesternCombo' },
{ id: 16, key: 16, label: '東區', type: 'easternCombo' },
{ id: 17, key: 17, label: '南區', type: 'southernCombo' },
{ id: 18, key: 18, label: '灣仔區', type: 'wanChaiCombo' },
{ id: 19, key: 19, label: '大嶼山區', type: 'lantauIslandCombo' },
{ id: 20, key: 20, label: '南丫島區', type: 'lammaIslandCombo' },
{ id: 21, key: 21, label: '坪洲區', type: 'pengChauCombo' }
];

export const country = [
{ id:1, key: 1, label: '香港', type: 'hongKong' },
{ id:2, key: 2, label: '內地', type: 'mainland' },
{ id:3, key: 3, label: '澳門', type: 'macau' }
];

export const accountFilter = [{ id: 1, key: 1, label: 'Active', type: 'active' }, { id: 2, key: 2, label: 'Locked', type: 'locked' }, { id: 3, key: 3, label: 'Not verified', type: 'notVerified' }];



+ 18
- 0
src/utils/CommonFunction.js View File

@@ -26,6 +26,15 @@ export function getObjectById(list, id) {
return obj === undefined || Object.keys(obj).length <= 0 ? null : obj
}

export function getObjectByValue(list, valueName, value) {
const obj = list.find((element) => {
return element[valueName] === parseInt(value);
});
console.log(obj);
return obj === undefined || Object.keys(obj).length <= 0 ? null : obj
}


export function removeObjectWithId(arr, id) {
const arrCopy = Array.from(arr);
const objWithIdIndex = arrCopy.findIndex((obj) => obj.id === id);
@@ -33,6 +42,15 @@ export function removeObjectWithId(arr, id) {
return arrCopy;
}

export function getComboValueByLabel(comboList, input) {
for (let i = 0; i < comboList.length; i++) {
if (comboList[i].label === input) {
return comboList[i];
}
}
return input === undefined ? null : input;
}

export function getDateString(queryDateArray) {
return (
queryDateArray[0]


Write Preview
Loading…
Cancel
Save