diff --git a/src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js b/src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js index bfb3498..8b732ba 100644 --- a/src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js +++ b/src/pages/User/DetailsPage_Individual/UserInformationCard_Individual.js @@ -19,10 +19,11 @@ const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingCo import Loadable from 'components/Loadable'; import { lazy } from 'react'; import { notifyActiveSuccess, notifyLockSuccess, notifySaveSuccess, notifyVerifySuccess } from 'utils/CommonFunction'; -import {useIntl} from "react-intl"; -import {PNSPS_BUTTON_THEME} from "themes/buttonConst"; -import {ThemeProvider} from "@emotion/react"; +import { useIntl } from "react-intl"; +import { PNSPS_BUTTON_THEME } from "themes/buttonConst"; +import { ThemeProvider } from "@emotion/react"; import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons'; +import { isGrantedAny } from "auth/utils"; // ==============================|| DASHBOARD - DEFAULT ||============================== // @@ -43,7 +44,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { const handleMouseDownId = (event) => { event.preventDefault(); }; - + useEffect(() => { //if state data are ready and assign to different field // console.log(currentApplicationDetailData) @@ -52,35 +53,35 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { } }, [currentUserData]); - - function getMaxErrStr(num, fieldname){ - return intl.formatMessage({ id: 'noMoreThenNWords' },{num:num, fieldname:fieldname?intl.formatMessage({ id: fieldname})+": ":""}); + + function getMaxErrStr(num, fieldname) { + return intl.formatMessage({ id: 'noMoreThenNWords' }, { num: num, fieldname: fieldname ? intl.formatMessage({ id: fieldname }) + ": " : "" }); } const formik = useFormik({ enableReinitialize: true, initialValues: currentUserData, validationSchema: yup.object().shape({ - enName: yup.string().max(40, getMaxErrStr(40)).required(intl.formatMessage({id: 'userRequireEnglishName'})), - chName: yup.string().max(6, getMaxErrStr(6)).required(intl.formatMessage({id: 'userRequireChineseName'})), - addressLine1: yup.string().max(40, getMaxErrStr(40)).required(intl.formatMessage({id: 'validateAddressLine1'})), + enName: yup.string().max(40, getMaxErrStr(40)).required(intl.formatMessage({ id: 'userRequireEnglishName' })), + chName: yup.string().max(6, getMaxErrStr(6)).required(intl.formatMessage({ id: 'userRequireChineseName' })), + addressLine1: yup.string().max(40, getMaxErrStr(40)).required(intl.formatMessage({ id: 'validateAddressLine1' })), addressLine2: yup.string().max(40, getMaxErrStr(40)).nullable(), addressLine3: yup.string().max(40, getMaxErrStr(40)).nullable(), - emailAddress: yup.string().email(intl.formatMessage({id: 'validEmailFormat'})).max(255).required(intl.formatMessage({id: 'requireEmail'})), - identification: yup.string().min(7, intl.formatMessage({id: 'requireIdDocNumber'})).required(intl.formatMessage({id: 'requireIdDocNumber'})), - checkDigit: yup.string().max(1, getMaxErrStr(1)).required(intl.formatMessage({id: 'requiredNumberInQuote'})).nullable(), - idDocType: yup.string().max(255, getMaxErrStr(255)).required(intl.formatMessage({id: 'requireIdDocType'})), - 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'})).nullable(), + emailAddress: yup.string().email(intl.formatMessage({ id: 'validEmailFormat' })).max(255).required(intl.formatMessage({ id: 'requireEmail' })), + identification: yup.string().min(7, intl.formatMessage({ id: 'requireIdDocNumber' })).required(intl.formatMessage({ id: 'requireIdDocNumber' })), + checkDigit: yup.string().max(1, getMaxErrStr(1)).required(intl.formatMessage({ id: 'requiredNumberInQuote' })).nullable(), + idDocType: yup.string().max(255, getMaxErrStr(255)).required(intl.formatMessage({ id: 'requireIdDocType' })), + 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' })).nullable(), }), onSubmit: values => { - if (values.country==null){ - setErrorMsg(intl.formatMessage({id: 'pleaseFillInCountry'})) + if (values.country == null) { + setErrorMsg(intl.formatMessage({ id: 'pleaseFillInCountry' })) } 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 { HttpUtils.post({ url: UrlUtils.POST_IND_USER + "/" + formData.id, @@ -175,48 +176,53 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { :
{/*top button*/} - - - {editMode ? - <> - - - - + { + isGrantedAny("MAINTAIN_USER") ? + + + {editMode ? + <> + + + + + + + + + + + : + <> + + + + + + + } + + + : <> + } - - - - - - : - <> - - - - - - - } - - {/*end top button*/} Individual User Details @@ -248,7 +254,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { })} - + {FieldUtils.getTextField({ label: "Created Date:", valueName: "createDate", @@ -256,7 +262,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { form: formik })} - + {FieldUtils.getTextField({ label: "Prefix:", valueName: "prefix", @@ -330,7 +336,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { { currentUserData.verifiedBy || editMode ? - + {FieldUtils.initField({ valueName: "verifiedStatus", disabled: true, @@ -339,21 +345,21 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { : <> - + {FieldUtils.initField({ valueName: "verifiedStatus", disabled: true, form: formik, })} - + - + @@ -363,7 +369,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { - + ID No.: @@ -371,14 +377,14 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { {formik.values.idDocType === "HKID" ? - editMode? + editMode ? <> - + {FieldUtils.initField({ valueName: "identification", disabled: (!editMode), form: formik, - placeholder: intl.formatMessage({id: 'idDocNumber'}), + placeholder: intl.formatMessage({ id: 'idDocNumber' }), inputProps: { maxLength: 7, onKeyDown: (e) => { @@ -390,21 +396,21 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { })} - + {FieldUtils.initField({ valueName: "checkDigit", disabled: (!editMode), form: formik, })} - - : + + : {formik.values.identification.slice(0, 4)} - - {showId ?formik.values.identification.slice(4):"****"}{showId ? '(' + formik.values.checkDigit + ')' :null} + + {showId ? formik.values.identification.slice(4) : "****"}{showId ? '(' + formik.values.checkDigit + ')' : null} { size="large" > {showId ? : } - + : - editMode? + editMode ? {FieldUtils.initField({ valueName: "identification", @@ -430,8 +436,8 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { {formik.values.identification.slice(0, 4)} - - {showId ?formik.values.identification.slice(4):"****"} + + {showId ? formik.values.identification.slice(4) : "****"} { size="large" > {showId ? : } - + } @@ -474,7 +480,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { {FieldUtils.getComboField({ label: "Country:", valueName: "country", - getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "", + getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "", dataList: ComboData.country, disabled: (!editMode), form: formik @@ -492,7 +498,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { - + Status: @@ -515,30 +521,33 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { form: formik, })} - {locked ? - - - - - - : - - - - - + { + isGrantedAny("MAINTAIN_USER") ? ( + locked ? + + + + + + : + + + + + + ) : <> } } @@ -550,7 +559,7 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { label: "District:", valueName: "district", dataList: ComboData.district, - getOptionLabel: (option) => option.type? intl.formatMessage({ id: option.type }) : "", + getOptionLabel: (option) => option.type ? intl.formatMessage({ id: option.type }) : "", disabled: (!editMode), form: formik })} @@ -558,10 +567,10 @@ const UserInformationCard_Individual = ({ formData, loadDataFun }) => { {FieldUtils.getComboField({ - label: intl.formatMessage({id: 'language'}) + ":", + label: intl.formatMessage({ id: 'language' }) + ":", valueName: "preferLocale", dataList: ComboData.Locale, - getOptionLabel: (option) => option.label? option.label: "", + getOptionLabel: (option) => option.label ? option.label : "", disabled: (!editMode), form: formik })} diff --git a/src/pages/User/SearchPage_Individual/UserTable_Individual.js b/src/pages/User/SearchPage_Individual/UserTable_Individual.js index 1116f13..063d822 100644 --- a/src/pages/User/SearchPage_Individual/UserTable_Individual.js +++ b/src/pages/User/SearchPage_Individual/UserTable_Individual.js @@ -2,13 +2,14 @@ import * as React from 'react'; import { GridActionsCellItem } from "@mui/x-data-grid"; import { FiDataGrid } from "components/FiDataGrid"; -import VisibilityIcon from '@mui/icons-material/Visibility'; +//import VisibilityIcon from '@mui/icons-material/Visibility'; import HighlightOff from '@mui/icons-material/HighlightOff'; import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline'; import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; import * as DateUtils from "utils/DateUtils"; import { GET_IND_USER_PATH } from "utils/ApiPathConst"; +import { clickableLink} from 'utils/CommonFunction'; // ==============================|| EVENT TABLE ||============================== // export default function UserTable_Individual({ searchCriteria }) { @@ -20,35 +21,38 @@ export default function UserTable_Individual({ searchCriteria }) { set_searchCriteria(searchCriteria); }, [searchCriteria]); - const handleActionClick = (id) => () => { - navigate('/indUser/' + id); - }; + // const handleActionClick = (id) => () => { + // navigate('/indUser/' + id); + // }; const columns = [ - { - field: 'actions', - type: 'actions', - headerName: 'Actions', - width: 100, - cellClassName: 'actions', - getActions: ({ id }) => { - return [ - } - label="View" - className="textPrimary" - onClick={handleActionClick(id)} - color="primary" - />] - }, - }, + // { + // field: 'actions', + // type: 'actions', + // headerName: 'Actions', + // width: 100, + // cellClassName: 'actions', + // getActions: ({ id }) => { + // return [ + // } + // label="View" + // className="textPrimary" + // onClick={handleActionClick(id)} + // color="primary" + // />] + // }, + // }, { id: 'username', field: 'username', headerName: 'Username', flex: 1, minWidth: 150, + renderCell: (params) => { + return clickableLink('/indUser/'+ params.row.id, params.row.username); + }, }, { id: 'enName',