diff --git a/app/Http/Controllers/LayananPemutihanController.php b/app/Http/Controllers/LayananPemutihanController.php
index c592bbe..cb59e0a 100644
--- a/app/Http/Controllers/LayananPemutihanController.php
+++ b/app/Http/Controllers/LayananPemutihanController.php
@@ -9,19 +9,62 @@
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Storage;
 use SimpleSoftwareIO\QrCode\Facades\QrCode;
+use Yajra\DataTables\Facades\DataTables;
 
 class LayananPemutihanController extends Controller
 {
 
-public function index(){
+public function data(Request $request){
+    $query = PengajuanPemutihan::
+    select(
+        'pengajuan_pemutihans.*',
+        'users.nama_gelar as dosen_pengampu',
+        )
+    ->join('users','dosen_id','=','users.id');
+    
+    if ($request->has('program_studi') && !empty($request->program_studi)) {
+        if($request->program_studi == "s1"){
+            $query->where('program_studi', "S1 Farmasi");
+        }elseif($request->program_studi == "s2"){
+            $query->where('program_studi', "S2 Farmasi");
+        }elseif($request->program_studi == "psppa"){
+            $query->where('program_studi', "PSPPA");
+        } 
+    }
+    $data = $query->orderBy('pengajuan_pemutihans.created_at', 'desc')->get();
+
+    return DataTables::of($data)
+    ->addColumn('action', function($row){
+        if (!empty($row->status_operator)) {
+            $btn = '<a href="javascript:void(0)" class="btn btn-info" onclick="showDetail(\''.$row->caseid.'\')">Detail</a>'; 
+        } else {
+            $btn = '<a href="javascript:void(0)" class="btn btn-info" onclick="showDetail(\''.$row->caseid.'\')">Detail</a>'; 
+            $btn = $btn.'<a href="javascript:void(0)" class="btn btn-success" onclick="showDetail(\''.$row->caseid.'\')">Terima</a>'; 
+            $btn = $btn.'<a href="javascript:void(0)" class="edit btn btn-danger" onclick="tolak(\''.$row->caseid.'\')">Tolak</a> ';
+            
+        }
+        return $btn;
+    })
+    ->toJson();
+}
+
+public function detail($caseid){
     $data = PengajuanPemutihan::
     select(
         'pengajuan_pemutihans.*',
         'users.nama_gelar as dosen_pengampu',
         )
     ->join('users','dosen_id','=','users.id')
+    ->where('pengajuan_pemutihans.caseid',$caseid)
     ->get();
-    return view('layanan-pemutihan.index',['title' => 'Pengajuan Pemutihan | Admin Dashboard','data' => $data]);
+    return DataTables::of($data)
+    ->toJson();
+}
+
+public function index(){
+    return view('layanan-pemutihan.index',[
+        'title' => 'Pengajuan Pemutihan | Admin Dashboard',
+    ]);
 }
 
 public function tambah(){
@@ -121,7 +164,8 @@ public function selesai($caseid, Request $request){
     $data->status_operator = Carbon::now();
     $data->keterangan_operator = 0;
     $data->save();
-    return redirect()->route('layanan-pemutihan.index')->with('success','Data Berhasil Disimpan, status akan diupdate menjadi selesai');
+    // return redirect()->route('layanan-pemutihan.index')->with('success','Data Berhasil Disimpan, status akan diupdate menjadi selesai');
+    return redirect()->back()->with('success','Data Berhasil Disimpan, status akan diupdate menjadi selesai');
 }
 
 function tolak($caseid, Request $request){
@@ -132,6 +176,6 @@ function tolak($caseid, Request $request){
     $data->status_operator = Carbon::now();
     $data->keterangan_operator = $request->keterangan_operator;
     $data->save();
-    return redirect()->route('layanan-pemutihan.index')->with('success','Data Berhasil Disimpan, status akan diupdate menjadi Ditolak');
+    return redirect()->back()->with('success','Data Berhasil Disimpan, status akan diupdate menjadi Ditolak');
 }
 }
diff --git a/composer.json b/composer.json
index 3691850..2cb5cda 100644
--- a/composer.json
+++ b/composer.json
@@ -14,7 +14,8 @@
         "laravel/sanctum": "^3.3",
         "laravel/tinker": "^2.8",
         "simplesoftwareio/simple-qrcode": "^4.2",
-        "spatie/laravel-permission": "^6.4"
+        "spatie/laravel-permission": "^6.4",
+        "yajra/laravel-datatables": "~10.0"
     },
     "require-dev": {
         "fakerphp/faker": "^1.9.1",
diff --git a/composer.lock b/composer.lock
index ef1371c..224c270 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "abcc97396294b57200718bb94f348eef",
+    "content-hash": "ecc6db30fd349cc2e1caf10dd989ba7f",
     "packages": [
         {
             "name": "bacon/bacon-qr-code",
@@ -828,6 +828,67 @@
             ],
             "time": "2023-10-06T06:47:41+00:00"
         },
+        {
+            "name": "ezyang/htmlpurifier",
+            "version": "v4.18.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/ezyang/htmlpurifier.git",
+                "reference": "cb56001e54359df7ae76dc522d08845dc741621b"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/ezyang/htmlpurifier/zipball/cb56001e54359df7ae76dc522d08845dc741621b",
+                "reference": "cb56001e54359df7ae76dc522d08845dc741621b",
+                "shasum": ""
+            },
+            "require": {
+                "php": "~5.6.0 || ~7.0.0 || ~7.1.0 || ~7.2.0 || ~7.3.0 || ~7.4.0 || ~8.0.0 || ~8.1.0 || ~8.2.0 || ~8.3.0 || ~8.4.0"
+            },
+            "require-dev": {
+                "cerdic/css-tidy": "^1.7 || ^2.0",
+                "simpletest/simpletest": "dev-master"
+            },
+            "suggest": {
+                "cerdic/css-tidy": "If you want to use the filter 'Filter.ExtractStyleBlocks'.",
+                "ext-bcmath": "Used for unit conversion and imagecrash protection",
+                "ext-iconv": "Converts text to and from non-UTF-8 encodings",
+                "ext-tidy": "Used for pretty-printing HTML"
+            },
+            "type": "library",
+            "autoload": {
+                "files": [
+                    "library/HTMLPurifier.composer.php"
+                ],
+                "psr-0": {
+                    "HTMLPurifier": "library/"
+                },
+                "exclude-from-classmap": [
+                    "/library/HTMLPurifier/Language/"
+                ]
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "LGPL-2.1-or-later"
+            ],
+            "authors": [
+                {
+                    "name": "Edward Z. Yang",
+                    "email": "admin@htmlpurifier.org",
+                    "homepage": "http://ezyang.com"
+                }
+            ],
+            "description": "Standards compliant HTML filter written in PHP",
+            "homepage": "http://htmlpurifier.org/",
+            "keywords": [
+                "html"
+            ],
+            "support": {
+                "issues": "https://github.com/ezyang/htmlpurifier/issues",
+                "source": "https://github.com/ezyang/htmlpurifier/tree/v4.18.0"
+            },
+            "time": "2024-11-01T03:51:45+00:00"
+        },
         {
             "name": "fruitcake/php-cors",
             "version": "v1.3.0",
@@ -2222,6 +2283,76 @@
             ],
             "time": "2024-01-26T18:25:23+00:00"
         },
+        {
+            "name": "league/fractal",
+            "version": "0.20.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/thephpleague/fractal.git",
+                "reference": "8b9d39b67624db9195c06f9c1ffd0355151eaf62"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/thephpleague/fractal/zipball/8b9d39b67624db9195c06f9c1ffd0355151eaf62",
+                "reference": "8b9d39b67624db9195c06f9c1ffd0355151eaf62",
+                "shasum": ""
+            },
+            "require": {
+                "php": ">=7.4"
+            },
+            "require-dev": {
+                "doctrine/orm": "^2.5",
+                "illuminate/contracts": "~5.0",
+                "mockery/mockery": "^1.3",
+                "pagerfanta/pagerfanta": "~1.0.0",
+                "phpstan/phpstan": "^1.4",
+                "phpunit/phpunit": "^9.5",
+                "squizlabs/php_codesniffer": "~3.4",
+                "vimeo/psalm": "^4.22",
+                "zendframework/zend-paginator": "~2.3"
+            },
+            "suggest": {
+                "illuminate/pagination": "The Illuminate Pagination component.",
+                "pagerfanta/pagerfanta": "Pagerfanta Paginator",
+                "zendframework/zend-paginator": "Zend Framework Paginator"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "0.20.x-dev"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "League\\Fractal\\": "src"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Phil Sturgeon",
+                    "email": "me@philsturgeon.uk",
+                    "homepage": "http://philsturgeon.uk/",
+                    "role": "Developer"
+                }
+            ],
+            "description": "Handle the output of complex data structures ready for API output.",
+            "homepage": "http://fractal.thephpleague.com/",
+            "keywords": [
+                "api",
+                "json",
+                "league",
+                "rest"
+            ],
+            "support": {
+                "issues": "https://github.com/thephpleague/fractal/issues",
+                "source": "https://github.com/thephpleague/fractal/tree/0.20.1"
+            },
+            "time": "2022-04-11T12:47:17+00:00"
+        },
         {
             "name": "league/mime-type-detection",
             "version": "1.15.0",
@@ -2278,6 +2409,266 @@
             ],
             "time": "2024-01-28T23:22:08+00:00"
         },
