update
parent
47cb21e8c4
commit
c32bfe2795
|
|
@ -12,6 +12,47 @@ use App\Models\Dataset\DatasetTable47;
|
||||||
|
|
||||||
class AjaxController extends Controller
|
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){
|
function getResourceData(Request $request){
|
||||||
$_data = [];
|
$_data = [];
|
||||||
|
|
||||||
|
|
@ -45,6 +86,7 @@ class AjaxController extends Controller
|
||||||
|
|
||||||
return response()->json(['data' => $_data,'status' => true]);
|
return response()->json(['data' => $_data,'status' => true]);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getInstansi($type){
|
function getInstansi($type){
|
||||||
$data = [];
|
$data = [];
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -115,7 +115,7 @@ class HomeController extends Controller
|
||||||
$dataset = Dataset::whereIn('ms_tabel_data_id',$resource)->count();
|
$dataset = Dataset::whereIn('ms_tabel_data_id',$resource)->count();
|
||||||
}
|
}
|
||||||
$persentase = $countresource > 0 ? round(($dataset/$countresource)*100) : '0';
|
$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){
|
if($persentase == 0){
|
||||||
$percent = '<span class="p-2 rounded bg-red-500 text-white">'.$persentase.'%</span>';
|
$percent = '<span class="p-2 rounded bg-red-500 text-white">'.$persentase.'%</span>';
|
||||||
}elseif($persentase > 0 && $persentase <= 50){
|
}elseif($persentase > 0 && $persentase <= 50){
|
||||||
|
|
|
||||||
|
|
@ -30,6 +30,13 @@
|
||||||
padding:10px;
|
padding:10px;
|
||||||
font-weight: 500!important;
|
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; }
|
body { font-family: 'Plus Jakarta Sans', sans-serif; }
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,7 @@
|
||||||
@extends('layouts.master')
|
@extends('layouts.master')
|
||||||
@section('content')
|
@section('content')
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
<div class="flex-1 overflow-y-auto p-8 custom-scrollbar">
|
<div class="flex-1 overflow-y-auto p-8 custom-scrollbar">
|
||||||
|
|
||||||
<!-- Stats Cards -->
|
<!-- Stats Cards -->
|
||||||
|
|
@ -81,10 +83,10 @@
|
||||||
id="grid-data">
|
id="grid-data">
|
||||||
<thead class="bg-slate-100 border-b border-slate-100">
|
<thead class="bg-slate-100 border-b border-slate-100">
|
||||||
<tr>
|
<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-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 tengah" 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="persentase">Persentase</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody></tbody>
|
<tbody></tbody>
|
||||||
|
|
@ -113,7 +115,7 @@
|
||||||
data-sort-order="desc"
|
data-sort-order="desc"
|
||||||
data-page-size="10"
|
data-page-size="10"
|
||||||
data-id-field="id"
|
data-id-field="id"
|
||||||
id="grid-data">
|
id="grid-data1">
|
||||||
<thead class="bg-slate-100 border-b border-slate-100">
|
<thead class="bg-slate-100 border-b border-slate-100">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="text-[10px] border font-bold text-slate-900 text-center" data-field="name">Dataset</th>
|
<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-sort-order="desc"
|
||||||
data-page-size="10"
|
data-page-size="10"
|
||||||
data-id-field="id"
|
data-id-field="id"
|
||||||
id="grid-data">
|
id="grid-data2">
|
||||||
<thead class="bg-slate-100 border-b border-slate-100">
|
<thead class="bg-slate-100 border-b border-slate-100">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="text-[10px] border font-bold text-slate-900 text-center" data-width="20" data-field="dataset">Dataset</th>
|
<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>
|
</button>
|
||||||
|
|
||||||
<h2 class="text-xl font-bold mb-4">Tabel Data Dirjen Bina Marga</h2>
|
<h2 class="text-xl font-bold mb-4 title">Tabel Data Dirjen Bina Marga</h2>
|
||||||
<table class="w-full border text-left border-collapse">
|
<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">
|
<thead class="bg-slate-100 border-b border-slate-100">
|
||||||
<tr>
|
<tr>
|
||||||
<th class="p-2 border font-bold text-slate-900 text-center" data-field="name">No</th>
|
<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>
|
<th class="p-2 border font-bold text-slate-900 text-center" data-field="name">Tanggal Input</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody id="bodyTabelModal">
|
||||||
<tr>
|
<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">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">Tes</td>
|
||||||
<td class="p-2 border text-slate-900 text-center" data-field="name">2</td>
|
<td class="p-2 border text-slate-900 text-center" data-field="name">2</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table> --}}
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -194,10 +219,24 @@
|
||||||
@endsection
|
@endsection
|
||||||
@section('js')
|
@section('js')
|
||||||
<script>
|
<script>
|
||||||
function openModal() {
|
$("#grid-data").on("click", ".btnModal", function() {
|
||||||
document.getElementById('modal').classList.remove('hidden');
|
|
||||||
document.getElementById('modal').classList.add('flex');
|
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() {
|
function closeModal() {
|
||||||
document.getElementById('modal').classList.remove('flex');
|
document.getElementById('modal').classList.remove('flex');
|
||||||
|
|
|
||||||
|
|
@ -11,15 +11,15 @@
|
||||||
data-search="false"
|
data-search="false"
|
||||||
data-show-refresh ="false"
|
data-show-refresh ="false"
|
||||||
data-page-size="700">
|
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>
|
<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" 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" >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="checkread"> Lihat</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="checkadd"> Tambah</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="checkedit"> Edit</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="checkdel"> Hapus</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="checkdownload"> Unggah</label></th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
|
|
|
||||||
|
|
@ -25,11 +25,11 @@
|
||||||
data-page-size="10"
|
data-page-size="10"
|
||||||
data-id-field="id"
|
data-id-field="id"
|
||||||
id="grid-data">
|
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>
|
<tr>
|
||||||
<th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="action">#</th>
|
<th class="border font-bold text-slate-900 text-center tengah" 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="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" data-field="name">Name</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody class="gridjs-tbody"></tbody>
|
<tbody class="gridjs-tbody"></tbody>
|
||||||
|
|
|
||||||
|
|
@ -58,7 +58,7 @@
|
||||||
|
|
||||||
<div class="flex gap-4">
|
<div class="flex gap-4">
|
||||||
<label class="mb-3 w-1/2 font-semibold required">Instansi</label>
|
<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>
|
<option value="">-Pilih Jenis Instansi-</option>
|
||||||
@if(@$userInstansi)
|
@if(@$userInstansi)
|
||||||
<option selected value="{{encode_id(@$userInstansi->ms_instansi_id)}}">{{@$userInstansi->instansi->name}}</option>
|
<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 src="{{asset('assets/libs/choices.js/public/assets/scripts/choices.min.js')}}"></script>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<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
|
// ketika type berubah
|
||||||
typeSelect.addEventListener('change', function() {
|
$('#type').on('change', function () {
|
||||||
const type = this.value;
|
const type = $(this).val();
|
||||||
|
$.ajax({
|
||||||
// Kosongkan pilihan kelas sebelumnya
|
method: "GET",
|
||||||
choicesInstansi.clearChoices();
|
url: `{{ url('getInstansi') }}/${type}`,
|
||||||
|
}).done(function(msg) {
|
||||||
// Load data kelas berdasarkan type
|
obj = msg.data;
|
||||||
choicesInstansi.setChoices(() => {
|
$('.remove').remove();
|
||||||
return fetch(`{{ url('getInstansi') }}/${type}`)
|
if (obj.length > 0) {
|
||||||
.then(res => res.json())
|
|
||||||
.then(res => {
|
$.each(obj, function(index) {
|
||||||
return res.data.map(item => ({
|
value = obj[index].id;
|
||||||
label: item.name,
|
text = obj[index].name;
|
||||||
value: item.id
|
$('#ms_instansi_id').append('<option class="remove" value=' + value + '>' + text + '</option>');
|
||||||
}));
|
});
|
||||||
})
|
}else {
|
||||||
.catch(err => {
|
$('.remove').remove();
|
||||||
console.error('Gagal load instansi:', err);
|
}
|
||||||
return [];
|
$('#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() {
|
$('#togglePassword').on('click', function() {
|
||||||
let passwordField = $('#password');
|
let passwordField = $('#password');
|
||||||
let icon = $(this).find('i');
|
let icon = $(this).find('i');
|
||||||
|
|
|
||||||
|
|
@ -25,12 +25,12 @@
|
||||||
data-page-size="10"
|
data-page-size="10"
|
||||||
data-id-field="id"
|
data-id-field="id"
|
||||||
id="grid-data">
|
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>
|
<tr>
|
||||||
<th class="text-[10px] border font-bold text-slate-900 text-center" data-width="10" data-field="action">#</th>
|
<th class="border font-bold text-slate-900 text-center tengah" 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="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" 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" data-field="role">Role</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
|
|
@ -18,6 +18,7 @@ use App\Http\Controllers\AjaxController;
|
||||||
Route::get('getPenduduk/{tahun}',[AjaxController::class,'getPenduduk'])->name('getPenduduk');
|
Route::get('getPenduduk/{tahun}',[AjaxController::class,'getPenduduk'])->name('getPenduduk');
|
||||||
Route::get('getTimbulan/{tahun}',[AjaxController::class,'getTimbulan'])->name('getTimbulan');
|
Route::get('getTimbulan/{tahun}',[AjaxController::class,'getTimbulan'])->name('getTimbulan');
|
||||||
Route::get('getResourceData',[AjaxController::class,'getResourceData'])->name('getResourceData');
|
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::name('dashboard.')->prefix('dashboard')->group(function () {
|
||||||
Route::get('/',[HomeController::class,'dashboard'])->name('dashboard');
|
Route::get('/',[HomeController::class,'dashboard'])->name('dashboard');
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue