update kalkulator, edit benefit item, dan delete benefit item

Modules/Internal/Http/Controllers/Api/ClaimRequestController.php

@@ -231,13 +231,13 @@ class ClaimRequestController extends Controller
     {
         $claimRequest = ClaimRequest::findOrFail($id);
         $claimRequest->load([
-            'histories' => function ($history) {
+            'requestLog',
-                $history->latest();
+            'requestLog.organization',
+            'requestLog.member',
+            'member.currentPlan' => function($memberPlan) {
+                $memberPlan->join('claim_requests', 'claim_requests.service_code', '=', 'plans.service_code');
             },
-            'files',
+            'requestLog.files',
-            'member',
-            'claim',
-            'organization',
         ]);
 
         return Helper::responseJson(data: ClaimRequestShowResource::make($claimRequest));

Modules/Internal/Http/Controllers/Api/RequestLogBenefitController.php

@@ -74,6 +74,7 @@ class RequestLogBenefitController extends Controller
                         'excess_paid' => $value['excess_paid'],
                         'keterangan' => $value['keterangan'],
                         'created_by' => auth()->user()->id,
+                        'reason' => $value['reason'] ? $value['reason'] : null ,
 
                     ];
                     // Insert Data
@@ -121,6 +122,7 @@ class RequestLogBenefitController extends Controller
         $requestLogBenefit->keterangan = $request->keterangan;
         $requestLogBenefit->updated_by = auth()->user()->id;
         $requestLogBenefit->updated_at = Carbon::now();
+        $requestLogBenefit->reason = $request->reason;
 
         $requestLogBenefit->save();
       
@@ -136,10 +138,14 @@ class RequestLogBenefitController extends Controller
      * @param int $id
      * @return Renderable
      */
-    public function destroy($id)
+    public function destroy(Request $request, $id)
     {
        $requestLogBenefit = RequestLogBenefit::findOrFail($id);
-       $requestLogBenefit->delete();
+       $requestLogBenefit->reason = 'Reason Delete ' .$request->reason;
+       $requestLogBenefit->deleted_at = Carbon::now();
+       $requestLogBenefit->deleted_by = auth()->user()->id;
+
+       $requestLogBenefit->save();
     }
     
 }

Modules/Internal/Routes/api.php

@@ -278,7 +278,7 @@ Route::prefix('internal')->group(function () {
         
         // insert benefit
         Route::post('customer-service/request/insert-benefit', [RequestLogBenefitController::class, 'store']);
-        Route::delete('customer-service/request/benefit_data/{id}', [RequestLogBenefitController::class, 'destroy']);
+        Route::post('customer-service/request/benefit_data/{id}', [RequestLogBenefitController::class, 'destroy']);
         Route::put('customer-service/request/benefit_data/{id}', [RequestLogBenefitController::class, 'update']);
         
         // insert medicine

Modules/Internal/Transformers/ClaimRequestShowResource.php

@@ -35,23 +35,50 @@ class ClaimRequestShowResource extends JsonResource
 
         $benefitData = [];
 
+        $total_amount_incurred = 0;
+        $total_amount_approved = 0;
+        $total_amount_not_approved = 0;
+        $total_excess_paid = 0;
+
         if (count($benefit)){
             foreach($benefit as $row){
                 array_push($benefitData, $row['benefit']);
             }
         }
 
+        if (count($benefitDetailLog)){
+            foreach($benefitDetailLog as $row){
+                $total_amount_incurred += $row['amount_incurred'];
+                $total_amount_approved += $row['amount_approved'];
+                $total_amount_not_approved += $row['amount_not_approved'];
+                $total_excess_paid += $row['excess_paid'];
+            }
+        }
+
         // Policy Number
         $policyNumber = CorporatePolicy::query()
             ->where('corporate_id', $corporateId)
             ->first();
 
+        $requestLogData = [
+            'id' => $data['request_log_id'],
+            'benefit' => $benefitData,
+            'benefit_data' => $benefitDetailLog,
+            'total_amount_incurred' => $total_amount_incurred,
+            'total_amount_approved' => $total_amount_approved,
+            'total_amount_not_approved' => $total_amount_not_approved,
+            'total_amount_incurred' => $total_amount_incurred,
+            'total_excess_paid' => $total_excess_paid,
+        ];
+
         
         $response = [
             'id' => $data['id'],
             'code' => $data['code'],
             'request_log_id' => $data['request_log_id'],
+            'request_log' => $requestLogData,
             'provider' => $data['request_log']['organization']['name'],
+            'provider_code' => $data['request_log']['organization']['code'],
             'member_id' => $data['request_log']['member']['member_id'],
             'policy_number' => $policyNumber->code ? $policyNumber->code : '-',
             'name' => $data['request_log']['member']['name'],
@@ -71,8 +98,7 @@ class ClaimRequestShowResource extends JsonResource
             'service_type' => Helper::serviceName( $data['request_log']['service_code']),
             'claim_method' =>  $data['request_log']['payment_type'],
             'files' => $data['request_log']['files'],
-            'benefit' => $benefitData,
+            // 'benefit_data' => $benefitDetailLog,
-            'benefit_data' => $benefitDetailLog,
         ];
 
 

database/migrations/2024_02_21_152813_add_coloumn_to_request_log_benefit_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('request_log_benefits', function (Blueprint $table) {
+            $table->string('reason')->nullable()->after('keterangan');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('request_log_benefits', function (Blueprint $table) {
+            $table->dropColumn('reason');
+        });
+    }
+};

database/migrations/2024_02_22_151335_add_coloumn_to_request_log_benefit_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('request_log_benefits', function (Blueprint $table) {
+            $table->softDeletes();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('request_log_benefits', function (Blueprint $table) {
+            $table->dropSoftDeletes(); 
+        });
+    }
+};

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

@@ -17,6 +17,7 @@ export type ClaimRequest = {
     claim: {
       organization: Organizations
     }
+    provider_code: string,
     organization: {
       code: string
     }

frontend/dashboard/src/pages/ClaimRequests/Components/FormEdit.tsx

@@ -68,11 +68,11 @@ export default function FormEdit({ isEdit, currentClaim }: Props) {
     () => ({
       id: currentClaim?.id || '-',
       code: currentClaim?.code || '-',
-      member_name: currentClaim?.member?.name || '-',
+      member_name: currentClaim?.name || '-',
       date: currentClaim?.submission_date ? fDateTimesecond(currentClaim?.submission_date) : '-',
-      claim_method: currentClaim?.payment_type || '-',
+      claim_method: currentClaim?.claim_method || '-',
-      service_type: currentClaim?.service_code || '-',
+      service_type: currentClaim?.service_type || '-',
-      organization_id: currentClaim?.organization?.code || '-',
+      organization_id: currentClaim?.provider_code || '-',
     }),
     [currentClaim]
   );
@@ -197,7 +197,7 @@ export default function FormEdit({ isEdit, currentClaim }: Props) {
                   </Stack>
                   <Stack direction='row' spacing={2} sx={marginBottom1}>
                       <Typography variant='subtitle2' sx={style1} gutterBottom>Name</Typography>
-                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.member?.name}</Typography>
+                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.name}</Typography>
                   </Stack>
                   <Stack direction='row' spacing={2} sx={marginBottom1}>
                       <Typography variant='subtitle2' sx={style1} gutterBottom>Date of Submission</Typography>
@@ -205,15 +205,15 @@ export default function FormEdit({ isEdit, currentClaim }: Props) {
                   </Stack>
                   <Stack direction='row' spacing={2} sx={marginBottom1}>
                       <Typography variant='subtitle2' sx={style1} gutterBottom>Claim Method</Typography>
-                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.payment_type}</Typography>
+                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.claim_method}</Typography>
                   </Stack>
                   <Stack direction='row' spacing={2} sx={marginBottom1}>
                       <Typography variant='subtitle2' sx={style1} gutterBottom>Service Type</Typography>
-                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.service_name || '-'}</Typography>
+                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.service_type || '-'}</Typography>
                   </Stack>
                   <Stack direction='row' spacing={2} sx={marginBottom1}>
                       <Typography variant='subtitle2' sx={style1} gutterBottom>Code Provider</Typography>
-                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.organization?.code || '-'}</Typography>
+                      <Typography variant='subtitle2' sx={style2} gutterBottom>{currentClaim?.provider_code || '-'}</Typography>
                   </Stack>
               </Card>
               <Card sx={{padding:2, marginTop:2}}  >

frontend/dashboard/src/pages/ClaimRequests/Detail.tsx

@@ -28,13 +28,17 @@ import { fDateTimesecond } from '@/utils/formatTime';
 import { makeFormData } from '@/utils/jsonToFormData';
 
 import { enqueueSnackbar } from 'notistack';
-import { DetailClaimRequest } from './Model/Types';
+import { BenefitData, DetailClaimRequest } from './Model/Types';
 import { Delete, EditOutlined } from '@mui/icons-material';
 import { fNumber } from '@/utils/formatNumber';
 import palette from '@/theme/palette';
 import MoreMenu from '@/components/MoreMenu';
 import DialogUploadFileFinalLog from './Components/DialogUploadFileFinalLog';
 import DialogDeleteFileLog from './Components/DialogDeleteFileLog';
+import DialogBenefit from '../CustomerService/FinalLog/Components/DialogBenefit';
+import DialogDeleteBenefit from '../CustomerService/FinalLog/Components/DialogDeleteBenefit';
+import DialogEditBenefit from '../CustomerService/FinalLog/Components/DialogEditBenefit';
+
 
 // ----------------------------------------------------------------------
 
@@ -80,10 +84,10 @@ export default function Detail() {
         marginBottom: 1,
     }
 
-    const [openDialogSubmit, setOpenDialogSubmit] = useState(false);
+  
-    const handleCloseDialogSubmit = () => {
+    // Handle Add Benefit
-        setOpenDialogSubmit(false);
+    const [openDialogBenefit, setDialogBenefit] = useState(false);
-    }
+
     const [approve, setApprove] = useState('');
 
     // Handle Delete File LOG
@@ -94,19 +98,28 @@ export default function Detail() {
     const [dialogUploadFileLog, setDialogUploadFileLog] = useState(false)
 
     // Buat total data 
-    const totalAmountIncurred = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
+    // const totalAmountIncurred = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
-        return accumulator + (item.amount_incurred || 0);
+    //     return accumulator + (item.amount_incurred || 0);
-      }, 0);
+    //   }, 0);
-    const totalAmountApprove = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
+    const totalAmountIncurred = claimRequests?.request_log?.total_amount_incurred;
-        return accumulator + (item.amount_approved || 0);
+    const totalAmountApproved = claimRequests?.request_log?.total_amount_approved;
-      }, 0);
+    const totalAmountNotApproved = claimRequests?.request_log?.total_amount_not_approved
-    const totalAmountNotApprove = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
+    const totalExcessPaid = claimRequests?.request_log?.total_excess_paid
-        return accumulator + (item.amount_not_approved || 0);
+
-      }, 0);
+    // Handle Delete Detail Benefit
-    const totalExcessPaid = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
+    const [idBenefitData, setIdBenefitData] = useState<number>();
-        return accumulator + (item.excess_paid || 0);
+    const [openDialogDeleteBenefit, setDialogDeleteBenefit] = useState(false)
-      }, 0);
+   
-      
+    // Handle Edit Detail Benefit
+    const [openDialogEditBenefit, setDialogEditBenefit] = useState(false)
+    const [BenefitConfigurationData, setBenefitConfigurationData] = useState<BenefitData>();
+  
+    const total = {
+        totalAmountIncurred :  totalAmountIncurred,
+        totalAmountApproved :  totalAmountApproved,
+        totalAmountNotApproved :  totalAmountNotApproved,
+        totalExcessPaid :  totalExcessPaid,
+    }     
     return (
     <Page title='Detail'>
          <Container maxWidth={themeStretch ? false : 'xl'}>
@@ -269,14 +282,14 @@ export default function Detail() {
                         <Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
                             <Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Benefit</Typography>
                                 <Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}}  onClick={() => {
-                                    // setDialogBenefit(true);
+                                    setDialogBenefit(true);
                                 }} >
                                     <Typography variant="button" display="block">Benefit</Typography>
                                 </Button>
                         </Stack>
 
                         <Box sx={{ border: '1px solid rgba(0,0,0,0.125)', px: '24px', py: '20px', marginBottom: '24px', borderRadius: '12px'}}> 