+        {
+            "name": "livewire/livewire",
+            "version": "v3.5.4",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/livewire/livewire.git",
+                "reference": "b158c6386a892efc6c5e4682e682829baac1f933"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/livewire/livewire/zipball/b158c6386a892efc6c5e4682e682829baac1f933",
+                "reference": "b158c6386a892efc6c5e4682e682829baac1f933",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/database": "^10.0|^11.0",
+                "illuminate/routing": "^10.0|^11.0",
+                "illuminate/support": "^10.0|^11.0",
+                "illuminate/validation": "^10.0|^11.0",
+                "league/mime-type-detection": "^1.9",
+                "php": "^8.1",
+                "symfony/console": "^6.0|^7.0",
+                "symfony/http-kernel": "^6.2|^7.0"
+            },
+            "require-dev": {
+                "calebporzio/sushi": "^2.1",
+                "laravel/framework": "^10.15.0|^11.0",
+                "laravel/prompts": "^0.1.6",
+                "mockery/mockery": "^1.3.1",
+                "orchestra/testbench": "^8.21.0|^9.0",
+                "orchestra/testbench-dusk": "^8.24|^9.1",
+                "phpunit/phpunit": "^10.4",
+                "psy/psysh": "^0.11.22|^0.12"
+            },
+            "type": "library",
+            "extra": {
+                "laravel": {
+                    "aliases": {
+                        "Livewire": "Livewire\\Livewire"
+                    },
+                    "providers": [
+                        "Livewire\\LivewireServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "files": [
+                    "src/helpers.php"
+                ],
+                "psr-4": {
+                    "Livewire\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Caleb Porzio",
+                    "email": "calebporzio@gmail.com"
+                }
+            ],
+            "description": "A front-end framework for Laravel.",
+            "support": {
+                "issues": "https://github.com/livewire/livewire/issues",
+                "source": "https://github.com/livewire/livewire/tree/v3.5.4"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/livewire",
+                    "type": "github"
+                }
+            ],
+            "time": "2024-07-15T18:27:32+00:00"
+        },
+        {
+            "name": "maennchen/zipstream-php",
+            "version": "3.1.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/maennchen/ZipStream-PHP.git",
+                "reference": "6187e9cc4493da94b9b63eb2315821552015fca9"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/maennchen/ZipStream-PHP/zipball/6187e9cc4493da94b9b63eb2315821552015fca9",
+                "reference": "6187e9cc4493da94b9b63eb2315821552015fca9",
+                "shasum": ""
+            },
+            "require": {
+                "ext-mbstring": "*",
+                "ext-zlib": "*",
+                "php-64bit": "^8.1"
+            },
+            "require-dev": {
+                "ext-zip": "*",
+                "friendsofphp/php-cs-fixer": "^3.16",
+                "guzzlehttp/guzzle": "^7.5",
+                "mikey179/vfsstream": "^1.6",
+                "php-coveralls/php-coveralls": "^2.5",
+                "phpunit/phpunit": "^10.0",
+                "vimeo/psalm": "^5.0"
+            },
+            "suggest": {
+                "guzzlehttp/psr7": "^2.4",
+                "psr/http-message": "^2.0"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "ZipStream\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Paul Duncan",
+                    "email": "pabs@pablotron.org"
+                },
+                {
+                    "name": "Jonatan Männchen",
+                    "email": "jonatan@maennchen.ch"
+                },
+                {
+                    "name": "Jesse Donat",
+                    "email": "donatj@gmail.com"
+                },
+                {
+                    "name": "András Kolesár",
+                    "email": "kolesar@kolesar.hu"
+                }
+            ],
+            "description": "ZipStream is a library for dynamically streaming dynamic zip files from PHP without writing to the disk at all on the server.",
+            "keywords": [
+                "stream",
+                "zip"
+            ],
+            "support": {
+                "issues": "https://github.com/maennchen/ZipStream-PHP/issues",
+                "source": "https://github.com/maennchen/ZipStream-PHP/tree/3.1.1"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/maennchen",
+                    "type": "github"
+                }
+            ],
+            "time": "2024-10-10T12:33:01+00:00"
+        },
+        {
+            "name": "markbaker/complex",
+            "version": "3.0.2",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/MarkBaker/PHPComplex.git",
+                "reference": "95c56caa1cf5c766ad6d65b6344b807c1e8405b9"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/MarkBaker/PHPComplex/zipball/95c56caa1cf5c766ad6d65b6344b807c1e8405b9",
+                "reference": "95c56caa1cf5c766ad6d65b6344b807c1e8405b9",
+                "shasum": ""
+            },
+            "require": {
+                "php": "^7.2 || ^8.0"
+            },
+            "require-dev": {
+                "dealerdirect/phpcodesniffer-composer-installer": "dev-master",
+                "phpcompatibility/php-compatibility": "^9.3",
+                "phpunit/phpunit": "^7.0 || ^8.0 || ^9.0",
+                "squizlabs/php_codesniffer": "^3.7"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "Complex\\": "classes/src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Mark Baker",
+                    "email": "mark@lange.demon.co.uk"
+                }
+            ],
+            "description": "PHP Class for working with complex numbers",
+            "homepage": "https://github.com/MarkBaker/PHPComplex",
+            "keywords": [
+                "complex",
+                "mathematics"
+            ],
+            "support": {
+                "issues": "https://github.com/MarkBaker/PHPComplex/issues",
+                "source": "https://github.com/MarkBaker/PHPComplex/tree/3.0.2"
+            },
+            "time": "2022-12-06T16:21:08+00:00"
+        },
+        {
+            "name": "markbaker/matrix",
+            "version": "3.0.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/MarkBaker/PHPMatrix.git",
+                "reference": "728434227fe21be27ff6d86621a1b13107a2562c"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/MarkBaker/PHPMatrix/zipball/728434227fe21be27ff6d86621a1b13107a2562c",
+                "reference": "728434227fe21be27ff6d86621a1b13107a2562c",
+                "shasum": ""
+            },
+            "require": {
+                "php": "^7.1 || ^8.0"
+            },
+            "require-dev": {
+                "dealerdirect/phpcodesniffer-composer-installer": "dev-master",
+                "phpcompatibility/php-compatibility": "^9.3",
+                "phpdocumentor/phpdocumentor": "2.*",
+                "phploc/phploc": "^4.0",
+                "phpmd/phpmd": "2.*",
+                "phpunit/phpunit": "^7.0 || ^8.0 || ^9.0",
+                "sebastian/phpcpd": "^4.0",
+                "squizlabs/php_codesniffer": "^3.7"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "Matrix\\": "classes/src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Mark Baker",
+                    "email": "mark@demon-angel.eu"
+                }
+            ],
+            "description": "PHP Class for working with matrices",
+            "homepage": "https://github.com/MarkBaker/PHPMatrix",
+            "keywords": [
+                "mathematics",
+                "matrix",
+                "vector"
+            ],
+            "support": {
+                "issues": "https://github.com/MarkBaker/PHPMatrix/issues",
+                "source": "https://github.com/MarkBaker/PHPMatrix/tree/3.0.1"
+            },
+            "time": "2022-12-02T22:17:43+00:00"
+        },
         {
             "name": "masterminds/html5",
             "version": "2.8.1",
@@ -2911,6 +3302,99 @@
             ],
             "time": "2023-02-08T01:06:31+00:00"
         },
