add client code

update layout
update pdf page
update user group combo

src/menu-items/setting.js

@@ -123,24 +123,24 @@ const setting = {
             breadcrumbs: false,
             ability:['VIEW','LOGIN_LOG']
         },
-        {
-            id: 'passwordPolicy',
-            title: 'Password Policy',
-            type: 'item',
-            url: '/passwordpolicy',
-            icon: icons.SafetyCertificateOutlined,
-            breadcrumbs: false,
-            ability:['MANAGE','SYSTEM_CONFIGURATION']
-        },
-        {
-            id: 'setting',
-            title: 'System Configuration',
-            type: 'item',
-            url: '/setting',
-            icon: icons.SettingOutlined,
-            breadcrumbs: false,
-            ability:['MANAGE','SYSTEM_CONFIGURATION']
-        },
+        // {
+        //     id: 'passwordPolicy',
+        //     title: 'Password Policy',
+        //     type: 'item',
+        //     url: '/passwordpolicy',
+        //     icon: icons.SafetyCertificateOutlined,
+        //     breadcrumbs: false,
+        //     ability:['MANAGE','SYSTEM_CONFIGURATION']
+        // },
+        // {
+        //     id: 'setting',
+        //     title: 'System Configuration',
+        //     type: 'item',
+        //     url: '/setting',
+        //     icon: icons.SettingOutlined,
+        //     breadcrumbs: false,
+        //     ability:['MANAGE','SYSTEM_CONFIGURATION']
+        // },
         // {
         //     id: 'generateReminder',
         //     title: 'Generate Reminder',

src/pages/client/ClientMaintainPage/ClientForm.js

@@ -562,6 +562,39 @@ const ClientForm = ({   refClientDetail,
 
                 <form>
                     <Grid container>
+                        <Grid item xs={12} s={12} md={12} lg={5.5} sx={{mt:1, ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"flex-start"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3,mt:1, display: 'flex', alignItems: 'flex-start'}}>
+                                    <Typography variant="lionerSize" component="span">
+                                        Client Code: <Typography sx={{ color: GENERAL_RED_COLOR }} component="span">*</Typography>
+                                    </Typography>
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6.5}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("clientCode",
+                                            {
+                                                value: refClient.clientCode,
+                                            })}
+                                        id='clientCode'
+                                        required
+                                        inputProps={{maxLength: 255, style: {fontSize: '1.1rem'}}}
+                                        InputProps={{
+                                            style: { minHeight:'42.5px', maxHeight: '50vh' },
+                                        }}
+                                        multiline
+                                        maxRows={3}
+                                        error={!!errors.lastname}
+                                        helperText={errors.lastname}
+                                        disabled
+                                        autoComplete="off"
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
                         <Grid item xs={12} s={12} md={12} lg={5.5} sx={{mt:1, ml: 3, mr: 3, mb: 3}}>
                             <Grid container alignItems={"flex-start"}>
                                 <Grid item xs={4} s={4} md={4} lg={4}
@@ -745,7 +778,7 @@ const ClientForm = ({   refClientDetail,
                             </Grid>
                         </Grid>
 
-                        <Grid item xs={12} sm={12} md={12} lg={5.5} sx={{ml: 3, mr: 3, mb: 3}}>
+                        {/* <Grid item xs={12} sm={12} md={12} lg={5.5} sx={{ml: 3, mr: 3, mb: 3}}>
                             <Grid container alignItems={"center"}>
                                 <Grid item xs={4} s={4} md={4} lg={4}
                                       sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
@@ -769,7 +802,7 @@ const ClientForm = ({   refClientDetail,
                                     />
                                 </Grid>
                             </Grid>
-                        </Grid>
+                        </Grid> */}
 
                         <Grid item xs={12} s={12} md={12} lg={5.5} sx={{ml: 3, mr: 3, mb: 3}}>
                             <Grid container alignItems={"flex-start"}>
@@ -780,6 +813,21 @@ const ClientForm = ({   refClientDetail,
                                     </Typography>
                                 </Grid>
 
+                                <Grid item xs={7} s={7} md={7} lg={6.5}>
+                                    <TextField
+                                        fullWidth
+                                        inputProps={{maxLength: 50}}
+                                        size="small"
+                                        {...register("cm",
+                                            {
+                                                value: "N/A",//refClient.phone1,
+                                            })}
+                                        id='cm'
+                                        disabled
+                                        autoComplete="off"
+                                    />
+                                </Grid>
+
                                 {/* <Grid item xs={7} s={7} md={7} lg={7}>
                                     <Autocomplete
                                         multiple
@@ -828,6 +876,21 @@ const ClientForm = ({   refClientDetail,
                                     </Typography>
                                 </Grid>
 
+                                <Grid item xs={7} s={7} md={7} lg={6.5}>
+                                    <TextField
+                                        fullWidth
+                                        inputProps={{maxLength: 50}}
+                                        size="small"
+                                        {...register("cs",
+                                            {
+                                                value: "N/A",//refClient.phone1,
+                                            })}
+                                        id='cs'
+                                        disabled
+                                        autoComplete="off"
+                                    />
+                                </Grid>
+
                                 {/* <Grid item xs={7} s={7} md={7} lg={7}>
                                     <Autocomplete
                                         multiple

src/pages/client/ClientMaintainPage/index.js

@@ -182,7 +182,7 @@ const ClientPanel = () => {
                     <Grid container justifyContent="flex-start" alignItems="center">
                         <Grid item xs={3} sx={{mt:-1, mb: -2.25}} >
                             <Box sx={{ display: 'flex', alignItems: 'center'}}>
-                                <Typography align="center" variant="h5" >{isNewRecord? "New Client" : "Maintain Client"}</Typography>
+                                <Typography align="center" variant="h4" >{isNewRecord? "New Client" : "Maintain Client"}</Typography>
                             </Box>
                         </Grid>
                     </Grid>

src/pages/client/ClientSearchPage/ClientSearchForm.js

@@ -240,6 +240,17 @@ const ClientSearchForm = ({applySearch, setExpanded,expanded}) => {
                 <ThemeProvider theme={LIONER_FORM_THEME}>
                 {/*row 2*/}
                 <Grid container alignItems={"flex-start"} >
+                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5}}>
+                        <InputLabel htmlFor="clientCode">Client Code</InputLabel>
+                        <TextField
+                            fullWidth
+                            {...register("clientCode")}
+                            inputProps={{maxLength: 500}}
+                            id="clientCode"
+                            autoComplete="off"
+                        />
+                    </Grid>
+
                     <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:0.5}}>
                         <InputLabel htmlFor="clientLastName">Client Last Name</InputLabel>
                         <TextField

src/pages/client/ClientSearchPage/ClientTable.js

@@ -87,6 +87,12 @@ export default function ClientTable({recordList, pageSize}) {
         //         // </div>
         //     ),
         // },
+        {
+            id: 'clientCode',
+            field: 'clientCode',
+            headerName: 'Client Code',
+            flex: 1.5,
+        },
         {
             id: 'fullname',
             field: 'fullname',
@@ -168,19 +174,19 @@ export default function ClientTable({recordList, pageSize}) {
                 );
             }
         },
