Browse Source

update UI

CR003
Anna Ho 1 year ago
parent
commit
875458a76f
6 changed files with 49 additions and 54 deletions
  1. +39
    -44
      src/pages/Organization/DetailPage/OrganizationPubCard.js
  2. +2
    -2
      src/pages/User/DetailsPage_Individual/UserInformationCard_Individual_Pub.js
  3. +2
    -2
      src/pages/User/DetailsPage_Organization/UserInformationCard_Organization_Pub.js
  4. +2
    -2
      src/translations/en.json
  5. +3
    -3
      src/translations/zh-CN.json
  6. +1
    -1
      src/translations/zh-HK.json

+ 39
- 44
src/pages/Organization/DetailPage/OrganizationPubCard.js View File

@@ -1,6 +1,6 @@
// material-ui // material-ui
import { import {
Grid, Button,
Grid, Button,
// Checkbox, FormControlLabel, // Checkbox, FormControlLabel,
Typography, Typography,
Dialog, DialogTitle, DialogContent, DialogActions, Dialog, DialogTitle, DialogContent, DialogActions,
@@ -20,9 +20,9 @@ const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingCo
import Loadable from 'components/Loadable'; import Loadable from 'components/Loadable';
import { lazy } from 'react'; import { lazy } from 'react';
import { notifySaveSuccess } from 'utils/CommonFunction'; import { notifySaveSuccess } from 'utils/CommonFunction';
import {FormattedMessage, useIntl} from "react-intl";
import {PNSPS_BUTTON_THEME} from "themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
import { FormattedMessage, useIntl } from "react-intl";
import { PNSPS_BUTTON_THEME } from "themes/buttonConst";
import { ThemeProvider } from "@emotion/react";


// ==============================|| DASHBOARD - DEFAULT ||============================== // // ==============================|| DASHBOARD - DEFAULT ||============================== //


@@ -54,19 +54,19 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
enableReinitialize: true, enableReinitialize: true,
initialValues: currentUserData, initialValues: currentUserData,
validationSchema: yup.object().shape({ validationSchema: yup.object().shape({
addressLine1: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({id: 'validateAddressLine1'}))),
addressLine2: yup.string().max(40, displayErrorMsg(intl.formatMessage({id: 'noMoreThen40Words'}))),
addressLine3: yup.string().max(40, displayErrorMsg(intl.formatMessage({id: 'noMoreThen40Words'}))),
tel_countryCode: yup.string().min(3, displayErrorMsg(intl.formatMessage({id: 'requireDialingCode'}))),
phoneNumber: yup.string().min(8, displayErrorMsg(intl.formatMessage({id: 'requiredValidNumber'}))).required(displayErrorMsg(intl.formatMessage({id: 'requireContactNumber'}))),
addressLine1: yup.string().max(40).required(displayErrorMsg(intl.formatMessage({ id: 'validateAddressLine1' }))),
addressLine2: yup.string().max(40, displayErrorMsg(intl.formatMessage({ id: 'noMoreThen40Words' }))),
addressLine3: yup.string().max(40, displayErrorMsg(intl.formatMessage({ id: 'noMoreThen40Words' }))),
tel_countryCode: yup.string().min(3, displayErrorMsg(intl.formatMessage({ id: 'requireDialingCode' }))),
phoneNumber: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'requiredValidNumber' }))).required(displayErrorMsg(intl.formatMessage({ id: 'requireContactNumber' }))),
faxNumber: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'require8Number' }))).nullable(), faxNumber: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'require8Number' }))).nullable(),
}), }),
onSubmit: values => { onSubmit: values => {
if (values.country==null){
setErrorMsg(intl.formatMessage({id: 'pleaseFillInCountry'}))
if (values.country == null) {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInCountry' }))
} else { } else {
if (values.country.type =="hongKong" && values.district == null){
setErrorMsg(intl.formatMessage({id: 'pleaseFillInDistrict'}))
if (values.country.type == "hongKong" && values.district == null) {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInDistrict' }))
} else { } else {
HttpUtils.post({ HttpUtils.post({
url: UrlUtils.POST_PUB_ORG_SAVE_PATH, url: UrlUtils.POST_PUB_ORG_SAVE_PATH,
@@ -100,9 +100,9 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
} }
}); });


useEffect(()=>{
useEffect(() => {
setEditModeFun(editMode); setEditModeFun(editMode);
},[editMode]);
}, [editMode]);


useEffect(() => { useEffect(() => {
if (Object.keys(userData).length > 0) { if (Object.keys(userData).length > 0) {
@@ -188,7 +188,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
onClick={onEditClick} onClick={onEditClick}
color="success" color="success"
> >
< FormattedMessage id="edit" />
< FormattedMessage id="edit" />
</Button> </Button>
</ThemeProvider> </ThemeProvider>
</Grid> </Grid>
@@ -202,11 +202,11 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
<LoadingComponent /> <LoadingComponent />
: :
<Grid container spacing={1}> <Grid container spacing={1}>
<Grid item xs={12}>
{/* <Grid item xs={12}>
<Typography variant="h4" sx={{ mb: 2, mr: 3, borderBottom: "1px solid black" }}> <Typography variant="h4" sx={{ mb: 2, mr: 3, borderBottom: "1px solid black" }}>
<FormattedMessage id="organizationDetails" /> <FormattedMessage id="organizationDetails" />
</Typography> </Typography>
</Grid>
</Grid> */}
<Grid item xs={12}> <Grid item xs={12}>
<FormHelperText error id="helper-text-address1-signup"> <FormHelperText error id="helper-text-address1-signup">
<Typography variant="errorMessage1"> <Typography variant="errorMessage1">
@@ -216,27 +216,27 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
</Grid> </Grid>
<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getTextField({ {FieldUtils.getTextField({
label: intl.formatMessage({id: 'brNo'}) + ":",
label: intl.formatMessage({ id: 'brNo' }) + ":",
valueName: "brNo", valueName: "brNo",
disabled: true, disabled: true,
form: formik form: formik
})} })}
</Grid> </Grid>
<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{/* {FieldUtils.getTextField({
label: intl.formatMessage({id: 'creditorAccount'}) + ":",
valueName: "creditor",
disabled: true,
form: formik
})} */}
{FieldUtils.getTextField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'expiryDate' }) + ":"),
valueName: "brExpiryDate",
disabled: true,
form: formik
})}
</Grid> </Grid>


<Grid item xs={12} lg={4} ></Grid> <Grid item xs={12} lg={4} ></Grid>


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getTextField({ {FieldUtils.getTextField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'nameEng'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'nameEng' }) + ":"),
valueName: "enCompanyName", valueName: "enCompanyName",
disabled: true, disabled: true,
form: formik form: formik
@@ -245,7 +245,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getTextField({ {FieldUtils.getTextField({
label: intl.formatMessage({id: 'nameChi'}) + ":",
label: intl.formatMessage({ id: 'nameChi' }) + ":",
valueName: "chCompanyName", valueName: "chCompanyName",
disabled: true, disabled: true,
form: formik form: formik
@@ -253,17 +253,12 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
</Grid> </Grid>


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getTextField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'expiryDate'}) + ":"),
valueName: "brExpiryDate",
disabled: true,
form: formik
})}

</Grid> </Grid>


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getTextField({ {FieldUtils.getTextField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'contactPerson'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'contactPerson' }) + ":"),
valueName: "contactPerson", valueName: "contactPerson",
disabled: (!editMode && !createMode), disabled: (!editMode && !createMode),
form: formik form: formik
@@ -272,7 +267,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getPhoneField({ {FieldUtils.getPhoneField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'userContactNumber'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'userContactNumber' }) + ":"),
valueName: { valueName: {
code: "tel_countryCode", code: "tel_countryCode",
num: "phoneNumber" num: "phoneNumber"
@@ -284,7 +279,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getPhoneField({ {FieldUtils.getPhoneField({
label: intl.formatMessage({id: 'contactFaxNumber'}) + ":",
label: intl.formatMessage({ id: 'contactFaxNumber' }) + ":",
valueName: { valueName: {
code: "fax_countryCode", code: "fax_countryCode",
num: "faxNumber" num: "faxNumber"
@@ -296,22 +291,22 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getComboField({ {FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'country'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'country' }) + ":"),
valueName: "country", valueName: "country",
disabled: (!editMode && !createMode), disabled: (!editMode && !createMode),
dataList: ComboData.country, dataList: ComboData.country,
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik form: formik
})} })}
</Grid> </Grid>


<Grid item xs={12} lg={4} > <Grid item xs={12} lg={4} >
{FieldUtils.getComboField({ {FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'district'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'district' }) + ":"),
valueName: "district", valueName: "district",
disabled: (!editMode && !createMode), disabled: (!editMode && !createMode),
dataList: ComboData.district, dataList: ComboData.district,
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik form: formik
})} })}
</Grid> </Grid>
@@ -319,7 +314,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {


<Grid item xs={12} lg={12} > <Grid item xs={12} lg={12} >
{FieldUtils.getAddressField({ {FieldUtils.getAddressField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({id: 'formAddress'}) + ":"),
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'formAddress' }) + ":"),
valueName: ["addressLine1", "addressLine2", "addressLine3"], valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode && !createMode), disabled: (!editMode && !createMode),
form: formik form: formik
@@ -348,7 +343,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
<Typography variant="h4" style={{ padding: '16px' }}>Are you sure mark as Credit Client?</Typography> <Typography variant="h4" style={{ padding: '16px' }}>Are you sure mark as Credit Client?</Typography>
</DialogContent> </DialogContent>
<DialogActions> <DialogActions>
<Button onClick={() => setCreditorConfirmPopUp(false)}><Typography variant="h5">Cancel</Typography></Button>
<Button onClick={() => setCreditorConfirmPopUp(false)}><Typography variant="h5">Cancel</Typography></Button>
<Button onClick={() => markAsCreditor()}><Typography variant="h5">Confirm</Typography></Button> <Button onClick={() => markAsCreditor()}><Typography variant="h5">Confirm</Typography></Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
@@ -370,7 +365,7 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
<Typography variant="h4" style={{ padding: '16px' }}>Are you sure mark as Non-Credit Client?</Typography> <Typography variant="h4" style={{ padding: '16px' }}>Are you sure mark as Non-Credit Client?</Typography>
</DialogContent> </DialogContent>
<DialogActions> <DialogActions>
<Button onClick={() => setNonCreditorConfirmPopUp(false)}><Typography variant="h5">Cancel</Typography></Button>
<Button onClick={() => setNonCreditorConfirmPopUp(false)}><Typography variant="h5">Cancel</Typography></Button>
<Button onClick={() => markAsNonCreditor()}><Typography variant="h5">Confirm</Typography></Button> <Button onClick={() => markAsNonCreditor()}><Typography variant="h5">Confirm</Typography></Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>


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

@@ -180,9 +180,9 @@ const UserInformationCard_Individual_Pub = ({ formData, loadDataFun }) => {
</Grid> </Grid>
</Grid> </Grid>
{/*end top button*/} {/*end top button*/}
<Typography variant="h4" sx={{ mt: 3, mb: 2, borderBottom: "1px solid black" }}>
{/* <Typography variant="h4" sx={{ mt: 3, mb: 2, borderBottom: "1px solid black" }}>
<FormattedMessage id="userDetail" /> <FormattedMessage id="userDetail" />
</Typography>
</Typography> */}
<Grid item xs={12} sm={12} md={12} lg={12}> <Grid item xs={12} sm={12} md={12} lg={12}>
<Grid container> <Grid container>
<Grid item xs={12}> <Grid item xs={12}>


+ 2
- 2
src/pages/User/DetailsPage_Organization/UserInformationCard_Organization_Pub.js View File

@@ -153,9 +153,9 @@ const UserInformationCard_Organization_Pub = ({ userData, loadDataFun,}) => {
</Grid> </Grid>
{/*end top button*/} {/*end top button*/}
<div style={{ paddingLeft: 24, paddingRight: 24 }}> <div style={{ paddingLeft: 24, paddingRight: 24 }}>
<Typography variant="h4" sx={{ mt: 3, mb: 2, mr: 3, borderBottom: "1px solid black" }}>
{/* <Typography variant="h4" sx={{ mt: 3, mb: 2, mr: 3, borderBottom: "1px solid black" }}>
<FormattedMessage id="userDetail" /> <FormattedMessage id="userDetail" />
</Typography>
</Typography> */}
<Grid container spacing={1}> <Grid container spacing={1}>
<Grid item xs={12} lg={12}> <Grid item xs={12} lg={12}>
{FieldUtils.getTextField({ {FieldUtils.getTextField({


+ 2
- 2
src/translations/en.json View File

@@ -140,7 +140,7 @@
"proofRecord": "Proof Records", "proofRecord": "Proof Records",
"onlinePaymentHistory": "Online Payment History", "onlinePaymentHistory": "Online Payment History",
"setting": "Settings", "setting": "Settings",
"companyOrUserRecord": "Company/Institutional User Records",
"companyOrUserRecord": "Organisation/Company User Records",
"welcomeMsg_am": "Good morning! Please select the required service.", "welcomeMsg_am": "Good morning! Please select the required service.",
"welcomeMsg_pm": "Good afternoon! Please select the required service.", "welcomeMsg_pm": "Good afternoon! Please select the required service.",
"welcomeMsg_night": "Good evening! Please select the required service.", "welcomeMsg_night": "Good evening! Please select the required service.",
@@ -523,7 +523,7 @@
"msgDetails": "Message Details", "msgDetails": "Message Details",


"userDetail": "User Details", "userDetail": "User Details",
"userProfile": "My Profile",
"userProfile": "User Profile",
"userChangePassword": "Change Password", "userChangePassword": "Change Password",
"primaryUser": "Primary User", "primaryUser": "Primary User",
"resetAndBack": "Reset & Back", "resetAndBack": "Reset & Back",


+ 3
- 3
src/translations/zh-CN.json View File

@@ -518,10 +518,10 @@
"viewAllSystemMessage": "显示所有消息", "viewAllSystemMessage": "显示所有消息",
"msgDetails": "消息详情", "msgDetails": "消息详情",


"userDetail": "用户详细信息",
"userProfile": "我的个人资料",
"userDetail": "使用者详细信息",
"userProfile": "使用者资料",
"userChangePassword": "更改密码", "userChangePassword": "更改密码",
"primaryUser": "主要用户",
"primaryUser": "主要使用者",
"resetAndBack": "重置并返回", "resetAndBack": "重置并返回",
"edit": "编辑", "edit": "编辑",
"save": "保存", "save": "保存",


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

@@ -520,7 +520,7 @@
"msgDetails": "消息詳情", "msgDetails": "消息詳情",


"userDetail": "使用者詳細資料", "userDetail": "使用者詳細資料",
"userProfile": "我的個人資料",
"userProfile": "使用者資料",
"userChangePassword": "更改密碼", "userChangePassword": "更改密碼",
"primaryUser": "主要使用者", "primaryUser": "主要使用者",
"resetAndBack": "重置並返回", "resetAndBack": "重置並返回",


Loading…
Cancel
Save