+        {
+            "name": "openspout/openspout",
+            "version": "v4.28.2",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/openspout/openspout.git",
+                "reference": "d6dd654b5db502f28c5773edfa785b516745a142"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/openspout/openspout/zipball/d6dd654b5db502f28c5773edfa785b516745a142",
+                "reference": "d6dd654b5db502f28c5773edfa785b516745a142",
+                "shasum": ""
+            },
+            "require": {
+                "ext-dom": "*",
+                "ext-fileinfo": "*",
+                "ext-filter": "*",
+                "ext-libxml": "*",
+                "ext-xmlreader": "*",
+                "ext-zip": "*",
+                "php": "~8.2.0 || ~8.3.0 || ~8.4.0"
+            },
+            "require-dev": {
+                "ext-zlib": "*",
+                "friendsofphp/php-cs-fixer": "^3.65.0",
+                "infection/infection": "^0.29.8",
+                "phpbench/phpbench": "^1.3.1",
+                "phpstan/phpstan": "^2.0.3",
+                "phpstan/phpstan-phpunit": "^2.0.1",
+                "phpstan/phpstan-strict-rules": "^2",
+                "phpunit/phpunit": "^11.4.4"
+            },
+            "suggest": {
+                "ext-iconv": "To handle non UTF-8 CSV files (if \"php-mbstring\" is not already installed or is too limited)",
+                "ext-mbstring": "To handle non UTF-8 CSV files (if \"iconv\" is not already installed)"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "3.3.x-dev"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "OpenSpout\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Adrien Loison",
+                    "email": "adrien@box.com"
+                }
+            ],
+            "description": "PHP Library to read and write spreadsheet files (CSV, XLSX and ODS), in a fast and scalable way",
+            "homepage": "https://github.com/openspout/openspout",
+            "keywords": [
+                "OOXML",
+                "csv",
+                "excel",
+                "memory",
+                "odf",
+                "ods",
+                "office",
+                "open",
+                "php",
+                "read",
+                "scale",
+                "spreadsheet",
+                "stream",
+                "write",
+                "xlsx"
+            ],
+            "support": {
+                "issues": "https://github.com/openspout/openspout/issues",
+                "source": "https://github.com/openspout/openspout/tree/v4.28.2"
+            },
+            "funding": [
+                {
+                    "url": "https://paypal.me/filippotessarotto",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/Slamdunk",
+                    "type": "github"
+                }
+            ],
+            "time": "2024-12-06T06:17:37+00:00"
+        },
         {
             "name": "phenx/php-font-lib",
             "version": "0.5.6",
@@ -3001,6 +3485,111 @@
             },
             "time": "2024-02-07T12:49:40+00:00"
         },
+        {
+            "name": "phpoffice/phpspreadsheet",
+            "version": "1.29.6",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/PHPOffice/PhpSpreadsheet.git",
+                "reference": "08597725b84570cd6f32bf0ea92e75a803ef28c2"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/PHPOffice/PhpSpreadsheet/zipball/08597725b84570cd6f32bf0ea92e75a803ef28c2",
+                "reference": "08597725b84570cd6f32bf0ea92e75a803ef28c2",
+                "shasum": ""
+            },
+            "require": {
+                "ext-ctype": "*",
+                "ext-dom": "*",
+                "ext-fileinfo": "*",
+                "ext-gd": "*",
+                "ext-iconv": "*",
+                "ext-libxml": "*",
+                "ext-mbstring": "*",
+                "ext-simplexml": "*",
+                "ext-xml": "*",
+                "ext-xmlreader": "*",
+                "ext-xmlwriter": "*",
+                "ext-zip": "*",
+                "ext-zlib": "*",
+                "ezyang/htmlpurifier": "^4.15",
+                "maennchen/zipstream-php": "^2.1 || ^3.0",
+                "markbaker/complex": "^3.0",
+                "markbaker/matrix": "^3.0",
+                "php": "^7.4 || ^8.0",
+                "psr/http-client": "^1.0",
+                "psr/http-factory": "^1.0",
+                "psr/simple-cache": "^1.0 || ^2.0 || ^3.0"
+            },
+            "require-dev": {
+                "dealerdirect/phpcodesniffer-composer-installer": "dev-main",
+                "dompdf/dompdf": "^1.0 || ^2.0 || ^3.0",
+                "friendsofphp/php-cs-fixer": "^3.2",
+                "mitoteam/jpgraph": "^10.3",
+                "mpdf/mpdf": "^8.1.1",
+                "phpcompatibility/php-compatibility": "^9.3",
+                "phpstan/phpstan": "^1.1",
+                "phpstan/phpstan-phpunit": "^1.0",
+                "phpunit/phpunit": "^8.5 || ^9.0",
+                "squizlabs/php_codesniffer": "^3.7",
+                "tecnickcom/tcpdf": "^6.5"
+            },
+            "suggest": {
+                "dompdf/dompdf": "Option for rendering PDF with PDF Writer",
+                "ext-intl": "PHP Internationalization Functions",
+                "mitoteam/jpgraph": "Option for rendering charts, or including charts with PDF or HTML Writers",
+                "mpdf/mpdf": "Option for rendering PDF with PDF Writer",
+                "tecnickcom/tcpdf": "Option for rendering PDF with PDF Writer"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "PhpOffice\\PhpSpreadsheet\\": "src/PhpSpreadsheet"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Maarten Balliauw",
+                    "homepage": "https://blog.maartenballiauw.be"
+                },
+                {
+                    "name": "Mark Baker",
+                    "homepage": "https://markbakeruk.net"
+                },
+                {
+                    "name": "Franck Lefevre",
+                    "homepage": "https://rootslabs.net"
+                },
+                {
+                    "name": "Erik Tilt"
+                },
+                {
+                    "name": "Adrien Crivelli"
+                }
+            ],
+            "description": "PHPSpreadsheet - Read, Create and Write Spreadsheet documents in PHP - Spreadsheet engine",
+            "homepage": "https://github.com/PHPOffice/PhpSpreadsheet",
+            "keywords": [
+                "OpenXML",
+                "excel",
+                "gnumeric",
+                "ods",
+                "php",
+                "spreadsheet",
+                "xls",
+                "xlsx"
+            ],
+            "support": {
+                "issues": "https://github.com/PHPOffice/PhpSpreadsheet/issues",
+                "source": "https://github.com/PHPOffice/PhpSpreadsheet/tree/1.29.6"
+            },
+            "time": "2024-12-08T05:49:00+00:00"
+        },
         {
             "name": "phpoption/phpoption",
             "version": "1.9.2",
@@ -6532,6 +7121,520 @@
                 "source": "https://github.com/webmozarts/assert/tree/1.11.0"
             },
             "time": "2022-06-03T18:03:27+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables",
