diff --git a/src/pages/Organization/DetailPage/OrganizationCard.js b/src/pages/Organization/DetailPage/OrganizationCard.js index 71e0bb7..8a634ac 100644 --- a/src/pages/Organization/DetailPage/OrganizationCard.js +++ b/src/pages/Organization/DetailPage/OrganizationCard.js @@ -10,7 +10,7 @@ import * as React from "react"; import { useFormik } from 'formik'; import { useForm } from "react-hook-form"; import * as yup from 'yup'; -import { useEffect, useState } from "react"; +import { useEffect, useState, lazy } from "react"; import * as DateUtils from 'utils/DateUtils'; import * as HttpUtils from 'utils/HttpUtils'; import * as UrlUtils from "utils/ApiPathConst"; @@ -18,13 +18,12 @@ import * as FieldUtils from "utils/FieldUtils"; import * as ComboData from "utils/ComboData"; const LoadingComponent = Loadable(lazy(() => import('../../extra-pages/LoadingComponent'))); import Loadable from 'components/Loadable'; -import { lazy } from 'react'; import { notifySaveSuccess } from 'utils/CommonFunction'; import { useIntl } from "react-intl"; import { PNSPS_BUTTON_THEME } from "themes/buttonConst"; import { ThemeProvider } from "@emotion/react"; import { makeStyles } from '@mui/styles'; - +import { isGrantedAny } from "auth/utils"; // ==============================|| DASHBOARD - DEFAULT ||============================== // const useStyles = makeStyles(() => ({ root: { @@ -40,7 +39,7 @@ const useStyles = makeStyles(() => ({ right: 50, display: "flex", alignItems: "center", - width:"70%" + width: "70%" }, })); @@ -57,7 +56,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { const [minDate] = React.useState(new Date()); const [fromDate, setFromDate] = React.useState("dd / mm / yyyy"); const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy"); - const {register, handleSubmit, reset} = useForm() + const { register, handleSubmit, reset } = useForm() React.useEffect(() => { setFromDateValue(fromDate); @@ -151,7 +150,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { id: id > 0 ? id : null, enCompanyName: values.enCompanyName, chCompanyName: values.chCompanyName, - orgShortName: values.creditor?values.orgShortName:"", + orgShortName: values.creditor ? values.orgShortName : "", brNo: values.brNo, // brExpiryDate: values.brExpiryDate, brExpiryDate: sentDateFrom, @@ -214,17 +213,17 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { const onSubmit = (data) => { let sentOrgShortName = ""; - if(data.orgShortName!=null && data.orgShortName!=""){ - sentOrgShortName = data.orgShortName - if (sentOrgShortName.length <=24){ + if (data.orgShortName != null && data.orgShortName != "") { + sentOrgShortName = data.orgShortName + if (sentOrgShortName.length <= 24) { const temp = { orgShortName: sentOrgShortName, }; markAsCreditor(temp); - }else{ + } else { alert("Organisation Short Name must not exceed 24 characters.") } - }else{ + } else { alert("Please enter Organisation Short Name for Demand Note.") } @@ -265,93 +264,97 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
{/*top*/} - - - - {editMode ? - <> - {createMode ? - <> + {isGrantedAny("MAINTAIN_ORG") ? + + + + {editMode ? + <> + {createMode ? + <> + + + + + + : + <> + + + + + + + + + + } + + : + <> + - - - + - : - <> - - - + + + { + currentUserData.creditor ? + + + + + : - + + + - - - } - - : - <> - - - - - - - { - currentUserData.creditor ? - - - - - - : - - - - - - } - - } + } + + } + - + : <> + } + {/*top*/} {!onReady ? @@ -430,9 +433,9 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { inputComponent: FormDateInputComponent, }} onChange={(newValue) => { - if (newValue.target.value>DateUtils.dateValue(minDate)){ + if (newValue.target.value > DateUtils.dateValue(minDate)) { setFromDate(newValue.target.value); - }else{ + } else { alert("Please select a date after today.") } }} @@ -440,11 +443,11 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { shrink: true }} disabled={(!editMode && !createMode)} - sx={{ "& .MuiInputBase-input": {display:"block", textIndent: "-9999px"} }} + sx={{ "& .MuiInputBase-input": { display: "block", textIndent: "-9999px" } }} /> - + @@ -511,7 +514,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { form: formik })} - : + : null } @@ -552,7 +555,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => { Please Enter Organisation Short Name for Credit Client (Used for Demand Note) - + () => { - navigate('/org/' + id); - }; + // const handleActionClick = (id) => () => { + // navigate('/org/' + id); + // }; const columns = [ - { - field: 'actions', - type: 'actions', - headerName: 'Actions', - width: 100, - cellClassName: 'actions', - getActions: ({ id }) => { - return [ - } - label="Edit" - className="textPrimary" - onClick={handleActionClick(id)} - color="primary" - />] - }, - }, + // { + // field: 'actions', + // type: 'actions', + // headerName: 'Actions', + // width: 100, + // cellClassName: 'actions', + // getActions: ({ id }) => { + // return [ + // } + // label="Edit" + // className="textPrimary" + // onClick={handleActionClick(id)} + // color="primary" + // />] + // }, + // }, { id: 'brNo', field: 'brNo', headerName: 'BR No.', flex: 1, minWidth: 150, + renderCell: (params) => { + return clickableLink('/org/'+ params.row.id, params.row.brNo); + }, }, { id: 'enCompanyName', diff --git a/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js b/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js index dc70692..f2296e8 100644 --- a/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js +++ b/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js @@ -5,8 +5,6 @@ import { import MainCard from "../../components/MainCard"; import * as React from "react"; import {useEffect, useState} from "react"; -//import LoadingComponent from "../extra-pages/LoadingComponent"; -//import GroupAuthTable from "./GroupAuthTable"; import Loadable from 'components/Loadable'; import { lazy } from 'react'; const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent'))); @@ -14,11 +12,16 @@ const GroupAuthTable = Loadable(lazy(() => import('./GroupAuthTable'))); // ==============================|| DASHBOARD - DEFAULT ||============================== // -const GroupAuthCard = ({isCollectData, updateUserAuthList,userGroupData,isNewRecord}) => { +const GroupAuthCard = ({isCollectData, updateUserAuthList,userGroupData,isNewRecord, editMode}) => { const [currentAuthData, setCurrentAuthData] = React.useState({}); const [onReady, setOnReady] = useState(false); const [selectedRow, setSelectedRow] = useState([]); const [referenceRow, setReferenceRow] = useState([]); + const [_editMode, setEditMode] = useState(editMode); + + useEffect(()=>{ + setEditMode(editMode); + },[editMode]) useEffect(() => { //if user data from parent are not null @@ -62,6 +65,7 @@ const GroupAuthCard = ({isCollectData, updateUserAuthList,userGroupData,isNewRec userAuth={userGroupData.authIds} setSelectedRow={setSelectedRow} isNewRecord={isNewRecord} + editMode={_editMode} /> ); diff --git a/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js b/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js index 9214364..568c4ba 100644 --- a/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js +++ b/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js @@ -15,10 +15,15 @@ const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingCompo // ==============================|| EVENT TABLE ||============================== // -export default function GroupAuthTable({setSelectedRow, userAuth,isNewRecord}) { +export default function GroupAuthTable({setSelectedRow, userAuth,isNewRecord, editMode}) { const [authData, setAuthData] = useState([]); const [onReady, setOnReady] = useState(false); const [currentSelectedRow, setCurrentSelectedRow] = useState(userAuth); + const [_editMode, setEditMode] = useState(editMode); + + useEffect(()=>{ + setEditMode(editMode); + },[editMode]) const _sx = { ml: 3, @@ -92,9 +97,10 @@ export default function GroupAuthTable({setSelectedRow, userAuth,isNewRecord}) { checkboxSelection rowSelectionModel={currentSelectedRow} onRowSelectionModelChange={(ids) => { - // console.log(ids); - setSelectedRow(ids); - setCurrentSelectedRow(ids); + if(_editMode){ + setSelectedRow(ids); + setCurrentSelectedRow(ids); + } }} autoHeight sx={_sx} diff --git a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js index 40b3468..5039e98 100644 --- a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js +++ b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js @@ -23,13 +23,18 @@ const UserAddTable = Loadable(lazy(() => import('./UserAddTable'))); // ==============================|| DASHBOARD - DEFAULT ||============================== // -const UserAddCard = ({ isCollectData, updateGroupMember, userGroupData, isNewRecord }) => { +const UserAddCard = ({ isCollectData, updateGroupMember, userGroupData, isNewRecord, editMode }) => { const [currentUserData, setCurrentUserData] = React.useState({}); const [onReady, setOnReady] = useState(false); const [groupUserData, setGroupUserData] = useState([]); const [userComboList, setUserComboList] = useState([]); const [selectedUser, setSelectedUser] = useState(null); const [deletedList, setDeletedList] = useState([]); + const [_editMode, setEditMode] = useState(editMode); + + useEffect(() => { + setEditMode(editMode); + }, [editMode]) function updateUserList() { const idList = getIdList(groupUserData); @@ -104,47 +109,55 @@ const UserAddCard = ({ isCollectData, updateGroupMember, userGroupData, isNewRec User(s) - - - - User: - - - { - console.log(newValue) - setSelectedUser(newValue); - }} - renderInput={(params) => } - /> - - - + + { + _editMode ? + + + + User: + + + { + console.log(newValue) + setSelectedUser(newValue); + }} + renderInput={(params) => } + /> + + + + + - - + : <> + } + + - + diff --git a/src/pages/pnspsUserGroupDetailPage/UserAddTable.js b/src/pages/pnspsUserGroupDetailPage/UserAddTable.js index d928984..65480af 100644 --- a/src/pages/pnspsUserGroupDetailPage/UserAddTable.js +++ b/src/pages/pnspsUserGroupDetailPage/UserAddTable.js @@ -14,7 +14,7 @@ const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingCompo // ==============================|| EVENT TABLE ||============================== // -export default function UserAddTable({setGroupUserData, userList,setDeletedList}) { +export default function UserAddTable({setGroupUserData, userList,setDeletedList, editMode}) { const [groupData, setGroupData] = useState([]); const [onReady, setOnReady] = useState(false); const [localDeletedList, setLocalDeletedList] = React.useState([]); @@ -37,6 +37,12 @@ export default function UserAddTable({setGroupUserData, userList,setDeletedList} } } + const [_editMode, setEditMode] = useState(editMode); + + useEffect(()=>{ + setEditMode(editMode); + },[editMode]) + useEffect(() => { setGroupData(userList); }, []); @@ -70,6 +76,7 @@ export default function UserAddTable({setGroupUserData, userList,setDeletedList} const columns = [ + _editMode? { field: 'actions', type: 'actions', @@ -87,7 +94,7 @@ export default function UserAddTable({setGroupUserData, userList,setDeletedList} />, ] }, - }, + }:{}, { id: 'name', field: 'name', diff --git a/src/pages/pnspsUserGroupDetailPage/UserGroupInfoCard.js b/src/pages/pnspsUserGroupDetailPage/UserGroupInfoCard.js index 1fb7c9b..bc3467f 100644 --- a/src/pages/pnspsUserGroupDetailPage/UserGroupInfoCard.js +++ b/src/pages/pnspsUserGroupDetailPage/UserGroupInfoCard.js @@ -14,12 +14,19 @@ const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingCompo // ==============================|| DASHBOARD - DEFAULT ||============================== // -const UserGroupInfoCard = ({ isCollectData, updateGroupObject, userGroupData }) => { +const UserGroupInfoCard = ({ isCollectData, updateGroupObject, userGroupData , editMode}) => { //const params = useParams(); const [currentUserGroupData, setCurrentUserGroupData] = React.useState({}); const [onReady, setOnReady] = useState(false); const { register, getValues } = useForm() + const [_editMode, setEditMode] = useState(editMode); + + useEffect(()=>{ + setEditMode(editMode); + },[editMode]) + + useEffect(() => { //if user data from parent are not null if (Object.keys(userGroupData).length > 0 && userGroupData !== undefined) { @@ -68,6 +75,7 @@ const UserGroupInfoCard = ({ isCollectData, updateGroupObject, userGroupData }) diff --git a/src/pages/pnspsUserGroupDetailPage/index.js b/src/pages/pnspsUserGroupDetailPage/index.js index 5a77804..308859d 100644 --- a/src/pages/pnspsUserGroupDetailPage/index.js +++ b/src/pages/pnspsUserGroupDetailPage/index.js @@ -12,10 +12,9 @@ import { getDeletedRecordWithRefList, getIdList, notifyDeleteSuccess, - // notifyDeleteSuccess, notifySaveSuccess } from "../../utils/CommonFunction"; -import { POST_AND_UPDATE_USER_GROUP, GET_GROUP_LIST_PATH } from "../../utils/ApiPathConst"; +import { POST_AND_UPDATE_USER_GROUP, GET_GROUP_LIST_PATH } from "utils/ApiPathConst"; import Loadable from 'components/Loadable'; const LoadingComponent = Loadable(lazy(() => import('../extra-pages/LoadingComponent'))); @@ -25,6 +24,7 @@ const UserAddCard = Loadable(lazy(() => import('./UserAddCard'))); import { useNavigate } from "react-router"; import ForwardIcon from '@mui/icons-material/Forward'; import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' +import { isGrantedAny } from "auth/utils"; const BackgroundHead = { backgroundImage: `url(${titleBackgroundImg})`, @@ -43,6 +43,7 @@ const UserMaintainPage = () => { const params = useParams(); const navigate = useNavigate(); const [onReady, setOnReady] = useState(false); + const [editMode, setEditMode] = useState(false); const [isCollectData, setIsCollectData] = useState(false); const [editedGroupData, setEditedGroupData] = useState({}); const [userGroupData, setUserGroupData] = useState([]); @@ -184,6 +185,96 @@ const UserMaintainPage = () => { + + {/*top button*/} + { + isGrantedAny("MAINTAIN_GROUP")? + + + {editMode ? + <> + + + + + + + + + + : + <> + + + + + + + + + + + } + + + + :<> + } + + + {/*col 1*/} @@ -194,6 +285,7 @@ const UserMaintainPage = () => { userGroupData={userGroupData} isCollectData={isCollectData} isNewRecord={isNewRecord} + editMode={editMode} /> @@ -205,6 +297,7 @@ const UserMaintainPage = () => { userGroupData={userGroupData} isCollectData={isCollectData} isNewRecord={isNewRecord} + editMode={editMode} /> @@ -218,51 +311,10 @@ const UserMaintainPage = () => { userGroupData={userGroupData} isCollectData={isCollectData} isNewRecord={isNewRecord} + editMode={editMode} /> - - {/*bottom button*/} - - - - - - - - - - - - ); }; diff --git a/src/pages/pnspsUserGroupSearchPage/UserGroupSearchForm.js b/src/pages/pnspsUserGroupSearchPage/UserGroupSearchForm.js index 32db0b3..3866d42 100644 --- a/src/pages/pnspsUserGroupSearchPage/UserGroupSearchForm.js +++ b/src/pages/pnspsUserGroupSearchPage/UserGroupSearchForm.js @@ -9,9 +9,9 @@ import { useForm } from "react-hook-form"; import * as React from "react"; import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'; import { useNavigate } from "react-router"; -import {PNSPS_BUTTON_THEME} from "../../themes/buttonConst"; -import {ThemeProvider} from "@emotion/react"; - +import { PNSPS_BUTTON_THEME } from "../../themes/buttonConst"; +import { ThemeProvider } from "@emotion/react"; +import { isGrantedAny } from "auth/utils"; // ==============================|| DASHBOARD - DEFAULT ||============================== // const UserGroupSearchForm = ({ applySearch }) => { @@ -38,9 +38,9 @@ const UserGroupSearchForm = ({ applySearch }) => { > - + {/*row 1*/} - + Search @@ -81,40 +81,46 @@ const UserGroupSearchForm = ({ applySearch }) => { sx={{ mb: 3 }} > - - - - - - - - + { + isGrantedAny("MAINTAIN_GROUP") ? + + + + : + + } - - + + + + + + + + + - diff --git a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js index 6dc5358..edd58c3 100644 --- a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js +++ b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js @@ -1,51 +1,54 @@ // material-ui -import * as React from 'react'; -import { - GridActionsCellItem, -} from "@mui/x-data-grid"; +// import { +// GridActionsCellItem, +// } from "@mui/x-data-grid"; import {FiDataGrid} from "components/FiDataGrid"; -import EditIcon from '@mui/icons-material/Edit'; -import {useEffect} from "react"; +//import EditIcon from '@mui/icons-material/Edit'; +import {useState, useEffect} from "react"; import {useNavigate} from "react-router-dom"; import { GET_GROUP_LIST_PATH } from "utils/ApiPathConst"; +import { clickableLink} from 'utils/CommonFunction'; // ==============================|| EVENT TABLE ||============================== // export default function UserGroupTable({searchCriteria}) { - const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); + const [_searchCriteria, set_searchCriteria] = useState(searchCriteria); const navigate = useNavigate() useEffect(() => { set_searchCriteria(searchCriteria); }, [searchCriteria]); - const handleEditClick = (id) => () => { - navigate('/userGroup/'+ id); - }; + // const handleEditClick = (id) => () => { + // navigate('/userGroup/'+ id); + // }; const columns = [ - { - field: 'actions', - type: 'actions', - headerName: 'Actions', - width: 100, - cellClassName: 'actions', - getActions: ({id}) => { - return [ - } - label="Edit" - className="textPrimary" - onClick={handleEditClick(id)} - color="primary" - />] - }, - }, + // { + // field: 'actions', + // type: 'actions', + // headerName: 'Actions', + // width: 100, + // cellClassName: 'actions', + // getActions: ({id}) => { + // return [ + // } + // label="Edit" + // className="textPrimary" + // onClick={handleEditClick(id)} + // color="primary" + // />] + // }, + // }, { id: 'groupName', field: 'name', headerName: 'User Group Name', flex: 1, + renderCell: (params) => { + return clickableLink('/userGroup/'+ params.row.id, params.row.name); + }, }, { id: 'description',