@@ -26,27 +26,25 @@ const AutoLogoutProvider = ({ children }) => { | |||
const userData = getUserData(); | |||
const checked = localStorage.getItem("checkPasswordExpired"); | |||
if(userData !== null){ | |||
if(!userData.lotusNotesUser){ | |||
//system user | |||
if(checked === "false"){ | |||
axios.get(`${apiPath}${GET_USER_PASSWORD_DURATION}`,{ | |||
params:{ | |||
id: userData.id | |||
//system user | |||
if(checked === "false"){ | |||
axios.get(`${apiPath}${GET_USER_PASSWORD_DURATION}`,{ | |||
params:{ | |||
id: userData.id | |||
} | |||
}) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setForceChangePassword(response.data.expired); | |||
if(!response.data.expired){ | |||
localStorage.setItem("checkPasswordExpired",true); | |||
} | |||
} | |||
}) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setForceChangePassword(response.data.expired); | |||
if(!response.data.expired){ | |||
localStorage.setItem("checkPasswordExpired",true); | |||
} | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} | |||
} | |||
}, []); | |||
@@ -29,6 +29,7 @@ import {parseString} from "xml2js"; | |||
import {useParams} from "react-router-dom"; | |||
import {isObjEmpty} from "../../utils/Utils"; | |||
import {GENERAL_RED_COLOR} from "../../themes/colorConst"; | |||
import {USER_GROUP_COMBO} from "../../utils/ComboConst"; | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
@@ -37,181 +38,78 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
requestError}) => { | |||
const params = useParams(); | |||
const [currentUserData, setCurrentUserData] = React.useState({}); | |||
const [subDivision, setSubDivision] = useState(null); | |||
const [userGroup, setUserGroup] = useState(null); | |||
const [locked, setLocked] = useState(false); | |||
const [isLotusNoteUser, setIsLotusNoteUser] = useState(false); | |||
const [lotusNoteUserList, setLotusNoteUserList] = useState([]) | |||
const [selectedLotusUser, setSelectedLotusUser] = useState(null); | |||
const [receiveReminder, setReceiveReminder] = useState(false); | |||
const [subDivisionList, setSubDivisionList] = useState([]); | |||
const [userGroupList, setUserGroupList] = useState([]); | |||
const [showPassword, setShowPassword] = React.useState(false); | |||
const [onReady, setOnReady] = useState(false); | |||
const {register, getValues, setValue} = useForm() | |||
const [errors, setErrors] = useState({}); | |||
const [tempLotusDetail, setTempLotusDetail] = useState(null); | |||
const handleClickShowPassword = () => setShowPassword((show) => !show); | |||
const handleMouseDownPassword = () => setShowPassword(!showPassword); | |||
const handleReceiveSwitchToggle = () => { | |||
setReceiveReminder(!receiveReminder); | |||
}; | |||
const handleLockSwitchToggle = () => { | |||
setLocked(!locked); | |||
}; | |||
const handleLocationCodeChange = (event, value) => { | |||
if (value.length >2 && !value.includes("(")) { | |||
fetchLotusUserList(value); | |||
} else { | |||
setLotusNoteUserList(lotusNoteUserList); | |||
} | |||
}; | |||
// Function to fetch user name options based on locationCode | |||
const fetchLotusUserListDetail = async (input) => { | |||
try { | |||
axios.get(`${apiPath}${GET_LDAP_USER_LIST}`,{ | |||
params:{ | |||
"EMSDlotus": input, | |||
} | |||
}) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
let xml = response.data; | |||
parseString(xml, function (err, result) { | |||
const tempRecordList = convertXmlToObject(result.RECORDS.RECORD); | |||
const tempRecord = getObjectByValueName(tempRecordList,"EMSDlotus", input) | |||
setTempLotusDetail(tempRecord); | |||
}); | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} catch (error) { | |||
console.error('Error fetching user name options:', error); | |||
} | |||
}; | |||
const fetchLotusUserList = async (input) => { | |||
try { | |||
axios.get(`${apiPath}${GET_LDAP_USER_COMBO}`,{ | |||
params:{ | |||
"username": input, | |||
} | |||
}) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setLotusNoteUserList(response.data.records); | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} catch (error) { | |||
console.error('Error fetching user name options:', error); | |||
} | |||
}; | |||
// const validateEmail = (email) => { | |||
// // Regular expression for email validation | |||
// const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; | |||
// return emailRegex.test(email); | |||
// }; | |||
useEffect(() => { | |||
if(!isObjEmpty(selectedLotusUser)){ | |||
//set basic info | |||
if(isNewRecord){ | |||
setValue('username', selectedLotusUser.label); | |||
} | |||
setValue('email', selectedLotusUser.mail); | |||
fetchLotusUserListDetail(selectedLotusUser.label); | |||
} | |||
else{ | |||
if(isNewRecord){ | |||
setValue('username', null); | |||
setValue('post', null); | |||
setValue('fullname',null); | |||
setValue('email', null); | |||
setValue("phone1", null); | |||
} | |||
} | |||
}, [selectedLotusUser]); | |||
useEffect(()=>{ | |||
if(!isObjEmpty(tempLotusDetail)){ | |||
setValue('post',tempLotusDetail.EMSDtitle); | |||
setValue('fullname',tempLotusDetail.EMSDlastname + " " + tempLotusDetail.EMSDfirstname); | |||
setValue("phone1", tempLotusDetail.EMSDofftel.substring(0,8)); | |||
} | |||
else if(isNewRecord){ | |||
setValue('post',""); | |||
setValue('fullname',""); | |||
setValue("phone1",""); | |||
} | |||
},[tempLotusDetail]); | |||
useEffect(() => { | |||
axios.get(`${apiPath}${GET_SUB_DIVISION_COMBO_LIST}`) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setSubDivisionList(response.data.records); | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
// axios.get(`${apiPath}${GET_USER_GROUP_COMBO_LIST}`) | |||
// .then((response) => { | |||
// if (response.status === 200) { | |||
// setSubDivisionList(response.data.records); | |||
// } | |||
// }) | |||
// .catch(error => { | |||
// console.log(error); | |||
// return false; | |||
// }); | |||
}, []); | |||
useEffect(() => { | |||
setErrors(requestError); | |||
}, [requestError]); | |||
useEffect(() => { | |||
if(isNewRecord){ | |||
setValue("password", null); | |||
setValue("username", null); | |||
} | |||
}, [isLotusNoteUser]); | |||
useEffect(() => { | |||
//if user data from parent are not null | |||
if (Object.keys(userData).length > 0 && userData !== undefined) { | |||
setIsLotusNoteUser(userData.data.lotusNotesUser); | |||
setCurrentUserData(userData.data); | |||
} | |||
}, [userData]); | |||
useEffect(() => { | |||
//if state data are ready and assign to different field | |||
if (Object.keys(currentUserData).length > 0 &¤tUserData !== undefined) { | |||
if (Object.keys(currentUserData).length > 0 && currentUserData !== undefined) { | |||
setLocked(currentUserData.locked); | |||
setReceiveReminder(currentUserData.reminderFlag); | |||
setSubDivision(getObjectById(subDivisionList, currentUserData.subDivisionId)); | |||
setUserGroup(USER_GROUP_COMBO.find(item => item.id == userData.groupId)); | |||
setOnReady(true); | |||
} | |||
else if(isNewRecord){ | |||
setLocked(false); | |||
setOnReady(true); | |||
} | |||
}, [currentUserData,subDivisionList]); | |||
}, [currentUserData]); | |||
useEffect(() => { | |||
//upload latest data to parent | |||
if(isCollectData){ | |||
const values = getValues(); | |||
let submitUserGroupId = userGroup?.key; | |||
if (userGroup?.key == userData.groupId) { // User Group is not updated | |||
submitUserGroupId = 0; | |||
} | |||
const values = { | |||
...getValues(), | |||
userGroupId:submitUserGroupId | |||
}; | |||
const formErrors = {}; | |||
if (isStringEmptyAfterTrim(values.username) ) { | |||
formErrors.username = 'User Name is required'; | |||
} | |||
if (isStringEmptyAfterTrim(values.password) && !isLotusNoteUser && isNewRecord){ | |||
if (isStringEmptyAfterTrim(values.password) && isNewRecord){ | |||
formErrors.password = "Password is required" | |||
} | |||
@@ -219,18 +117,17 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
formErrors.fullname = 'Full Name is required'; | |||
} | |||
if(isStringEmptyAfterTrim(values.email)){ | |||
formErrors.email = 'Email is required'; | |||
if (userGroup == null) { | |||
formErrors.userGroup = 'User Group is required'; | |||
} | |||
// if(isStringEmptyAfterTrim(values.email)){ | |||
// formErrors.email = 'Email is required'; | |||
// } | |||
// else if(!validateEmail(values.email)){ | |||
// formErrors.email = 'Invalid Email'; | |||
// } | |||
if(subDivision === null){ | |||
formErrors.subDivision = 'Sub-Division is required'; | |||
} | |||
setErrors(formErrors); | |||
if (Object.keys(formErrors).length === 0) { | |||
@@ -253,11 +150,7 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
else if(!response.data.isTaken){ | |||
const objectData ={ | |||
...values, | |||
lotusNotesUser: isLotusNoteUser ? true : selectedLotusUser !== null, | |||
selectedLotusUser: (isLotusNoteUser && selectedLotusUser !== null)? selectedLotusUser.account : null, | |||
subDivisionId: subDivision !== null ? subDivision.id : null, | |||
locked: locked, | |||
reminderFlag: receiveReminder, | |||
} | |||
updateUserObject(objectData); | |||
} | |||
@@ -282,63 +175,15 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
: | |||
<MainCard elevation={0} | |||
content={false} | |||
sx={{height:'77.5vh'}} | |||
// sx={{height:'77.5vh'}} | |||
> | |||
<Typography variant="h5" sx={{mt: 1.5, ml: 3, mb: 1}}> | |||
Information | |||
</Typography> | |||
<form> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb:1}}> | |||
<Grid container alignItems={"center"}> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Lotus Note User: | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={1} s={1} md={1} lg={1}> | |||
<Checkbox | |||
checked={isLotusNoteUser} | |||
onChange={(event) => setIsLotusNoteUser(event.target.checked)} | |||
name="isLotusNoteUser" | |||
color="primary" | |||
size="medium" | |||
disabled={!isNewRecord} | |||
/> | |||
</Grid> | |||
<Grid item xs={6} s={6} md={6} lg={5}> | |||
<Autocomplete | |||
disablePortal | |||
id="lotus-note-combo" | |||
value={selectedLotusUser === null ? null : selectedLotusUser} | |||
options={lotusNoteUserList} | |||
disabled={!isLotusNoteUser || !isNewRecord} | |||
size="small" | |||
onInputChange={handleLocationCodeChange} | |||
onChange={(event, newValue) => { | |||
if(lotusNoteUserList.length >0){ | |||
if(newValue !== null){ | |||
if(getComboValueByLabel(lotusNoteUserList, newValue.label) !== null){ | |||
setSelectedLotusUser(newValue); | |||
} | |||
} | |||
else{ | |||
setSelectedLotusUser(null); | |||
} | |||
} | |||
}} | |||
isOptionEqualToValue={isOptionEqualToValue} | |||
renderInput={(params) => <TextField | |||
{...params} | |||
label={"Search LN User"} | |||
/>} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
{/* <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb:1}}> | |||
</Grid> */} | |||
<Grid container> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
@@ -362,9 +207,9 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
value: currentUserData.username, | |||
})} | |||
id='username' | |||
InputProps={{ | |||
readOnly: isLotusNoteUser, | |||
}} | |||
// InputProps={{ | |||
// readOnly: {}, | |||
// }} | |||
disabled={!isNewRecord} | |||
error={!!errors.username} | |||
helperText={errors.username} | |||
@@ -383,17 +228,11 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
<Grid container alignItems={"center"}> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
{isLotusNoteUser || !isNewRecord? | |||
<Typography variant="lionerSize" component="span"> | |||
Password: | |||
</Typography> | |||
: | |||
<Typography variant="lionerSize" component="span"> | |||
Password: | |||
<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> | |||
</Typography> | |||
} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Password: | |||
{isNewRecord && (<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography>)} | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
@@ -405,7 +244,7 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
{...register("password")} | |||
id='password' | |||
type={showPassword ? 'text' : 'password'} | |||
disabled={isLotusNoteUser} | |||
// disabled={} | |||
error={!!errors.password} | |||
autoComplete="off" | |||
inputProps={{ | |||
@@ -480,30 +319,6 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
</Grid> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
<Grid container alignItems={"center"}> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Post: | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
<FormControl fullWidth required> | |||
<TextField | |||
fullWidth | |||
size="small" | |||
autoComplete="off" | |||
inputProps={{maxLength: 50}} | |||
{...register("post", | |||
{ | |||
value: currentUserData.post, | |||
})} | |||
id='post' | |||
/> | |||
</FormControl> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
@@ -511,7 +326,7 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Sub-Division: | |||
User Group: | |||
<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> | |||
</Typography> | |||
</Grid> | |||
@@ -519,19 +334,24 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
<Autocomplete | |||
disablePortal | |||
id="sub-division-combo" | |||
// {...register("userGroup", | |||
// { | |||
// value: USER_GROUP_COMBO.find(item => item.id = currentUserData.groupId), | |||
// })} | |||
id="userGroup" | |||
size="small" | |||
value={subDivision === null ? null : subDivision} | |||
options={subDivisionList} | |||
value= {userGroup} | |||
// value={userGroup ?? null} | |||
options={USER_GROUP_COMBO}//{userGroupList} | |||
onChange={(event, newValue) => { | |||
setSubDivision(newValue); | |||
setUserGroup(newValue); | |||
}} | |||
renderInput={(params) => ( | |||
<TextField | |||
{...params} | |||
//label={content2} | |||
error={!!errors.subDivision} | |||
helperText={errors.subDivision} | |||
error={!!errors.userGroup} | |||
helperText={errors.userGroup} | |||
InputProps={{ | |||
...params.InputProps, | |||
style: { | |||
@@ -558,7 +378,7 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Email: | |||
<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> | |||
{/* <Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> */} | |||
</Typography> | |||
</Grid> | |||
@@ -610,38 +430,25 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData, | |||
</Grid> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
<Grid container> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Receive Reminder: | |||
<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
<Switch checked={receiveReminder} onChange={handleReceiveSwitchToggle} /> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
{!isNewRecord && ( | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
<Grid container> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Locked: | |||
{/* <Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> */} | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 1}}> | |||
<Grid container> | |||
<Grid item xs={4} s={4} md={4} lg={4} | |||
sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}> | |||
<Typography variant="lionerSize" component="span"> | |||
Locked: | |||
<Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography> | |||
</Typography> | |||
</Grid> | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
<Switch checked={locked} onChange={handleLockSwitchToggle} /> | |||
</Grid> | |||
<Grid item xs={7} s={7} md={7} lg={6}> | |||
<Switch checked={locked} onChange={handleLockSwitchToggle} /> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
)} | |||
</Grid> | |||
</form> | |||
@@ -37,7 +37,7 @@ const UserMaintainPage = () => { | |||
const [userData, setUserData] = React.useState({}); | |||
const [onReady, setOnReady] = useState(false); | |||
const [isCollectData, setIsCollectData] = useState(false); | |||
const [editedCustomerData, setEditedCustomerData] = useState({}); | |||
const [editedUserData, setEditedUserData] = useState({}); | |||
const [userGroupData,setUserGroupData] = useState([]); | |||
const [userAuthData,setUserAuthData] = useState([]); | |||
const [userConfirm, setUserConfirm] = useState(false); | |||
@@ -45,7 +45,7 @@ const UserMaintainPage = () => { | |||
const [requestError, setRequestError] = useState({}); | |||
function updateUserObject(userData) { | |||
setEditedCustomerData(userData); | |||
setEditedUserData(userData); | |||
} | |||
function updateUserGroupList(userGroupData){ | |||
@@ -96,7 +96,7 @@ const UserMaintainPage = () => { | |||
// ==============================|| DELETE WINDOW RELATED ||============================== // | |||
useEffect(() => { | |||
if(params.id > 0 ){ | |||
if(params.id > 0){ | |||
axios.get(`${apiPath}${GET_USER_PATH}/${params.id}`) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
@@ -146,22 +146,18 @@ const UserMaintainPage = () => { | |||
axios.post(`${apiPath}${CREATE_USER_PATH}`, | |||
{ | |||
"id": parseInt(params.id), | |||
"fullname": editedCustomerData.fullname.trim(), | |||
"name": editedCustomerData.username.trim(), | |||
"locked": editedCustomerData.locked, | |||
"lotusNotesUser": editedCustomerData.lotusNotesUser, | |||
"selectedLotusUser": editedCustomerData.selectedLotusUser, | |||
"username": editedCustomerData.username.trim(), | |||
"password": editedCustomerData.lotusNotesUser? null : editedCustomerData.password, | |||
"phone1": editedCustomerData.phone1 === null ? "" : editedCustomerData.phone1.trim(), | |||
"post": editedCustomerData.post === null ? "" : editedCustomerData.post.trim(), | |||
"email": editedCustomerData.email === null ? "": editedCustomerData.email.trim(), | |||
"reminderFlag": editedCustomerData.reminderFlag, | |||
"subDivisionId": editedCustomerData.subDivisionId, | |||
"addGroupIds": userGroupData, | |||
"removeGroupIds": deletedUserGroup, | |||
"addAuthIds": userAuthData, | |||
"removeAuthIds": deletedUserAuth, | |||
"fullname": editedUserData.fullname.trim(), | |||
"name": editedUserData.username.trim(), | |||
"locked": editedUserData.locked, | |||
"username": editedUserData.username.trim(), | |||
"phone1": editedUserData.phone1 === null ? "" : editedUserData.phone1.trim(), | |||
// "post": editedUserData.post === null ? "" : editedUserData.post.trim(), | |||
"email": editedUserData.email === null ? "": editedUserData.email.trim(), | |||
"userGroupId": editedUserData.userGroupId ?? null, | |||
// "addGroupIds": userGroupData, | |||
// "removeGroupIds": deletedUserGroup, | |||
// "addAuthIds": userAuthData, | |||
// "removeAuthIds": deletedUserAuth, | |||
}, | |||
).then((response) => { | |||
if (response.status === 200) { | |||
@@ -190,7 +186,7 @@ const UserMaintainPage = () => { | |||
} | |||
setUserConfirm(false); | |||
setIsCollectData(false); | |||
}, [editedCustomerData]); | |||
}, [editedUserData]); | |||
return ( | |||
!onReady ? | |||
@@ -202,7 +198,7 @@ const UserMaintainPage = () => { | |||
<Typography variant="h5">{isNewRecord? "Create User" : "Maintain User"}</Typography> | |||
</Grid> | |||
{/*col 1*/} | |||
<Grid item xs={12} md={12} lg={5}> | |||
<Grid item xs={12} md={12}/* lg={5}*/> | |||
<UserInformationCard | |||
updateUserObject={updateUserObject} | |||
userData={userData} | |||
@@ -214,7 +210,7 @@ const UserMaintainPage = () => { | |||
/> | |||
</Grid> | |||
{/*col 2*/} | |||
<Grid item xs={12} md={12} lg={7}> | |||
{/*<Grid item xs={12} md={12} lg={7}> | |||
<Grid container> | |||
<Grid item xs={12} md={12} lg={12} > | |||
<UserGroupCard | |||
@@ -236,7 +232,7 @@ const UserMaintainPage = () => { | |||
</Grid> | |||
</Grid> | |||
</Grid>*/} | |||
{/*bottom button*/} | |||
<Grid item s={12} md={12} lg={12} sx={{mt:-1.5}} alignItems={"end"} justifyContent="center"> | |||
@@ -262,25 +258,25 @@ const UserMaintainPage = () => { | |||
Cancel | |||
</Button> | |||
</Grid> | |||
<Grid item sx={{ml:{xs:1.5, md:1.5, lg:1.5}, mr:1.5}}> | |||
<Button | |||
variant="contained" | |||
color="delete" | |||
disabled={isNewRecord} | |||
onClick={handleDeleteClick} | |||
> | |||
Delete | |||
</Button> | |||
<GeneralConfirmWindow | |||
isWindowOpen={isWindowOpen} | |||
title={"Attention"} | |||
//content={`Confirm to delete User "${userData.data.username}" ?`} | |||
content={"Are you sure to delete this user?"} | |||
onNormalClose={handleClose} | |||
onConfirmClose={deleteData} | |||
/> | |||
</Grid> | |||
{!isNewRecord && ( | |||
<Grid item sx={{ml:{xs:1.5, md:1.5, lg:1.5}, mr:1.5}}> | |||
<Button | |||
variant="contained" | |||
color="delete" | |||
onClick={handleDeleteClick} | |||
> | |||
Delete | |||
</Button> | |||
<GeneralConfirmWindow | |||
isWindowOpen={isWindowOpen} | |||
title={"Attention"} | |||
//content={`Confirm to delete User "${userData.data.username}" ?`} | |||
content={"Are you sure to delete this user?"} | |||
onNormalClose={handleClose} | |||
onConfirmClose={deleteData} | |||
/> | |||
</Grid> | |||
)} | |||
</Grid> | |||
</ThemeProvider> | |||
@@ -12,13 +12,12 @@ import {useEffect, useState} from "react"; | |||
import Autocomplete from '@mui/material/Autocomplete'; | |||
import Checkbox from "@mui/material/Checkbox"; | |||
import * as React from "react"; | |||
import axios from "axios"; | |||
import {apiPath} from "../../auth/utils"; | |||
import {GET_SUB_DIVISION_COMBO_LIST} from "../../utils/ApiPathConst"; | |||
// import {GET_USER_GROUP_COMBO_LIST} from "../../utils/ApiPathConst"; | |||
import {useNavigate} from 'react-router-dom'; | |||
import {ThemeProvider} from "@emotion/react"; | |||
import {LIONER_BUTTON_THEME} from "../../themes/colorConst"; | |||
import {USER_TYPE_COMBO} from "../../utils/ComboConst"; | |||
import {USER_GROUP_COMBO} from "../../utils/ComboConst"; | |||
import {CARD_MAX_WIDTH} from "../../themes/themeConst"; | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
@@ -27,9 +26,9 @@ const UserSearchForm = ({applySearch}) => { | |||
const navigate = useNavigate() | |||
const [type, setType] = useState([]); | |||
const [subDivision, setSubDivision] = useState(null); | |||
const [userGroup, setUserGroup] = useState(null); | |||
const [selectedUserType, setSelectedUserType] = useState(null); | |||
const [subDivisionList, setSubDivisionList] = useState([]); | |||
const [userGroupList, setUserGroupList] = useState([]); | |||
const [locked, setLocked] = useState(false); | |||
@@ -46,31 +45,31 @@ const UserSearchForm = ({applySearch}) => { | |||
username: data.userName, | |||
fullname: data.fullName, | |||
post: data.post, | |||
subDivisionId: subDivision !== null ? subDivision.id : null, | |||
groupId: userGroup !== null ? userGroup.id : null, | |||
email: data.email, | |||
phone: data.phone, | |||
isLotusNotesUser: selectedUserType === null ? null : selectedUserType.id === 1 ? null : selectedUserType.id === 2, | |||
locked: locked, | |||
}; | |||
applySearch(temp); | |||
}; | |||
useEffect(() => { | |||
axios.get(`${apiPath}${GET_SUB_DIVISION_COMBO_LIST}`) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setSubDivisionList(response.data.records); | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
// axios.get(`${apiPath}${GET_USER_GROUP_COMBO_LIST}`) | |||
// .then((response) => { | |||
// if (response.status === 200) { | |||
// setUserGroupList(response.data.records); | |||
// } | |||
// }) | |||
// .catch(error => { | |||
// console.log(error); | |||
// return false; | |||
// }); | |||
}, []); | |||
function resetForm(){ | |||
setType([]); | |||
setSubDivision(null); | |||
setUserGroup(null); | |||
setSelectedUserType(null); | |||
setLocked(false); | |||
reset(); | |||
@@ -120,29 +119,16 @@ const UserSearchForm = ({applySearch}) => { | |||
<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5 }}> | |||
<Typography variant="lionerLabel" component="span"> | |||
Post | |||
</Typography> | |||
<TextField | |||
fullWidth | |||
{...register("post")} | |||
inputProps={{maxLength: 50}} | |||
id="post" | |||
autoComplete="off" | |||
/> | |||
</Grid> | |||
<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5 }}> | |||
<Typography variant="lionerLabel" component="span"> | |||
Sub-Division | |||
User Group | |||
</Typography> | |||
<Autocomplete | |||
disablePortal | |||
id="sub-division-combo" | |||
id="user-group-combo" | |||
size="small" | |||
value={subDivision === null? null : subDivision} | |||
options={subDivisionList} | |||
value={userGroup === null? null : userGroup} | |||
options={USER_GROUP_COMBO}//{userGroupList} | |||
onChange={(event, newValue) => { | |||
setSubDivision(newValue); | |||
setUserGroup(newValue); | |||
}} | |||
renderInput={(params) => <TextField {...params}/>} | |||
/> | |||
@@ -174,57 +160,18 @@ const UserSearchForm = ({applySearch}) => { | |||
/> | |||
</Grid> | |||
<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5 }}> | |||
{/* <Grid item xs={9} s={6} md={5} lg={3} sx={{mt:2.5,ml:3, mr:3 }}> | |||
<Typography variant="lionerLabel" component="span"> | |||
User Type | |||
Show Locked User Only | |||
</Typography> | |||
<Autocomplete | |||
disablePortal | |||
id="user-type-combo" | |||
size="small" | |||
value={selectedUserType === null? null : selectedUserType} | |||
options={USER_TYPE_COMBO} | |||
onChange={(event, newValue) => { | |||
setSelectedUserType(newValue); | |||
}} | |||
renderInput={(params) => <TextField {...params}/>} | |||
<Checkbox | |||
checked={locked} | |||
onChange={(event) => setLocked(event.target.checked)} | |||
name="checked" | |||
color="primary" | |||
size="medium" | |||
/> | |||
{/*<FormControlLabel*/} | |||
{/* control={*/} | |||
{/* <Checkbox*/} | |||
{/* checked={selectedUserType}*/} | |||
{/* onChange={(event) => setSelectedUserType(event.target.checked)}*/} | |||
{/* name="checked"*/} | |||
{/* color="primary"*/} | |||
{/* size="medium"*/} | |||
{/* />*/} | |||
{/* }*/} | |||
{/* label={<Typography variant="lionerLabel">Lotus Notes User</Typography>}*/} | |||
{/*/>*/} | |||
</Grid> | |||
<Grid item xs={9} s={6} md={5} lg={3} sx={{mt:2.5,ml:3, mr:3 }}> | |||
<FormControlLabel | |||
control={ | |||
<Checkbox | |||
checked={locked} | |||
onChange={(event) => setLocked(event.target.checked)} | |||
name="checked" | |||
color="primary" | |||
size="medium" | |||
/> | |||
} | |||
label={<Typography variant="lionerLabel">Locked</Typography>} | |||
/> | |||
</Grid> | |||
{/*<Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5 }}>*/} | |||
{/* <TextField*/} | |||
{/* fullWidth*/} | |||
{/* {...register("subDivisionId")}*/} | |||
{/* id="subDivision"*/} | |||
{/* label="Sub-Division"*/} | |||
{/* />*/} | |||
{/*</Grid>*/} | |||
</Grid> */} | |||
</Grid> | |||
@@ -11,7 +11,9 @@ import { useTheme } from '@mui/material/styles'; | |||
import Checkbox from '@mui/material/Checkbox'; | |||
import {CustomNoRowsOverlay} from "../../utils/CommonFunction"; | |||
import {LIONER_BUTTON_THEME} from "../../themes/colorConst"; | |||
import {USER_GROUP_COMBO} from "../../utils/ComboConst"; | |||
import {ThemeProvider} from "@emotion/react"; | |||
// ==============================|| EVENT TABLE ||============================== // | |||
export default function UserTable({recordList}) { | |||
@@ -70,30 +72,23 @@ export default function UserTable({recordList}) { | |||
flex: 0.75, | |||
}, | |||
{ | |||
id: 'post', | |||
field: 'post', | |||
headerName: 'Post', | |||
id: 'groupId', | |||
field: 'groupId', | |||
headerName: 'User Group', | |||
flex: 0.5, | |||
}, | |||
{ | |||
id: 'email', | |||
field: 'email', | |||
headerName: 'Email', | |||
flex: 1.45, | |||
renderCell: (params) => { | |||
const userGroup = USER_GROUP_COMBO.find(item => item.id === params.value)?? {label: "N/A"}; | |||
return ( | |||
<div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}> | |||
{params.value} | |||
{userGroup.label} | |||
</div> | |||
); | |||
} | |||
}, | |||
{ | |||
id: 'subDivision', | |||
field: 'subDivision', | |||
//type: 'date', | |||
//sortable: false, | |||
headerName: 'Sub-Division', | |||
id: 'email', | |||
field: 'email', | |||
headerName: 'Email', | |||
flex: 1.45, | |||
renderCell: (params) => { | |||
return ( | |||
@@ -103,25 +98,6 @@ export default function UserTable({recordList}) { | |||
); | |||
} | |||
}, | |||
{ | |||
id: 'lotusNotesUser', | |||
field: 'lotusNotesUser', | |||
type: 'bool', | |||
headerName: 'Lotus Notes', | |||
flex: 0.63, | |||
renderCell: (params) => { | |||
return ( | |||
<Checkbox | |||
theme={theme} | |||
key="locked" | |||
checked={params.row.lotusNotesUser} | |||
color="primary" | |||
size="medium" | |||
//onChange={handleChange} | |||
/> | |||
); | |||
}, | |||
}, | |||
{ | |||
id: 'locked', | |||
field: 'locked', | |||
@@ -130,14 +106,20 @@ export default function UserTable({recordList}) { | |||
flex: 0.5, | |||
renderCell: (params) => { | |||
return ( | |||
<Checkbox | |||
theme={theme} | |||
key="locked" | |||
checked={params.row.locked} | |||
color="primary" | |||
size="medium" | |||
//onChange={handleChange} | |||
<input | |||
type="checkbox" | |||
checked={params.row.locked} | |||
// onClick={handleClick} // Prevent click effect | |||
/> | |||
// <Checkbox | |||
// theme={theme} | |||
// key="locked" | |||
// checked={params.row.locked} | |||
// color="primary" | |||
// size="medium" | |||
// disabled | |||
// //onChange={handleChange} | |||
// /> | |||
); | |||
}, | |||
}, | |||
@@ -28,10 +28,6 @@ const UserSettingPage = () => { | |||
getUserList(); | |||
}, []); | |||
useEffect(() => { | |||
setOnReady(true); | |||
}, [record]); | |||
useEffect(() => { | |||
getUserList(); | |||
}, [searchCriteria]); | |||
@@ -42,7 +38,11 @@ const UserSettingPage = () => { | |||
) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
setRecord(response.data); | |||
const suId = response.data.find(item => item.groupId == 3)?.id; | |||
const res = response.data.filter(item => item?.id !== suId); | |||
setRecord(res); | |||
setOnReady(true); | |||
} | |||
}) | |||
.catch(error => { | |||
@@ -56,9 +56,6 @@ const UserSettingPage = () => { | |||
} | |||
return ( | |||
!onReady ? | |||
<LoadingComponent/> | |||
: | |||
<Grid container rowSpacing={3} columnSpacing={2.75}> | |||
<ThemeProvider theme={LIONER_FORM_THEME}> | |||
<Grid item xs={12} md={12} lg={12} sx={{mt:-1}}> | |||
@@ -76,6 +73,9 @@ const UserSettingPage = () => { | |||
<SearchForm applySearch={applySearch}/> | |||
</Grid> | |||
{/*row 2*/} | |||
{!onReady ? | |||
<LoadingComponent/> | |||
: | |||
<Grid item xs={12} md={12} lg={12} sx={{mt:{lg:-1.5}}}> | |||
<MainCard elevation={0} | |||
content={false} | |||
@@ -85,7 +85,7 @@ const UserSettingPage = () => { | |||
recordList={record} | |||
/> | |||
</MainCard> | |||
</Grid> | |||
</Grid>} | |||
</ThemeProvider> | |||
</Grid> | |||
@@ -50,10 +50,10 @@ export const MODULE_COMBO = [ | |||
{id:3, key: 3, label: 'Award'}, | |||
]; | |||
export const USER_TYPE_COMBO = [ | |||
{id:1, key: 1, label: 'All Type'}, | |||
{id:2, key: 2, label: 'Lotus Note User'}, | |||
{id:3, key: 3, label: 'System User'}, | |||
export const USER_GROUP_COMBO = [ | |||
// {id:0, key: 0, label: 'System Admin'}, | |||
{id:1, key: 1, label: 'Case Officer'}, | |||
{id:2, key: 2, label: 'Administrator'}, | |||
]; | |||
export const EVENT_REGION_COMBO = [ | |||