+            "version": "v10.1.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/datatables.git",
+                "reference": "7837d079edd88f088755a62b254e32068dfe16e1"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/datatables/zipball/7837d079edd88f088755a62b254e32068dfe16e1",
+                "reference": "7837d079edd88f088755a62b254e32068dfe16e1",
+                "shasum": ""
+            },
+            "require": {
+                "php": "^8.1",
+                "yajra/laravel-datatables-buttons": "^10",
+                "yajra/laravel-datatables-editor": "1.*",
+                "yajra/laravel-datatables-export": "^10",
+                "yajra/laravel-datatables-fractal": "^10",
+                "yajra/laravel-datatables-html": "^10",
+                "yajra/laravel-datatables-oracle": "^10"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "10.0-dev"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables Complete Package.",
+            "keywords": [
+                "datatables",
+                "jquery",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/datatables/issues",
+                "source": "https://github.com/yajra/datatables/tree/v10.1.0"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/sponsors/yajra",
+                    "type": "github"
+                }
+            ],
+            "time": "2023-02-20T05:26:34+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-buttons",
+            "version": "v10.0.9",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables-buttons.git",
+                "reference": "dc93c0ec8bae12005d7e591beebbe053f0abda7f"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables-buttons/zipball/dc93c0ec8bae12005d7e591beebbe053f0abda7f",
+                "reference": "dc93c0ec8bae12005d7e591beebbe053f0abda7f",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/console": "^10",
+                "php": "^8.1",
+                "yajra/laravel-datatables-html": "^10",
+                "yajra/laravel-datatables-oracle": "^10"
+            },
+            "require-dev": {
+                "barryvdh/laravel-snappy": "^1.0.1",
+                "larastan/larastan": "^2.4",
+                "maatwebsite/excel": "^3.1.46",
+                "orchestra/testbench": "^8",
+                "rap2hpoutre/fast-excel": "^5.1"
+            },
+            "suggest": {
+                "barryvdh/laravel-snappy": "Allows exporting of dataTable to PDF using the print view.",
+                "dompdf/dompdf": "Allows exporting of dataTable to PDF using the DomPDF.",
+                "maatwebsite/excel": "Exporting of dataTables (excel, csv and PDF) using maatwebsite package.",
+                "rap2hpoutre/fast-excel": "Faster exporting of dataTables using fast-excel package.",
+                "yajra/laravel-datatables-export": "Exporting of dataTables (excel, csv and PDF) via livewire and queue worker."
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "10.0-dev"
+                },
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\ButtonsServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables Buttons Plugin.",
+            "keywords": [
+                "buttons",
+                "datatables",
+                "jquery",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables-buttons/issues",
+                "source": "https://github.com/yajra/laravel-datatables-buttons/tree/v10.0.9"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/sponsors/yajra",
+                    "type": "github"
+                }
+            ],
+            "time": "2024-02-27T06:52:35+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-editor",
+            "version": "v1.25.4",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables-editor.git",
+                "reference": "23962356700d6b31f49bb119665b13e87303e13f"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables-editor/zipball/23962356700d6b31f49bb119665b13e87303e13f",
+                "reference": "23962356700d6b31f49bb119665b13e87303e13f",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/console": "*",
+                "illuminate/database": "*",
+                "illuminate/http": "*",
+                "illuminate/validation": "*",
+                "php": ">=7.0"
+            },
+            "require-dev": {
+                "orchestra/testbench": "~3.5"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "1.0-dev"
+                },
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\EditorServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables Editor plugin for Laravel 5.5+.",
+            "keywords": [
+                "JS",
+                "datatables",
+                "editor",
+                "html",
+                "jquery",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables-editor/issues",
+                "source": "https://github.com/yajra/laravel-datatables-editor/tree/v1.25.4"
+            },
+            "funding": [
+                {
+                    "url": "https://www.paypal.me/yajra",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/yajra",
+                    "type": "github"
+                },
+                {
+                    "url": "https://www.patreon.com/yajra",
+                    "type": "patreon"
+                }
+            ],
+            "time": "2023-02-21T06:57:59+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-export",
+            "version": "v10.1.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables-export.git",
+                "reference": "18a1a22195af7b22b03ba07b47946b1e0aa176f2"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables-export/zipball/18a1a22195af7b22b03ba07b47946b1e0aa176f2",
+                "reference": "18a1a22195af7b22b03ba07b47946b1e0aa176f2",
+                "shasum": ""
+            },
+            "require": {
+                "ext-json": "*",
+                "livewire/livewire": "^2.11.2|^3.0.1",
+                "openspout/openspout": "^4.12.1",
+                "php": "^8.1",
+                "phpoffice/phpspreadsheet": "^1.27",
+                "yajra/laravel-datatables": "^10.0"
+            },
+            "require-dev": {
+                "nunomaduro/larastan": "^2.4.1",
+                "orchestra/testbench": "^8.0.1"
+            },
+            "type": "library",
+            "extra": {
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\ExportServiceProvider"
+                    ]
+                },
+                "branch-alias": {
+                    "dev-master": "10.0-dev"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables Queued Export Plugin.",
+            "keywords": [
+                "datatables",
+                "excel",
+                "export",
+                "laravel",
+                "livewire",
+                "queue"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables-export/issues",
+                "source": "https://github.com/yajra/laravel-datatables-export/tree/v10.1.1"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/sponsors/yajra",
+                    "type": "github"
+                }
+            ],
+            "time": "2023-11-14T12:59:00+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-fractal",
+            "version": "v10.0.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables-fractal.git",
+                "reference": "765198d1f2b3f0a7c0c00f08ee41ba11be4ab1e2"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables-fractal/zipball/765198d1f2b3f0a7c0c00f08ee41ba11be4ab1e2",
+                "reference": "765198d1f2b3f0a7c0c00f08ee41ba11be4ab1e2",
+                "shasum": ""
+            },
+            "require": {
+                "league/fractal": "^0.20.1",
+                "php": "^8.1",
+                "yajra/laravel-datatables-oracle": "^10.0"
+            },
+            "require-dev": {
+                "nunomaduro/larastan": "^2.4",
+                "orchestra/testbench": "^7.21"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "10.0-dev"
+                },
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\FractalServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables Fractal Plugin.",
+            "keywords": [
+                "api",
+                "datatables",
+                "fractal",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables-fractal/issues",
+                "source": "https://github.com/yajra/laravel-datatables-fractal/tree/v10.0.0"
+            },
+            "time": "2023-02-07T03:46:04+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-html",
+            "version": "v10.12.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables-html.git",
+                "reference": "1c0fc1ff2026457ff29ab1a6a3433a44d59b251d"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables-html/zipball/1c0fc1ff2026457ff29ab1a6a3433a44d59b251d",
+                "reference": "1c0fc1ff2026457ff29ab1a6a3433a44d59b251d",
+                "shasum": ""
+            },
+            "require": {
+                "ext-json": "*",
+                "php": "^8.1",
+                "yajra/laravel-datatables-oracle": "^10.0"
+            },
+            "require-dev": {
+                "nunomaduro/larastan": "^2.4",
+                "orchestra/testbench": "^7.21"
+            },
+            "type": "library",
+            "extra": {
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\HtmlServiceProvider"
+                    ]
+                },
+                "branch-alias": {
+                    "dev-master": "10.0-dev"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "Laravel DataTables HTML builder plugin for Laravel 5.4+.",
+            "keywords": [
+                "JS",
+                "datatables",
+                "html",
+                "jquery",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables-html/issues",
+                "source": "https://github.com/yajra/laravel-datatables-html/tree/v10.12.0"
+            },
+            "funding": [
+                {
+                    "url": "https://www.paypal.me/yajra",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/yajra",
+                    "type": "github"
+                },
+                {
+                    "url": "https://www.patreon.com/yajra",
+                    "type": "patreon"
+                }
+            ],
+            "time": "2023-12-15T04:41:00+00:00"
+        },
+        {
+            "name": "yajra/laravel-datatables-oracle",
+            "version": "v10.11.4",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/yajra/laravel-datatables.git",
+                "reference": "a11dc9cf5ec7f7dc68ad0d5959c5e7aec0af29a5"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/yajra/laravel-datatables/zipball/a11dc9cf5ec7f7dc68ad0d5959c5e7aec0af29a5",
+                "reference": "a11dc9cf5ec7f7dc68ad0d5959c5e7aec0af29a5",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/database": "^9|^10",
+                "illuminate/filesystem": "^9|^10",
+                "illuminate/http": "^9|^10",
+                "illuminate/support": "^9|^10",
+                "illuminate/view": "^9|^10",
+                "php": "^8.0.2"
+            },
+            "require-dev": {
+                "algolia/algoliasearch-client-php": "^3.4",
+                "larastan/larastan": "^2.4",
+                "laravel/scout": "^10.5",
+                "meilisearch/meilisearch-php": "^1.4",
+                "orchestra/testbench": "^8",
+                "yajra/laravel-datatables-html": "^9.3.4|^10"
+            },
+            "suggest": {
+                "yajra/laravel-datatables-buttons": "Plugin for server-side exporting of dataTables.",
+                "yajra/laravel-datatables-editor": "Plugin to use DataTables Editor (requires a license).",
+                "yajra/laravel-datatables-export": "Plugin for server-side exporting using livewire and queue worker.",
+                "yajra/laravel-datatables-fractal": "Plugin for server-side response using Fractal.",
+                "yajra/laravel-datatables-html": "Plugin for server-side HTML builder of dataTables."
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "10.x-dev"
+                },
+                "laravel": {
+                    "providers": [
+                        "Yajra\\DataTables\\DataTablesServiceProvider"
+                    ],
+                    "aliases": {
+                        "DataTables": "Yajra\\DataTables\\Facades\\DataTables"
+                    }
+                }
+            },
+            "autoload": {
+                "files": [
+                    "src/helper.php"
+                ],
+                "psr-4": {
+                    "Yajra\\DataTables\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Arjay Angeles",
+                    "email": "aqangeles@gmail.com"
+                }
+            ],
+            "description": "jQuery DataTables API for Laravel 4|5|6|7|8|9|10",
+            "keywords": [
+                "datatables",
+                "jquery",
+                "laravel"
+            ],
+            "support": {
+                "issues": "https://github.com/yajra/laravel-datatables/issues",
+                "source": "https://github.com/yajra/laravel-datatables/tree/v10.11.4"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/sponsors/yajra",
+                    "type": "github"
+                }
+            ],
+            "time": "2024-02-28T05:00:23+00:00"
         }
     ],
     "packages-dev": [
@@ -8976,5 +10079,5 @@
         "php": "^8.1"
     },
     "platform-dev": [],