-        {
-            id: 'phone2',
-            field: 'phone2',
-            headerName: '2nd Phone No.',
-            flex: 1,
-            renderCell: (params) => {
-                return (
-                    <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}>
-                        {params.value}
-                    </div>
-                );
-            }
-        },
+        // {
+        //     id: 'phone2',
+        //     field: 'phone2',
+        //     headerName: '2nd Phone No.',
+        //     flex: 1,
+        //     renderCell: (params) => {
+        //         return (
+        //             <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}>
+        //                 {params.value}
+        //             </div>
+        //         );
+        //     }
+        // },
         {
             id: 'remarks',
             field: 'remarks',

src/pages/lionerLoginLog/index.js

@@ -65,7 +65,7 @@ const LoginLogSearchPanel = () => {
                     <Grid container justifyContent="flex-start" alignItems="center">
                         <Grid item xs={3} sx={{mb: -2.25}} >
                             <Box sx={{ display: 'flex', alignItems: 'center'}}>
-                                <Typography align="center" variant="h5" >Login Log</Typography>
+                                <Typography align="center" variant="h4" >Login Log</Typography>
                             </Box>
                         </Grid>
                     </Grid>

src/pages/lionerPasswordPolicyPage/index.js

@@ -156,7 +156,7 @@ const PasswordPolicyPage = () => {
         <Grid container rowSpacing={4.5} columnSpacing={2.75} justifyContent="center">
             <ThemeProvider theme={LIONER_FORM_THEME}>
             <Grid item xs={12} sx={{mb: -2.25}}>
-                <Typography variant="h5">Password Policy</Typography>
+                <Typography variant="h4">Password Policy</Typography>
             </Grid>
             <Grid item xs={12} md={11} lg={10} >
                 <MainCard xs={12} md={12} lg={12}

src/pages/lionerSettingPage/index.js

@@ -169,7 +169,7 @@ const SettingPage = () => {
             :
         <Grid container rowSpacing={4.5} columnSpacing={2.75} justifyContent="center">
             <Grid item xs={12} sx={{mb: -2.25}}>
-                <Typography variant="h5">System Configuration</Typography>
+                <Typography variant="h4">System Configuration</Typography>
             </Grid>
             <Grid item xs={12} md={11} lg={10} >
                 <MainCard xs={12} md={12} lg={12}

src/pages/lionerUserDetailPage/UserInformationCard.js

@@ -177,16 +177,16 @@ const UserInformationCard = ({isCollectData, updateUserObject,userData,
                       content={false}
                     //   sx={{height:'77.5vh'}}
             >
-                <Typography variant="h5" sx={{mt: 1.5, ml: 3, mb: 1}}>
-                    Information
-                </Typography>
+                {/*<Typography variant="h5" sx={{mt: 1.5, ml: 3, mb: 1}}>
+                    
+                </Typography>*/}
 
                 <form>
                     {/* <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}}>
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{mt: 3, 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'}}>

src/pages/lionerUserDetailPage/index.js

@@ -196,7 +196,7 @@ const UserMaintainPage = () => {
             <Grid container rowSpacing={3} columnSpacing={1.5}>
                 <ThemeProvider theme={LIONER_FORM_THEME}>
                 <Grid item xs={12} sx={{mt:-1, mb: -2.25}}>
-                    <Typography variant="h5">{isNewRecord? "Create User" : "Maintain User"}</Typography>
+                    <Typography variant="h4">{isNewRecord? "Create User" : "Maintain User"}</Typography>
                 </Grid>
                 {/*col 1*/}
                 <Grid item xs={12} md={12}/* lg={5}*/>

src/pages/lionerUserSearchPage/index.js

@@ -62,7 +62,7 @@ const UserSettingPage = () => {
                     <Grid container justifyContent="flex-start" alignItems="center">
                         <Grid item xs={12} sx={{mb: -2.25}} >
                             <Box sx={{ display: 'flex', alignItems: 'center'}}>
-                                <Typography align="center" variant="h5">View User</Typography>
+                                <Typography align="center" variant="h4">View User</Typography>
                             </Box>
                         </Grid>
                     </Grid>

src/pages/pdf/PdfMaintainPage/index.js

@@ -23,6 +23,7 @@ function PDF() {
     const viewerRef = useRef(null); // Ref for the DOM element where PDF will render
     const [pdfLoaded, setPdfLoaded] = useState(false);
     const [viewerLoaded, setViewerLoaded] = useState(false);
+    const [isSaving, setIsSaving] = useState(false);
     const [viewInstance,setViewInstance] = useState();
     const [adobeDCView,setAdobeDCView] = useState();
     const [pdfUrl, setPdfUrl] = useState();
@@ -194,6 +195,7 @@ function PDF() {
             const formData = new FormData();
             formData.append('file', filledPdfBlob, 'filled_form.pdf');
             formData.append('record', JSON.stringify(record));
+            setIsSaving(true);
             // Send the filled PDF to your Spring Boot backend's save endpoint
             await axios.post(`${apiPath}${POST_PDF_PATH}`, formData, {
                 headers: {
@@ -201,6 +203,7 @@ function PDF() {
                 },
             })
             .then(response => {
+                setIsSaving(false);
                 console.log('PDF saved on server:', response.data);
                 setRecord({
                     id: response.data.data.id,
@@ -264,6 +267,7 @@ function PDF() {
                                 variant="contained"
                                 color="cancel"
                                 onClick={viewerLoaded ? handleBackClick : handleBack}
+                                disabled={isSaving}
                                 >
                                 Back
                             </Button>

src/pages/pdf/PdfSearchPage/PdfSearchForm.js

@@ -246,7 +246,7 @@ const PdfSearchForm = ({applySearch, setExpanded,expanded, clientId}) => {
                         </Grid>
                     </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={{ml:3, mr:3, mb:0.5}}>
                         <InputLabel htmlFor="remarks">Remarks</InputLabel>
                         <TextField
                             fullWidth
@@ -255,7 +255,7 @@ const PdfSearchForm = ({applySearch, setExpanded,expanded, clientId}) => {
                             id="remarks"
                             autoComplete="off"
                         />
-                    </Grid>
+                    </Grid> */}
 
                 </Grid>
 

src/pages/pdf/PdfSearchPage/PdfTable.js

@@ -117,6 +117,19 @@ export default function PdfTable({recordList}) {
                 </div>
             ),
         },
+        {
+            id: 'version',
+            field: 'version',
+            headerName: 'Version',
+            flex: 0.5,
+            renderCell: (params) => {
+                return (
+                    <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}>
+                        {params.value}
+                    </div>
+                );
+            }
+        },
         {
             id: 'modified',
             field: 'modified',
@@ -198,19 +211,19 @@ export default function PdfTable({recordList}) {
         //         );
         //     }
         // },
-        {
-            id: 'remarks',
-            field: 'remarks',
-            headerName: 'Remarks',
-            flex: 2,
-            renderCell: (params) => {
-                return (
-                    <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}>
-                        {params.value}
-                    </div>
-                );
-            }
-        },
+        // {
+        //     id: 'remarks',
+        //     field: 'remarks',
+        //     headerName: 'Remarks',
+        //     flex: 2,
+        //     renderCell: (params) => {
+        //         return (
+        //             <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', whiteSpace: 'normal', wordBreak: 'break-word'}}>
+        //                 {params.value}
+        //             </div>
+        //         );
+        //     }
+        // },
 
     ];
 

src/pages/pdf/PdfSearchPage/SelectTemplateWindow.js

@@ -46,6 +46,19 @@ export function SelectTemplateWindow({ isWindowOpen, onNormalClose, onConfirmClo
     const createNewForm = (templateId) => {
       navigate(`/pdf/maintain/-${clientId}T${templateId}`);
     };
+
+    const generateColorFromKey = (key) => {
+      let hash = 0;
+      for (let i = 0; i < key.length; i++) {
+          hash += key.charCodeAt(i);
+      }
+
+      const baseHue = (hash * 37) % 360; // Multiply by a prime number for better distribution
+      const saturation = 120; // Higher saturation for more vibrant colors
+      const lightness = 30; // Lower lightness for darker colors
+
+      return `hsl(${baseHue}, ${saturation}%, ${lightness}%)`;
+  };
   
     return (
       <Dialog
@@ -75,8 +88,8 @@ export function SelectTemplateWindow({ isWindowOpen, onNormalClose, onConfirmClo
               <div key={record.id} style={{ margin: '10px' }}>
                 <Button
                   variant="contained"
-                  color="create"
-                  sx={{mr: 1}}
+                  //color="create"
+                  sx={{backgroundColor: generateColorFromKey(record.name.split(' ')[0]), color: 'white', mr: 1}}
                   onClick={() => createNewForm(record.id)}
                   >
                   {record.name}

src/utils/ComboConst.js

@@ -52,7 +52,7 @@ export const MODULE_COMBO = [
 
 export const USER_GROUP_COMBO = [
     // {id:0, key: 0, label: 'System Admin'},
-    {id:1, key: 1, label: 'Case Officer'},
+    {id:1, key: 1, label: 'Case Manager'},
     {id:2, key: 2, label: 'Administrator'},
 ];