penjagaan organisasi dan apotek

frontend/dashboard/src/@types/user.ts

@@ -139,6 +139,11 @@ export type Organization = {
     name: string;
   };
 
+  export type Corporate = {
+    id: number;
+    name: string;
+  };
+
 export type Permisions = {
   name: string;
   guard_name: string;
@@ -152,6 +157,7 @@ export type UserAccess = {
   person: Person;
   role: Role;
   organization_id: Organization;
+  corporate_id: Corporate;
 }
 
 export type Person = {

frontend/dashboard/src/pages/UserManagement/UserAccess/CreateUpdate.tsx

@@ -14,6 +14,7 @@ export default function UserAccessCreate() {
   const { id } = useParams();
   const [ currentUserAccess, setCurrentUserAccess ] = useState<UserAccess>();
   const [ roles, setRole ] = useState<any>();
+  const [ corporate, setCorporate ] = useState<any>();
   const [ organizations, setOrganization ] = useState<any>();
 
 
@@ -42,7 +43,6 @@ export default function UserAccessCreate() {
           navigate('/404');
         }
       })
-
     axios.get('/organization-list')
       .then((res)=> {
         setOrganization(res.data)
@@ -53,8 +53,20 @@ export default function UserAccessCreate() {
         }
       })
 
+    axios.get('/corporates')
+      .then((res)=> {
+        setCorporate(res.data)
+      })
+      .catch((err) => {
+        if (err.response.status === 404) {
+          navigate('/404');
+        }
+      })
+
   }, [id]);
 
+  console.log(corporate, 'test')
+
 
   return (
     <Page title= "User Access">
@@ -69,7 +81,7 @@ export default function UserAccessCreate() {
         ]}
       />
 
-      <UserAccessForm isEdit={isEdit} currentUserAccess={currentUserAccess} roles={roles} organizations={organizations}/>
+      <UserAccessForm isEdit={isEdit} currentUserAccess={currentUserAccess} roles={roles} organizations={organizations} corporate={corporate} />
     </Page>
   );
 }

frontend/dashboard/src/pages/UserManagement/UserAccess/Form.tsx

@@ -2,23 +2,25 @@ import * as Yup from 'yup';
 import { LoadingButton } from "@mui/lab";
 import { Box, Card, Grid, Stack, Typography } from "@mui/material";
 import { Role, UserAccess, Organization } from "../../../@types/user";
-import { FormProvider, RHFSelect, RHFSwitch, RHFTextField } from "../../../components/hook-form";
+import { FormProvider, RHFSelect, RHFTextField } from "../../../components/hook-form";
-import { useEffect, useMemo } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { useSnackbar } from 'notistack';
 import { useNavigate, useParams } from 'react-router-dom';
 import axios from '../../../utils/axios';
 import palette from '@/theme/palette';
+import { Corporate } from '@/@types/corporates';
 
 type Props = {
   isEdit: boolean;
   currentUserAccess?: UserAccess;
   roles: Role;
   organizations: Organization;
+  corporate: Corporate;
 };
 
-export default function AccsessForm({ isEdit, currentUserAccess, roles, organizations }: Props) {
+export default function AccessForm({ isEdit, currentUserAccess, roles, organizations, corporate }: Props) {
 
   const { enqueueSnackbar } = useSnackbar();
   const navigate = useNavigate();
@@ -28,14 +30,14 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
     name: Yup.string().required('Name is required'),
   });
 
