Add Service Config

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

@@ -0,0 +1,91 @@
+<?php
+
+namespace Modules\Internal\Http\Controllers\Api;
+
+use App\Helpers\Helper;
+use App\Models\CorporateService;
+use App\Models\CorporateServiceConfig;
+use Illuminate\Contracts\Support\Renderable;
+use Illuminate\Http\Request;
+use Illuminate\Routing\Controller;
+use Modules\Internal\Transformers\CorporateServiceConfigResource;
+
+class CorporateServiceController extends Controller
+{
+    /**
+     * Display a listing of the resource.
+     * @return Renderable
+     */
+    public function index(Request $request, $corporate_id)
+    {
+        $services = CorporateService::with('configs', 'service')->where('corporate_id', $corporate_id)->paginate();
+
+        return Helper::paginateResources(CorporateServiceConfigResource::collection($services));
+    }
+
+    /**
+     * Show the form for creating a new resource.
+     * @return Renderable
+     */
+    public function create()
+    {
+        return view('internal::create');
+    }
+
+    /**
+     * Store a newly created resource in storage.
+     * @param Request $request
+     * @return Renderable
+     */
+    public function store(Request $request)
+    {
+        //
+    }
+
+    /**
+     * Show the specified resource.
+     * @param int $id
+     * @return Renderable
+     */
+    public function show($id)
+    {
+        return view('internal::show');
+    }
+
+    /**
+     * Show the form for editing the specified resource.
+     * @param int $id
+     * @return Renderable
+     */
+    public function edit($id)
+    {
+        return view('internal::edit');
+    }
+
+    /**
+     * Update the specified resource in storage.
+     * @param Request $request
+     * @param int $id
+     * @return Renderable
+     */
+    public function update(Request $request, $corporate_id)
+    {
+        $corporateService = CorporateService::where('corporate_id', $corporate_id)->where('service_code', $request->service_code)->first();
+        $corporateServiceConfig = $corporateService->configs()->updateOrCreate([
+            'name' => $request->config_name,
+            'value' => $request->config_value
+        ]);
+
+        return $corporateServiceConfig;
+    }
+
+    /**
+     * Remove the specified resource from storage.
+     * @param int $id
+     * @return Renderable
+     */
+    public function destroy($id)
+    {
+        //
+    }
+}

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

@@ -32,7 +32,6 @@ class DiagnosisExclusionController extends Controller
                             ->paginate();
         // return $exclusions;
         return Helper::paginateResources(DiagnosisExclusionResource::collection($exclusions));
-        return response()->json(DiagnosisExclusionResource::collection($exclusions)->response()->getData(true));
     }
 
     /**

Modules/Internal/Routes/api.php

@@ -6,6 +6,7 @@ use Modules\Internal\Http\Controllers\Api\BenefitController;
 use Modules\Internal\Http\Controllers\Api\CorporateBenefitController;
 use Modules\Internal\Http\Controllers\Api\CorporateController;
 use Modules\Internal\Http\Controllers\Api\CorporatePlanController;
+use Modules\Internal\Http\Controllers\Api\CorporateServiceController;
 use Modules\Internal\Http\Controllers\Api\DiagnosisController;
 use Modules\Internal\Http\Controllers\Api\DiagnosisExclusionController;
 use Modules\Internal\Http\Controllers\Api\DivisionController;
@@ -68,6 +69,9 @@ Route::prefix('internal')->group(function () {
         Route::get('corporates/{corporate_id}/diagnosis-exclusions', [DiagnosisExclusionController::class, 'index']);
         Route::post('corporates/{corporate_id}/diagnosis-exclusions/import', [DiagnosisExclusionController::class, 'import']);
 
+        Route::get('corporates/{corporate_id}/services', [CorporateServiceController::class, 'index']);
+        Route::put('corporates/{corporate_id}/services', [CorporateServiceController::class, 'update']);
+
         // Route::get('corporates/{corporate_id}/diagnosis-exclusions', [DiagnosisExclusionController::class, 'index']);
         // Route::get('corporates/{corporate_id}/diagnosis-exclusions/import', [DiagnosisExclusionController::class, 'import']);
 

Modules/Internal/Transformers/CorporateServiceConfigResource.php

@@ -0,0 +1,28 @@
+<?php
+
+namespace Modules\Internal\Transformers;
+
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class CorporateServiceConfigResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @param  \Illuminate\Http\Request
+     * @return array
+     */
+    public function toArray($request)
+    {
+
+        return [
+            'id' => $this->id,
+            'corporate_id' => $this->corporate_id,
+            'service_code' => $this->service_code,
+            'status' => $this->status,
+            'name' => $this->service->name,
+            'description' => $this->service->description,
+            'configurations' => $this->configs->pluck('value', 'name')
+        ];
+    }
+}