-    "plugin-api-version": "2.2.0"
+    "plugin-api-version": "2.6.0"
 }
diff --git a/config/app.php b/config/app.php
index 477f1df..76c7751 100644
--- a/config/app.php
+++ b/config/app.php
@@ -169,6 +169,7 @@
         App\Providers\EventServiceProvider::class,
         App\Providers\RouteServiceProvider::class,
         Spatie\Permission\PermissionServiceProvider::class,
+        Yajra\DataTables\DataTablesServiceProvider::class,
     ])->toArray(),
 
     /*
diff --git a/config/datatables.php b/config/datatables.php
new file mode 100644
index 0000000..0891264
--- /dev/null
+++ b/config/datatables.php
@@ -0,0 +1,127 @@
+<?php
+
+return [
+    /*
+     * DataTables search options.
+     */
+    'search' => [
+        /*
+         * Smart search will enclose search keyword with wildcard string "%keyword%".
+         * SQL: column LIKE "%keyword%"
+         */
+        'smart' => true,
+
+        /*
+         * Multi-term search will explode search keyword using spaces resulting into multiple term search.
+         */
+        'multi_term' => true,
+
+        /*
+         * Case insensitive will search the keyword in lower case format.
+         * SQL: LOWER(column) LIKE LOWER(keyword)
+         */
+        'case_insensitive' => true,
+
+        /*
+         * Wild card will add "%" in between every characters of the keyword.
+         * SQL: column LIKE "%k%e%y%w%o%r%d%"
+         */
+        'use_wildcards' => false,
+
+        /*
+         * Perform a search which starts with the given keyword.
+         * SQL: column LIKE "keyword%"
+         */
+        'starts_with' => false,
+    ],
+
+    /*
+     * DataTables internal index id response column name.
+     */
+    'index_column' => 'DT_RowIndex',
+
+    /*
+     * List of available builders for DataTables.
+     * This is where you can register your custom dataTables builder.
+     */
+    'engines' => [
+        'eloquent' => Yajra\DataTables\EloquentDataTable::class,
+        'query' => Yajra\DataTables\QueryDataTable::class,
+        'collection' => Yajra\DataTables\CollectionDataTable::class,
+        'resource' => Yajra\DataTables\ApiResourceDataTable::class,
+    ],
+
+    /*
+     * DataTables accepted builder to engine mapping.
+     * This is where you can override which engine a builder should use
+     * Note, only change this if you know what you are doing!
+     */
+    'builders' => [
+        //Illuminate\Database\Eloquent\Relations\Relation::class => 'eloquent',
+        //Illuminate\Database\Eloquent\Builder::class            => 'eloquent',
+        //Illuminate\Database\Query\Builder::class               => 'query',
+        //Illuminate\Support\Collection::class                   => 'collection',
+    ],
+
+    /*
+     * Nulls last sql pattern for PostgreSQL & Oracle.
+     * For MySQL, use 'CASE WHEN :column IS NULL THEN 1 ELSE 0 END, :column :direction'
+     */
+    'nulls_last_sql' => ':column :direction NULLS LAST',
+
+    /*
+     * User friendly message to be displayed on user if error occurs.
+     * Possible values:
+     * null             - The exception message will be used on error response.
+     * 'throw'          - Throws a \Yajra\DataTables\Exceptions\Exception. Use your custom error handler if needed.
+     * 'custom message' - Any friendly message to be displayed to the user. You can also use translation key.
+     */
+    'error' => env('DATATABLES_ERROR', null),
+
+    /*
+     * Default columns definition of dataTable utility functions.
+     */
+    'columns' => [
+        /*
+         * List of columns hidden/removed on json response.
+         */
+        'excess' => ['rn', 'row_num'],
+
+        /*
+         * List of columns to be escaped. If set to *, all columns are escape.
+         * Note: You can set the value to empty array to disable XSS protection.
+         */
+        'escape' => '*',
+
+        /*
+         * List of columns that are allowed to display html content.
+         * Note: Adding columns to list will make us available to XSS attacks.
+         */
+        'raw' => ['action'],
+
+        /*
+         * List of columns are forbidden from being searched/sorted.
+         */
+        'blacklist' => ['password', 'remember_token'],
+
+        /*
+         * List of columns that are only allowed fo search/sort.
+         * If set to *, all columns are allowed.
+         */
+        'whitelist' => '*',
+    ],
+
+    /*
+     * JsonResponse header and options config.
+     */
+    'json' => [
+        'header' => [],
+        'options' => 0,
+    ],
+
+    /*
+     * Default condition to determine if a parameter is a callback or not.
+     * Callbacks needs to start by those terms, or they will be cast to string.
+     */
+    'callback' => ['$', '$.', 'function'],
+];
diff --git a/resources/views/layanan-pemutihan/index.blade.php b/resources/views/layanan-pemutihan/index.blade.php
index 68ad8e6..ba70ec9 100644
--- a/resources/views/layanan-pemutihan/index.blade.php
+++ b/resources/views/layanan-pemutihan/index.blade.php
@@ -65,6 +65,7 @@
             <thead>
             <tr>
               <th>CaseID</th>