-  console.log(currentUserAccess, 'test')
   const defaultValues = useMemo(
     () => ({
       name: currentUserAccess?.person?.name || '',
       username: currentUserAccess?.username || '',
       email: currentUserAccess?.email || '',
-      roles: currentUserAccess?.role?.id || [],
+      roles: currentUserAccess?.role?.id || '',
-      organizations: currentUserAccess?.organization_id || [],
+      organizations: currentUserAccess?.organization_id || '',
+      corporates: currentUserAccess?.corporate_id || '',
       password: '',
     }),
     [currentUserAccess]
@@ -58,25 +60,21 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
   const {
     reset,
     watch,
-    control,
-    setValue,
-    getValues,
-    setError,
     handleSubmit,
+    setError,
     formState: { isSubmitting },
   } = methods;
 
+  // Watch 'roles' field to conditionally render other fields
+  const selectedRole = watch('roles'); 
 
   const onSubmit = async (data: any) => {
-
+    console.log(data, 'test123');
-    console.log(data);
     if (!isEdit) {
       await axios
         .post('/user/access', data)
         .then((res) => {
           enqueueSnackbar('User created successfully', { variant: 'success' });
-      })
-      .then((res) => {
           navigate('/user-access', { replace: true });
         })
         .catch(({ response }) => {
@@ -85,9 +83,8 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
               setError(key, { message: value[0] });
               enqueueSnackbar(value[0] ?? 'Failed Processing Request', { variant: 'error' });
             }
-        }
+          } else {
-        else {
+            enqueueSnackbar('Create Failed : ' + response.data.message, { variant: 'error' });
-          enqueueSnackbar('Create Failed : '+ response.data.message, { variant: 'error' });
           }
         });
     } else {
@@ -95,33 +92,29 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
         .put('/user/access/' + currentUserAccess?.id, data)
         .then((res) => {
           enqueueSnackbar('User updated successfully', { variant: 'success' });
-        })
+          navigate('/user-access', { replace: true });
-        .then((res) => {
-          navigate('/user-access' ,  { replace: true });
         })
         .catch(({ response }) => {
-          enqueueSnackbar('Update Failed : '+ response.data.message, { variant: 'error' });
+          enqueueSnackbar('Update Failed : ' + response.data.message, { variant: 'error' });
         });
     }
   };
 
-  const optionsRoles = roles?.data?.map(item => ({
+  // Map role, organization, and corporate options
+  const optionsRoles = roles?.data?.map((item) => ({
     value: item.id,
-    label: item.name
+    label: item.name,
   })) ?? [];
 
-  if (optionsRoles.length > 0) {
+  const optionsOrganization = organizations?.data?.map((item) => ({
-    optionsRoles.unshift({ value: '', label: '' });
-  }
-
-  const optionsOrganization = organizations?.data?.map(item => ({
     value: item.id,
-    label: item.name
+    label: item.name,
   })) ?? [];
 
-  if (optionsOrganization.length > 0) {
+  const optionsCorporate = corporate?.data?.map((item) => ({
-    optionsOrganization.unshift({ value: '', label: '' });
+    value: item.id,
-  }
+    label: item.name,
+  })) ?? [];
 
   return (
     <FormProvider methods={methods} onSubmit={handleSubmit(onSubmit)}>
@@ -130,11 +123,15 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
           <Grid item xs={12} sm={12}>
             <Card sx={{ px: 3, py: 4 }}>
               <Stack spacing={2}>
-                          <Typography variant="h6" color={palette.light.primary.main}>User Access</Typography>
+                <Typography variant="h6" color={palette.light.primary.main}>
+                  User Access
+                </Typography>
                 <RHFTextField name="name" label="Name" />
                 <RHFTextField name="username" label="Username" />
                 <RHFTextField type="email" name="email" label="Email" />
                 <RHFTextField type="password" name="password" label="Password" />
+
+                {/* Select for roles */}
                 <RHFSelect name="roles" label="Roles">
                   {optionsRoles.map((option, index) => (
                     <option key={index} value={option.value}>
@@ -142,19 +139,35 @@ export default function AccsessForm({ isEdit, currentUserAccess, roles, organiza
                     </option>
                   ))}
                 </RHFSelect>
-                          <RHFSelect name="organizations" label="organizations">
+
+                {/* Conditional rendering based on selectedRole */}
+                {selectedRole && (['8'].includes(selectedRole) ? (
+                  <RHFSelect name="organizations" label="Organizations">
                     {optionsOrganization.map((option, index) => (
                       <option key={index} value={option.value}>
                         {option.label}
                       </option>
                     ))}
                   </RHFSelect>
+                ) : ['2'].includes(selectedRole) ? (
+                  <RHFSelect name="corporates" label="Corporates">
+                    {optionsCorporate.map((option, index) => (
+                      <option key={index} value={option.value}>
+                        {option.label}
+                      </option>
+                    ))}
+                  </RHFSelect>
+                ) : null)}
 
-
+                <LoadingButton
-                          <LoadingButton type="submit" variant="contained" size="large" fullWidth={true} loading={isSubmitting}>
+                  type="submit"
-                              { isEdit? 'Update' : 'Create' }
+                  variant="contained"
+                  size="large"
+                  fullWidth={true}
+                  loading={isSubmitting}
+                >
+                  {isEdit ? 'Update' : 'Create'}
                 </LoadingButton>
-
               </Stack>
             </Card>
           </Grid>