app/Models/Corporate.php

@@ -67,4 +67,14 @@ class Corporate extends Model
     {
         return $this->morphMany(ImportLog::class, 'importable');
     }
+
+    public function services()
+    {
+        return $this->hasManyThrough(CorporateService::class, Service::class, 'corporate_id', 'service_code', 'id', 'service_code');
+    }
+
+    public function corporateServices()
+    {
+        return $this->hasMany(CorporateService::class, 'corporate_id');
+    }
 }

app/Models/CorporateService.php

@@ -0,0 +1,34 @@
+<?php
+
+namespace App\Models;
+
+use App\Traits\Blameable;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\SoftDeletes;
+
+class CorporateService extends Model
+{
+    use HasFactory, SoftDeletes, Blameable;
+
+    protected $fillable = [
+        'corporate_id',
+        'service_code',
+        'status',
+    ];
+
+    public function corporate()
+    {
+        return $this->belongsTo(Corporate::class);
+    }
+
+    public function configs()
+    {
+        return $this->hasMany(CorporateServiceConfig::class, 'corporate_service_id');
+    }
+
+    public function service()
+    {
+        return $this->hasOne(Service::class, 'code', 'service_code');
+    }
+}

app/Models/CorporateServiceConfig.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Models;
+
+use App\Traits\Blameable;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\SoftDeletes;
+
+class CorporateServiceConfig extends Model
+{
+    use HasFactory, SoftDeletes, Blameable;
+
+    protected $fillable = [
+        'corporate_service_id',
+        'name',
+        'value'
+    ];
+
+    public function corporateService()
+    {
+        return $this->belongsTo(CorporateService::class, 'corporate_service_id');
+    }
+}

app/Models/Service.php

@@ -5,7 +5,13 @@ namespace App\Models;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 
-class Services extends Model
+class Service extends Model
 {
     use HasFactory;
+
+    protected $fillable = [
+        'code',
+        'name',
+        'description',
+    ];
 }

database/migrations/2022_08_05_035511_create_corporate_services_table.php

@@ -0,0 +1,42 @@
+<?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::create('corporate_services', function (Blueprint $table) {
+            $table->id();
+            $table->foreignId('corporate_id')->index();
+            $table->string('service_code')->index();
+            $table->string('status')->default('active');
+
+            $table->timestamps();
+            $table->softDeletes();
+            
+            $table->unsignedBigInteger('created_by')->nullable();
+            $table->unsignedBigInteger('updated_by')->nullable();
+            $table->unsignedBigInteger('deleted_by')->nullable();
+
+            $table->index(['corporate_id', 'service_code']);
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('corporate_services');
+    }
+};

database/migrations/2022_08_08_042246_create_corporate_service_configs_table.php

@@ -0,0 +1,40 @@
+<?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::create('corporate_service_configs', function (Blueprint $table) {
+            $table->id();
+            $table->foreignId('corporate_service_id')->index();
+            $table->string('name');
+            $table->text('value');
+
+            $table->timestamps();
+            $table->softDeletes();
+            
+            $table->unsignedBigInteger('created_by')->nullable();
+            $table->unsignedBigInteger('updated_by')->nullable();
+            $table->unsignedBigInteger('deleted_by')->nullable();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('corporate_service_configs');
+    }
+};

database/seeders/ServiceSeeder.php