+              <th>Tanggal Pengajuan</th>
               <th>Program Studi</th>
               <th>Mata Kuliah</th>
               <th>Dosen Pengampu</th>
@@ -73,50 +74,18 @@
               <th>Action</th>
             </tr>
             </thead>
-            <tbody>
-            @foreach ($data as $datas)
-            <tr>
-              <td>@if($datas->status_operator === null)<span class="badge badge-warning">{{$datas->caseid}}</span> @elseif($datas->keterangan_operator != "0")<span class="badge badge-danger">{{$datas->caseid}}</span> @else <span class="badge badge-success">{{$datas->caseid}}</span>  @endif</td>
-              <td>{{ $datas->program_studi }}</td>
-              <td>{{ $datas->mata_kuliah }} </td>
-              <td>{{ $datas->dosen_pengampu }} </td>
-              <td>{{ $datas->ruang_kelas }} </td>
-              <td>{{ $datas->tanggal_kelas }}</td>
-              <td class="text-center">
-                <form action="{{ route('layanan-pemutihan.selesai',['caseid'=>$datas->caseid]) }}" method="post">@csrf 
-                <a class="btn btn-primary" data-toggle="modal" data-target="#MD{{ $datas->id }}">Details</a>
-                @if($datas->status_operator == null) | <button type="submit" id="selesai" class="btn btn-success">Selesai</button> | <a class="btn btn-danger" data-toggle="modal" data-target="#Delete{{ $datas->id }}">Tolak</a>@endif
-                </form>
-              </td>
-            </tr>
-            <!-- /.modal-Delete -->
-            <div class="modal fade" id="Delete{{$datas->id}}">
+           <!-- /.modal-Delete -->
+            <div class="modal fade" id="ModalDelete">
               <div class="modal-dialog modal-lg">
                 <div class="modal-content">
                   <div class="modal-header">
-                    <h4 class="modal-title">Apa Anda Yakin Menolak Pengajuan Pemutihan <b>{{ $datas->caseid }}</b> ?</h4>
+                    <h4 class="modal-title"></h4>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                       <span aria-hidden="true">&times;</span>
                     </button>
                   </div>
                   <div class="modal-body">
-                    <div class="alert alert-info alert-dismissible">
-                      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
-                      <h5><i class="icon fas fa-info"></i> Perhatian!</h5>
-                      <span >Alasan yang Dimasukkan Disini, Akan dikirimkan melalui Email Kepada Mahasiswa Terkait.</span>
-                    </div>
-                  <form action="{{ route('layanan-pemutihan.tolak',$datas->caseid) }}" method="post">
-                    @csrf
-                      <input type="hidden" name="id" value="{{$datas->id}}">
-                      <div class="row">
-                        <div class="col">
-                          <label for="keterangan_operator">Alasan:</label>
-                          <textarea name="keterangan_operator" class="form-control" id="keterangan_operator" cols="30" rows="10" 
-                          placeholder="Masukkan Alasan Disini
-                          Masukkan Alasan Disini"></textarea>
-                          <input type="hidden" name="id" value="{{$datas->id}}">
-                        </div>
-                      </div>
+                    
                   </div>
                   <div class="modal-footer justify-content-between">
                     <button type="button" class="btn btn-default" data-dismiss="modal">Batal</button>
@@ -129,89 +98,75 @@
               <!-- /.modal-dialog -->
             </div>
             <!-- Modal Detail dan Terima -->
-            <div class="modal fade" id="MD{{$datas->id}}">
+            <div class="modal fade" id="ModalDetail">
               <div class="modal-dialog modal-lg">
                 <div class="modal-content">
                   <div class="modal-header">
-                    <h4 class="modal-title">Details Data <b>{{ $datas->caseid }}</b></h4>
+                    <h4 class="modal-title">Details Data</h4>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                       <span aria-hidden="true">&times;</span>
                     </button>
                   </div>
                   <div class="modal-body">
-                  <div class="row">
-                    <div class="col">
-                      <label for="program_studi">Program Studi:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->program_studi }}">
-                      <label for="jam_kelas">Jam Kelas:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->jam_kelas }}">
-                      <label for="ruang_kelas">Ruang Kelas:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->ruang_kelas }}">
-                    </div>
-                    <div class="col">
-                      <label for="mata_kuliah">Mata Kuliah:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->mata_kuliah }}">
-                      <label for="tanggal_kelas">Tanggal Kelas:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->tanggal_kelas }}">
-                      <label for="bukti_izin_dosen">Bukti Izin Dosen:</label><br/>
-                      <a href="{{asset('storage')}}/pemutihan/{{ $datas->bukti_izin_dosen }}" target="_blank" class="btn btn-success">Klik Disini</a>
-                    </div>
-                  </div>
-                  <div class="row">
-                    <div class="col">
-                      <label for="dosen_pengampu">Dosen Pengampu: {{ $datas->ttd_dosen === '-' ? 'Belum Tanda Tangan' : 'Telah TTD Pada '.$datas->ttd_dosen }}</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->dosen_pengampu }}">
-                      <label for="jurnal_kuliah">Jurnal Kuliah:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->jurnal_kuliah }}">
-                      <label for="alasan">Alasan Pemutihan:</label>
-                      <input type="text" class="form-control form-control-border" readonly value="{{ $datas->alasan }}">
-                      <label for="keterangan">Keterangan:</label>
-                      <textarea name="keterangan" id="keterangan" cols="30" rows="10" class="form-control form-control-border" readonly>
-{{ $datas->keterangan }}
-                      </textarea>
-                    </div>
-                  </div>
-                  <div class="row">
-                    <div class="col">
-                      <label for="file_transkrip">Cetak Surat Pernyataan<br>
-                        <a href="{{ route('layanan-pemutihan.cetak',['caseid'=>$datas->caseid]) }}" target="_blank" class="btn btn-success">Klik Disini</a>
-                    </div>
-                  </div>
-                  @if($datas->status_operator == null)
-                    <div class="row mt-3">
+                    <!-- Content goes here -->
+                    <div class="row">
                       <div class="col">