-                        {claimRequests?.benefit_data?.map((item, index) => (
+                        {claimRequests?.request_log?.benefit_data?.map((item, index) => (
                             <Grid container spacing={2}>
                                 <Grid item xs={12}>
                                     <Grid container >
@@ -289,17 +302,17 @@ export default function Detail() {
                                             <MoreMenu actions={
                                                 <>
                                                     <MenuItem onClick={() => {
-                                                            // setDialogEditBenefit(true)
+                                                            setDialogEditBenefit(true)
-                                                            // setIdBenefitData(item.id)
+                                                            setIdBenefitData(item.id)
-                                                            // setBenefitConfigurationData(item)
+                                                            setBenefitConfigurationData(item)
                                                         }}
                                                     >
                                                         <EditOutlined />
                                                         Edit
                                                     </MenuItem>
                                                     <MenuItem onClick={() => {
-                                                        // setIdBenefitData(item.id)
+                                                        setIdBenefitData(item.id)
-                                                        // setDialogDeleteBenefit(true)
+                                                        setDialogDeleteBenefit(true)
                                                     }}
                                                     >
                                                         <Delete color='error'/>
@@ -367,7 +380,7 @@ export default function Detail() {
                                                 <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
                                                     <Grid item xs={12}>
                                                         <Typography variant="caption">
-                                                            Excess Paid*
+                                                            Excess Paid
                                                         </Typography>
                                                     </Grid>
                                                     <Grid item xs={12}>
@@ -383,7 +396,7 @@ export default function Detail() {
                                                 <Grid container>
                                                     <Grid item xs={12}>
                                                         <Typography variant="caption">
-                                                            Keterangan*
+                                                            Keterangan
                                                         </Typography>
                                                     </Grid>
                                                     <Grid item xs={12}>
@@ -402,95 +415,95 @@ export default function Detail() {
                         ))}
                         <hr />
                         <br />
-                    {claimRequests?.benefit_data && claimRequests.benefit_data.length > 0 ? (
+                        {claimRequests?.request_log?.benefit_data && claimRequests?.request_log?.benefit_data.length > 0 ? (
-                        
+                            
-                        <Grid container spacing={2}>
+                            <Grid container spacing={2}>
-                            <Grid item xs={12}>
+                                <Grid item xs={12}>
-                                <Grid container spacing={2}>
+                                    <Grid container spacing={2}>
-                                    <Grid item xs={6}>
+                                        <Grid item xs={6}>
-                                        <Typography variant="body2" sx={{ fontWeight: 'bold'}}>
+                                            <Typography variant="body2" sx={{ fontWeight: 'bold'}}>
-                                            Total Benefit
+                                                Total Benefit
-                                        </Typography>
+                                            </Typography>
+                                        </Grid>
+                                        
                                     </Grid>
-                                    
                                 </Grid>
+                                <Grid item xs={12}>
+                                    <Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
+                                        <Grid container spacing={1}>
+
+                                            {/* Amount Incurred */}
+                                            <Grid item xs={2}>
+                                                <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption">
+                                                            Amount Incurred
+                                                        </Typography>
+                                                    </Grid>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
+                                                            {totalAmountIncurred ? fNumber(totalAmountIncurred) : '0'}
+                                                        </Typography>
+                                                    </Grid>
+                                                </Grid>
+                                            </Grid>
+
+                                            {/* Amount Approved */}
+                                            <Grid item xs={2}>
+                                                <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption">
+                                                            Amount Approved
+                                                        </Typography>
+                                                    </Grid>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
+                                                            {totalAmountApproved ? fNumber(totalAmountApproved) : '0'}
+                                                        </Typography>
+                                                    </Grid>
+                                                </Grid>
+                                            </Grid>
+
+                                            {/* Amount Not Approved */}
+                                            <Grid item xs={3}>
+                                                <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption">
+                                                            Amount Not Approved
+                                                        </Typography>
+                                                    </Grid>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
+                                                            {totalAmountNotApproved ? fNumber(totalAmountNotApproved) : 0}
+                                                        </Typography>
+                                                    </Grid>
+                                                </Grid>
+                                            </Grid>
+
+                                            {/* Excess Paid* */}
+                                            <Grid item xs={2}>
+                                                <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption">
+                                                            Excess Paid
+                                                        </Typography>
+                                                    </Grid>
+                                                    <Grid item xs={12}>
+                                                        <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
+                                                            {totalExcessPaid ? fNumber(totalExcessPaid) : 0}
+                                                        </Typography>
+                                                    </Grid>
+                                                </Grid>
+                                            </Grid>
+                                        </Grid>
+                                    </Box>
+                                </Grid>
+                            
                             </Grid>
-                            <Grid item xs={12}>
+                        ) 
-                                <Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
+                        : (
-                                    <Grid container spacing={1}>
+                            null
-
+                        )}  
-                                        {/* Amount Incurred */}
-                                        <Grid item xs={2}>
-                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption">
-                                                        Amount Incurred
-                                                    </Typography>
-                                                </Grid>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
-                                                        {fNumber(totalAmountIncurred)}
-                                                    </Typography>
-                                                </Grid>
-                                            </Grid>
-                                        </Grid>
-
-                                        {/* Amount Approved */}
-                                        <Grid item xs={2}>
-                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption">
-                                                        Amount Approved
-                                                    </Typography>
-                                                </Grid>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
-                                                        {fNumber(totalAmountApprove)}
-                                                    </Typography>
-                                                </Grid>
-                                            </Grid>
-                                        </Grid>
-
-                                        {/* Amount Not Approved */}
-                                        <Grid item xs={3}>
-                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption">
-                                                        Amount Not Approved
-                                                    </Typography>
-                                                </Grid>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
-                                                        {fNumber(totalAmountNotApprove)}
-                                                    </Typography>
-                                                </Grid>
-                                            </Grid>
-                                        </Grid>
-
-                                        {/* Excess Paid* */}
-                                        <Grid item xs={2}>
-                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption">
-                                                        Excess Paid
-                                                    </Typography>
-                                                </Grid>
-                                                <Grid item xs={12}>
-                                                    <Typography variant="caption" sx={{ fontWeight: 'bold' }}>
-                                                        {fNumber(totalExcessPaid)}
-                                                    </Typography>
-                                                </Grid>
-                                            </Grid>
-                                        </Grid>
-                                    </Grid>
-                                </Box>
-                            </Grid>
-                        
-                        </Grid>
-                    ) 
-                    : (
-                        null
-                    )}  
                         </Box>  
                     </Card>
 
@@ -500,26 +513,28 @@ export default function Detail() {
                     >
 
                     </CardBenefit> */}
-                    {/* <DialogBenefit
+                    <DialogBenefit
-                        requestLog={requestLog}
+                        requestLog={claimRequests?.request_log}
                         openDialog={openDialogBenefit}
                         setOpenDialog={setDialogBenefit}
+                        claimInput={true}
                         
                     />
                     {/* Dialog Edit */}
-                    {/* <DialogEditBenefit
+                    <DialogEditBenefit
                         id={idBenefitData}
                         data={BenefitConfigurationData}
                         openDialog={openDialogEditBenefit}
                         setOpenDialog={setDialogEditBenefit}
-                    /> */}
+                        total={total}
+                    />
 
                     {/* Dialog Delete */}
-                    {/* <DialogDeleteBenfit 
+                    <DialogDeleteBenefit 
                         id={idBenefitData}
                         openDialog={openDialogDeleteBenefit}
                         setOpenDialog={setDialogDeleteBenefit}
-                    /> */}
+                    />
 
                     {/* Dialog Edit Detai; */}
                     {/* <DialogEditFinalLOG 

frontend/dashboard/src/pages/ClaimRequests/Model/Functions.tsx

@@ -2,6 +2,7 @@ import axios from '@/utils/axios';
 import { enqueueSnackbar } from 'notistack';
 import { MemberListType } from './Types';
 import { makeFormData } from '@/utils/jsonToFormData';
+import { BenefitConfigurationListType } from '@/pages/CustomerService/FinalLog/Model/Types';
 
 /**
  * Listing Member
@@ -77,3 +78,76 @@ export const addClaimRequest = async ( data: MemberListType[] ): Promise<boolean
 
     return response;
 };
+
+/**
+ * Add Benefit
+ */
+
+export const postAddBenefit = async (data: BenefitConfigurationListType):Promise<boolean> => {
+    const response = await axios.post(`customer-service/request/insert-benefit`, {
+       ...data 
+    })
+    .then((res) =>{
+        enqueueSnackbar(res.data.message, {
+            variant: 'success',
+        });
+
+        return true;
+    })
+    .catch((res) => {
+        if (res.response.status == 400) {
+            let arr_message = res.response.data.message;
+
+            // for (const key in arr_message) {
+                enqueueSnackbar(arr_message, {
+                    variant: 'warning',
+                });
+            // }
+        }
+        else {
+            enqueueSnackbar("server error !", {
+                variant: 'error',
+            });
+        }
+
+        return false;
+    });
+
+    return response;
+}
+
+/**
+ * Edit Benefit
+ */
+export const postEditBenefit = async (id:number|undefined, data: BenefitConfigurationListType):Promise<boolean> => {
+    const response = await axios.put(`customer-service/request/benefit_data/${id}`, {
+       ...data 
+    })
+    .then((res) =>{
+        enqueueSnackbar(res.data.message, {
+            variant: 'success',
+        });
+
+        return true;
+    })
+    .catch((res) => {
+        if (res.response.status == 400) {
+            let arr_message = res.response.data.message;
+
+            // for (const key in arr_message) {
+                enqueueSnackbar(arr_message, {
+                    variant: 'warning',
+                });
+            // }
+        }
+        else {
+            enqueueSnackbar("server error !", {
+                variant: 'error',
+            });
+        }
+
+        return false;
+    });
+
+    return response;
+}

frontend/dashboard/src/pages/ClaimRequests/Model/Types.tsx

@@ -1,3 +1,5 @@
+import { Member } from "@/@types/member"
+
 /**
  * Search Type
  */
@@ -48,6 +50,45 @@ export type DetailClaimRequest = {
     files               : file[],
     benefit_data        : BenefitData[],
     diagnosis           : Diagnosis[],
+    request_log         : RequestLogType | undefined,
+}
+
+export type RequestLogType = {
+    id                  : number,
+    code                : string,
+    member              : Member,
+    submission_date     : string,
+    admission_date      : string,
+    service_name        : string,
+    provider            : string,
+    member_name         : string,
+    payment_type_name   : string,
+    status_final_log    : string,
+    status              : string,
+    files_by_type       : files_by_type,
+    total_amount_incurred : number | undefined,
+    total_amount_approved : number | undefined,
+    total_amount_not_approved : number | undefined,
+    total_excess_paid : number | undefined,
+    benefit_data : benefit_data[] | undefined
+}
+
+export type benefit_data = {
+    benefit : {
+        description : string
+    },
+    id : number,
+    amount_incurred : number,
+    amount_approved : number,
+    amount_not_approved : number,
+    excess_paid : number,
+    keterangan : string,
+}
+
+export type files_by_type = {
+    claim_diagnosis : file[],
+    claim_kondisi : file[],
+    claim_result : file[],
 }
 
 export type Benefit = {

frontend/dashboard/src/pages/CustomerService/FinalLog/Components/DialogBenefit.tsx

@@ -2,7 +2,7 @@ import * as Yup from 'yup';
 import { yupResolver } from '@hookform/resolvers/yup';
 
 import MuiDialog from "@/components/MuiDialog";
-import { Checkbox, Typography, FormControl, Card, Grid, DialogActions } from "@mui/material";
+import { Checkbox, Typography, FormControl, Card, Grid, DialogActions, IconButton, Autocomplete } from "@mui/material";
 import { Paper } from "@mui/material";
 import { Stack } from '@mui/material';
 import React, { useEffect, useState } from 'react';
@@ -18,11 +18,14 @@ import { Box } from "@mui/material";
 import { FormProvider, RHFTextField } from "@/components/hook-form";
 import RHFTextFieldMoney from '@/components/hook-form/v2/RHFTextFieldMoney';
 
-import { useFieldArray, useForm } from 'react-hook-form';
+import { useFieldArray, useForm, useWatch } from 'react-hook-form';
 import { LoadingButton } from '@mui/lab';
 import { postAddBenefit } from '../Model/Functions';
 import { useNavigate } from 'react-router';
 import { description } from '@/_mock/text';
+import { Delete } from '@mui/icons-material';
+import { TextField } from '@mui/material';
+import RHFAutocomplete from '@/components/hook-form/RHFAutocomplete';
 
 
 type DialogConfirmationType = {
@@ -30,6 +33,7 @@ type DialogConfirmationType = {
     setOpenDialog: any;
     onSubmit?: void;
     requestLog: DetailFinalLogType|undefined; 
+    claimInput:boolean
 }
 
 type BenefitSelected = {
@@ -40,7 +44,7 @@ type BenefitSelected = {
 
 
 
-export default function DialogBenefit({requestLog, setOpenDialog, openDialog } : DialogConfirmationType ) {
+export default function DialogBenefit({requestLog, setOpenDialog, openDialog, claimInput = false } : DialogConfirmationType ) {
 
     // Add Benefit 
     const [addBenefit, setAddBenefit] = useState(false)
@@ -63,9 +67,13 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
         }
     };
 
+    const reasons = [
+        { value: 'Wrong Setting', label: 'Wrong Setting' },
+        { value: 'Hospital Request', label: 'Hospital Request' }
+    ];
+
     useEffect(() => {
         const datax: any[] = []
-
         valBenefitNames.map((data) => {
             benefitNameData?.map((row) => {
                 if(row.id == data) {
@@ -85,15 +93,16 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                 amount_not_approved: 0,
                 excess_paid: 0,
                 keterangan: '',
+                reason: null
             }
         })
     
         reset({benefit_data: temp})
 
         setBenefitSelected(datax)
-        
     }, [valBenefitNames])
 
+
     const handleCloseDialogBenefit = () => {
         // setOpenDialog(false);
         setAddBenefit(false)
@@ -112,10 +121,19 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
         amount_approved: 0,
         amount_not_approved: 0,
         excess_paid: 0,
+        reason: null
     };
 
     const validationSchema = Yup.object().shape({
         benefit_data: Yup.array().of(
+            claimInput ? 
+            Yup.object().shape({
+                amount_incurred     : Yup.number().typeError('').required(''),
+                amount_approved     : Yup.number().typeError('').required(''),
+                amount_not_approved : Yup.number().typeError('').required(''),
+                excess_paid         : Yup.number().typeError('').required(''),
+                // reason              : Yup.string().required(''),
+            }) : 
             Yup.object().shape({
                 amount_incurred     : Yup.number().typeError('').required(''),
                 amount_approved     : Yup.number().typeError('').required(''),
@@ -130,14 +148,56 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
         defaultValues
     });
 
-    const {fields, append, remove} = useFieldArray({name: 'benefit_data',control: methods.control})
+    let width = claimInput ? 2 : 2.36;
+
+    const {fields, append, remove} = useFieldArray({name: 'benefit_data',control: methods.control});
+    const { handleSubmit, reset, watch, setValue, formState: { isDirty, isSubmitting, errors } } = methods
+
+    // Buat total data 
+    let totalAmountIncurred = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
+    return accumulator + (item.amount_incurred || 0);
+    }, 0);
+    let totalAmountApproved = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
+    return accumulator + (item.amount_approved || 0);
+    }, 0);
+    let totalAmountNotApproved = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
+    return accumulator + (item.amount_not_approved || 0);
+    }, 0);
+    let totalExcessPaid = (requestLog?.benefit_data || []).reduce((accumulator, item) => {
+    return accumulator + (item.excess_paid || 0);
+    }, 0);
+    const benefitData = watch('benefit_data');
+    const [isDisableSave, setDisableSave] = useState(false)
+    
+    benefitData?.map((item, index) => {
+        totalAmountIncurred += parseFloat(item.amount_incurred);
+        totalAmountApproved += parseFloat(item.amount_approved);
+        totalAmountNotApproved += parseFloat(item.amount_not_approved);
+        totalExcessPaid += parseFloat(item.excess_paid);
+
+        if (totalAmountApproved != 0 && totalAmountIncurred != 0) {
+            if (totalAmountApproved > totalAmountIncurred){
+                setValue(`benefit_data.${index}.amount_approved`, 0)
+                alert('Total Amount Approved tidak boleh lebih dari Total Incurred')
+            }
+        } 
+
+    });
     
-    const { handleSubmit, reset, watch, setValue, formState: { isDirty, isSubmitting, errors } } = methods;
     // Submit Form
     // =====================================
     const submitHandler = async (data: BenefitConfigurationListType) => {
-    
+        const mapData = data.benefit_data.map((item) => ({
-        const response = await postAddBenefit(data);
+            ...item,
+            reason: item.reason.value
+        }));
+        
+        const newData = {
+            ...data,
+            benefit_data: mapData
+        };
+        
+        const response = await postAddBenefit(newData);
 
         if (response == true) {
             reset();
@@ -146,6 +206,8 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
         }
     }
 
+    // Calculate 
+
     const getContent = () => !addBenefit ? (
         <Stack spacing={2} sx={{marginTop: 2, padding: 2}} direction="column">
             <Stack direction="row" spacing={2}>
@@ -198,14 +260,14 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                 {fields?.map((item, index) => 
                 (
                     <Box sx={{ marginTop:'10px', marginBottom:'10px', py: '8px', px: '12px', border:'1px solid #919EAB52', borderRadius: '6px'}}>                    
-                            <Grid key={item.id} container spacing={2}>
+                            <Grid key={item.id} container spacing={2} alignItems="center">
                                 <Grid item xs={12}>
                                     <Typography variant="subtitle1" sx={{ fontWeight: 'bold'}}>
                                         {item.description}
                                     </Typography>
                                    
                                 </Grid>
-                                <Grid item xs={2.5}>
+                                <Grid item xs={width}>
                                     <Grid container spacing={2}>
                                         <Grid item xs={12}>
                                             <Typography variant="subtitle1" component="div">
@@ -224,7 +286,7 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                                     </Grid>
                                 </Grid>
 
-                                <Grid item xs={2.5}>
+                                <Grid item xs={width}>
                                     <Grid container spacing={2}>
                                         <Grid item xs={12}>
                                             <Typography variant="subtitle1" component="div">
@@ -244,7 +306,7 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                                     </Grid>
                                 </Grid>
 
-                                <Grid item xs={2.5}>
+                                <Grid item xs={width}>
                                     <Grid container spacing={2}>
                                         <Grid item xs={12}>
                                             <Typography variant="subtitle1" component="div">
@@ -264,7 +326,7 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                                     </Grid>
                                 </Grid>
 
-                                <Grid item xs={2.5}>
+                                <Grid item xs={width}>
                                     <Grid container spacing={2}>
                                         <Grid item xs={12}>
                                             <Typography variant="subtitle1" component="div">
@@ -288,7 +350,7 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                                     <Grid container spacing={2}>
                                         <Grid item xs={12}>
                                             <Typography variant="subtitle1" component="div">
-                                                Keterangan*
+                                                Keterangan
                                             </Typography>
                                         </Grid>
                                         <Grid item xs={12} sx={{display: 'flex', gap: 1}}>
@@ -298,21 +360,146 @@ export default function DialogBenefit({requestLog, setOpenDialog, openDialog } :
                                                 key={item.id}
                                                 name={`benefit_data.${index}.keterangan`}
                                                 placeholder='Keterangan'
-                                                required
                                             />
                                         </Grid>
                                     </Grid>
                                 </Grid>
+                                {claimInput ? (
+                                    <Grid item xs={1.4}>
+                                        <Grid container spacing={2}>
+                                            <Grid item xs={12}>
+                                                <Typography variant="subtitle1" component="div">
+                                                    Reason*
+                                                </Typography>
+                                            </Grid>
+                                            <Grid item xs={12} sx={{display: 'flex', gap: 1}}>
+                                            <Autocomplete
+                                                options={reasons}
+                                                getOptionLabel={(option) => option.label}
+                                                fullWidth
+                                                value={benefitData[index]?.reason} // Use find to match the default value
+                                                onChange={(event, newValue) => {
+                                                    // Update the value in the form data
+                                                    setValue(`benefit_data.${index}.reason`, newValue);
+                                                }}
+                                                renderInput={(params) => (
+                                                    <TextField
+                                                        {...params}
+                                                        label="Reason"
+                                                        variant="outlined"
+                                                        required
+                                                    />
+                                                )}
+                                            />
+                                            </Grid>
+
+                                        </Grid>
+                                    </Grid>
+                                ) : null}
+                                { fields.length > 1 ? (
+                                    <Grid item xs={0} sx={{ textAlign: 'center' }}>
+                                        <IconButton size='large' color='error' onClick={() => remove(index)}>
+                                            <Delete />
+                                        </IconButton>
+                                    </Grid>
+                                ) : null }
                         </Grid>
                     </Box>
                 ))}
 
+                <br/>
+                <hr/>
+                <br/>
+                <Grid container spacing={2}>
+                    <Grid item xs={12}>
+                        <Grid container spacing={2}>
+                            <Grid item xs={6}>
+                                <Typography variant="body2" sx={{ fontWeight: 'bold'}}>
+                                    Total Benefit
+                                </Typography>
+                            </Grid>
+                            
+                        </Grid>
+                    </Grid>
+                    <Grid item xs={12}>
+                        <Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
+                            <Grid container spacing={1} alignItems={'end'}>
+                                {/* Amount Incurred */}
+                                <Grid item xs={width}>
+                                    <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                Amount Incurred
+                                            </Typography>
+                                        </Grid>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                {fNumber(totalAmountIncurred)}
+                                            </Typography>
+                                        </Grid>
+                                    </Grid>
+                                </Grid>
+
+                                {/* Amount Approved */}
+                                <Grid item xs={width}>
+                                    <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                Amount Approved
+                                            </Typography>
+                                        </Grid>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                {fNumber(totalAmountApproved)}
+                                            </Typography>
+                                        </Grid>
+                                    </Grid>
+                                </Grid>
+
+                                {/* Amount Not Approved */}
+                                <Grid item xs={width}>
+                                    <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                Amount Not Approved
+                                            </Typography>
+                                        </Grid>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                {fNumber(totalAmountNotApproved)}
+                                            </Typography>
+                                        </Grid>
+                                    </Grid>
+                                </Grid>
+
+                                {/* Excess Paid* */}
+                                <Grid item xs={width}>
+                                    <Grid container>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                Excess Paid
+                                            </Typography>
+                                        </Grid>
+                                        <Grid item xs={12}>
+                                            <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                {fNumber(totalExcessPaid)}
+                                            </Typography>
+                                        </Grid>
+                                    </Grid>
+                                </Grid>
+                            </Grid>
+                        </Box>
+                    </Grid>
+
+                
+                </Grid>
+
                 
                 {/* </Card> */}
                 <DialogActions>
                     <Stack direction="row" sx={{marginTop:3}} alignItems="center" justifyContent="space-between" spacing={2}>
                         <Button variant="outlined" onClick={handleCloseDialogBenefit}><Typography>Cancel</Typography></Button>
-                        <LoadingButton disabled={!addBenefit} type="submit" variant="contained" loading={isSubmitting}>
+                        <LoadingButton disabled={isDisableSave} type="submit" variant="contained"  loading={isSubmitting}>
                             Save
                         </LoadingButton>
                     </Stack>

frontend/dashboard/src/pages/CustomerService/FinalLog/Components/DialogDeleteBenefit.tsx

@@ -1,8 +1,8 @@
 import MuiDialog from "@/components/MuiDialog";
-import { Button, Card, Checkbox, DialogActions, Grid, Typography } from "@mui/material";
+import { Autocomplete, Button, Card, Checkbox, DialogActions, Grid, TextField, Typography } from "@mui/material";
 import { Paper } from "@mui/material";
 import { Stack } from '@mui/material';
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { DetailFinalLogType } from "../Model/Types";
 import { fDateTimesecond, toTitleCase } from "@/utils/formatTime";
 import axios from "@/utils/axios";
@@ -18,9 +18,39 @@ type DialogDeleteType = {
 }
 
 export default function DialogDeleteBenefit({id, setOpenDialog, openDialog,onSubmit} : DialogDeleteType ) {
+    
+    const [formData, setFormData] = useState({
+        reason: null
+    });
+
+    const resetForm = () => {
+        setFormData({
+            reason: null,
+        });
+    };
+
+    useEffect(() => {
+        // Update formData setiap kali approve berubah
+        setFormData(prevData => ({
+          ...prevData,
+        }));
+    }, []);
+
+    const handleChange = (field, value) => {
+        setFormData((prevData) => ({
+            ...prevData,
+            [field]: value,
+        }));
+        if (field === 'reason') {
+            setIsReasonSelected(!!value);
+        }
+
+    };
+    
     const handleSubmit = () => {
-        axios
+        if (isReasonSelected && formData.reason !== '') {
-            .delete(`customer-service/request/benefit_data/${id}`)
+            axios
+            .post(`customer-service/request/benefit_data/${id}`, formData)
             .then((response) => {
                 enqueueSnackbar('Benefit Data has Deleted', { variant: 'success' });
                 setOpenDialog(false);
@@ -29,6 +59,11 @@ export default function DialogDeleteBenefit({id, setOpenDialog, openDialog,onSub
             .catch(({ response }) => {
                 enqueueSnackbar(response.data.message ?? 'Something went wrong!', { variant: 'error' });
             });
+        } else {
+            setIsReasonSelected(false);
+            alert('Silakan pilih alasan sebelum menghapus data.');
+        }
+        
     }
 
     const style1 = {
@@ -38,10 +73,19 @@ export default function DialogDeleteBenefit({id, setOpenDialog, openDialog,onSub
     const style2 = {
         width: '70%'
     }
-    const marginBottom1 = {
+    const marginBottom2 = {
-        marginBottom: 1,
+        marginBottom: 2,
     }
 
+    const [isReasonSelected, setIsReasonSelected] = useState(false);
+   
+    const reasons = [
+        { value: 'agreement', label: 'Agreement changed' },
+        { value: 'endorsement', label: 'Endorsement' },
+        { value: 'renewal', label: 'Renewal' },
+        { value: 'wrong_setting', label: 'Wrong Setting' },
+        // Add more options as needed
+    ];
     const handleCloseDialog = () => {
         setOpenDialog(false);
     }
@@ -49,10 +93,35 @@ export default function DialogDeleteBenefit({id, setOpenDialog, openDialog,onSub
     const getContent = () => (
         <Stack spacing={1} marginTop={2}>
             <Typography variant="subtitle2">Are you sure to delete this detail benefit ?</Typography>
-                <DialogActions>
+            <Grid item xs={12} md={12} marginTop={4}>
-                    <Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialog}>Cancel</Button>
+                <Card sx={{padding:2, marginTop:2}}  >
-                    <Button color="error" variant="contained" onClick={handleSubmit}>Delete</Button>
+                    <Stack direction='row' spacing={2} sx={marginBottom2}>
-                </DialogActions>
+                        <Typography variant='subtitle2' sx={style1} gutterBottom>Reason*</Typography>
+                        <Autocomplete
+                            options={reasons}
+                            getOptionLabel={(option) => option.label}
+                            fullWidth
+                            value={reasons.find((r) => r.value === formData.reason) || null} // Use find to match the default value
+                            onChange={(e, newValue) => handleChange('reason', newValue?.value)}
+                            renderInput={(params) => (
+                                <TextField
+                                    {...params}
+                                    label="Reason"
+                                    variant="outlined"
+                                    required
+                                    error={!isReasonSelected} // Menandai input sebagai salah jika opsi tidak dipilih
+                                    helperText={!isReasonSelected ? 'Alasan harus dipilih' : ''}
+
+                                />
+                            )}
+                        />
+                    </Stack>
+                </Card>
+            </Grid>
+            <DialogActions>
+                <Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialog}>Cancel</Button>
+                <Button color="error" variant="contained" onClick={handleSubmit}>Delete</Button>
+            </DialogActions>
         </Stack>
     );
 

frontend/dashboard/src/pages/CustomerService/FinalLog/Components/DialogEditBenefit.tsx

@@ -2,7 +2,7 @@ import * as Yup from 'yup';
 import { yupResolver } from '@hookform/resolvers/yup';
 
 import MuiDialog from "@/components/MuiDialog";
-import { Box, Button, Card, Checkbox, DialogActions, Grid, Typography } from "@mui/material";
+import { Autocomplete, Box, Button, Card, Checkbox, DialogActions, Grid, TextField, Typography } from "@mui/material";
 import { Paper } from "@mui/material";
 import { Stack } from '@mui/material';
 import React, { useEffect, useState } from 'react';
@@ -17,6 +17,9 @@ import { useForm } from 'react-hook-form';
 import { FormProvider, RHFTextField } from "@/components/hook-form";
 import RHFTextFieldMoney from "@/components/hook-form/v2/RHFTextFieldMoney";
 import { LoadingButton } from "@mui/lab";
+import { find } from 'lodash';
+import { fNumber } from '@/utils/formatNumber';
+import palette from '@/theme/palette';
 
 
 type DialogDeleteType = {
@@ -25,9 +28,10 @@ type DialogDeleteType = {
     onSubmit?: void;
     data: BenefitConfigurationListType|undefined; 
     id: number|undefined;
+    total: any
 }
 
-export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,onSubmit} : DialogDeleteType ) { 
+export default function DialogEditBenefit({id, data, setOpenDialog, openDialog, onSubmit, total} : DialogDeleteType ) { 
     const handleCloseDialog = () => {
         setOpenDialog(false);
     }
@@ -42,7 +46,8 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
         amount_not_approved: 0,
         excess_paid: 0,
         keterangan: '-',
-        description: '-'
+        description: '-',
+        reason: null
     };
 
     const validationSchema = Yup.object().shape({
@@ -59,6 +64,28 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
 
     const { handleSubmit, reset, watch, setValue, formState: { isDirty, isSubmitting, errors } } = methods;
 
+   // Ambil nilai dari form menggunakan watch
+    const amountIncurred = parseFloat(watch('amount_incurred'));
+    const amountApproved = parseFloat(watch('amount_approved'));
+    const amountNotApproved = parseFloat(watch('amount_not_approved'));
+    const excessPaid = parseFloat(watch('excess_paid'));
+
+    // Hitung total baru
+    const totalAmountIncurred = total.totalAmountIncurred - data?.amount_incurred + amountIncurred;
+    const totalAmountApproved = total.totalAmountApproved - data?.amount_approved + amountApproved;
+    const totalAmountNotApproved = total.totalAmountNotApproved - data?.amount_not_approved + amountNotApproved;
+    const totalExcessPaid = total.totalExcessPaid - data?.excess_paid + excessPaid;
+
+    if (totalAmountApproved > totalAmountIncurred) {
+        alert('Total Approve tidak boleh melebihi Total Incurred')
+        setValue('amount_approved', data?.amount_approved)
+    }
+
+    // if (totalAmountIncurred !== (totalAmountApproved+totalAmountNotApproved)){
+    //     // alert('Total Incurred tidak sama dengan Total Approve + Total Not Approve')
+    //     // setValue('amount_approved', data?.amount_approved)
+    // }
+    
     // Submit Form
     // =====================================
     const submitHandler = async (data: BenefitConfigurationListType) => {
@@ -72,6 +99,11 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
         }
     }
 
+    const reasons = [
+        { value: 'Wrong Setting', label: 'Wrong Setting' },
+        { value: 'Hospital Request', label: 'Hospital Request' }
+    ];
+
      // Set Value Form
     // =====================================
     useEffect(() => {
@@ -80,8 +112,10 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
         setValue('amount_not_approved', data?.amount_not_approved)
         setValue('excess_paid', data?.excess_paid)
         setValue('keterangan', data?.keterangan)
+        setValue('reason', data?.reason)
     }, [data])
-
+    
+    
     const getContent = () => (
         <FormProvider methods={methods} onSubmit={handleSubmit(submitHandler)}>
             <Stack paddingX={2} paddingY={4}>
@@ -94,7 +128,7 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                 </Typography>
                                 
                             </Grid>
-                            <Grid item xs={2.5}>
+                            <Grid item xs={2}>
                                 <Grid container spacing={2}>
                                     <Grid item xs={12}>
                                         <Typography variant="subtitle1" component="div">
@@ -113,7 +147,7 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                 </Grid>
                             </Grid>
 
-                            <Grid item xs={2.5}>
+                            <Grid item xs={2}>
                                 <Grid container spacing={2}>
                                     <Grid item xs={12}>
                                         <Typography variant="subtitle1" component="div">
@@ -133,7 +167,7 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                 </Grid>
                             </Grid>
 
-                            <Grid item xs={2.5}>
+                            <Grid item xs={2}>
                                 <Grid container spacing={2}>
                                     <Grid item xs={12}>
                                         <Typography variant="subtitle1" component="div">
@@ -153,7 +187,7 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                 </Grid>
                             </Grid>
 
-                            <Grid item xs={2.5}>
+                            <Grid item xs={2}>
                                 <Grid container spacing={2}>
                                     <Grid item xs={12}>
                                         <Typography variant="subtitle1" component="div">
@@ -177,7 +211,7 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                 <Grid container spacing={2}>
                                     <Grid item xs={12}>
                                         <Typography variant="subtitle1" component="div">
-                                            Keterangan*
+                                            Keterangan
                                         </Typography>
                                     </Grid>
                                     <Grid item xs={12} sx={{display: 'flex', gap: 1}}>
@@ -187,11 +221,116 @@ export default function DialogEditBenefit({id, data, setOpenDialog, openDialog,o
                                             key={id}
                                             name={`keterangan`}
                                             placeholder='Keterangan'
-                                            required
                                         />
                                     </Grid>
                                 </Grid>
                             </Grid>
+                            <Grid item xs={2}>
+                                <Grid container spacing={2}>
+                                    <Grid item xs={12}>
+                                        <Typography variant="subtitle1" component="div">
+                                            Reason*
+                                        </Typography>
+                                    </Grid>
+                                    <Grid item xs={12} sx={{display: 'flex', gap: 1}}>
+                                        <Autocomplete
+                                            options={reasons}
+                                            getOptionLabel={(option) => option.label}
+                                            fullWidth
+                                            value={reasons.find((r) => r.value === watch('reason')) || null}// Use find to match the default value
+                                            onChange={(event, newValue) => {
+                                                setValue(`reason`, newValue?.value);
+                                            }}
+                                            renderInput={(params) => (
+                                                <TextField
+                                                    {...params}
+                                                    label="Reason"
+                                                    variant="outlined"
+                                                    required
+                                                />
+                                            )}
+                                        />
+                                    </Grid>
+                                </Grid>
+                            </Grid>
+                            <Grid item xs={12} marginTop={3}>
+                                <Grid container spacing={2}>
+                                    <Grid item xs={12}>
+                                        <Typography variant="body2" sx={{ fontWeight: 'bold'}}>
+                                            Total Current Benefit
+                                        </Typography>
+                                    </Grid>
+                                </Grid>
+                            </Grid>
+                            <Grid item xs={12}>
+                                <Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
+                                    <Grid container spacing={1} alignItems={'end'}>
+                                        {/* Amount Incurred */}
+                                        <Grid item xs={2}>
+                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                        Amount Incurred
+                                                    </Typography>
+                                                </Grid>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                        {totalAmountIncurred ? fNumber(totalAmountIncurred) : 0}
+                                                    </Typography>
+                                                </Grid>
+                                            </Grid>
+                                        </Grid>
+
+                                        {/* Amount Approved */}
+                                        <Grid item xs={2}>
+                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                        Amount Approved
+                                                    </Typography>
+                                                </Grid>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                        {fNumber(totalAmountApproved)}
+                                                    </Typography>
+                                                </Grid>
+                                            </Grid>
+                                        </Grid>
+
+                                        {/* Amount Not Approved */}
+                                        <Grid item xs={2}>
+                                            <Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                        Amount Not Approved
+                                                    </Typography>
+                                                </Grid>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                        {fNumber(totalAmountNotApproved)}
+                                                    </Typography>
+                                                </Grid>
+                                            </Grid>
+                                        </Grid>
+
+                                        {/* Excess Paid* */}
+                                        <Grid item xs={2}>
+                                            <Grid container>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ textAlign: 'right' }}>
+                                                        Excess Paid
+                                                    </Typography>
+                                                </Grid>
+                                                <Grid item xs={12}>
+                                                    <Typography variant="caption" sx={{ fontWeight: 'bold', textAlign: 'right' }}>
+                                                        {fNumber(totalExcessPaid)}
+                                                    </Typography>
+                                                </Grid>
+                                            </Grid>
+                                        </Grid>
+                                    </Grid>
+                                </Box>
+                            </Grid>
                     </Grid>
                 </Box>
                 {/* </Card> */}

frontend/dashboard/src/pages/CustomerService/FinalLog/Detail.tsx

@@ -133,6 +133,12 @@ export default function Detail() {
         return accumulator + (item.excess_paid || 0);
       }, 0);
       
+    const total = {
+        totalAmountIncurred :  totalAmountIncurred,
+        totalAmountApproved :  totalAmountApprove,
+        totalAmountNotApproved :  totalAmountNotApprove,
+        totalExcessPaid :  totalExcessPaid,
+    }  
     // Handle Delete File LOG
     const [pathFile, setPathFile] = useState('')
     const [dialogDeleteFIleLog, setDialogDeleteFileLog] = useState(false)
@@ -522,6 +528,7 @@ export default function Detail() {
                         data={BenefitConfigurationData}
                         openDialog={openDialogEditBenefit}
                         setOpenDialog={setDialogEditBenefit}
+                        total={total}
                     />
 
                     {/* Dialog Delete */}

frontend/dashboard/src/pages/CustomerService/FinalLog/Model/Types.tsx

@@ -89,6 +89,10 @@ export type BenefitConfigurationListType = {
     excess_paid: number,
     keterangan: string,
     description: string,
+    reason: {
+        value:string,
+        label:string
+    } | null
 }
 
 export type Benefit = {

frontend/dashboard/src/pages/Master/Hospitals/Form.tsx

@@ -237,7 +237,6 @@ export default function OrganizationsForm({ isEdit, currentOrganizations }: Prop
       navigate('/master/hospitals');
     } catch (error: any) {
       if (error && error.response.status === 422) {
-        console.log('error', error.response.data.errors);
         for (const [key, value] of Object.entries(error.response.data.errors)) {
           setError(key, { message: value[0] });
           enqueueSnackbar(value[0] ?? 'Failed Processing Request', { variant: 'error' });
@@ -276,8 +275,6 @@ export default function OrganizationsForm({ isEdit, currentOrganizations }: Prop
     setSelectedCorporateID(corporate_selected)
   }, [defaultValues])
 
-  console.log(corporate_selected, 'test')
-
   const handleSelectChange = (event, selectedOptions:any) => {
     const selectedValues = selectedOptions.map(option => option.value);
     setSelectedCorporateID(selectedValues);