| @@ -149,7 +149,7 @@ export default function FileList({refType, refId, allowDelete, sx}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -86,7 +86,7 @@ export default function OrganizationTable({recordList}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -14,7 +14,7 @@ import AuthBackground from 'assets/images/auth/AuthBackground'; | |||||
| // ==============================|| AUTHENTICATION - WRAPPER ||============================== // | // ==============================|| AUTHENTICATION - WRAPPER ||============================== // | ||||
| const AuthWrapperCustom = ({ children }) => ( | const AuthWrapperCustom = ({ children }) => ( | ||||
| <Box sx={{ minHeight: '80vh' }}> | |||||
| <Box sx={{ minHeight: '60vh' }}> | |||||
| <AuthBackground /> | <AuthBackground /> | ||||
| <Grid | <Grid | ||||
| container | container | ||||
| @@ -22,7 +22,7 @@ const AuthWrapperCustom = ({ children }) => ( | |||||
| justifyContent="center" | justifyContent="center" | ||||
| alignItems="flex-start" | alignItems="flex-start" | ||||
| sx={{ | sx={{ | ||||
| minHeight: '80vh' | |||||
| minHeight: '60vh' | |||||
| }} | }} | ||||
| > | > | ||||
| {/* <Grid item xs={12} sx={{ ml: 3, mt: 3 }}> | {/* <Grid item xs={12} sx={{ ml: 3, mt: 3 }}> | ||||
| @@ -35,7 +35,7 @@ const AuthWrapperCustom = ({ children }) => ( | |||||
| container | container | ||||
| justifyContent="center" | justifyContent="center" | ||||
| alignItems="flex-start" | alignItems="flex-start" | ||||
| sx={{ minHeight: { xs: 'calc(80vh - 134px)', md: 'calc(80vh - 112px)' }}} | |||||
| sx={{ minHeight: { xs: 'calc(60vh - 134px)', md: 'calc(60vh - 112px)' }}} | |||||
| > | > | ||||
| <Grid item> | <Grid item> | ||||
| <AuthCard>{children}</AuthCard> | <AuthCard>{children}</AuthCard> | ||||
| @@ -74,23 +74,17 @@ | |||||
| steps.findIndex((step, i) => !(i in completed)) | steps.findIndex((step, i) => !(i in completed)) | ||||
| : activeStep + 1; | : activeStep + 1; | ||||
| setActiveStep(newActiveStep); | setActiveStep(newActiveStep); | ||||
| console.log(newActiveStep) | |||||
| scrollToTop(); | |||||
| }; | }; | ||||
| const handleBack = () => { | const handleBack = () => { | ||||
| scrollToTop(); | |||||
| setActiveStep((prevActiveStep) => prevActiveStep - 1); | setActiveStep((prevActiveStep) => prevActiveStep - 1); | ||||
| }; | }; | ||||
| // const handleStep = (step) => () => { | |||||
| // setActiveStep(step); | |||||
| // }; | |||||
| // const handleComplete = () => { | |||||
| // const newCompleted = completed; | |||||
| // newCompleted[activeStep] = true; | |||||
| // setCompleted(newCompleted); | |||||
| // handleNext(); | |||||
| // }; | |||||
| const scrollToTop = () => { | |||||
| window.scrollTo(0,0); | |||||
| }; | |||||
| const handleReset = () => { | const handleReset = () => { | ||||
| setActiveStep(0); | setActiveStep(0); | ||||
| @@ -173,6 +167,7 @@ | |||||
| </Button> | </Button> | ||||
| ): | ): | ||||
| ( | ( | ||||
| // <Button disabled={updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | |||||
| <Button disabled={!updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | <Button disabled={!updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | ||||
| 繼續 | 繼續 | ||||
| </Button> | </Button> | ||||
| @@ -75,7 +75,6 @@ | |||||
| }; | }; | ||||
| const handleNext = () => { | const handleNext = () => { | ||||
| scrollToTop() | |||||
| const newActiveStep = | const newActiveStep = | ||||
| isLastStep() && !allStepsCompleted() | isLastStep() && !allStepsCompleted() | ||||
| ? // It's the last step, but not all steps have been completed, | ? // It's the last step, but not all steps have been completed, | ||||
| @@ -83,16 +82,16 @@ | |||||
| steps.findIndex((step, i) => !(i in completed)) | steps.findIndex((step, i) => !(i in completed)) | ||||
| : activeStep + 1; | : activeStep + 1; | ||||
| setActiveStep(newActiveStep); | setActiveStep(newActiveStep); | ||||
| // console.log(newActiveStep) | |||||
| scrollToTop(); | |||||
| }; | }; | ||||
| const handleBack = () => { | const handleBack = () => { | ||||
| scrollToTop() | |||||
| scrollToTop(); | |||||
| setActiveStep((prevActiveStep) => prevActiveStep - 1); | setActiveStep((prevActiveStep) => prevActiveStep - 1); | ||||
| }; | }; | ||||
| const scrollToTop = () => { | const scrollToTop = () => { | ||||
| window.scrollTo({ top: 0, left: 0, behavior: 'smooth' }); | |||||
| window.scrollTo(0,0); | |||||
| }; | }; | ||||
| const handleReset = () => { | const handleReset = () => { | ||||
| @@ -176,6 +175,7 @@ | |||||
| </Button> | </Button> | ||||
| ): | ): | ||||
| ( | ( | ||||
| // <Button disabled={updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | |||||
| <Button disabled={!updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | <Button disabled={!updateValid} variant="outlined" onClick={handleNext} sx={{ mr: 1 }}> | ||||
| 繼續 | 繼續 | ||||
| </Button> | </Button> | ||||
| @@ -722,7 +722,7 @@ const BusCustomFormWizard = (props) => { | |||||
| </Grid> | </Grid> | ||||
| <Grid item xs={12} md={12}> | <Grid item xs={12} md={12}> | ||||
| <Stack spacing={1}> | <Stack spacing={1}> | ||||
| <InputLabel htmlFor="enName-signup">英文姓名 | |||||
| <InputLabel htmlFor="enName-signup">姓名 | |||||
| <span style={{color: '#f10000'}}>*</span> | <span style={{color: '#f10000'}}>*</span> | ||||
| </InputLabel> | </InputLabel> | ||||
| <OutlinedInput | <OutlinedInput | ||||
| @@ -731,7 +731,7 @@ const BusCustomFormWizard = (props) => { | |||||
| value={formik.values.enName} | value={formik.values.enName} | ||||
| name="enName" | name="enName" | ||||
| onChange={formik.handleChange} | onChange={formik.handleChange} | ||||
| placeholder="與你的身份證明文件相同" | |||||
| placeholder="" | |||||
| fullWidth | fullWidth | ||||
| error={Boolean(formik.touched.enName && formik.errors.enName)} | error={Boolean(formik.touched.enName && formik.errors.enName)} | ||||
| onBlur={formik.handleBlur} | onBlur={formik.handleBlur} | ||||
| @@ -76,7 +76,7 @@ const CustomFormWizard = (props) => { | |||||
| const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false); | const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false); | ||||
| const [isValid, setisValid] = useState(false); | const [isValid, setisValid] = useState(false); | ||||
| const [isLoading, setLoding] = useState(true); | const [isLoading, setLoding] = useState(true); | ||||
| const idDocTypeComboList = ComboData.idDocType; | const idDocTypeComboList = ComboData.idDocType; | ||||
| const address4ComboList = ComboData.district; | const address4ComboList = ComboData.district; | ||||
| const address5ComboList = ComboData.country; | const address5ComboList = ComboData.country; | ||||
| @@ -135,22 +135,43 @@ const CustomFormWizard = (props) => { | |||||
| }; | }; | ||||
| const handleFileUpload = (event)=>{ | const handleFileUpload = (event)=>{ | ||||
| let list = new DataTransfer(); | |||||
| let currentFileList = fileListData; | |||||
| const uploadFileList = event.target.files; | const uploadFileList = event.target.files; | ||||
| const saveFileList = []; | const saveFileList = []; | ||||
| var currentIndex = 0; | var currentIndex = 0; | ||||
| if (!fileList.length==null){ | |||||
| currentIndex = fileList.length; | |||||
| if (currentFileList.length!=null){ | |||||
| currentIndex = currentFileList.length; | |||||
| for (let i = 0; i < currentIndex; i++){ | |||||
| const file = currentFileList[i] | |||||
| list.items.add(file); | |||||
| saveFileList.push(file); | |||||
| } | |||||
| } | } | ||||
| for (let i = 0; i < uploadFileList.length; i++){ | for (let i = 0; i < uploadFileList.length; i++){ | ||||
| const file = event.target.files[i] | const file = event.target.files[i] | ||||
| file.id = currentIndex+i+1 | |||||
| saveFileList.push(file) | |||||
| let isDuplicate = false; | |||||
| // Check if the file name already exists in saveFileList | |||||
| for (let j = 0; j < saveFileList.length; j++) { | |||||
| if (saveFileList[j].name === file.name) { | |||||
| isDuplicate = true; | |||||
| break; | |||||
| } | |||||
| } | |||||
| if (!isDuplicate) { | |||||
| file.id = currentIndex+i | |||||
| saveFileList.push(file) | |||||
| list.items.add(file); | |||||
| } | |||||
| } | } | ||||
| let myFileList = list.files; | |||||
| setFileListData(saveFileList) | setFileListData(saveFileList) | ||||
| setFileList(uploadFileList); | |||||
| setFileList(myFileList); | |||||
| }; | }; | ||||
| useEffect(() => { | useEffect(() => { | ||||
| @@ -311,7 +332,7 @@ const CustomFormWizard = (props) => { | |||||
| submit: null, | submit: null, | ||||
| fax:'', | fax:'', | ||||
| faxCountryCode:'852', | faxCountryCode:'852', | ||||
| idDocType:selectedIdDocType | |||||
| idDocType:'' | |||||
| }), | }), | ||||
| validationSchema:yup.object().shape({ | validationSchema:yup.object().shape({ | ||||
| username: yup.string().min(6,'用戶名稱最少6位').required('請輸入用戶名稱'), | username: yup.string().min(6,'用戶名稱最少6位').required('請輸入用戶名稱'), | ||||
| @@ -536,13 +557,18 @@ const CustomFormWizard = (props) => { | |||||
| <Autocomplete | <Autocomplete | ||||
| disablePortal | disablePortal | ||||
| id="idDocType" | id="idDocType" | ||||
| value={selectedIdDocType} | |||||
| // value={selectedIdDocType} | |||||
| options={idDocTypeComboList} | options={idDocTypeComboList} | ||||
| getOptionLabel={(idDocTypeComboList) => idDocTypeComboList.label} | |||||
| onBlur={formik.handleBlur} | onBlur={formik.handleBlur} | ||||
| onChange={(event, newValue) => { | onChange={(event, newValue) => { | ||||
| setSelectedIdDocType(newValue); | |||||
| if (newValue!="HKID"){ | |||||
| formik.setFieldValue("checkDigit","") | |||||
| // console.log(newValue) | |||||
| if (newValue!=null){ | |||||
| setSelectedIdDocType(newValue.type); | |||||
| if (newValue.type!="HKID"){ | |||||
| formik.setFieldValue("checkDigit","") | |||||
| } | |||||
| } | } | ||||
| }} | }} | ||||
| sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}} | sx={{"& .MuiInputBase-root": { height: "41px" },"#idDocType":{padding: "0px 0px 0px 0px"}, "& .MuiAutocomplete-endAdornment": { top: "auto" },}} | ||||
| @@ -1068,8 +1094,8 @@ const CustomFormWizard = (props) => { | |||||
| </FormGroup> | </FormGroup> | ||||
| {/* Preview Form */} | {/* Preview Form */} | ||||
| <FormGroup id={"previewForm"} sx={{ display: props.step === 1 ? "" : "none"}}> | <FormGroup id={"previewForm"} sx={{ display: props.step === 1 ? "" : "none"}}> | ||||
| <Grid container spacing={2}> | |||||
| <Grid item xs={12}> | |||||
| <Grid container spacing={3}> | |||||
| <Grid item xs={12} md={12}> | |||||
| <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}> | <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}> | ||||
| <div style={{borderBottom: "3px solid #1A4399", width:"100%", margin_right: "15px"}}> | <div style={{borderBottom: "3px solid #1A4399", width:"100%", margin_right: "15px"}}> | ||||
| <Typography display="inline" variant="h3" sx={{ color: '#1A4399'}}>成為新的個人用戶</Typography> | <Typography display="inline" variant="h3" sx={{ color: '#1A4399'}}>成為新的個人用戶</Typography> | ||||
| @@ -1081,10 +1107,10 @@ const CustomFormWizard = (props) => { | |||||
| </Typography> */} | </Typography> */} | ||||
| </Stack> | </Stack> | ||||
| </Grid> | </Grid> | ||||
| <Grid item xs={12}> | |||||
| <Grid container spacing={1}> | |||||
| <Grid item xs={12} md={12}> | |||||
| <Grid container spacing={2}> | |||||
| <Grid item xs={12} > | <Grid item xs={12} > | ||||
| <Stack spacing={1} direction="row"> | |||||
| <Stack spacing={2} direction="row"> | |||||
| <Typography> | <Typography> | ||||
| 用戶登入名稱: | 用戶登入名稱: | ||||
| </Typography> | </Typography> | ||||
| @@ -1217,19 +1243,7 @@ const CustomFormWizard = (props) => { | |||||
| </Stack> | </Stack> | ||||
| </Grid> | </Grid> | ||||
| :null} | :null} | ||||
| {/* <Grid item xs={12} mt={1} mb={1}> | |||||
| <Stack spacing={1} direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}> | |||||
| <Typography display="inline" variant="h4" sx={{ color: 'primary.primary'}}>身份證明文件</Typography> | |||||
| <Typography display="inline" variant="h6" sx={{ fontSize: 12,color: 'primary.primary'}}>請上傳你的 有效身份證明文件 的數碼檔案,以驗證你的身份。</Typography> | |||||
| <Typography display="inline" variant="h6" sx={{ fontSize: 12,color: 'primary.primary'}}>如: 香港身份證; 護照; 中國內地身份證等</Typography> | |||||
| <Stack mt={1} direction="row" justifyContent="flex-start" alignItems="center" spacing={2}> | |||||
| <Button variant="contained" component="label" sx={{ fontSize: 12,height:'25px'}}>上傳身份證明文件 | |||||
| <input type="file" accept=".csv" hidden /> | |||||
| </Button> | |||||
| <Typography display="inline" variant="h6" sx={{ fontSize: 12, color: 'primary.primary'}}>如: 香港身份證; 護照; 中國內地身份證等</Typography> | |||||
| </Stack> | |||||
| </Stack> | |||||
| </Grid> */} | |||||
| </Grid> | </Grid> | ||||
| </Grid> | </Grid> | ||||
| </Grid> | </Grid> | ||||
| @@ -78,7 +78,7 @@ export default function UploadFileTable({recordList}) { | |||||
| // }, | // }, | ||||
| // }} | // }} | ||||
| // pageSizeOptions={[5, 10]} | // pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </Box> | </Box> | ||||
| ); | ); | ||||
| @@ -7,7 +7,7 @@ const LoadingComponent = () => { | |||||
| display="flex" | display="flex" | ||||
| justifyContent="center" | justifyContent="center" | ||||
| alignItems="center" | alignItems="center" | ||||
| autoHeight="true" | |||||
| autoHeight={true} | |||||
| > | > | ||||
| <CircularProgress /> | <CircularProgress /> | ||||
| </Box> | </Box> | ||||
| @@ -73,7 +73,7 @@ export default function UserAuthTable({setSelectedRow, userAuth}) { | |||||
| setSelectedRow(ids); | setSelectedRow(ids); | ||||
| setCurrentSelectedRow(ids); | setCurrentSelectedRow(ids); | ||||
| }} | }} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -69,7 +69,7 @@ export default function UserGroupTable({setSelectedRow, userGroup}) { | |||||
| setSelectedRow(ids); | setSelectedRow(ids); | ||||
| setCurrentSelectedRow(ids); | setCurrentSelectedRow(ids); | ||||
| }} | }} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -73,7 +73,7 @@ export default function GroupAuthTable({setSelectedRow, userAuth}) { | |||||
| setSelectedRow(ids); | setSelectedRow(ids); | ||||
| setCurrentSelectedRow(ids); | setCurrentSelectedRow(ids); | ||||
| }} | }} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -100,6 +100,7 @@ const UserAddCard = ({isCollectData, updateGroupMember,userGroupData}) => { | |||||
| value={selectedUser === null ? null : selectedUser} | value={selectedUser === null ? null : selectedUser} | ||||
| options={userComboList} | options={userComboList} | ||||
| onChange={(event, newValue) => { | onChange={(event, newValue) => { | ||||
| console.log(newValue) | |||||
| setSelectedUser(newValue); | setSelectedUser(newValue); | ||||
| }} | }} | ||||
| renderInput={(params) => <TextField {...params} />} | renderInput={(params) => <TextField {...params} />} | ||||
| @@ -68,7 +68,7 @@ export default function UserGroupTable({recordList}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[10, 15, 20]} | pageSizeOptions={[10, 15, 20]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -140,7 +140,7 @@ export default function UserTable({recordList}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -145,7 +145,7 @@ export default function UserTable_Individual({recordList}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -145,7 +145,7 @@ export default function UserTable_Organization({recordList}) { | |||||
| }, | }, | ||||
| }} | }} | ||||
| pageSizeOptions={[5, 10]} | pageSizeOptions={[5, 10]} | ||||
| autoHeight | |||||
| autoHeight = {true} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -1,7 +1,12 @@ | |||||
| export const idDocType = ["passport","HKID","CNID","BR","otherCert"]; | |||||
| export const idDocType = [ | |||||
| {label:"護照", type:"passport"}, | |||||
| {label:"香港身份證", type:"HKID"}, | |||||
| {label:"內地身份證", type:"CNID"}, | |||||
| {label:"專業執業證書", type:"otherCert"} | |||||
| ]; | |||||
| export const district = ["北區","長洲區","大埔區","大嶼山區","東區","觀塘區","黃大仙區","九龍城區","葵青區","南區","南丫島區", | export const district = ["北區","長洲區","大埔區","大嶼山區","東區","觀塘區","黃大仙區","九龍城區","葵青區","南區","南丫島區", | ||||
| "坪洲區","荃灣區","沙田區","深水埗區","屯門區","灣仔區","西貢區","油尖旺區","元朗區","中西區"]; | "坪洲區","荃灣區","沙田區","深水埗區","屯門區","灣仔區","西貢區","油尖旺區","元朗區","中西區"]; | ||||
| export const country = ["中國香港","中國","中國澳門"]; | export const country = ["中國香港","中國","中國澳門"]; | ||||
| export const accountFilter = [{display:"Active", value:"active"},{display:"Locked", value:"locked"},{display:"Not verified", value:"notVerified"}]; | |||||
| export const accountFilter = [{id:1,label:"Active", key:"active"},{id:2,label:"Locked", key:"locked"},{id:3,label:"Not verified", key:"notVerified"}]; | |||||