-                          <form action="{{ route('layanan-pemutihan.selesai',['caseid'=>$datas->caseid]) }}" method="post">
-                          @csrf
-                          <input type="hidden" name="caseid" value="{{$datas->caseid}}">
-                          <button type="submit" id="selesai" class="btn btn-success btn-block">Selesai</button>
-                          </form>
+                        <label for="program_studi">Program Studi:</label>
+                        <input id="program_studi" type="text" class="form-control form-control-border" readonly value="">
+                        <label for="mata_kuliah">Mata Kuliah:</label>
+                        <input id="program_studi" type="text" class="form-control form-control-border" readonly value="">
+                      </div>
+                      <div class="col">
+                        <label for="jam_kelas">Jam Kelas:</label>
+                        <input id="jam_kelas" type="text" class="form-control form-control-border" readonly value="">
+                        <label for="tanggal_kelas">Tanggal Kelas:</label>
+                        <input id="tanggal_kelas" type="text" class="form-control form-control-border" readonly value="">
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="col">
+                        <div class="link-dokumen"></div>
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="col">
+                        <label for="ruang_kelas">Ruang Kelas:</label>
+                        <input id="ruang_kelas" type="text" class="form-control form-control-border" readonly value="">
+                        <label for="dosen_pengampu">Dosen Pengampu:</label>
+                        <input id="dosen_pengampu" class="form-control form-control-border" readonly value="">
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="col">
+                        <label for="jurnal_kuliah">Jurnal Perkuliahan:</label>
+                        <input id="jurnal_kuliah" class="form-control form-control-border" readonly value="">
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="col">
+                        <label for="alasan">Alasan Pemutihan:</label>
+                        <input id="alasan" class="form-control form-control-border" readonly value="">
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="col">
+                        <label for="keterangan">Keterangan Pemutihan:</label>
+                        <textarea name="keterangan" id="keterangan" class="form-control form-control-border" cols="30" rows="5" readonly></textarea>
                       </div>
                     </div>
-                    @endif
                   </div>
                   <div class="modal-footer justify-content-between">
-                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
-                    <span>{{$datas->caseid}}</span>
-                    @if($datas->ttd_operator=="-")
-                      <form action="{{ route('layanan-sempro.terima')}}" method="post">
-                      @csrf
-                      <input type="hidden" name="id" value="{{$datas->id}}">
-                      <button type="submit" class="btn btn-success">Terima</button>
-                      </form>
-                    @endif
-                  </form>
                   </div>
+
                 </div>
                 <!-- /.modal-content -->
               </div>
               <!-- /.modal-dialog -->
             </div>
-            
-            @endforeach
-            </tbody>
             <tfoot>
               <tr>
                 <th>CaseID</th>
+                <th>Tanggal Pengajuan</th>
                 <th>Program Studi</th>
                 <th>Mata Kuliah</th>
                 <th>Dosen Pengampu</th>
