diff --git a/app/Http/Controllers/AjaxController.php b/app/Http/Controllers/AjaxController.php
index 099d500..8ee6169 100644
--- a/app/Http/Controllers/AjaxController.php
+++ b/app/Http/Controllers/AjaxController.php
@@ -12,6 +12,47 @@ use App\Models\Dataset\DatasetTable47;
 
 class AjaxController extends Controller
 {
+    function getResourceDataDashboard(Request $request,$id){
+        $_data = [];
+
+        $keyId = decode_id($id);
+        $instansi = Instansi::find($keyId);
+        $resource = json_decode($instansi->resource_data);
+        // dd($resource);
+
+        if(@$resource){
+            $data = TabelData::whereIn('MsTabelDataId',$resource)->count();
+        
+            if(@$data != 0){
+                $data = TabelData::whereIn('MsTabelDataId',$resource)->get();
+            }else{
+                $data = TabelData::all();
+            }
+        }else{
+            $data = TabelData::all();
+        }
+
+        // $data = TabelData::all();
+        
+        foreach ($data as $key => $value) {
+            $cek = Dataset::where('instansi_id',$keyId)->where('ms_tabel_data_id',$value->MsTabelDataId)->first();
+            if(@$cek){
+                $status = '<span class="p-2 bg-emerald-500 text-[10px] rounded text-white w-full"><i class="ri-check-line"></i></span>';
+            }else{
+                $status = '<span class="p-2 bg-red-500 text-[10px] rounded text-white w-full"><i class="ri-close-line"></i></span>';
+            }
+
+            $_data[] = [
+                'no'    => $key+1,
+                'tabel' => @$value->name,
+                'status' => @$status,
+                'tanggal' => @$cek ? date('d-m-Y',strtotime(@$cek->created_at)) : '-',
+            ];
+        }
+
+        return response()->json($_data);
+    }
+
     function getResourceData(Request $request){
         $_data = [];
 
@@ -45,6 +86,7 @@ class AjaxController extends Controller
 
         return response()->json(['data' => $_data,'status' => true]);
     }
+
     function getInstansi($type){
         $data = [];
 
diff --git a/app/Http/Controllers/HomeController.php b/app/Http/Controllers/HomeController.php
index 874fae6..ce30919 100644
--- a/app/Http/Controllers/HomeController.php
+++ b/app/Http/Controllers/HomeController.php
@@ -115,7 +115,7 @@ class HomeController extends Controller
                 $dataset = Dataset::whereIn('ms_tabel_data_id',$resource)->count();
             }
             $persentase = $countresource > 0 ? round(($dataset/$countresource)*100) : '0';
-            $btn = '<a onclick="openModal()" href="#" data-id="'.encode_id($row->MsInstansiId).'" class="p-2 rounded bg-blue-500 text-white">'.$dataset.'/'.$countresource.'</a>';
+            $btn = '<a href="#" data-id="'.encode_id($row->MsInstansiId).'" data-name="'.$row->name.'" class="p-2 rounded btnModal bg-blue-500 text-white">'.$dataset.'/'.$countresource.'</a>';
             if($persentase == 0){
                 $percent = '<span class="p-2 rounded bg-red-500 text-white">'.$persentase.'%</span>';
             }elseif($persentase > 0 && $persentase <= 50){
diff --git a/resources/views/layouts/master.blade.php b/resources/views/layouts/master.blade.php
index dd92979..382c823 100644
--- a/resources/views/layouts/master.blade.php
+++ b/resources/views/layouts/master.blade.php
@@ -30,6 +30,13 @@
             padding:10px;
             font-weight: 500!important;
 
+        }
+
+        .bootstrap-table .fixed-table-container .table td.tengah{
+            text-align: center!important;
+            padding:10px;
+            font-weight: 500!important;
+
         }
         body { font-family: 'Plus Jakarta Sans', sans-serif; }
         
diff --git a/resources/views/modules/dashboard/dashboard.blade.php b/resources/views/modules/dashboard/dashboard.blade.php
index fdc9ff9..00d7174 100644
--- a/resources/views/modules/dashboard/dashboard.blade.php
+++ b/resources/views/modules/dashboard/dashboard.blade.php
@@ -1,5 +1,7 @@
 @extends('layouts.master')
 @section('content')
+<style>
+</style>
     <div class="flex-1 overflow-y-auto p-8 custom-scrollbar">
         
         <!-- Stats Cards -->
@@ -81,10 +83,10 @@
                         id="grid-data">
                         <thead class="bg-slate-100 border-b border-slate-100">
                         <tr>
-                            <th class="border font-bold text-slate-900 text-center" data-width="10" data-field="no">No</th>
+                            <th class="border font-bold text-slate-900 text-center tengah" data-width="10" data-field="no">No</th>
                             <th class="border font-bold text-slate-900 text-center" data-field="name">Instansi</th>
-                            <th class="border font-bold text-slate-900 text-center" data-width="20" data-field="dataset">Dataset</th>
-                            <th class="border font-bold text-slate-900 text-center" data-width="20" data-field="persentase">Persentase</th>
+                            <th class="border font-bold text-slate-900 text-center tengah" data-width="20" data-field="dataset">Dataset</th>
+                            <th class="border font-bold text-slate-900 text-center tengah" data-width="20" data-field="persentase">Persentase</th>
                         </tr>
                         </thead>
                         <tbody></tbody>
@@ -113,7 +115,7 @@
                             data-sort-order="desc"
                             data-page-size="10"
                             data-id-field="id"
-                            id="grid-data">
+                            id="grid-data1">
                             <thead class="bg-slate-100 border-b border-slate-100">
                             <tr>
                                 <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="name">Dataset</th>
@@ -144,7 +146,7 @@
                             data-sort-order="desc"
                             data-page-size="10"
                             data-id-field="id"
-                            id="grid-data">
+                            id="grid-data2">
                             <thead class="bg-slate-100 border-b border-slate-100">
                             <tr>
                                 <th class="text-[10px] border font-bold text-slate-900 text-center" data-width="20" data-field="dataset">Dataset</th>
@@ -170,8 +172,31 @@
                 &times;
             </button>
 
-            <h2 class="text-xl font-bold mb-4">Tabel Data Dirjen Bina Marga</h2>
-            <table class="w-full border text-left border-collapse">
+            <h2 class="text-xl font-bold mb-4 title">Tabel Data Dirjen Bina Marga</h2>
+            <table class="w-full border text-left border-collapse" 
+                data-search="false"
+                data-toggle="table"
+                data-pagination="true"
+                data-toolbar="#toolbar"
+                data-show-refresh="false"
+                data-url=""
+                data-sort-name="ids"
+                data-sort-order="desc"
+                data-page-size="10"
+                data-id-field="id"
+                id="bodyTabelModal">
+                <thead class="bg-slate-100 border-b border-slate-100">
+                <tr>
+                    <th class="text-[10px] border font-bold text-slate-900 text-center tengah" data-width="3" data-field="no">No</th>
+                    <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="tabel">Tabel Utama</th>
+                    <th class="text-[10px] border font-bold text-slate-900 text-center tengah" data-field="status">Status</th>
+                    <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="tanggal">Tanggal Unggah</th>
+                </tr>
+                </thead>
+                <tbody></tbody>
+            </table>
+
+            {{-- <table class="w-full border text-left border-collapse">
                 <thead class="bg-slate-100 border-b border-slate-100">
                     <tr>
                         <th class="p-2 border font-bold text-slate-900 text-center" data-field="name">No</th>
@@ -179,14 +204,14 @@
                         <th class="p-2 border font-bold text-slate-900 text-center" data-field="name">Tanggal Input</th>
                     </tr>
                 </thead>
-                <tbody>
+                <tbody id="bodyTabelModal">
                     <tr>
                         <td class="p-2 border text-slate-900 text-center" data-field="name">1</td>
                         <td class="p-2 border text-slate-900 text-center" data-field="name">Tes</td>
                         <td class="p-2 border text-slate-900 text-center" data-field="name">2</td>
                     </tr>
                 </tbody>
-            </table>
+            </table> --}}
             
 
         </div>
@@ -194,10 +219,24 @@
 @endsection
 @section('js')
 <script>
-function openModal() {
-    document.getElementById('modal').classList.remove('hidden');
-    document.getElementById('modal').classList.add('flex');
-}
+    $("#grid-data").on("click", ".btnModal", function() {
+        
+        document.getElementById('modal').classList.remove('hidden');
+        document.getElementById('modal').classList.add('flex');
+
+        var id = $(this).attr('data-id');
+        var name = $(this).attr('data-name');
+        
+        var base_url = "{{url('/')}}";
+        var html = '';
+        var url = base_url + '/getResourceDataDashboard/' + id;
+        $('.title').html('Tabel Data '+name);
+
+        $('#bodyTabelModal').bootstrapTable('refresh', {
+            url: url
+        });
+        
+    });
 
 function closeModal() {
     document.getElementById('modal').classList.remove('flex');
diff --git a/resources/views/modules/management/role/akses/form.blade.php b/resources/views/modules/management/role/akses/form.blade.php
index 73d9496..8e15208 100644
--- a/resources/views/modules/management/role/akses/form.blade.php
+++ b/resources/views/modules/management/role/akses/form.blade.php
@@ -11,15 +11,15 @@
                     data-search="false"
                     data-show-refresh ="false"
                     data-page-size="700">
-                    <thead class="bg-slate-50/50 border-b border-slate-100">
+                    <thead class="bg-slate-100 border-b border-slate-100">
                     <tr>
                         <th class="text-[10px] border font-bold text-slate-900 text-center"  width="20">#</th>
                         <th class="text-[10px] border font-bold text-slate-900 text-center" >Menu</th>
-                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkread"> Read</label></th>
-                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkadd"> Create</label></th>
-                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkedit"> Update</label></th>
-                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkdel"> Delete</label></th>
-                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkdownload"> Download</label></th>
+                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkread"> Lihat</label></th>
+                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkadd"> Tambah</label></th>
+                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkedit"> Edit</label></th>
+                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkdel"> Hapus</label></th>
+                        <th class="text-[10px] border font-bold text-slate-900 text-center"  width="100"><label><input type="checkbox" class="checkdownload"> Unggah</label></th>
                     </tr>
                     </thead>
                     <tbody>
diff --git a/resources/views/modules/management/role/index.blade.php b/resources/views/modules/management/role/index.blade.php
index ea19c26..e1d331b 100644
--- a/resources/views/modules/management/role/index.blade.php
+++ b/resources/views/modules/management/role/index.blade.php
@@ -25,11 +25,11 @@
                     data-page-size="10"
                     data-id-field="id"
                     id="grid-data">
-                  <thead class="bg-slate-50/50 border-b border-slate-100">
+                  <thead class="bg-slate-100 border-b border-slate-100">
                     <tr>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="action">#</th>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="no">No</th>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="name">Name</th>
+                      <th class="border font-bold text-slate-900 text-center tengah" data-width="10" data-field="action">#</th>
+                      <th class="border font-bold text-slate-900 text-center" data-width="10" data-field="no">No</th>
+                      <th class="border font-bold text-slate-900 text-center" data-field="name">Name</th>
                     </tr>
                   </thead>
                   <tbody class="gridjs-tbody"></tbody>
diff --git a/resources/views/modules/management/user/form.blade.php b/resources/views/modules/management/user/form.blade.php
index 2131ecb..9aa200d 100644
--- a/resources/views/modules/management/user/form.blade.php
+++ b/resources/views/modules/management/user/form.blade.php
@@ -58,7 +58,7 @@
 
                 <div class="flex gap-4">
                     <label class="mb-3 w-1/2 font-semibold required">Instansi</label>
-                    <select name="ms_instansi_id" id="ms_instansi_id" class="p-2 bg-white rounded border w-full @error('ms_instansi_id') is-invalid @enderror" required>
+                    <select name="ms_instansi_id" id="ms_instansi_id" class="p-2 bg-white rounded border w-full select2 @error('ms_instansi_id') is-invalid @enderror" required>
                         <option value="">-Pilih Jenis Instansi-</option>
                         @if(@$userInstansi)
                             <option selected value="{{encode_id(@$userInstansi->ms_instansi_id)}}">{{@$userInstansi->instansi->name}}</option>
@@ -93,38 +93,63 @@
     <script src="{{asset('assets/libs/choices.js/public/assets/scripts/choices.min.js')}}"></script>
     
 	<script type="text/javascript">
-        const typeSelect  = document.getElementById('type');
-        const instansiSelect = document.getElementById('ms_instansi_id');
-        const choicesInstansi = new Choices(instansiSelect, {
-            allowHTML: false,
-            searchPlaceholderValue: 'Pilih Instansi terlebih dahulu',
-        });
-        
 
-        // Ketika user memilih sekolah, load ulang kelas
-        typeSelect.addEventListener('change', function() {
-            const type = this.value;
-            
-            // Kosongkan pilihan kelas sebelumnya
-            choicesInstansi.clearChoices();
-
-            // Load data kelas berdasarkan type
-            choicesInstansi.setChoices(() => {
-                return fetch(`{{ url('getInstansi') }}/${type}`)
-                .then(res => res.json())
-                .then(res => {
-                    return res.data.map(item => ({
-                        label: item.name,
-                        value: item.id
-                    }));
-                })
-                .catch(err => {
-                    console.error('Gagal load instansi:', err);
-                    return [];
-                });
+         // ketika type berubah
+        $('#type').on('change', function () {
+            const type = $(this).val();
+            $.ajax({
+                method: "GET",
+                url: `{{ url('getInstansi') }}/${type}`,
+            }).done(function(msg) {
+                obj = msg.data;
+                $('.remove').remove();
+                if (obj.length > 0) {
+                
+                    $.each(obj, function(index) {
+                        value = obj[index].id;
+                        text = obj[index].name;
+                        $('#ms_instansi_id').append('<option class="remove" value=' + value + '>' + text + '</option>');
+                    });
+                }else {
+                    $('.remove').remove();
+                }
+                $('#loading-spinner').hide();
             });
 
         });
+        
+        // const typeSelect  = document.getElementById('type');
+        // const instansiSelect = document.getElementById('ms_instansi_id');
+        // const choicesInstansi = new Choices(instansiSelect, {
+        //     allowHTML: false,
+        //     searchPlaceholderValue: 'Pilih Instansi terlebih dahulu',
+        // });
+        
+
+        // // Ketika user memilih sekolah, load ulang kelas
+        // typeSelect.addEventListener('change', function() {
+        //     const type = this.value;
+            
+        //     // Kosongkan pilihan kelas sebelumnya
+        //     choicesInstansi.clearChoices();
+
+        //     // Load data kelas berdasarkan type
+        //     choicesInstansi.setChoices(() => {
+        //         return fetch(`{{ url('getInstansi') }}/${type}`)
+        //         .then(res => res.json())
+        //         .then(res => {
+        //             return res.data.map(item => ({
+        //                 label: item.name,
+        //                 value: item.id
+        //             }));
+        //         })
+        //         .catch(err => {
+        //             console.error('Gagal load instansi:', err);
+        //             return [];
+        //         });
+        //     });
+
+        // });
         $('#togglePassword').on('click', function() {
             let passwordField = $('#password');
             let icon = $(this).find('i');
diff --git a/resources/views/modules/management/user/index.blade.php b/resources/views/modules/management/user/index.blade.php
index 90b43d5..a116b6d 100644
--- a/resources/views/modules/management/user/index.blade.php
+++ b/resources/views/modules/management/user/index.blade.php
@@ -25,12 +25,12 @@
                     data-page-size="10"
                     data-id-field="id"
                     id="grid-data">
-                  <thead class="bg-slate-50/50 border-b border-slate-100">
+                  <thead class="bg-slate-100 border-b border-slate-100">
                     <tr>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="action">#</th>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="no">No</th>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="name">Name</th>
-                      <th class="text-[10px] border font-bold text-slate-900 text-center" data-field="role">Role</th>
+                      <th class="border font-bold text-slate-900 text-center tengah" data-width="10" data-field="action">#</th>
+                      <th class="border font-bold text-slate-900 text-center" data-width="10" data-field="no">No</th>
+                      <th class="border font-bold text-slate-900 text-center" data-field="name">Name</th>
+                      <th class="border font-bold text-slate-900 text-center" data-field="role">Role</th>
                     </tr>
                   </thead>
               </table>
diff --git a/routes/modules/modules.php b/routes/modules/modules.php
index 5f2cd49..1f132bb 100644
--- a/routes/modules/modules.php
+++ b/routes/modules/modules.php
@@ -18,6 +18,7 @@ use App\Http\Controllers\AjaxController;
 Route::get('getPenduduk/{tahun}',[AjaxController::class,'getPenduduk'])->name('getPenduduk');
 Route::get('getTimbulan/{tahun}',[AjaxController::class,'getTimbulan'])->name('getTimbulan');
 Route::get('getResourceData',[AjaxController::class,'getResourceData'])->name('getResourceData');
+Route::get('getResourceDataDashboard/{id}',[AjaxController::class,'getResourceDataDashboard'])->name('getResourceDataDashboard');
 
 Route::name('dashboard.')->prefix('dashboard')->group(function () {
     Route::get('/',[HomeController::class,'dashboard'])->name('dashboard');