@@ -0,0 +1,129 @@
+<?php
+
+namespace Database\Seeders;
+
+use App\Models\Corporate;
+use App\Models\Service;
+use Illuminate\Database\Console\Seeds\WithoutModelEvents;
+use Illuminate\Database\Seeder;
+
+class ServiceSeeder extends Seeder
+{
+    /**
+     * Run the database seeds.
+     *
+     * @return void
+     */
+    public function run()
+    {
+        $services = [
+            [
+                'id' => 1,
+                'name' => 'Out Patient',
+                'code' => 'OP',
+                'description' => 'Out Patient',
+            ],
+            [
+                'id' => 2,
+                'name' => 'Inpatient',
+                'code' => 'IP',
+                'description' => 'Inpatient',
+            ],
+            [
+                'id' => 3,
+                'name' => 'Dental',
+                'code' => 'DE',
+                'description' => 'Dental',
+            ],
+            [
+                'id' => 4,
+                'name' => 'Maternal',
+                'code' => 'MA',
+                'description' => 'Maternal',
+            ],
+            [
+                'id' => 5,
+                'name' => 'Optical',
+                'code' => 'OPT',
+                'description' => 'Optical',
+            ],
+        ];
+
+
+        $corporates = Corporate::get();
+
+        foreach ($services as $service) {
+            $service = Service::updateOrCreate(['id' => $service['id']], $service);
+
+            foreach ($corporates as $corporate) {
+                $corporateService = $corporate->corporateServices()->create([
+                    'service_code' => $service->code,
+                    'status' => 'active'
+                ]);
+
+                $corporateService->configs()->insert([
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'gp_external_doctor_online',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'gp_external_doctor_offline',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'gp_internal_doctor_online',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'gp_internal_doctor_offline',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'sp_external_doctor_online',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'sp_external_doctor_offline',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'sp_internal_doctor_online',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'sp_internal_doctor_offline',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'vitamins',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'delivery_fee',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'general_practitioner_fee',
+                        'value' => false,
+                    ],
+                    [
+                        'corporate_service_id' => $corporateService->id,
+                        'name' => 'specialist_practitioner_fee',
+                        'value' => false,
+                    ],
+                ]);
+            }
+        }
+    }
+}

frontend/dashboard/src/layouts/dashboard/navbar/NavConfig.tsx

@@ -55,7 +55,7 @@ const navConfig = [
           { title: 'Corporate', path: '/corporates' },
           { title: 'Corporate Create', path: '/corporates/create' },
           { title: 'Formularium', path: '/formularium' },
-          { title: 'Diagnosis Library (ICD-X)', path: '/master/diagnosis' },
+          { title: 'Diagnosis Library (ICD-X)', path: '/masterdiagnosis' },
           { title: 'Hospitals', path: '/hospitals' },
         ],
       },

frontend/dashboard/src/pages/Corporates/CorporateTabNavigations.tsx

@@ -23,6 +23,10 @@ export default function CorporateTabNavigations({ position }: Props) {
     //   'path' : 'corporate-plans',
     //   'label': 'Corporate Plan',
     // },
+    {
+      'path' : 'services',
+      'label': 'Services',
+    },
     {
       'path' : 'plans',
       'label': 'Plans',

frontend/dashboard/src/pages/Corporates/Services/Create.tsx

@@ -0,0 +1,241 @@
+import * as Yup from 'yup';
+import { yupResolver } from "@hookform/resolvers/yup";
+import { Card, Collapse, Divider, Grid, Stack, Typography } from "@mui/material";
+import { useForm } from "react-hook-form";
+import { useParams } from "react-router-dom";
+import HeaderBreadcrumbs from "../../../components/HeaderBreadcrumbs";
+import { FormProvider, RHFCheckbox, RHFSelect, RHFTextField } from "../../../components/hook-form";
+import Page from "../../../components/Page";
+import useSettings from "../../../hooks/useSettings";
+import CorporateTabNavigations from "../CorporateTabNavigations";
+import DivisionsList from "./List";
+import { useMemo, useState } from 'react';
+
+
+
+export default function Divisions() {
+  const { themeStretch } = useSettings();
+
+  const { corporate_id } = useParams();
+
+  const NewDivisionSchema = Yup.object().shape({
+    name: Yup.string().required('Name is required'),
+    code: Yup.string().required('Corporate Code is required'),
+    active: Yup.boolean().required('Corporate Status is required'),
+  });
+
+  const defaultValues = useMemo(
+    () => ({
+      code: '',
+    }),
+    []
+  );
+
+  const methods = useForm({
+    resolver: yupResolver(NewDivisionSchema),
+    defaultValues,
+  });
+
+  const {
+    reset,
+    watch,
+    control,
+    setValue,
+    getValues,
+    setError,
+    handleSubmit,
+    formState: { isSubmitting },
+  } = methods;
+
+  const onSubmit = async (data: any) => {
+    console.log(data);
+  };
+
+  const [open, setOpen] = useState(false);
+
+  const benefits = [
+    {
+      'category' : 'General Practitioner',
+      'childs' : [
+        {
+          'name' : 'External Doctor Online',
+          'code' : 'gp-external-doctor-online'
+        },
+        {
+          'name' : 'External Doctor Offline',
+          'code' : 'gp-external-doctor-offline'
+        },
+        {
+          'name' : 'Internal Doctor Online',
+          'code' : 'gp-internal-doctor-online'
+        },
+        {
+          'name' : 'Internal Doctor Offline',
+          'code' : 'gp-internal-doctor-offline'
+        },
+      ]
+    },
+    {
+      'category' : 'Specialist',
+      'childs' : [
+        {
+          'name' : 'External Doctor Online',
+          'code' : 'sp-external-doctor-online'
+        },
+        {
+          'name' : 'External Doctor Offline',
+          'code' : 'sp-external-doctor-offline'
+        },
+        {
+          'name' : 'Internal Doctor Online',
+          'code' : 'sp-internal-doctor-online'
+        },
+        {
+          'name' : 'Internal Doctor Offline',
+          'code' : 'sp-internal-doctor-offline'
+        },
+      ]
+    },
+    {
+      'category' : 'Medicines',
+      'childs' : [
+        {
+          'name' : 'Vitamins',
+          'code' : 'medicines-vitamins'
+        },
+        {
+          'name' : 'Delivery Fee',
+          'code' : 'medicines-delivery-fee'
+        },
+      ]
+    },
+  ];
+
+  const products = [
+    {
+      'name' : 'Inpatient',
+      'code' : 'IP',
+    },
+    {
+      'name' : 'Outpatient',
+      'code' : 'OP',
+    },
+    {
+      'name' : 'Dental',
+      'code' : 'DT',
+    },
+    {
+      'name' : 'Dental',
+      'code' : 'DTL',
+    },
+    {
+      'name' : 'Matternity',
+      'code' : 'MT',
+    },
+    {
+      'name' : 'Special Benefit',
+      'code' : 'SB',
+    },
+  ];
+
+  return (
+    <Page title="Create Benefit">
+
+      <HeaderBreadcrumbs
+        heading={'Create Benefit'}
+        links={[
+          { name: 'Dashboard', href: '/dashboard' },
+          {
+            name: 'Corporates',
+            href: '/corporates',
+          },
+          {
+            name: 'Corporate Name',
+            href: '/corporates/'+id,
+          },
+          {
+            name: 'Benefits',
+            href: '/corporates/'+id+'/benefits',
+          },
+          {
+            name: 'Create',
+            href: '/corporates/'+id+'/benefits/create',
+          },
+        ]}
+      />
+      
+
+      <Grid container spacing={2}>
+        <Grid item xs={12}>
+          <Card sx={{ p: 2 }}>
+            <FormProvider methods={methods} onSubmit={handleSubmit(onSubmit)}>
+              <Stack spacing={3}>
+
+                <Typography variant="h6">Benefit Detail</Typography>
+
+                <RHFTextField name="name" label="Benefit Name" />
+
+                <RHFTextField name="code" label="Benefit Code" />
+
+                <Typography variant="h6">Benefit Configuration</Typography>
+                
+                <Divider orientation="horizontal" flexItem />
+                <Stack spacing={3} divider={<Divider orientation="horizontal" flexItem />}>
+                  <Stack spacing={2}>
+                    <RHFCheckbox name="a" label='Outpatient'/>
+                    {benefits.map(row => (
+                      <Collapse in={true} timeout="auto" unmountOnExit >
+                        <Typography>{row.category}</Typography>
+                        <Grid container>
+                        {row.childs.map(benefit => (
+                          <Grid item xs={6}>
+                            <RHFCheckbox name={benefit.code} label={benefit.name}/>
+                            </Grid>
+                        ))}
+                        </Grid>
+                      </Collapse>
+                    ))}
+                    <Typography>Admin Fee</Typography>
+                    <Grid container>
+                    {benefits.map(row => (
+                      <Grid item xs={4}>
+                        <RHFCheckbox name="cat" label={row.category}/>
+                      </Grid>
+                    ))}
+                    </Grid>
+                  </Stack>
+
+
+                  <Stack spacing={2}>
+                    <RHFCheckbox name="a" label='Inpatient'/>
+                    {benefits.map(row => (
+                      <Collapse in={true} timeout="auto" unmountOnExit >
+                        <Typography>{row.category}</Typography>
+                        <Grid container>
+                        {row.childs.map(benefit => (
+                          <Grid item xs={6}>
+                            <RHFCheckbox name={benefit.code} label={benefit.name}/>
+                            </Grid>
+                        ))}
+                        </Grid>
+                      </Collapse>
+                    ))}
+                    <Typography>Admin Fee</Typography>
+                    <Grid container>
+                    {benefits.map(row => (
+                      <Grid item xs={4}>
+                        <RHFCheckbox name="cat" label={row.category}/>
+                      </Grid>
+                    ))}
+                    </Grid>
+                  </Stack>
+                </Stack>
+
+              </Stack>
+            </FormProvider>
+          </Card>
+        </Grid>
+      </Grid>
+    </Page>
+  );
+}

frontend/dashboard/src/pages/Corporates/Services/Index.tsx

@@ -0,0 +1,46 @@
+import { Card, Grid } from "@mui/material";
+import { useParams } from "react-router-dom";
+import HeaderBreadcrumbs from "../../../components/HeaderBreadcrumbs";
+import Page from "../../../components/Page";
+import useSettings from "../../../hooks/useSettings";
+import CorporateTabNavigations from "../CorporateTabNavigations";
+import List from "./List";
+
+
+
+export default function Divisions() {
+  const { themeStretch } = useSettings();
+
+  const { corporate_id } = useParams();
+
+  const pageTitle = 'Services';
+  return (
+    <Page title={ pageTitle }>
+
+      <HeaderBreadcrumbs
+        heading={ pageTitle }
+        links={[
+          {
+            name: 'Corporates',
+            href: '/corporates',
+          },
+          {
+            name: 'Corporate Name',
+            href: '/corporates/'+corporate_id,
+          },
+          {
+            name: 'Services',
+            href: '/corporates/'+corporate_id+'/services',
+          },
+        ]}
+      />
+
+      <Card>
+        <CorporateTabNavigations position={'services'} />
+
+        <List />
+        
+      </Card>
+    </Page>
+  );
+}

frontend/dashboard/src/pages/Corporates/Services/List.tsx

@@ -0,0 +1,463 @@
+import * as Yup from 'yup';
+// @mui
+import { Box, Button, Card, Collapse, IconButton, InputLabel, MenuItem, OutlinedInput, Paper, Select, SelectChangeEvent, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TextField, Typography, Badge, Tab, Tabs, CardHeader, Stack, Menu, ButtonGroup, Checkbox, FormControlLabel } from '@mui/material';
+import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
+import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
+import AddIcon from '@mui/icons-material/Add';
+import UploadIcon from '@mui/icons-material/Upload';
+import CancelIcon from '@mui/icons-material/Cancel';
+// hooks
+import React, { ChangeEvent, Component, useEffect, useMemo, useRef, useState } from 'react';
+import useSettings from '../../../hooks/useSettings';
+import { useParams, useSearchParams } from 'react-router-dom';
+// components
+import axios from '../../../utils/axios';
+import { LaravelPaginatedData } from '../../../@types/paginated-data';
+import { Icd } from '../../../@types/diagnosis';
+import BasePagination from '../../../components/BasePagination';
+import { useForm } from 'react-hook-form';
+import { yupResolver } from '@hookform/resolvers/yup';
+import { RHFCheckbox } from '../../../components/hook-form';
+import { CheckBox } from '@mui/icons-material';
+
+export default function List() {
+  const { themeStretch } = useSettings();
+  const { corporate_id } = useParams();
+  const [searchParams, setSearchParams] = useSearchParams();
+  const [importResult, setImportResult] = useState(null);
+  
+  function SearchInput(props: any) {
+     // SEARCH
+    const searchInput = useRef<HTMLInputElement>(null);
+    const [searchText, setSearchText] = useState("");
+
+    const handleSearchChange = (event: any) => {
+      const newSearchText = event.target.value ?? ''
+      setSearchText(newSearchText);
+    }
+
+    const handleSearchSubmit = (event: any) => {
+      event.preventDefault();
+      props.onSearch(searchText); // Trigger to Parent
+    }
+
+    useEffect(() =>  { // Trigger First Search
+      setSearchText(searchParams.get('search') ?? '');
+    }, [searchParams])
+
+    return (
+      <form onSubmit={handleSearchSubmit} style={{ width: '100%' }}>
+        <TextField id="search-input" ref={searchInput} label="Search" variant="outlined" fullWidth onChange={handleSearchChange} value={searchText}/>
+      </form>
+    );
+  }
+
+  function SearchForm(props: any) {
+    // Create Button Menu
+    const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
+
+    const handleClose = () => {
+      setAnchorEl(null);
+    };
+
+    return (
+        <Stack direction={'row'} spacing={2} sx={{ p: 2 }}>
+          <SearchInput onSearch={applyFilter}/>
+        </Stack>
+    );
+  }
+
+  // Called on every row to map the data to the columns
+  function createData( icd: Icd ): Icd {
+    return {
+      ...icd,
+    }
+  }
+
+  // Generate the every row of the table
+  function Row(props: { row: ReturnType<typeof createData> }) {
+    const { row } = props;
+    const [open, setOpen] = React.useState(false);
+
+    const handleConfigChange = (event: ChangeEvent<HTMLInputElement>, service: any) => {
+      console.log( event.target.name ,event.target.checked, service);
+
+      axios.put(`/corporates/${corporate_id}/services/`, { 
+        service_code: service.service_code,
+        config_name: event.target.name,
+        config_value: event.target.checked
+       })
+    }
+
+    return (
+      <React.Fragment>
+        <TableRow sx={{ '& > *': { borderBottom: 'unset' } }}>
+          <TableCell>
+            <IconButton
+              aria-label="expand row"
+              size="small"
+              onClick={() => setOpen(!open)}
+            >
+              {open ? <KeyboardArrowDownIcon /> : <KeyboardArrowRightIcon />}
+            </IconButton>
+          </TableCell>
+          <TableCell align="left">{row.name}</TableCell>
+
+          <TableCell align="right"><Button variant="outlined" color="success" size="small">Active</Button></TableCell>
+          <TableCell align="right"><Button variant="outlined" color="error" size="small">Disable</Button></TableCell>
+        </TableRow>
+        {/* COLLAPSIBLE ROW */}
+        <TableRow>
+          <TableCell style={{ paddingBottom: 0, paddingTop: 0 }} colSpan={99}>
+            <Collapse in={open} timeout="auto" unmountOnExit>
+              <Box sx={{ borderBottom: 1 }}>
+                <Stack>
+
+                  <TableContainer>
+                    <Table sx={{ minWidth: 650 }} size="small">
+                      <TableHead>
+                        <TableRow>
+                          <TableCell colSpan={4} sx={{ py: 1 }}>General Practitioner</TableCell>
+                        </TableRow>
+                      </TableHead>
+                      <TableBody>
+                        <TableRow>
+                          <TableCell colSpan={2}>External Doctor</TableCell>
+                          <TableCell colSpan={2}>Internal Doctor</TableCell>
+                        </TableRow>
+                        <TableRow>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.gp_external_doctor_online == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="gp_external_doctor_online" />} label="Online" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.gp_external_doctor_offline == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="gp_external_doctor_offline" />} label="Offline" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.gp_internal_doctor_online == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="gp_internal_doctor_online" />} label="Online" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.gp_internal_doctor_offline == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="gp_internal_doctor_offline" />} label="Offline" />
+                          </TableCell>
+                        </TableRow>
+                      </TableBody>
+                    </Table>
+                  </TableContainer>
+
+                  <TableContainer>
+                    <Table sx={{ minWidth: 650 }} size="small">
+                      <TableHead>
+                        <TableRow>
+                          <TableCell colSpan={4} sx={{ py: 1 }}>Specialist Practitioner</TableCell>
+                        </TableRow>
+                      </TableHead>
+                      <TableBody>
+                        <TableRow>
+                          <TableCell colSpan={2}>External Doctor</TableCell>
+                          <TableCell colSpan={2}>Internal Doctor</TableCell>
+                        </TableRow>
+                        <TableRow>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.sp_external_doctor_online == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="sp_external_doctor_online" />} label="Online" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.sp_external_doctor_offline == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="sp_external_doctor_offline" />} label="Offline" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.sp_internal_doctor_online == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="sp_internal_doctor_online" />} label="Online" />
+                          </TableCell>
+                          <TableCell>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.sp_internal_doctor_offline == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="sp_internal_doctor_offline" />} label="Offline" />
+                          </TableCell>
+                        </TableRow>
+                      </TableBody>
+                    </Table>
+                  </TableContainer>
+
+                  <TableContainer>
+                    <Table sx={{ minWidth: 650 }} size="small">
+                      <TableHead>
+                        <TableRow>
+                          <TableCell colSpan={4} sx={{ py: 1 }}>Medicine</TableCell>
+                        </TableRow>
+                      </TableHead>
+                      <TableBody>
+                        <TableRow>
+                          <TableCell width={'25%'}>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.vitamins == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="vitamins" />} label="Vitamins" />
+                          </TableCell>
+                          <TableCell width={'25%'}>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.delivery_fee == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="delivery_fee" />} label="Delivery Fee" />
+                          </TableCell>
+                          <TableCell width={'25%'}/>
+                          <TableCell width={'25%'}/>
+                        </TableRow>
+                      </TableBody>
+                    </Table>
+                  </TableContainer>
+
+                  <TableContainer>
+                    <Table sx={{ minWidth: 650 }} size="small">
+                      <TableHead>
+                        <TableRow>
+                          <TableCell colSpan={4} sx={{ py: 1 }}>Free Admin Fee</TableCell>
+                        </TableRow>
+                      </TableHead>
+                      <TableBody>
+                        <TableRow>
+                          <TableCell width={'25%'}>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.general_practitioner_fee == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="general_practitioner_fee" />} label="General Practitioner" />
+                          </TableCell>
+                          <TableCell width={'25%'}>
+                            <FormControlLabel control={<Checkbox defaultChecked={row.configurations.specialist_practitioner_fee == '1'} onChange={(event) => {handleConfigChange(event, row)}} name="specialist_practitioner_fee" />} label="Specialist Practitioner" />
+                          </TableCell>
+                          <TableCell width={'25%'}/>
+                          <TableCell width={'25%'}/>
+                        </TableRow>
+                      </TableBody>
+                    </Table>
+                  </TableContainer>
+
+
+                </Stack>
+              </Box>
+            </Collapse>
+          </TableCell>
+        </TableRow>
+      </React.Fragment>
+    );
+  }
+
+  // Dummy Default Data
+  const [dataTableIsLoading, setDataTableLoading] = useState(true);
+  const [dataTableLastRequest, setDataTableLastRequest] = useState(0);
+  const [dataTableResponseState, setDataTableResponseState] = useState('idle');
+  const [dataTableData, setDataTableData] = useState<LaravelPaginatedData>({
+    current_page: 1,
+    data: [],
+    path: "",
+    first_page_url: "",
+    last_page: 1,
+    last_page_url: "",
+    next_page_url: "",
+    prev_page_url: "",
+    per_page: 10,
+    from: 0,
+    to: 0,
+    total: 0
+  });
+
+  const loadDataTableData = async (appliedFilter : any | null = null) => {
+    setDataTableLoading(true);
+    const filter = appliedFilter ? appliedFilter : Object.fromEntries([...searchParams.entries()]);
+    const response = await axios.get('/corporates/'+corporate_id+'/services', { params: filter });
+    setDataTableLoading(false);
+
+    // const service = [
+    //   {
+    //     'id' : 1,
+    //     'code' : 'OP',
+    //     'name' : 'Out Patient',
+    //     'description' : 'Out Patient',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   },
+    //   {
+    //     'id' : 2,
+    //     'code' : 'IP',
+    //     'name' : 'In Patient',
+    //     'description' : 'In Patient',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   },
+    //   {
+    //     'id' : 3,
+    //     'code' : 'DE',
+    //     'name' : 'Dental',
+    //     'description' : 'Dental',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   },
+    //   {
+    //     'id' : 4,
+    //     'code' : 'Optical',
+    //     'name' : 'Optical',
+    //     'description' : 'Optical',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   },
+    //   {
+    //     'id' : 5,
+    //     'code' : 'MA',
+    //     'name' : 'Matternity',
+    //     'description' : 'Matternity',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   },
+    //   {
+    //     'id' : 6,
+    //     'code' : 'SP',
+    //     'name' : 'Special Benefit',
+    //     'description' : 'Special Benefit',
+    //     'configurations' : [
+    //       {
+    //         'gp_external_doctor_online' : false,
+    //         'gp_external_doctor_offline' : false,
+    //         'gp_internal_doctor_online' : false,
+    //         'gp_internal_doctor_offline' : false,
+    //         'sp_external_doctor_online' : false,
+    //         'sp_external_doctor_offline' : false,
+    //         'sp_internal_doctor_online' : false,
+    //         'sp_internal_doctor_offline' : false,
+    //         'vitamins': false,
+    //         'delivery_fee': false,
+    //         'general_practitioner_fee': false,
+    //         'specialist_practitioner_fee': false,
+    //       },
+    //     ]
+    //   }
+    // ];
+
+    // console.log('asdasd', service);
+    // let x = response.data;
+    // x.data = service;
+
+    setDataTableData(response.data);
+  }
+
+  const headStyle = {
+    fontWeight: 'bold',
+  };
+
+  const applyFilter = async (searchFilter: any) => {
+    await loadDataTableData({ "search" : searchFilter });
+    setSearchParams({ "search" : searchFilter });
+  }
+
+  const handlePageChange = (event : ChangeEvent, value: number) => {
+    const filter = Object.fromEntries([...searchParams.entries(), ["page", value]]);
+    loadDataTableData(filter);
+    setSearchParams(filter);
+  }
+
+  useEffect(() => {
+    loadDataTableData();
+  }, [])
+  
+  return (
+    <Stack>
+      <SearchForm />
+
+        <Card>
+        {/* The Main Table */}
+        <TableContainer component={Paper}>
+          <Table aria-label="collapsible table">
+            <TableBody>
+              <TableRow>
+                <TableCell style={headStyle} align="left" width={10}/>
+                <TableCell style={headStyle} align="left">Service</TableCell>
+
+                <TableCell style={headStyle} align="right" width={30}>Status</TableCell>
+                <TableCell style={headStyle} align="right" width={30}>Action</TableCell>
+              </TableRow>
+            </TableBody>
+            {dataTableIsLoading ?
+              (
+                <TableBody>
+                  <TableRow>
+                    <TableCell colSpan={8} align="center">Loading</TableCell>
+                  </TableRow>
+                </TableBody>
+              ) : (
+                dataTableData.data.length == 0 ? 
+                (
+                  <TableBody>
+                    <TableRow>
+                      <TableCell colSpan={8} align="center">No Data</TableCell>
+                    </TableRow>
+                  </TableBody>
+                ) : (
+                  <TableBody>
+                    {dataTableData.data.map(row => (
+                      <Row key={row.id} row={row} />
+                    ))}
+                  </TableBody>
+                )
+            )}
+          </Table>
+        </TableContainer>
+        
+        <BasePagination paginationData={dataTableData} onPageChange={handlePageChange}/>
+        </Card>
+    </Stack>
+  );
+}

frontend/dashboard/src/routes/index.tsx

@@ -114,6 +114,11 @@ export default function Router() {
           element: <CorporateMembers />,
         },
 
+        {
+          path: 'corporates/:corporate_id/services',
+          element: <CorporateServices />,
+        },
+
         {
           path: 'corporates/:corporate_id/plans/create',
           element: <PlanCreate />,
@@ -236,3 +241,5 @@ const Plans = Loadable(lazy(() => import('../pages/Corporates/Plan/Index')));
 const DiagnosisExclusions = Loadable(lazy(() => import('../pages/Corporates/DiagnosisExclusion/Index')));
 
 const MasterDiagnosis = Loadable(lazy(() => import('../pages/Master/Diagnosis/Index')));
+
+const CorporateServices = Loadable(lazy(() => import('../pages/Corporates/Services/Index')));