@@ -245,23 +200,168 @@
 <script src="{{asset('/')}}plugins/datatables-buttons/js/buttons.html5.min.js"></script>
 <script src="{{asset('/')}}plugins/datatables-buttons/js/buttons.print.min.js"></script>
 <script src="{{asset('/')}}plugins/datatables-buttons/js/buttons.colVis.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
 
 <script>
   $(function () {
-    $("#example1").DataTable({
-      "responsive": true, "lengthChange": false, "autoWidth": false,
-      "order": [[6, 'desc']],
-      "buttons": [{
-            // New button configuration
-            text: 'Tambah Data', // Replace with your desired button text
-            action: function ( e, dt, node, config ) {
-                // Perform your custom action here, e.g., open a new tab with the external link
-                window.open("{{ route('layanan-pemutihan.tambah')}}", '_blank');
-            }
-        },"csv", "excel", "pdf", "print", "colvis"]
-    }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
-
+    if(window.location.search === '?program_studi=s1'){
+         var url = '/admin/layanan-pemutihan/data?program_studi=s1';
+    }else if(window.location.search === '?program_studi=s2'){
+      var url = '/admin/layanan-pemutihan/data?program_studi=s2';
+    }else if(window.location.search === '?program_studi=psppa'){
+      var url = '/admin/layanan-pemutihan/data?program_studi=psppa';
+    }else{
+      var url = '/admin/layanan-pemutihan/data';
+    };
+    var table = $("#example1").DataTable({
+      "responsive": true,
+      "lengthChange": false,
+      "autoWidth": false,
+      "processing": true,
+      "serverSide": true,
+      "ajax": {
+        "url": url,
+      },
+      "columns": [{ // mengambil & menampilkan kolom sesuai tabel database
+                        data: 'caseid',
+                        // name: 'CaseID',
+                        searchable: true
+                    },
+                    {
+                        data: 'created_at',
+                        render: function(data, type, row) {
+                          return moment(data).format('DD-MM-YYYY hh:mm')
+                        }
+                    },
+                    {
+                        data: 'program_studi',
+                        // name: 'Program Studi'
+                    },
+                    {
+                        data: 'mata_kuliah',
+                        // name: 'Mata Kuliah'
+                    },
+                    {
+                        data: 'dosen_pengampu',
+                        // name: 'Dosen Pengampu'
+                    },
+                    {
+                        data: 'ruang_kelas',
+                        // name: 'Ruang Kuliah'
+                    },
+                    {
+                        data: 'tanggal_kelas',
+                        // name: 'Tanggal'
+                    },
+                    {
+                        data: 'action',
+                        searchable: false
+                        // name: 'Aksi'
+                    },
+                ],
+      "search": {
+        "caseInsensitive": true
+      },
+      order: [
+        [2, 'desc']
+      ]
+    })
   });
+  function showDetail($caseid) {
+    // Implement the logic to show the detail modal or navigate to the detail page
+    // For example, you can use AJAX to fetch the detail data and show it in a modal
+    // console.log($caseid);
+    $.ajax({
+      url: '/admin/layanan-pemutihan/data/'+$caseid,
+      method: 'GET',
+      success: function(data) {
+        // Populate the modal with the detail data
+        var result = data.data[0];
+        
+        var modalTitle = `
+        <h4 class="modal-title">Details Data <strong>${result.caseid}</strong></h4>
+        `;
+        var linkDokumen = `
+        <label for="bukti_izin_dosen">Bukti Izin Dosen :</label>
+        <a href="/storage/pemutihan/${result.bukti_izin_dosen}" target="_blank" class="form-control btn btn-success" id="bukti_izin_dosen">Klik Disini</a>
+        <label for="cetak_bukti_pemutihan">Cetak Surat Pernyataan :</label>
+        <a href="/admin/layanan-pemutihan/cetak/${result.caseid}" target="_blank" class="form-control btn btn-success">Klik Disini</a>
+        `;
+        $('#ModalDetail .link-dokumen').html(linkDokumen);
+        $('#ModalDetail .modal-title').html(modalTitle);
+        $('#ModalDetail #caseid').val(result.caseid);
+        $('#ModalDetail #program_studi').val(result.program_studi);
+        $('#ModalDetail #mata_kuliah').val(result.mata_kuliah);
+        $('#ModalDetail #jam_kelas').val(result.jam_kelas);
+        $('#ModalDetail #tanggal_kelas').val(result.tanggal_kelas);
+        $('#ModalDetail #ruang_kelas').val(result.ruang_kelas);
+        $('#ModalDetail #bukti_izin_dosen').val(result.bukti_izin_dosen);
+        $('#ModalDetail #dosen_pengampu').val(result.dosen_pengampu);
+        $('#ModalDetail #jurnal_kuliah').val(result.jurnal_kuliah);
+        $('#ModalDetail #alasan').val(result.alasan);
+        $('#ModalDetail #keterangan').val(result.keterangan);
+        
+        if(result.status_operator == null){
+          $('#ModalDetail .modal-footer').html(`
+          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+          <form action="/admin/layanan-pemutihan/selesai/${result.caseid}" method="post">
+            @csrf
+          <button type="submit" class="btn btn-success">Kirim</button>
+          </form>
+          `);
+        $('#ModalDetail').modal('show');
+        }
+        else{
+          $('#ModalDetail .modal-footer').html(`
+          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+          `);
+        }
+        $('#ModalDetail').modal('show');
+      }
+    });
+  }
+  function tolak($caseid) {
+    // Implement the logic to show the detail modal or navigate to the detail page
+    // For example, you can use AJAX to fetch the detail data and show it in a modal
+    // console.log($caseid);
+    $.ajax({
+      url: '/admin/layanan-pemutihan/data/'+$caseid,
+      method: 'GET',
+      success: function(data) {
+        // Populate the modal with the detail data
+        var result = data.data[0];
+        
+        var modalTitle = `
+        Apa Anda Yakin Menolak Pengajuan Pemutihan <b>${result.caseid}</b> ?
+        `;
+        $('#ModalDelete .modal-title').html(modalTitle);
+        
+
+        if(result.status_operator == null){
+          $('#ModalDelete .modal-body').html(`
+          <div class="alert alert-info alert-dismissible">
+                      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
+                      <h5><i class="icon fas fa-info"></i> Perhatian!</h5>
+                      <span >Alasan yang Dimasukkan Disini, Akan dikirimkan melalui Email Kepada Mahasiswa Terkait.</span>
+          </div>
+          <form action="/admin/layanan-pemutihan/tolak/${result.caseid}" method="post">
+          @csrf
+          <label for="keterangan_operator">Keterangan Operator :</label>
+          <textarea name="keterangan_operator" id="keterangan_operator" class="form-control" cols="20" rows="10" required></textarea>
+          <div class="text-center mt-3">
+          <button type="submit" class="btn btn-danger">Tolak</button>
+          </div>
+          </form>
+          `);
+          
+          $('#ModalDelete .modal-footer').html(`
+          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+          `);
+        }
+      $('#ModalDelete').modal('show');
+      }
+    });
+  }
 </script>
 @endpush
 
diff --git a/resources/views/layout/app.blade.php b/resources/views/layout/app.blade.php
index 515daf3..d15039b 100644
--- a/resources/views/layout/app.blade.php
+++ b/resources/views/layout/app.blade.php
@@ -31,6 +31,7 @@
 <script src="{{ asset('/') }}plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
 <!-- AdminLTE App -->
 <script src="{{ asset('/') }}dist/js/adminlte.min.js"></script>
+
 @stack('js')
 </body>
 </html>
diff --git a/resources/views/layout/navbars/sidebar.blade.php b/resources/views/layout/navbars/sidebar.blade.php
index aa09e30..5c5248c 100644
--- a/resources/views/layout/navbars/sidebar.blade.php
+++ b/resources/views/layout/navbars/sidebar.blade.php
@@ -46,13 +46,40 @@
           </li>
           @hasanyrole('Super Administrator|Operator Akademik')
           <li class="nav-header text-bold">LAYANAN AKADEMIK</li>
-          <li class="nav-item">
+          <li class="nav-item has-treeview">
             <a href="{{ route('layanan-pemutihan.index') }}" class="nav-link {{ Request::is('admin/layanan-pemutihan') ? 'active' : '' }}">
               <i class="nav-icon fas fa-chalkboard-teacher"></i>
               <p>
-                Pengajuan Pemutihan
+                Layanan Pemutihan
+                <i class="right fas fa-angle-left"></i>
               </p>
             </a>
+            <ul class="nav nav-treeview">
+              <li class="nav-item">
+                <a href="{{ route('layanan-pemutihan.index') }}" id="filter-s1-farmasi" class="nav-link {{ Request::is('admin/layanan-pemutihan/s1') ? 'active' : '' }}">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Keseluruhan</p>
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="{{ route('layanan-pemutihan.index',['program_studi' => 's1']) }}" id="filter-s1-farmasi" class="nav-link {{ Request::is('admin/layanan-pemutihan/s1') ? 'active' : '' }}">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>S1 Farmasi</p>
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="{{ route('layanan-pemutihan.index',['program_studi' => 's2']) }}" id="filter-s2-farmasi" class="nav-link {{ Request::is('admin/layanan-pemutihan/s2') ? 'active' : '' }}">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>S2 Farmasi</p>
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="{{ route('layanan-pemutihan.index',['program_studi' => 'psppa']) }}" class="nav-link {{ Request::is('admin/layanan-pemutihan/psppa') ? 'active' : '' }}">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>PSPPA</p>
+                </a>
+              </li>
+            </ul>
           </li>
           <li class="nav-item">
             <a href="{{ route('layanan-dpudpa.index') }}" class="nav-link {{ Request::is('admin/layanan-dpudpa') ? 'active' : '' }}">
diff --git a/routes/web.php b/routes/web.php
index a5c6496..1f9cf70 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -49,6 +49,8 @@
     //layanan Pemutihan kelas
     Route::get('/layanan-pemutihan', [LayananPemutihanController::class, 'index'])->name('layanan-pemutihan.index');
     Route::POST('/layanan-pemutihan', [LayananPemutihanController::class, 'terima'])->name('layanan-pemutihan.terima');
+    Route::get('/layanan-pemutihan/data', [LayananPemutihanController::class, 'data'])->name('layanan-pemutihan.data');
+    Route::get('/layanan-pemutihan/data/{caseid}', [LayananPemutihanController::class, 'detail'])->name('layanan-pemutihan.detail');
     Route::POST('/layanan-pemutihan/tolak/{caseid}', [LayananPemutihanController::class, 'tolak'])->name('layanan-pemutihan.tolak');
     Route::POST('/layanan-pemutihan/selesai/{caseid}', [LayananPemutihanController::class, 'selesai'])->name('layanan-pemutihan.selesai');
     //layanan Pengajuan DPU DPA