Commit c97259c9 authored by Muhamad's avatar Muhamad

upgrade .js

parent 23cae4a3
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
// SIDEBAR JS
$("#sel-kec ").change(function() {
var id_kec = $(this).val()
console.log(id_kec)
// $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $("#list_perbaikan").dataTable().fnDestroy();
$(".datatab").dataTable().fnDestroy()
// $("#dataperb").css('display', 'none')
// $(".datatab").css('display', 'none')
// $(".datatable-show-all.list_perb").html('kosong')
$.ajax({
url: "api/filt_perbaikan_kecamatan",
data: {
'id_kec': id_kec
},
dataType: 'json',
success: function(data) {
if (data['res_kel'] == 'all_kecamatan') {
$('#sel-desa').html(`<option>Pilih Desa</option>`);
} else {
var data_all_desa = []
for (var i = 0; i < data['res_kel'].length; i++) {
var id_k = data['res_kel'][i][0];
var data_k = data['res_kel'][i][1];
var data_kel = `<option value="` + id_k + ` ">` +
data_k +
`</option>`;
data_all_desa.push(data_kel)
};
$('#sel-desa').html(`<option>Pilih Desa</option>` + data_all_desa);
}
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data['res_perbaikan'].length; i++) {
number += 1;
var name_perbaikan = data['res_perbaikan'][i]['name_perbaikan'];
var id_object = data['res_perbaikan'][i]['id_object'];
var name = data['res_perbaikan'][i]['name'];
var type = data['res_perbaikan'][i]['type'];
var tgl_perbaikan = data['res_perbaikan'][i]['tgl_perbaikan'];
var anggaran = data['res_perbaikan'][i]['anggaran'];
var tgl_selesai = data['res_perbaikan'][i]['tgl_selesai'];
console.log(number, name, name_perbaikan)
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + name_perbaikan + `</td>
<td>` + name + `</td>
<td>` + type + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td class="text-center ">
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal " data-target="#modal_detail_perbaikan " style="background-color: #5A9AFB;color: white;border-radius: 5px;width: 85px;height: 25px; ">
<div style="margin-top: -5px; ">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
<span>&nbsp;&nbsp;
Detail</span>
</div>
</a>
</td>
</tr>`;
// var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
// <div>
// ` + number + `
// </div>
// <div>
// ` + name_perbaikan + `
// </div>
// <div>
// ` + name + `
// </div>
// <div>
// ` + type + `
// </div>
// <div>
// ` + tgl_perbaikan + `
// </div>
// <div>
// ` + tgl_selesai + `
// </div>
// <div>
// ` + anggaran + `
// </div>
// <div>
// <a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
// <span>
// <i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
// &nbsp;&nbsp;
// Detail
// </span>
// </a>
// </div>
// </li>`;
data_perbaikan.push(data_gab)
};
// $("#tbody_perbaikan").html(data_perbaikan)
// $("#dataperb").html(data_perbaikan)
$("#dataperb").html(data_gab)
datatatata()
}
});
});
$("#sel-desa ").change(function() {
var id_desa = $(this).val()
console.log(id_desa)
// $(".datatab").dataTable().fnDestroy()
// $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $("#list_perbaikan").dataTable().fnDestroy();
$(".datatab").dataTable().fnDestroy()
$.ajax({
url: "api/filt_perbaikan_desa",
data: {
'id_desa': id_desa
},
dataType: 'json',
success: function(data) {
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data['res_perbaikan'].length; i++) {
number += 1;
var name_perbaikan = data['res_perbaikan'][i]['name_perbaikan'];
var id_object = data['res_perbaikan'][i]['id_object'];
var name = data['res_perbaikan'][i]['name'];
var type = data['res_perbaikan'][i]['type'];
var tgl_perbaikan = data['res_perbaikan'][i]['tgl_perbaikan'];
var anggaran = data['res_perbaikan'][i]['anggaran'];
var tgl_selesai = data['res_perbaikan'][i]['tgl_selesai'];
console.log(number, name, name_perbaikan)
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + name_perbaikan + `</td>
<td>` + name + `</td>
<td>` + type + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td class="text-center ">
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal " data-target="#modal_detail_perbaikan " style="background-color: #5A9AFB;color: white;border-radius: 5px;width: 85px;height: 25px; ">
<div style="margin-top: -5px; ">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
<span>&nbsp;&nbsp;
Detail</span>
</div>
</a>
</td>
</tr>`;
// var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
// <div>
// ` + number + `
// </div>
// <div>
// ` + name_perbaikan + `
// </div>
// <div>
// ` + name + `
// </div>
// <div>
// ` + type + `
// </div>
// <div>
// ` + tgl_perbaikan + `
// </div>
// <div>
// ` + tgl_selesai + `
// </div>
// <div>
// ` + anggaran + `
// </div>
// <div>
// <a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
// <span>
// <i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
// &nbsp;&nbsp;
// Detail
// </span>
// </a>
// </div>
// </li>`;
data_perbaikan.push(data_gab)
};
// $("#tbody_perbaikan ").html(data_perbaikan)
// $("#dataperb").html(data_perbaikan)
$("#dataperb").html(data_gab)
datatatata()
}
});
});
function datatatata() {
// $('.datatable-show-all.list_perb').DataTable({
$('.datatab').DataTable({
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, {
orderable: false,
width: '20px',
targets: [6],
}, {
orderable: false,
width: '20px',
targets: [7],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
drawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
},
preDrawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
}
});
}
// $("#perbaikan_manage").click(function() {
// // $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $(".datatab").dataTable().fnDestroy();
// setTimeout(function() {
// datatatata()
// }, 100);
//
//
// })
function loaddetailid(id) {
$(".map_detail_p").html(``)
var isObject = {};
isObject.id = id;
$("#iduser ").val(id)
$.ajax({
url: "loadDetail",
data: isObject,
dataType: 'json',
type: 'post',
success: function(data) {
$("#modal_detail_perbaikan").modal('show')
$(".map_detail_p").html(`<div id="map_detail_perbaikan" style=" position: relative; height: 220px; width: 90%; border-radius: 5px; ">`)
var map_detail_perbaikan = L.map('map_detail_perbaikan', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([-4.125826277307029, 104.1881561279297], 10);
L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}&s=Gal&apistyle=s.t:0|s.e:l|p.v:off', {
maxZoom: 21,
minZoom: 4,
}).addTo(map_detail_perbaikan);
setTimeout(function() {
map_detail_perbaikan.invalidateSize();
}, 500);
if (data.length === 0) {
$(".nama_detail").text("Null");
$(".type_detail ").html("Null");
$(".tanggal_perbaikan_detail ").html("Null")
// $(".anggaran_detail ").html("Null")
// $(".penanggung_jawab_detail ").html("Null")
// $(".penanggung_jawab_lapangan_detail ").html("Null")
// $(".kontraktor_detail ").html("Null")
$(".panjang_jalan_detail ").html("Null")
$(".lebar_jalan_detail ").html("Null")
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/null" id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 80px;width: 80px; ">
// </a>`);
//
//
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/null" onclick="viewBukti() " id="view-bukti ">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
} else {
console.log(data[0]['jenis'])
if (data[0]['jenis'] == 'jalan') {
$(".nama_detail").html(data[0]['name']);
$(".type_detail ").html(data[0]['type'])
$(".tanggal_perbaikan_detail ").text(data[0]['tgl_perbaikan'])
//$(".anggaran_detail ").html(data[0]['anggaran'])
//$(".penanggung_jawab_detail ").html(data[0]['pj'])
//$(".penanggung_jawab_lapangan_detail ").html(data[0]['pj_lapangan'])
//$(".kontraktor_detail ").html(data[0]['kontraktor'])
$(".panjang_jalan_detail ").html(data[0]['panjang'])
$(".lebar_jalan_detail ").html(data[0]['lbr_jln_reno'])
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/` + data[0]['proposal'] + `" target="_blank" "id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
// </a>`);
//
//
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/` + data[0].bukti_selesai + `" target="_blank" id="view-bukti">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
$('.isi_detail_cek_jalan').show()
$('.map_detail_p_jalan').show()
map_detail_perbaikan.setView([data[0]['geometry']['coordinates'][0][0][1], data[0]['geometry']['coordinates'][0][0][0]], 18)
var myLines = [data[0]['geometry']];
var geo_jalan_perbaikan = L.geoJson(data[0]['geometry'], {
style: function(feature) {
return {
color: "#FAFA00",
weight: 10,
opacity: 2,
zIndex: 1001
};
}
}).addTo(map_detail_perbaikan);
} else if (data[0]['jenis'] == 'bangunan') {
$(".nama_detail").html(data[0]['name']);
$(".type_detail ").html(data[0]['type'])
$(".tanggal_perbaikan_detail ").text(data[0]['tgl_perbaikan'])
// $(".anggaran_detail ").html(data[0]['anggaran'])
// $(".penanggung_jawab_detail ").html(data[0]['pj'])
// $(".penanggung_jawab_lapangan_detail ").html(data[0]['pj_lapangan'])
// $(".kontraktor_detail ").html(data[0]['kontraktor'])
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/` + data[0]['proposal'] + `" target="_blank" "id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
// </a>`);
$(".judul_panjang_jalan_detail ").html('Jenis Perbaikan')
$(".panjang_jalan_detail ").html(data[0]['jenis_perbaikan'])
$('.isi_detail_cek_jalan').hide()
$('.map_detail_p_jalan').hide()
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/` + data[0].bukti_selesai + `" target="_blank" id="view-bukti">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
}
}
}
});
};
// var element = $("#map_detail_perbaikan"); // global variable
// var getCanvas; // global variable
//
// $("#download_map").on('click', function() {
// html2canvas(element, {
// onrendered: function(canvas) {
// $("#previewImage").append(canvas);
// getCanvas = canvas;
// }
// });
//
// var imgageData = getCanvas.toDataURL("image/png");
// // Now browser starts downloading it instead of just showing it
// var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
// $("#download_map").attr("download", "image.png").attr("href", newData);
// });
function download_user_list(type, fn, dl) {
$.ajax({
url: "api/user-data",
dataType: 'json',
success: function(data) {
var thead = `<thead>
<tr>
<th>No.</th>
<th>Id user</th>
<th>Username</th>
<th>Nama</th>
<th>Email</th>
<th>Last Login</th>
<th>Status</th>
</tr>
</thead>`
var data_user = []
var number = 0;
for (var i = 0; i < data['data'].length; i++) {
number += 1;
var id = data['data'][i]['id'];
var name = data['data'][i]['name'];
var username = data['data'][i]['username'];
var group = data['data'][i]['group'];
var email = data['data'][i]['email'];
var last = data['data'][i]['last'];
var isactive = data['data'][i]['isactive'];
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + id + `</td>
<td>` + username + `</td>
<td>` + name + `</td>
<td>` + email + `</td>
<td>` + last + `</td>
<td>` + isactive + `</td>
</tr>`;
data_user.push(data_gab)
}
var tbody = `<tbody>
` + data_user + `
</tbody>`;
$("#table_downloader").html(thead + tbody)
var elt = document.getElementById('table_downloader');
var wb = XLSX.utils.table_to_book(elt, {
sheet: "sheet1"
});
return dl ?
XLSX.write(wb, {
bookType: type,
bookSST: true,
type: 'base64'
}) :
XLSX.writeFile(wb, fn || ('data_user.' + (type || 'xlsx')));
}
})
}
function download_all(type, fn, dl) {
$.ajax({
url: "api/download_perbaikan_data",
dataType: 'json',
success: function(data) {
var thead = `<thead>
<tr>
<th>No.</th>
<th>Id perbaikan</th>
<th>Jenis yang diperbaiki</th>
<th>Nama</th>
<th>Tipe</th>
<th>Panjang (Jika perbaikan jalan)</th>
<th>Tanggal Pembuatan/Peresmian</th>
<th>Tanggal Perbaikan</th>
<th>Tanggal Selesai</th>
<th>Anggaran</th>
<th>Penanggung Jawab</th>
<th>Penanggung Jawab Lapangan</th>
<th>Kontraktor</th>
<th>Panjang yang diperbaiki</th>
<th>Lebar yang diperbaiki</th>
</tr>
</thead>`
var data_user = []
var number = 0;
for (var i = 0; i < data['data'].length; i++) {
number += 1;
var id = data['data'][i]['id'];
var jenis_perbaikan = data['data'][i]['jenis_perbaikan'];
var nama = data['data'][i]['nama'];
var tipe = data['data'][i]['tipe'];
var panjang = data['data'][i]['panjang'];
var tgl_pembuatan = data['data'][i]['tgl_pembuatan'];
var tgl_perbaikan = data['data'][i]['tgl_perbaikan'];
var tgl_selesai = data['data'][i]['tgl_selesai'];
var anggaran = data['data'][i]['anggaran'];
var pj = data['data'][i]['pj'];
var pj_lapangan = data['data'][i]['pj_lapangan'];
var kontraktor = data['data'][i]['kontraktor'];
var panjang_per = data['data'][i]['panjang_per'];
var lebar_per = data['data'][i]['lebar_per'];
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + id + `</td>
<td>` + jenis_perbaikan + `</td>
<td>` + nama + `</td>
<td>` + tipe + `</td>
<td>` + panjang + `</td>
<td>` + tgl_pembuatan + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td>` + anggaran + `</td>
<td>` + pj + `</td>
<td>` + pj_lapangan + `</td>
<td>` + kontraktor + `</td>
<td>` + panjang_per + `</td>
<td>` + lebar_per + `</td>
</tr>`;
data_user.push(data_gab)
}
var tbody = `<tbody>
` + data_user + `
</tbody>`;
$("#table_downloader").html(thead + tbody)
var elt = document.getElementById('table_downloader');
var wb = XLSX.utils.table_to_book(elt, {
sheet: "sheet1"
});
return dl ?
XLSX.write(wb, {
bookType: type,
bookSST: true,
type: 'base64'
}) :
XLSX.writeFile(wb, fn || ('data_perbaikan.' + (type || 'xlsx')));
}
});
}
var $content, $modal, $apnData, $modalCon;
$content = $(".min");
$(".mdlFire").click(function(e) {
e.preventDefault();
var $id = $(this).attr("data-target");
});
$(".modalMinimize").on("click", function() {
$modalCon = $(this).closest(".mymodal").attr("id");
$apnData = $(this).closest(".mymodal");
$modal = "#" + $modalCon;
$(".modal-backdrop").addClass("display-none");
$($modal).toggleClass("min");
if ($($modal).hasClass("min")) {
$(".minmaxCon").append($apnData);
$(this).find("i").toggleClass('fa-minus').toggleClass('fa-clone');
} else {
$(".container").append($apnData);
$(this).find("i").toggleClass('fa-clone').toggleClass('fa-minus');
};
});
$("button[data-dismiss='modal']").click(function() {
$(this).closest(".mymodal").removeClass("min");
$(".container").removeClass($apnData);
$(this).next('.modalMinimize').find("i").removeClass('fa fa-clone').addClass('fa fa-minus');
});
$("#btn-hide-all").click(function() {
$("#button_keterangan").removeClass("active");
$("#manage_perbaikan").removeClass("active");
$("#panel-sm").removeClass("active");
$("#panel-sm2").removeClass("active");
$("#panel-sm").css('display', 'none');
$(this).css('display', 'none');
$(this).removeClass("hid");
});
function btn_hid_all_close() {
$("#button_keterangan").removeClass("active");
$("#manage_perbaikan").removeClass("active");
$("#panel-sm").removeClass("active");
$("#panel-sm2").removeClass("active");
$(this).css('display', 'none');
$(this).removeClass("hid");
};
$("#keterangan_button").click(function() {
$("#btn-hide-all").css('display', 'block');
// $("#btn-hide-all").toggleClass("hid");
});
$("#perbaikan_manage").click(function() {
$("#btn-hide-all").css('display', 'block');
// $("#btn-hide-all").toggleClass("hid");
});
function gas_all() {
var checkBox = document.getElementById("po_all");
if (document.getElementById("po_all").checked == true) {
document.getElementById("knt_adm").checked = true;
document.getElementById("lyn_kes").checked = true;
document.getElementById("pus").checked = true;
document.getElementById("rusak").checked = true;
document.getElementById("ibdh").checked = true;
document.getElementById("dididik").checked = true;
document.getElementById("tasiun").checked = true;
document.getElementById("caheum").checked = true;
document.getElementById("cabud").checked = true;
document.getElementById("gardu").checked = true;
k_adm()
l_kes()
pks()
rs()
fiksi()
didik()
sthall()
temanggung()
cb100()
gl100()
} else if (document.getElementById("po_all").checked == false) {
document.getElementById("knt_adm").checked = false;
document.getElementById("lyn_kes").checked = false;
document.getElementById("pus").checked = false;
document.getElementById("rusak").checked = false;
document.getElementById("ibdh").checked = false;
document.getElementById("dididik").checked = false;
document.getElementById("tasiun").checked = false;
document.getElementById("caheum").checked = false;
document.getElementById("cabud").checked = false;
document.getElementById("gardu").checked = false;
k_adm()
l_kes()
pks()
rs()
fiksi()
didik()
sthall()
temanggung()
cb100()
gl100()
}
}
// function gas_poin(){
// document.getElementById("po_all").checked == true;
// k_adm()
// l_kes()
// pks()
// rs()
// fiksi()
// didik()
// sthall()
// temanggung()
// cb100()
// gl100()
// }
// gas_poin()
function destroymodper() {
$("#modal_detail_perbaikan").modal('hide')
}
$(".search_list").on('input', function() {
var v = $(".inp_search_list").val()
$.ajax({
url: "api/search_list_perbaikan",
dataType: 'json',
data: {
'v_list': v
},
success: function(data) {
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data.length; i++) {
number += 1;
var name_perbaikan = data[i][0];
var id_object = data[i][1];
var name = data[i][2];
var type = data[i][3];
var tgl_perbaikan = data[i][4];
var anggaran = data[i][5];
var tgl_selesai = data[i][6];
var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
<div>
` + number + `
</div>
<div>
` + name_perbaikan + `
</div>
<div>
` + name + `
</div>
<div>
` + type + `
</div>
<div>
` + tgl_perbaikan + `
</div>
<div>
` + tgl_selesai + `
</div>
<div>
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
<span>
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
&nbsp;&nbsp;
Detail
</span>
</a>
</div>
</li>`;
data_perbaikan.push(data_gab)
};
$(".datatab").html(data_perbaikan)
}
});
});
$("#perbaikan_manage").on("click", function() {
$.ajax({
url: "api/dataperbaikan",
dataType: 'json',
type: 'get',
success: function(data) {
console.log(data)
var data_per = []
var num = 0
for (i in data) {
num += 1;
var data_i = `<li class="media panel panel-body stack-media-on-mobile" id="cunli" style="background: transparent;border: none;color: white;">
<div>
` + num + `
</div>
<div>
` + data[i].name_perbaikan + `
</div>
<div>
` + data[i].name + `
</div>
<div>
` + data[i].desa + `, ` + data[i].kecamatan + `
</div>
<div>
` + data[i].type + `
</div>
<div>
` + data[i].tgl_perbaikan + `
</div>
<div>
` + data[i].tgl_selesai + `
</div>
<div>
<a class="btn mdlFire " onclick="loaddetailid( '` + data[i].id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i> &nbsp;&nbsp; Detail
</a>
</div>
</li>`;
data_per.push(data_i)
}
$("#dataperb").html(data_per)
var x = window.matchMedia("(min-width: 700px)")
if (x.matches) { // If media query matches
$(".search_list").css('display', 'none')
$.fn.dataList = function(options) {
this.each(function() {
var $table = $(this);
if ($table.is('ul')) {
var $ul = $table;
$table = $ul.wrap('<table><tbody/></table').closest('table');
$ul.find('li').wrap('<tr></tr>').contents().unwrap();
$ul.find('div').wrap('<td><td/>').contents().unwrap();
$ul.contents().unwrap()
$table.prepend(`<thead><tr><th>No.</th>
<th>Sarana Perbaikan</th>
<th>Nama</th>
<th>Alamat</th>
<th>Type</th>
<th>Tanggal Mulai</th>
<th>Tanggal Selesai</th>
<th>Keterangan</th>
</tr></thead>`);
}
$table.dataTable(options);
});
}
$('.datatab').dataList({
"pageLength": 15,
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
});
$('.datatab').DataTable({
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, {
orderable: false,
width: '20px',
targets: [6],
}, {
orderable: false,
width: '20px',
targets: [7],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
drawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
},
preDrawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
}
});
} else {
$(".search_list").css('display', 'block')
$("#download_perbaikan").css('display', 'none')
// document.querySelector("#perbaikan-dashboard\\ > div > div.container-detached > div > ul > li > div:nth-child(1)").style.display = 'none';
//$('.datatab').dataTable({
// "pageLength": 15
//});
}
}
})
})
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
{% load static %}
<!-- <div class="legendapo" id="legendapo" style="bottom: 0px;display:none">
<div>
<a href="#" onclick="hidelegend()" class="btn btn-default" id="button_hide_point"><span class="caret" style="margin-left: -5px;"></span></a>
</div>
<div class="row">
<div class="col-xs-12">
<div class="col-md-2" style="min-width: 150px;">
<div class="form-group">
<label class="text-semibold">LEGENDA</label>
<div>
<table>
<tr>
<th>
<div class="circle" style=" border: solid 10px #1392ec;
width: 30px;
height: 30px;margin-bottom: 5px;">
<img/>
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Administrasi Pemerintahan
</div>
</td>
</tr>
<tr>
<th>
<div class="circle" style="border: solid 10px #e90404;
width: 30px;
height: 30px;margin-bottom: 5px;">
<img/>
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Pelayanan Kesehatan
</div>
</td>
</tr>
<tr>
<th>
<div class="circle" style=" border: solid 10px #0cf00c;
width: 30px;
height: 30px;margin-bottom: 5px;">
<img/>
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Sarana Peribadatan
</div>
</td>
</tr>
<tr>
<th>
<div class="circle" style="border: solid 10px #f0c20c;
width: 30px;
height: 30px;margin-bottom: 5px;">
<img/>
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Sarana Pendidikan
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
<div class="col-md-2" style="min-width: 150px;">
<div class="form-group" style="margin-top: 30px;">
<table>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/police.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Kantor Polisi
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/tni.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Instalasi TNI
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/lurah.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Kantor Perangkat Daerah
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/kades.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Kantor Pemerintahan Lainnya
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/pemerintahan_lain.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Lembaga Pemasyarakatan
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="col-md-2" style="min-width: 150px;">
<div class="form-group" style="margin-top: 30px;">
<table>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/rs.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Rumah Sakit
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/masjid.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Masjid
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/gereja.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Gereja
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/pura.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Pura
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/pesantren.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Pondok Pesantren / TPA
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="col-md-2" style="min-width: 150px;">
<div class="form-group" style="margin-top: 30px;">
<table>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/kampus.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Universitas
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/sekolah.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Sekolah
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/perpus.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Perpustakaan
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/pom.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;SPBU
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/kereta.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Stasiun
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="col-md-2" style="min-width: 150px;">
<div class="form-group" style="margin-top: 30px;">
<table>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/bus.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Terminal
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/loc.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Cagar Budaya
</div>
</td>
</tr>
<tr>
<th>
<div id="main" style="width: 20px; height: 20px;background-position:center;background-repeat:no-repeat;background-size: contain;background-image:url('static/img/icon/listrik.svg')">
</div>
</th>
<td>
<div style="margin-bottom: 5px;">
&nbsp;&nbsp;&nbsp;Gardu Listrik
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
<div>
<a href="#" onclick="showlegend()" class="btn btn-default" id="button_unhide_point" style="display: none;"><span class="caret" style="margin-left: -5px;transform: rotate(180deg)"></span></a>
</div> -->
\ No newline at end of file
......@@ -732,922 +732,4 @@ background: none;border-color: transparent;">
</div>
<div id="panel-sm-kosong " class="sidebar-2 " style="display:none;background: #1B1F2D;position: absolute;z-index: 1;left: 0%;transition: all 0.5s ease; ">
</div>
<script type="text/javascript " src="{% static 'js/plugins/tables/datatables/datatables.min.js' %} "></script>
<script type="text/javascript " src="{% static 'js/plugins/forms/selects/select2.min.js' %} "></script>
<script>
//tes
$("#sel-kec ").change(function() {
var id_kec = $(this).val()
console.log(id_kec)
// $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $("#list_perbaikan").dataTable().fnDestroy();
$(".datatab").dataTable().fnDestroy()
// $("#dataperb").css('display', 'none')
// $(".datatab").css('display', 'none')
// $(".datatable-show-all.list_perb").html('kosong')
$.ajax({
url: "api/filt_perbaikan_kecamatan",
data: {
'id_kec': id_kec
},
dataType: 'json',
success: function(data) {
if (data['res_kel'] == 'all_kecamatan') {
$('#sel-desa').html(`<option>Pilih Desa</option>`);
} else {
var data_all_desa = []
for (var i = 0; i < data['res_kel'].length; i++) {
var id_k = data['res_kel'][i][0];
var data_k = data['res_kel'][i][1];
var data_kel = `<option value="` + id_k + ` ">` +
data_k +
`</option>`;
data_all_desa.push(data_kel)
};
$('#sel-desa').html(`<option>Pilih Desa</option>` + data_all_desa);
}
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data['res_perbaikan'].length; i++) {
number += 1;
var name_perbaikan = data['res_perbaikan'][i]['name_perbaikan'];
var id_object = data['res_perbaikan'][i]['id_object'];
var name = data['res_perbaikan'][i]['name'];
var type = data['res_perbaikan'][i]['type'];
var tgl_perbaikan = data['res_perbaikan'][i]['tgl_perbaikan'];
var anggaran = data['res_perbaikan'][i]['anggaran'];
var tgl_selesai = data['res_perbaikan'][i]['tgl_selesai'];
console.log(number, name, name_perbaikan)
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + name_perbaikan + `</td>
<td>` + name + `</td>
<td>` + type + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td class="text-center ">
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal " data-target="#modal_detail_perbaikan " style="background-color: #5A9AFB;color: white;border-radius: 5px;width: 85px;height: 25px; ">
<div style="margin-top: -5px; ">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
<span>&nbsp;&nbsp;
Detail</span>
</div>
</a>
</td>
</tr>`;
// var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
// <div>
// ` + number + `
// </div>
// <div>
// ` + name_perbaikan + `
// </div>
// <div>
// ` + name + `
// </div>
// <div>
// ` + type + `
// </div>
// <div>
// ` + tgl_perbaikan + `
// </div>
// <div>
// ` + tgl_selesai + `
// </div>
// <div>
// ` + anggaran + `
// </div>
// <div>
// <a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
// <span>
// <i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
// &nbsp;&nbsp;
// Detail
// </span>
// </a>
// </div>
// </li>`;
data_perbaikan.push(data_gab)
};
// $("#tbody_perbaikan").html(data_perbaikan)
// $("#dataperb").html(data_perbaikan)
$("#dataperb").html(data_gab)
datatatata()
}
});
});
$("#sel-desa ").change(function() {
var id_desa = $(this).val()
console.log(id_desa)
// $(".datatab").dataTable().fnDestroy()
// $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $("#list_perbaikan").dataTable().fnDestroy();
$(".datatab").dataTable().fnDestroy()
$.ajax({
url: "api/filt_perbaikan_desa",
data: {
'id_desa': id_desa
},
dataType: 'json',
success: function(data) {
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data['res_perbaikan'].length; i++) {
number += 1;
var name_perbaikan = data['res_perbaikan'][i]['name_perbaikan'];
var id_object = data['res_perbaikan'][i]['id_object'];
var name = data['res_perbaikan'][i]['name'];
var type = data['res_perbaikan'][i]['type'];
var tgl_perbaikan = data['res_perbaikan'][i]['tgl_perbaikan'];
var anggaran = data['res_perbaikan'][i]['anggaran'];
var tgl_selesai = data['res_perbaikan'][i]['tgl_selesai'];
console.log(number, name, name_perbaikan)
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + name_perbaikan + `</td>
<td>` + name + `</td>
<td>` + type + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td class="text-center ">
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal " data-target="#modal_detail_perbaikan " style="background-color: #5A9AFB;color: white;border-radius: 5px;width: 85px;height: 25px; ">
<div style="margin-top: -5px; ">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
<span>&nbsp;&nbsp;
Detail</span>
</div>
</a>
</td>
</tr>`;
// var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
// <div>
// ` + number + `
// </div>
// <div>
// ` + name_perbaikan + `
// </div>
// <div>
// ` + name + `
// </div>
// <div>
// ` + type + `
// </div>
// <div>
// ` + tgl_perbaikan + `
// </div>
// <div>
// ` + tgl_selesai + `
// </div>
// <div>
// ` + anggaran + `
// </div>
// <div>
// <a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
// <span>
// <i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
// &nbsp;&nbsp;
// Detail
// </span>
// </a>
// </div>
// </li>`;
data_perbaikan.push(data_gab)
};
// $("#tbody_perbaikan ").html(data_perbaikan)
// $("#dataperb").html(data_perbaikan)
$("#dataperb").html(data_gab)
datatatata()
}
});
});
function datatatata() {
// $('.datatable-show-all.list_perb').DataTable({
$('.datatab').DataTable({
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, {
orderable: false,
width: '20px',
targets: [6],
}, {
orderable: false,
width: '20px',
targets: [7],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
drawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
},
preDrawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
}
});
}
// $("#perbaikan_manage").click(function() {
// // $(".datatable-show-all.list_perb").dataTable().fnDestroy();
// $(".datatab").dataTable().fnDestroy();
// setTimeout(function() {
// datatatata()
// }, 100);
//
//
// })
function loaddetailid(id) {
$(".map_detail_p").html(``)
var isObject = {};
isObject.id = id;
$("#iduser ").val(id)
$.ajax({
url: "{% url 'apps:loadDetail' %} ",
data: isObject,
dataType: 'json',
type: 'post',
success: function(data) {
$("#modal_detail_perbaikan").modal('show')
$(".map_detail_p").html(`<div id="map_detail_perbaikan" style=" position: relative; height: 220px; width: 90%; border-radius: 5px; ">`)
var map_detail_perbaikan = L.map('map_detail_perbaikan', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([-4.125826277307029, 104.1881561279297], 10);
L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}&s=Gal&apistyle=s.t:0|s.e:l|p.v:off', {
maxZoom: 21,
minZoom: 4,
}).addTo(map_detail_perbaikan);
setTimeout(function() {
map_detail_perbaikan.invalidateSize();
}, 500);
if (data.length === 0) {
$(".nama_detail").text("Null");
$(".type_detail ").html("Null");
$(".tanggal_perbaikan_detail ").html("Null")
// $(".anggaran_detail ").html("Null")
// $(".penanggung_jawab_detail ").html("Null")
// $(".penanggung_jawab_lapangan_detail ").html("Null")
// $(".kontraktor_detail ").html("Null")
$(".panjang_jalan_detail ").html("Null")
$(".lebar_jalan_detail ").html("Null")
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/null" id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 80px;width: 80px; ">
// </a>`);
//
//
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/null" onclick="viewBukti() " id="view-bukti ">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
} else {
console.log(data[0]['jenis'])
if (data[0]['jenis'] == 'jalan') {
$(".nama_detail").html(data[0]['name']);
$(".type_detail ").html(data[0]['type'])
$(".tanggal_perbaikan_detail ").text(data[0]['tgl_perbaikan'])
//$(".anggaran_detail ").html(data[0]['anggaran'])
//$(".penanggung_jawab_detail ").html(data[0]['pj'])
//$(".penanggung_jawab_lapangan_detail ").html(data[0]['pj_lapangan'])
//$(".kontraktor_detail ").html(data[0]['kontraktor'])
$(".panjang_jalan_detail ").html(data[0]['panjang'])
$(".lebar_jalan_detail ").html(data[0]['lbr_jln_reno'])
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/` + data[0]['proposal'] + `" target="_blank" "id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
// </a>`);
//
//
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/` + data[0].bukti_selesai + `" target="_blank" id="view-bukti">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
$('.isi_detail_cek_jalan').show()
$('.map_detail_p_jalan').show()
map_detail_perbaikan.setView([data[0]['geometry']['coordinates'][0][0][1], data[0]['geometry']['coordinates'][0][0][0]], 18)
var myLines = [data[0]['geometry']];
var geo_jalan_perbaikan = L.geoJson(data[0]['geometry'], {
style: function(feature) {
return {
color: "#FAFA00",
weight: 10,
opacity: 2,
zIndex: 1001
};
}
}).addTo(map_detail_perbaikan);
} else if (data[0]['jenis'] == 'bangunan') {
$(".nama_detail").html(data[0]['name']);
$(".type_detail ").html(data[0]['type'])
$(".tanggal_perbaikan_detail ").text(data[0]['tgl_perbaikan'])
// $(".anggaran_detail ").html(data[0]['anggaran'])
// $(".penanggung_jawab_detail ").html(data[0]['pj'])
// $(".penanggung_jawab_lapangan_detail ").html(data[0]['pj_lapangan'])
// $(".kontraktor_detail ").html(data[0]['kontraktor'])
//$(".proposal_detail ").html(`
// <a href="static/media/proposal/` + data[0]['proposal'] + `" target="_blank" "id="downloadproposal">
// <img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
// </a>`);
$(".judul_panjang_jalan_detail ").html('Jenis Perbaikan')
$(".panjang_jalan_detail ").html(data[0]['jenis_perbaikan'])
$('.isi_detail_cek_jalan').hide()
$('.map_detail_p_jalan').hide()
//$(".bukti_detail_perbaikan").html(`
// <a href="static/media/bukti_penyelesaian/` + data[0].bukti_selesai + `" target="_blank" id="view-bukti">
// <img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 70px;
// width: 50px;">
// </a>`);
}
}
}
});
};
// var element = $("#map_detail_perbaikan"); // global variable
// var getCanvas; // global variable
//
// $("#download_map").on('click', function() {
// html2canvas(element, {
// onrendered: function(canvas) {
// $("#previewImage").append(canvas);
// getCanvas = canvas;
// }
// });
//
// var imgageData = getCanvas.toDataURL("image/png");
// // Now browser starts downloading it instead of just showing it
// var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
// $("#download_map").attr("download", "image.png").attr("href", newData);
// });
function download_user_list(type, fn, dl) {
$.ajax({
url: "api/user-data",
dataType: 'json',
success: function(data) {
var thead = `<thead>
<tr>
<th>No.</th>
<th>Id user</th>
<th>Username</th>
<th>Nama</th>
<th>Email</th>
<th>Last Login</th>
<th>Status</th>
</tr>
</thead>`
var data_user = []
var number = 0;
for (var i = 0; i < data['data'].length; i++) {
number += 1;
var id = data['data'][i]['id'];
var name = data['data'][i]['name'];
var username = data['data'][i]['username'];
var group = data['data'][i]['group'];
var email = data['data'][i]['email'];
var last = data['data'][i]['last'];
var isactive = data['data'][i]['isactive'];
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + id + `</td>
<td>` + username + `</td>
<td>` + name + `</td>
<td>` + email + `</td>
<td>` + last + `</td>
<td>` + isactive + `</td>
</tr>`;
data_user.push(data_gab)
}
var tbody = `<tbody>
` + data_user + `
</tbody>`;
$("#table_downloader").html(thead + tbody)
var elt = document.getElementById('table_downloader');
var wb = XLSX.utils.table_to_book(elt, {
sheet: "sheet1"
});
return dl ?
XLSX.write(wb, {
bookType: type,
bookSST: true,
type: 'base64'
}) :
XLSX.writeFile(wb, fn || ('data_user.' + (type || 'xlsx')));
}
})
}
function download_all(type, fn, dl) {
$.ajax({
url: "api/download_perbaikan_data",
dataType: 'json',
success: function(data) {
var thead = `<thead>
<tr>
<th>No.</th>
<th>Id perbaikan</th>
<th>Jenis yang diperbaiki</th>
<th>Nama</th>
<th>Tipe</th>
<th>Panjang (Jika perbaikan jalan)</th>
<th>Tanggal Pembuatan/Peresmian</th>
<th>Tanggal Perbaikan</th>
<th>Tanggal Selesai</th>
<th>Anggaran</th>
<th>Penanggung Jawab</th>
<th>Penanggung Jawab Lapangan</th>
<th>Kontraktor</th>
<th>Panjang yang diperbaiki</th>
<th>Lebar yang diperbaiki</th>
</tr>
</thead>`
var data_user = []
var number = 0;
for (var i = 0; i < data['data'].length; i++) {
number += 1;
var id = data['data'][i]['id'];
var jenis_perbaikan = data['data'][i]['jenis_perbaikan'];
var nama = data['data'][i]['nama'];
var tipe = data['data'][i]['tipe'];
var panjang = data['data'][i]['panjang'];
var tgl_pembuatan = data['data'][i]['tgl_pembuatan'];
var tgl_perbaikan = data['data'][i]['tgl_perbaikan'];
var tgl_selesai = data['data'][i]['tgl_selesai'];
var anggaran = data['data'][i]['anggaran'];
var pj = data['data'][i]['pj'];
var pj_lapangan = data['data'][i]['pj_lapangan'];
var kontraktor = data['data'][i]['kontraktor'];
var panjang_per = data['data'][i]['panjang_per'];
var lebar_per = data['data'][i]['lebar_per'];
var data_gab = `<tr>
<td>` + number + `</td>
<td>` + id + `</td>
<td>` + jenis_perbaikan + `</td>
<td>` + nama + `</td>
<td>` + tipe + `</td>
<td>` + panjang + `</td>
<td>` + tgl_pembuatan + `</td>
<td>` + tgl_perbaikan + `</td>
<td>` + tgl_selesai + `</td>
<td>` + anggaran + `</td>
<td>` + pj + `</td>
<td>` + pj_lapangan + `</td>
<td>` + kontraktor + `</td>
<td>` + panjang_per + `</td>
<td>` + lebar_per + `</td>
</tr>`;
data_user.push(data_gab)
}
var tbody = `<tbody>
` + data_user + `
</tbody>`;
$("#table_downloader").html(thead + tbody)
var elt = document.getElementById('table_downloader');
var wb = XLSX.utils.table_to_book(elt, {
sheet: "sheet1"
});
return dl ?
XLSX.write(wb, {
bookType: type,
bookSST: true,
type: 'base64'
}) :
XLSX.writeFile(wb, fn || ('data_perbaikan.' + (type || 'xlsx')));
}
});
}
var $content, $modal, $apnData, $modalCon;
$content = $(".min");
$(".mdlFire").click(function(e) {
e.preventDefault();
var $id = $(this).attr("data-target");
});
$(".modalMinimize").on("click", function() {
$modalCon = $(this).closest(".mymodal").attr("id");
$apnData = $(this).closest(".mymodal");
$modal = "#" + $modalCon;
$(".modal-backdrop").addClass("display-none");
$($modal).toggleClass("min");
if ($($modal).hasClass("min")) {
$(".minmaxCon").append($apnData);
$(this).find("i").toggleClass('fa-minus').toggleClass('fa-clone');
} else {
$(".container").append($apnData);
$(this).find("i").toggleClass('fa-clone').toggleClass('fa-minus');
};
});
$("button[data-dismiss='modal']").click(function() {
$(this).closest(".mymodal").removeClass("min");
$(".container").removeClass($apnData);
$(this).next('.modalMinimize').find("i").removeClass('fa fa-clone').addClass('fa fa-minus');
});
$("#btn-hide-all").click(function() {
$("#button_keterangan").removeClass("active");
$("#manage_perbaikan").removeClass("active");
$("#panel-sm").removeClass("active");
$("#panel-sm2").removeClass("active");
$("#panel-sm").css('display', 'none');
$(this).css('display', 'none');
$(this).removeClass("hid");
});
function btn_hid_all_close() {
$("#button_keterangan").removeClass("active");
$("#manage_perbaikan").removeClass("active");
$("#panel-sm").removeClass("active");
$("#panel-sm2").removeClass("active");
$(this).css('display', 'none');
$(this).removeClass("hid");
};
$("#keterangan_button").click(function() {
$("#btn-hide-all").css('display', 'block');
// $("#btn-hide-all").toggleClass("hid");
});
$("#perbaikan_manage").click(function() {
$("#btn-hide-all").css('display', 'block');
// $("#btn-hide-all").toggleClass("hid");
});
function gas_all() {
var checkBox = document.getElementById("po_all");
if (document.getElementById("po_all").checked == true) {
document.getElementById("knt_adm").checked = true;
document.getElementById("lyn_kes").checked = true;
document.getElementById("pus").checked = true;
document.getElementById("rusak").checked = true;
document.getElementById("ibdh").checked = true;
document.getElementById("dididik").checked = true;
document.getElementById("tasiun").checked = true;
document.getElementById("caheum").checked = true;
document.getElementById("cabud").checked = true;
document.getElementById("gardu").checked = true;
k_adm()
l_kes()
pks()
rs()
fiksi()
didik()
sthall()
temanggung()
cb100()
gl100()
} else if (document.getElementById("po_all").checked == false) {
document.getElementById("knt_adm").checked = false;
document.getElementById("lyn_kes").checked = false;
document.getElementById("pus").checked = false;
document.getElementById("rusak").checked = false;
document.getElementById("ibdh").checked = false;
document.getElementById("dididik").checked = false;
document.getElementById("tasiun").checked = false;
document.getElementById("caheum").checked = false;
document.getElementById("cabud").checked = false;
document.getElementById("gardu").checked = false;
k_adm()
l_kes()
pks()
rs()
fiksi()
didik()
sthall()
temanggung()
cb100()
gl100()
}
}
// function gas_poin(){
// document.getElementById("po_all").checked == true;
// k_adm()
// l_kes()
// pks()
// rs()
// fiksi()
// didik()
// sthall()
// temanggung()
// cb100()
// gl100()
// }
// gas_poin()
function destroymodper() {
$("#modal_detail_perbaikan").modal('hide')
}
$(".search_list").on('input', function() {
var v = $(".inp_search_list").val()
$.ajax({
url: "api/search_list_perbaikan",
dataType: 'json',
data: {
'v_list': v
},
success: function(data) {
var data_perbaikan = []
var number = 0;
for (var i = 0; i < data.length; i++) {
number += 1;
var name_perbaikan = data[i][0];
var id_object = data[i][1];
var name = data[i][2];
var type = data[i][3];
var tgl_perbaikan = data[i][4];
var anggaran = data[i][5];
var tgl_selesai = data[i][6];
var data_gab = `<li class="media panel panel-body stack-media-on-mobile" style="background: transparent;border: none;color: white;">
<div>
` + number + `
</div>
<div>
` + name_perbaikan + `
</div>
<div>
` + name + `
</div>
<div>
` + type + `
</div>
<div>
` + tgl_perbaikan + `
</div>
<div>
` + tgl_selesai + `
</div>
<div>
<a class="btn mdlFire " onclick="loaddetailid( '` + id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;height: 25px; ">
<span>
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
&nbsp;&nbsp;
Detail
</span>
</a>
</div>
</li>`;
data_perbaikan.push(data_gab)
};
$(".datatab").html(data_perbaikan)
}
});
});
$("#perbaikan_manage").on("click", function() {
$.ajax({
url: "api/dataperbaikan",
dataType: 'json',
type: 'get',
success: function(data) {
console.log(data)
var data_per = []
var num = 0
for (i in data) {
num += 1;
var data_i = `<li class="media panel panel-body stack-media-on-mobile" id="cunli" style="background: transparent;border: none;color: white;">
<div>
` + num + `
</div>
<div>
` + data[i].name_perbaikan + `
</div>
<div>
` + data[i].name + `
</div>
<div>
` + data[i].desa + `, ` + data[i].kecamatan + `
</div>
<div>
` + data[i].type + `
</div>
<div>
` + data[i].tgl_perbaikan + `
</div>
<div>
` + data[i].tgl_selesai + `
</div>
<div>
<a class="btn mdlFire " onclick="loaddetailid( '` + data[i].id_object + `') " data-toggle="modal" data-target="#modal_detail_perbaikan" style="background-color: #5A9AFB;color: white;border-radius: 5px;">
<i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i> &nbsp;&nbsp; Detail
</a>
</div>
</li>`;
data_per.push(data_i)
}
$("#dataperb").html(data_per)
var x = window.matchMedia("(min-width: 700px)")
if (x.matches) { // If media query matches
$(".search_list").css('display', 'none')
$.fn.dataList = function(options) {
this.each(function() {
var $table = $(this);
if ($table.is('ul')) {
var $ul = $table;
$table = $ul.wrap('<table><tbody/></table').closest('table');
$ul.find('li').wrap('<tr></tr>').contents().unwrap();
$ul.find('div').wrap('<td><td/>').contents().unwrap();
$ul.contents().unwrap()
$table.prepend(`<thead><tr><th>No.</th>
<th>Sarana Perbaikan</th>
<th>Nama</th>
<th>Alamat</th>
<th>Type</th>
<th>Tanggal Mulai</th>
<th>Tanggal Selesai</th>
<th>Keterangan</th>
</tr></thead>`);
}
$table.dataTable(options);
});
}
$('.datatab').dataList({
"pageLength": 15,
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
});
$('.datatab').DataTable({
autoWidth: false,
columnDefs: [{
orderable: false,
width: '20px',
targets: [0],
}, {
orderable: false,
width: '20px',
targets: [6],
}, {
orderable: false,
width: '20px',
targets: [7],
}, ],
dom: '<"float-left "B>frtip',
language: {
search: ' _INPUT_',
searchPlaceholder: 'Data Perbaikan...',
lengthMenu: '<span>Show:</span><hr> _MENU_',
paginate: {
'first': 'First',
'last': 'Last',
'next': '&rarr;',
'previous': '&larr;'
}
},
drawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
},
preDrawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
}
});
} else {
$(".search_list").css('display', 'block')
$("#download_perbaikan").css('display', 'none')
// document.querySelector("#perbaikan-dashboard\\ > div > div.container-detached > div > ul > li > div:nth-child(1)").style.display = 'none';
//$('.datatab').dataTable({
// "pageLength": 15
//});
}
}
})
})
</script>
\ No newline at end of file
</div>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment