alex
/
PNSPS-frontend-MaterialUI
1
0
Förgrening 0
Kod Ärenden 0 Pull-förfrågningar 0 Släpp 0 Wiki Aktiviteter
Bläddra i källkod

update ui layout

CR003
Alex Cheung 1 år sedan
förälder
96b7bc6ef5
incheckning
0ee39a7fde
15 ändrade filer med 192 tillägg och 109 borttagningar
Delad Vy
Diff Options
Show Stats Download Patch File Download Diff File
  1. +22
    -21
      src/pages/Organization/DetailPage/OrganizationCard.js
  2. +17
    -16
      src/pages/Organization/DetailPage/OrganizationPubCard.js
  3. +14
    -13
      src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js
  4. +6
    -0
      src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js
  5. +43
    -2
      src/pages/PublicNotice/Details_GLD/GazetteDetailCard.js
  6. +22
    -21
      src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js
  7. +22
    -21
      src/pages/User/DetailsPage_Individual/UserInformationCard_Individual_Pub.js
  8. +4
    -4
      src/pages/authentication/auth-forms/BusCustomFormWizard.js
  9. +4
    -4
      src/pages/authentication/auth-forms/CustomFormWizard.js
  10. +4
    -4
      src/pages/authentication/auth-forms/IAmSmartFormWizard.js
  11. +1
    -0
      src/translations/en.json
  12. +2
    -1
      src/translations/zh-CN.json
  13. +2
    -1
      src/translations/zh-HK.json
  14. +28
    -0
      src/utils/FieldUtils.js
  15. +1
    -1
      src/utils/statusUtils/ProofStatus.js

+ 22
- 21
src/pages/Organization/DetailPage/OrganizationCard.js Visa fil

@@ -517,27 +517,6 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
})}
</Grid>

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

<Grid item xs={12} lg={4} >
{FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel("District:"),
valueName: "district",
disabled: (!editMode && !createMode),
dataList: ComboData.district,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik
})}
</Grid>
{
currentUserData.creditor ?
<Grid item xs={12} lg={4} >
@@ -562,6 +541,28 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
})}
</Grid>

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

<Grid item xs={12} lg={12} >
{FieldUtils.getProfileComboField({
label: "",
valueName: "country",
disabled: true,
dataList: ComboData.country,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik
})}
</Grid>

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

</Grid>


+ 17
- 16
src/pages/Organization/DetailPage/OrganizationPubCard.js Visa fil

@@ -289,20 +289,19 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
})}
</Grid>

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

<Grid item xs={12} lg={4} >
{FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'district' }) + ":"),
<Grid item xs={12} lg={12} >
{FieldUtils.getProfileComboField({
// label: FieldUtils.notNullFieldLabel(""),
label: "",
valueName: "district",
disabled: (!editMode && !createMode),
dataList: ComboData.district,
@@ -310,13 +309,15 @@ const OrganizationPubCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
form: formik
})}
</Grid>


<Grid item xs={12} lg={12} >
{FieldUtils.getAddressField({
label: FieldUtils.notNullFieldLabel(intl.formatMessage({ id: 'formAddress' }) + ":"),
valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode && !createMode),
{FieldUtils.getProfileComboField({
// label: FieldUtils.notNullFieldLabel(""),
label: "",
valueName: "country",
disabled: true,
dataList: ComboData.country,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik
})}
</Grid>


+ 14
- 13
src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js Visa fil

@@ -310,20 +310,17 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
})}
</Grid>

<Grid item xs={12} lg={4}>
{FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel("Country:"),
valueName: "country",
disabled: true,
dataList: ComboData.country,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
<Grid item xs={12}>
{FieldUtils.getAddressField({
label: FieldUtils.notNullFieldLabel("Address:"),
valueName: ["addressLine1", "addressLine2", "addressLine3"],
form: formik
})}
</Grid>

<Grid item xs={12} lg={4}>
<Grid item xs={12} lg={12}>
{FieldUtils.getComboField({
label: FieldUtils.notNullFieldLabel("District:"),
label: "",
valueName: "district",
dataList: ComboData.district,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
@@ -331,13 +328,17 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
})}
</Grid>

<Grid item xs={12}>
{FieldUtils.getAddressField({
label: FieldUtils.notNullFieldLabel("Address:"),
valueName: ["addressLine1", "addressLine2", "addressLine3"],
<Grid item xs={12} lg={12}>
{FieldUtils.getComboField({
label: "",
valueName: "country",
disabled: true,
dataList: ComboData.country,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
form: formik
})}
</Grid>

</Grid>
}
</form>


+ 6
- 0
src/pages/PublicNotice/ApplyForm/PublicNoticeApplyForm.js Visa fil

@@ -587,6 +587,12 @@ const PublicNoticeApplyForm = ({ loadedData, _selections, gazetteIssueList }) =>
</center>
</Grid>

<Grid item xs={12}>
<Typography variant="h6" height="100%" >
<div style={{ padding: 12 }} dangerouslySetInnerHTML={{ __html: intl.formatMessage({ id: "applyPublicNoticeText" }) }} />
</Typography>
</Grid>






+ 43
- 2
src/pages/PublicNotice/Details_GLD/GazetteDetailCard.js Visa fil

@@ -33,6 +33,8 @@ const GazetteDetailCard = (
const [groupTitle, setGroupTitle] = useState("");
const [verified, setVerified] = useState(null);
const [currentStatus, setCurrentStatus] = useState({});
const [sysType, setSysType] = useState(null);
const [careOf, setCareOf] = useState("");

const [isWarningPopUp, setIsWarningPopUp] = useState(false);
const [warningText, setWarningText] = useState("");
@@ -49,7 +51,9 @@ const GazetteDetailCard = (
+ " No. " + applicationDetailData.gazetteIssueDetail.issueNo);
setIssueDate(DateUtils.dateFormat(applicationDetailData.gazetteIssueDetail.issueDate, "D MMM YYYY (ddd)"));
setGazetteCode(applicationDetailData.data.groupNo)
console.log(gazetteCode)
console.log(applicationDetailData)
setSysType(applicationDetailData.userData.sysType)
setCareOf(applicationDetailData.data.careOf)
setGroupTitle(applicationDetailData.data.groupTitle)
}
}, [applicationDetailData]);
@@ -178,7 +182,7 @@ const GazetteDetailCard = (
</Grid>
</Grid>
<Grid container direction="row" justifyContent="space-between"
alignItems="center" sx={{ mb: { lg: -3 } }}>
alignItems="center" >
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={4} lg={4}
@@ -238,6 +242,43 @@ const GazetteDetailCard = (
</Grid>
</Grid>
</Grid>
{
sysType != null && sysType == "dummy"?
<Grid container direction="row" justifyContent="space-between" alignItems="center" sx={{ mb: { lg: -3 } }}>
<Grid item xs={12} md={12} lg={12} sx={{ mb: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={2} lg={2}
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>
<Typography variant="h5">Customer&apos;s Client/ Case No:</Typography>
</FormLabel>
</Grid>
<Grid item xs={12} md={10} lg={10}>
<FormControl variant="outlined" fullWidth disabled >
<OutlinedInput
fullWidth
size="small"
{...register("careOf",
{
value: careOf,
})}
value={careOf}
id='careOf'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Grid>
</Grid>
</Grid>
</Grid>
: null
}
</Grid>
</Grid>
</form>


+ 22
- 21
src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js Visa fil

@@ -575,11 +575,11 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => {

<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: "Country:",
valueName: "country",
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
dataList: ComboData.country,
disabled: true,
label: intl.formatMessage({ id: 'language' }) + ":",
valueName: "preferLocale",
dataList: ComboData.Locale,
getOptionLabel: (option) => option.label ? option.label : "",
disabled: (!editMode),
form: formik
})}
</Grid>
@@ -649,36 +649,37 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => {
</Grid>
</Grid>

<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: "District:",
valueName: "district",
dataList: ComboData.district,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getAddressField({
label: "Address:",
valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode),
form: formik
})}
</Grid>

<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: intl.formatMessage({ id: 'language' }) + ":",
valueName: "preferLocale",
dataList: ComboData.Locale,
getOptionLabel: (option) => option.label ? option.label : "",
<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getProfileComboField({
label: "",
valueName: "district",
dataList: ComboData.district,
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
disabled: (!editMode),
form: formik
})}
</Grid>

<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getAddressField({
label: "Address:",
valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode),
{FieldUtils.getProfileComboField({
label: "",
valueName: "country",
getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "",
dataList: ComboData.country,
disabled: true,
form: formik
})}
</Grid>

</Grid>
</Grid>
</form>


+ 22
- 21
src/pages/User/DetailsPage_Individual/UserInformationCard_Individual_Pub.js Visa fil

@@ -330,11 +330,11 @@ const UserInformationCard_Individual_Pub = ({ formData, loadDataFun }) => {

<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: intl.formatMessage({id: 'country'}) + ":",
valueName: "country",
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",
dataList: ComboData.country,
disabled: true,
label: intl.formatMessage({id: 'language'}) + ":",
valueName: "preferLocale",
dataList: ComboData.Locale,
getOptionLabel: (option) => option.label? option.label: "",
disabled: (!editMode),
form: formik
})}
</Grid>
@@ -359,33 +359,34 @@ const UserInformationCard_Individual_Pub = ({ formData, loadDataFun }) => {
form: formik
})}
</Grid>
<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: intl.formatMessage({id: 'district'}) + ":",
valueName: "district",
dataList: ComboData.district,
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",

<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getAddressField({
label: intl.formatMessage({id: 'userAddress'}) + ":",
valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode),
form: formik
})}
</Grid>

<Grid item xs={12} sm={12} md={12} lg={4}>
{FieldUtils.getComboField({
label: intl.formatMessage({id: 'language'}) + ":",
valueName: "preferLocale",
dataList: ComboData.Locale,
getOptionLabel: (option) => option.label? option.label: "",
<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getProfileComboField({
label: "",
valueName: "district",
dataList: ComboData.district,
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",
disabled: (!editMode),
form: formik
})}
</Grid>

<Grid item xs={12} sm={12} md={12} lg={12}>
{FieldUtils.getAddressField({
label: intl.formatMessage({id: 'userAddress'}) + ":",
valueName: ["addressLine1", "addressLine2", "addressLine3"],
disabled: (!editMode),
{FieldUtils.getProfileComboField({
label: "",
valueName: "country",
getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "",
dataList: ComboData.country,
disabled: true,
form: formik
})}
</Grid>


+ 4
- 4
src/pages/authentication/auth-forms/BusCustomFormWizard.js Visa fil

@@ -1602,18 +1602,18 @@ const BusCustomFormWizard = (props) => {
: null}
{selectedAddress5.type === "hongKong" ?
<Stack direction="column">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
{/* <Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
<FormattedMessage id="region"/>:
</Typography>
</Typography> */}
<Typography variant="pnspsFormHeader">
{!selectedAddress4? "" : intl.formatMessage({id: selectedAddress4.type})}
</Typography>
</Stack>
: null}
<Stack direction="column">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address5-signup">
{/* <Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address5-signup">
<FormattedMessage id="regionOrCountry"/>:
</Typography>
</Typography> */}
<Typography variant="pnspsFormHeader">
{intl.formatMessage({id: selectedAddress5.type})}
</Typography>


+ 4
- 4
src/pages/authentication/auth-forms/CustomFormWizard.js Visa fil

@@ -1830,18 +1830,18 @@ const CustomFormWizard = (props) => {
: null}
{selectedAddress5.type === "hongKong" ?
<Stack direction="column">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
{/* <Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address4-signup">
<FormattedMessage id="region" />:
</Typography>
</Typography> */}
<Typography variant="pnspsFormHeader">
{!selectedAddress4 ? "" : intl.formatMessage({ id: selectedAddress4.type })}
</Typography>
</Stack>
: null}
<Stack direction="column">
<Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address5-signup">
{/* <Typography variant="pnspsFormHeader" color={theme.palette.grey[600]} id="preview-address5-signup">
<FormattedMessage id="regionOrCountry" />:
</Typography>
</Typography> */}
<Typography variant="pnspsFormHeader">
{intl.formatMessage({ id: selectedAddress5.type })}
</Typography>


+ 4
- 4
src/pages/authentication/auth-forms/IAmSmartFormWizard.js Visa fil

@@ -1075,18 +1075,18 @@ const CustomFormWizard = (props) => {
: null}
{selectedAddress5.type === "hongKong" ?
<Stack direction="column">
<Typography variant="h5" color={theme.palette.grey[600]} id="preview-address4-signup">
{/* <Typography variant="h5" color={theme.palette.grey[600]} id="preview-address4-signup">
<FormattedMessage id="region" />:
</Typography>
</Typography> */}
<Typography variant="h5">
{!selectedAddress4 ? "" : intl.formatMessage({ id: selectedAddress4.type })}
</Typography>
</Stack>
: null}
<Stack direction="column">
<Typography variant="h5" color={theme.palette.grey[600]} id="preview-address5-signup">
{/* <Typography variant="h5" color={theme.palette.grey[600]} id="preview-address5-signup">
<FormattedMessage id="regionOrCountry" />:
</Typography>
</Typography> */}
<Typography variant="h5">
{intl.formatMessage({ id: selectedAddress5.type })}
</Typography>


+ 1
- 0
src/translations/en.json Visa fil

@@ -338,6 +338,7 @@


"applyPublicNotice": "Apply for Public Notice",
"applyPublicNoticeText": "<div style=\"color:red;\">After successful submission, the application will appear under “Processing” on “My Public Notices” page. A notification email with the Application Number will reach your mailbox.</div>",
"attention": "Attention",
"to": "To",
"all": "All",


+ 2
- 1
src/translations/zh-CN.json Visa fil

@@ -370,6 +370,7 @@
"pwStrong": "强",

"applyPublicNotice": "申请公共启事",
"applyPublicNoticeText": "<div style=\"color:red;\">成功提交申请后，申请将列在「我的公共启事」页面下的「处理中」。你将收到附有申请号码的通知电邮。</div>",
"attention": "注意",
"to": "到",
"all": "全部",
@@ -528,7 +529,7 @@
"idType": "身份证类型",
"idNo": "身份证号码",
"country": "国家",
"district": "区域",
"district": "地区",
"noRecordFound": "找不到记录",
"rowsPerPage": "每页项数",
"date" : "日期",


+ 2
- 1
src/translations/zh-HK.json Visa fil

@@ -371,6 +371,7 @@
"pwStrong": "強",

"applyPublicNotice": "申請公共啟事",
"applyPublicNoticeText": "<div style=\"color:red;\">成功提交申請後，申請將列在「我的公共啟事」頁面下的「處理中」。你將收到附有申請號碼的通知電郵。</div>",
"attention": "注意",
"to": "到",
"all": "全部",
@@ -529,7 +530,7 @@
"idType": "身分證類型",
"idNo": "身分證號碼",
"country": "國家",
"district": "區域",
"district": "地區",
"noRecordFound": "找不到記錄",
"rowsPerPage": "每頁項數",
"date" : "日期",


+ 28
- 0
src/utils/FieldUtils.js Visa fil

@@ -204,6 +204,34 @@ export const getComboField = ({ label, dataList, valueName, form, disabled, getO
</Grid>;
}

export const getProfileComboField = ({ label, dataList, valueName, form, disabled, getOptionLabel, onInputChange, onChange, filterOptions, ...props }) => {
let err = Boolean(form.errors[valueName]);
return <Grid container spacing={1} alignItems={"top"}>
<Grid item xs={12} md={3} lg={1} mt={1} sx={{ display: 'flex', alignItems: 'top' }}>
<Grid item lg={12} sx={{ alignItems: 'center' }}>
<Typography variant="pnspsFormParagraphBold">{label}</Typography>
</Grid>
</Grid>
<Grid item xs={12} md={6} lg={6}>
<Grid item lg={12} sx={{mb:2}}>
<Combo
valueName={valueName}
disabled={disabled}
dataList={dataList}
form={form}
error={err}
helperText={form.errors[valueName] ? form.errors[valueName] : ''}
filterOptions={filterOptions}
getOptionLabel={getOptionLabel}
onInputChange={onInputChange}
onChange={onChange}
{...props}
/>
</Grid>
</Grid>
</Grid>;
}

export const initField = ({ type, valueName, form, disabled, autoFocus, multiline, handleChange, placeholder, inputProps, InputProps, width, ...props }) => {
let err = Boolean(form.errors[valueName]);



+ 1
- 1
src/utils/statusUtils/ProofStatus.js Visa fil

@@ -42,7 +42,7 @@ function getStatus(params) {
if(isCancelled) return cancel;
console.log(replyDate)
// console.log(replyDate)
if(replyDate){
return action?confirm:unable;
}else{


Skriv Förhandsgranska
Laddar…
Avbryt
Spara