update
parent
47cb21e8c4
commit
c32bfe2795
|
|
@ -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 = [];
|
||||
|
||||
|
|
|
|||
|
|
@ -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){
|
||||
|
|
|
|||
|
|
@ -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; }
|
||||
|
||||
|
|
|
|||
|
|
@ -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 @@
|
|||
×
|
||||
</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');
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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 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) {
|
||||
|
||||
// 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 [];
|
||||
});
|
||||
$.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');
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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');
|
||||
|
|
|
|||
Loading…
Reference in New Issue