update status function

frontend/dashboard/src/pages/Corporates/Formularium/New/CategoryDetail.tsx

@@ -19,12 +19,18 @@ import { useForm } from 'react-hook-form';
 import * as Yup from 'yup';
 import { CorporateFormulariumList } from "./Types";
 
-export default function CategoryDetail(props: DetailCorpFormularium) {
+type ParamsDetail = {
+  props: DetailCorpFormularium,
+  formularium: CorporateFormulariumList,
+}
+
+export default function CategoryDetail({props, formularium} : ParamsDetail) {
+  
   type FormValuesProps = {
     value: string;
     active: boolean;
   };
-  
+  const { corporate_id } = useParams();
   const [open, setOpen] = React.useState(false);
   const [isDialogOpen, setDialogOpen] = useState(false)
   let titles = {
@@ -59,7 +65,7 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
 
   const onSubmit = async (row : any) => {
     try {
-      handleUpdate(dataValue?.active, dataValue?.id) 
+      handleUpdate(dataValue?.active, dataValue?.id, row.reason) 
     } catch (error: any) {
       console.log('data gagal');
     }
@@ -70,14 +76,19 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
     }
   };
   
-  const handleUpdate = (active: string, id: number) => {
-    console.log(active)
+  const handleUpdate = (active: string, id: number, reason: string) => {
+    if (active == "Active") {
+      active = "0"
+    } else {
+      active = "1"
+    }
+    console.log(corporate_id, id , active)
     axios
-      .put(`/corporates/${id}/formulariums-update-status/${id}`, {
-        active: active, 
-        reason: reason
+      .put(`/corporates/${corporate_id}/formulariums-update-status/${id}`, {
+        active: active,
       })
       .then((res) => {
+        console.log(res.data.message)
         window.location.reload();
       });
   }
@@ -85,7 +96,7 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
   const getContent = () => (
     <>
       <Stack paddingX={2} paddingY={2}>
-        <Typography variant='subtitle1'>Are you sure to {dataValue?.active === "1" ? 'Inactive' : 'Active'} this Formularium ?</Typography>
+        <Typography variant='subtitle1'>Are you sure to {dataValue?.active === "Active" ? 'inactive' : 'active'} this Formularium ?</Typography>
         <Stack>
           <Card>
             <Grid container paddingX={2} paddingY={2}>
@@ -127,7 +138,7 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
                 >
                   Cancel
                 </Button>
-                {dataValue?.active == "1" ?
+                {dataValue?.active == "Active" ?
                   <LoadingButton
                     sx={{boxShadow: '0px 2px 4px rgba(0,0,0,0.1)'}}
                     type='submit'
@@ -167,9 +178,11 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
             <TableCell align='left'>{props.code}</TableCell>
             <TableCell align='left'>{props.name}</TableCell>
             <TableCell align='left' width={100}>
-              <Label color='success'>
-                Active
-              </Label>
+              {formularium.active == "Active" ? (
+                <Label color='success'>Active</Label>
+              ): (
+                <Label color='error'>Inactive</Label>
+              )}
             </TableCell>
             <TableCell align='center' width={100}>
               <TableMoreMenu actions={
@@ -179,11 +192,11 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
                     Detail
                   </MenuItem>
                   <MenuItem onClick={() => handleActivate(true, {
-                    id: 0,
-                    formulaurium_category_id: 0,
-                    category: '-',
-                    description: '-',
-                    active: '1'
+                    id: formularium.id,
+                    formulaurium_category_id: formularium.formulaurium_category_id,
+                    category: formularium.category,
+                    description: formularium.description,
+                    active: formularium.active
                   })
                   }>
                     <CachedOutlined />
@@ -194,13 +207,15 @@ export default function CategoryDetail(props: DetailCorpFormularium) {
             </TableCell>
           </TableRow>
         </TableBody>
-        <TableRow>
-          <TableCell colSpan={5} style={{paddingBottom:0, paddingTop:0}}>
-            <Collapse in={open} timeout='auto' unmountOnExit>
-              <InfoDetail {...props}/>
-            </Collapse>
-          </TableCell>
-        </TableRow>
+        <TableBody>
+          <TableRow>
+            <TableCell colSpan={5} style={{paddingBottom:0, paddingTop:0}}>
+              <Collapse in={open} timeout='auto' unmountOnExit>
+                <InfoDetail {...props}/>
+              </Collapse>
+            </TableCell>
+          </TableRow>
+        </TableBody>
 
         {/* TODO: dialog update status */}
         <DialogUpdateStatus 

frontend/dashboard/src/pages/Corporates/Formularium/New/CategoryRow.tsx

@@ -67,7 +67,7 @@ const CategoryRow: React.FC<CorporateFormulariumList> = (props) => {
                   <TableCell colSpan={5} align="center">No Data</TableCell>
                 ) : (
                   dataRow?.map(item => (
-                    <CategoryDetail {...item}/>
+                    <CategoryDetail props={item} formularium={props}/>
                   ))
                 )}
               </Table>

frontend/dashboard/src/pages/Corporates/Formularium/New/List.tsx

@@ -45,8 +45,6 @@ export default function List() {
     setDataTableLoading(false);
     setDataTableData(resp.data);
     setDataRow(resp.data.data);
-    console.log(dataTableData);
-    console.log(dataRow);
   }
 
   const applyFilter = async (searchFilter: any) => {
@@ -63,6 +61,8 @@ export default function List() {
 
   useEffect(() => {
     loadDataTableData();
+    console.log(dataTableData);
+    console.log(dataRow);
   }, []);
 
   
@@ -140,7 +140,7 @@ export default function List() {
               <Table aria-label="collapsible table">
                 <TableHead>
                   <TableRow>
-                    <TableCell align='left' width={50}/> 
+                    <TableCell align='left' width={50}></TableCell>
                     <TableCell style={headStyle} align="left">Formularium Name</TableCell>
                     <TableCell style={headStyle} align="left">Description</TableCell>
                     <TableCell style={headStyle} align="center" width={100}></TableCell>