Skip to content

O
OKU-GIS
Commit 12b4d15f authored by Manggar Mahardhika's avatar Manggar Mahardhika
Browse files
Options

Conflicts: 

	templates/includes/js-m.html
	templates/includes/js-o.html
	templates/layout/layout.html
parents 4307a24b c97259c9
Hide whitespace changes
Inline Side-by-side
Showing with 17620 additions and 1710 deletions
static/js/scripts_js_m.js 0 → 100644
View file @ 12b4d15f
This source diff could not be displayed because it is too large. You can view the blob instead.
static/js/scripts_js_o.js 0 → 100644
View file @ 12b4d15f
This source diff could not be displayed because it is too large. You can view the blob instead.
static/js/scripts_layout.js 0 → 100644
View file @ 12b4d15f
This source diff could not be displayed because it is too large. You can view the blob instead.
static/js/scripts_sidebar.js 0 → 100644
View file @ 12b4d15f
// 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
templates/includes/js-m.html
View file @ 12b4d15f
......@@ -88,7 +88,6 @@
display: block;
}
</style>
{% endif %}{% endfor %}
<script>
//suk
......@@ -9602,4 +9601,5 @@
}
});
};
</script>
\ No newline at end of file
</script>
{% endif %}{% endfor %}
templates/includes/m.html
View file @ 12b4d15f
{% 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
templates/includes/sidebar.html
View file @ 12b4d15f
......@@ -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
templates/layout/layout.html
View file @ 12b4d15f
......@@ -162,49 +162,7 @@
<input type="text" id="input_search" class="form-control" placeholder="search...">
<input type="text" id="input_search_id" class="form-control hidden">
<!-- <span class="input-group-btn" style="border-radius: 0px 10px 10px 0px; outline: none;">
<i class="icon-reset text-muted text-size-base" style="color:#3c4043;"></i>
</span> -->
<!-- <span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="outline: none;">
<i class="icon-reset text-muted text-size-base" style="color: white;"></i>
</button>
</span> -->
<span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="border-radius: 0px 10px 10px 0px;
outline: none;
background: linear-gradient(
201.55deg
, #72BBFF -24.21%, #3D5CCA 130.65%);">
<i class="icon-search4 text-muted text-size-base" style="color: white;"></i>
</button>
</span>
</div>
<div class="col-sm-4 head">
</div>
</div>
<!-- </div> -->
<!-- <div class="row" id="searchbar" style="margin-top: 2%;">
<div class="col-sm-4 head">
</div>
<div class="col-sm-4 input-group content-group head">
<div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="true" id="btn_s_s">
<span class="caret" id="cari_caret"></span>
<span id="pilihcari"></span>
</button>
<ul class="dropdown-menu" id="search_spes">
<li><input type="hidden" value="bangunan" /><a href="#"><i class="icon-home4 text-muted text-size-base" style="color: #5A9AFB;"></i> Bangunan</a></li>
<li><input type="hidden" value="jalan" /><a href="#"><i class="icon-git-branch text-muted text-size-base" style="color: #5A9AFB;"></i> Jalan</a></li>
<li><input type="hidden" value="point" /><a href="#"><i class="icon-location4 text-muted text-size-base" style="color: #5A9AFB;"></i> Point</a></li>
</ul>
</div>
<input type="text" id="input_search" class="form-control" placeholder="search...">
<input type="text" id="input_search_id" class="form-control hidden">
<span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="border-radius: 0px 10px 10px 0px;
outline: none;
......@@ -218,40 +176,8 @@
<div class="col-sm-4 head">
</div>
</div> -->
<!-- <div class="col-md-4 col-md-offset-4 input-group content-group head">
<div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="true" id="btn_s_s">
<span class="caret" id="cari_caret"></span>
<span id="pilihcari"></span>
</button>
<ul class="dropdown-menu" id="search_spes">
<li><input type="hidden" value="bangunan" /><a href="#"><i class="icon-home4 text-muted text-size-base" style="color: #5A9AFB;"></i> Bangunan</a></li>
<li><input type="hidden" value="jalan" /><a href="#"><i class="icon-git-branch text-muted text-size-base" style="color: #5A9AFB;"></i> Jalan</a></li>
<li><input type="hidden" value="point" /><a href="#"><i class="icon-location4 text-muted text-size-base" style="color: #5A9AFB;"></i> Point</a></li>
</ul>
</div>
<input type="text" id="input_search" class="form-control" placeholder="search...">
<input type="text" id="input_search_id" class="form-control hidden">
<span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="border-radius: 0px 10px 10px 0px;
outline: none;
background: linear-gradient(
201.55deg
, #72BBFF -24.21%, #3D5CCA 130.65%);">
<i class="icon-search4 text-muted text-size-base" style="color: white;"></i>
</button>
</span>
</div> -->
<!-- </div> -->
<!-- <div class="col-md-6 col-md-offset-3 modal-login input-group content-group foot centered" style="z-index: 999;">
</div>
<div class="row row-full-height" style="width: 100%;margin-left: 10px;"> -->
{% if user.is_authenticated %} {% else %}
<div class="col-md-6 col-md-offset-3 modal-login input-group content-group foot centered" style="height: fit-content;">
......@@ -273,25 +199,6 @@
</div>
{% endif %}
</div>
<!-- <div class="col-md-6 col-md-offset-3 modal-login input-group content-group foot centered" style="z-index: 999;">
<div class="row row-full-height" style="width: 100%;margin-left: 10px;">
<div class="col-md-1">
<img src="/static/img/logo-ok.png" alt="" class="img-centered" style="max-height: 28px;max-width: 21.999998092651367px;/* left: 27px; *//* top: 14px; */border-radius: 0px;">
</div>
<div class="col-md-9">
<div style="font-size: 14px;margin: 8px; text-align: center;">
<span><b>Welcome to TEMANKU!</b>
Login untuk menikmati fitur lengkap
</span>
</div>
</div>
<div class="col-md-2">
<a href="{% url 'login' %}" class="btn btn-primary vertical-centered" id="btn-signin">SIGN IN</a>
</div>
</div>
</div> -->
{% if user.is_authenticated %}
<div class="user-p-nav" style="height: 10%;width: 10%;position: absolute;top: 30px;right: 65px;z-index: 999;">
......@@ -437,399 +344,13 @@
<!-- /page content -->
</div>
{% include 'includes/modal.html' %}
<div class="modal fade" id="modal-kelurahan" tabindex="-1" role="dialog">
</div>
<!-- end modal location -->{% include 'includes/m.html' %}
<!-- end modal location -->
<div class="page_loader"></div>
<!-- <div class="footer" id="thisFooter" style="bottom: 30px; left: 0px;">
<input type="hidden" id="infoLongitude">
<input type="hidden" id="infoLatitude">
<input type="hidden" id="infoLimitx">
<div>
<a href="#" class="btn btn-default" id="button_hide"><span class="caret" style="margin-left: -5px;"></span></a>
</div>
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6 content-footer">
<div class="row" id="info-footer">
<div class="col-md-12">
<div class="row">
<div class="panel panel-flat" style="margin-top: 5px;">
<div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
<h6 class="panel-title"><b>Login</b></h6>
<div class="heading-elements">
<ul class="icons-list">
<li>
<a data-action="collapse"></a>
</li>
</ul>
</div>
</div>
<div class="panel-body" style="display: none;">
<table>
<tr>
<td>1.</td>
<td>Pada halaman dashboard, klik tombol “SIGN IN” untuk melakukan login</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-16.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>2.</td>
<td>
Masukkan <i>username</i> dan <i>password</i>
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-21.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>3.</td>
<td>
Kemudian klik tombol “Log In”
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-27.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>4.</td>
<td>
Akan muncul Welcome Page seperti di bawah
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-34.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
</table>
</div>
</div>
<div class="panel panel-flat" style="margin-top: 5px;">
<div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
<h6 class="panel-title"><b>Akses Fitur 3D</b></h6>
<div class="heading-elements">
<ul class="icons-list">
<li>
<a data-action="collapse"></a>
</li>
</ul>
</div>
</div>
<div class="panel-body" style="display: none;">
<table>
<tr>
<td>1.</td>
<td>Pada halaman utama aplikasi, klik icon</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-40.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>2.</td>
<td>
Setelah itu akan muncul form 3D Searching, lalu pilih desa,
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-46.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>3.</td>
<td>
Lalu klik tombol “Search”
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-50.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>4.</td>
<td>
Maka akan muncul desa yang dicari
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-46-56.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
</table>
</div>
</div>
<div class="panel panel-flat" style="margin-top: 5px;">
<div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
<h6 class="panel-title"><b>Memunculkan Data Bangunan</b></h6>
<div class="heading-elements">
<ul class="icons-list">
<li>
<a data-action="collapse"></a>
</li>
</ul>
</div>
</div>
<div class="panel-body" style="display: none;">
<table>
<tr>
<td>1.</td>
<td>Pada halaman utama aplikasi, klik icon</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-47-03.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>2.</td>
<td>
Setelah itu akan muncul halaman sidebar filters
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-47-07.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>3.</td>
<td>
Kemudian checklist pada bagian bagunan
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-47-11.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>4.</td>
<td>
Maka akan muncul tampilan bangunan (polygon bangunan akan muncul ketika zoom > 17)
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-47-18.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
<tr>
<td>5.</td>
<td>Untuk melihat informasi bangunan, klik bagian bangunan yang akan di lihat informasinya.
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/photo_2021-10-22_16-47-23.jpg' %}" alt="" style="width: 500px;margin-bottom: 15px;">
</td>
</tr>
</table>
</div>
</div>
<div class="panel panel-flat" style="margin-top: 5px;">
<div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
<h6 class="panel-title"><b>Memunculkan Data Tempat</b></h6>
<div class="heading-elements">
<ul class="icons-list">
<li>
<a data-action="collapse"></a>
</li>
</ul>
</div>
</div>
<div class="panel-body" style="display: none;">
<table>
<tr>
<td>
1.
</td>
<td>
Klik icon
<img src="{% static 'img/icon-1/Screenshot_poi.png'%}" alt=""> pie pada sidebar
</td>
</tr>
<tr>
<td>
2.
</td>
<td>
Sehingga akan muncul informasi berikut
</td>
</tr>
<tr>
<td>
</td>
<td>
<img src="{% static 'img/icon-1/Screenshot_menu_layer.png'%}" alt="" style="max-width: 500px;">
</td>
</tr>
<tr>
<td>
3.
</td>
<td>
Untuk informasi tempat, klik Point Of Interest
</td>
</tr>
<tr>
<td>
4.
</td>
<td>
Untuk informasi tempat, klik Point Of Interest
</td>
</tr>
<tr>
<td>
5.
</td>
<td>
Ceklist data tempat yang akan dimunculkan
</td>
</tr>
<tr>
<td>
</td>
<td>
<img src="{% static 'img/icon-1/Screenshot_point_of_interest.png' %}" alt="" style="max-width: 500px;">
</td>
</tr>
<tr>
<td>
6.
</td>
<td>
Sehingga akan muncul informasi sebagai berikut
</td>
</tr>
<tr>
<td>
</td>
<td>
<img src="{% static 'img/icon-1/Screenshot_dash_poi.png' %}" alt="" style="max-width: 500px;">
</td>
</tr>
<tr>
<td>
7.
</td>
<td>
Untuk informasi tempat lebih detail, klik tempat yang akan di munculkan detailnya
</td>
</tr>
<tr>
<td>
8.
</td>
<td>
Akan muncul informasi detail tempat seperti berikut
</td>
</tr>
<tr>
<td>
</td>
<td>
<img src="{% static 'img/icon-1/Screenshot_detail_point.png' %}" alt="">
</td>
</tr>
</table>
</div>
</div>
<div class="panel panel-flat" style="margin-top: 5px;">
<div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
<h6 class="panel-title"><b>Menemukan Informasi Data Perbaikan</b></h6>
<div class="heading-elements">
<ul class="icons-list">
<li>
<a data-action="collapse"></a>
</li>
</ul>
</div>
</div>
<div class="panel-body" style="display: none;">
<table>
<tr>
<td>
1.
</td>
<td>
Klik icon pie pada sidebar
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/icon_pie_sd.png' %}" alt="">
</td>
</tr>
<tr>
<td>
2.
</td>
<td>
Setelah di-klik maka akan muncul informasi berikut
</td>
</tr>
<tr>
<td></td>
<td>
<img src="{% static 'img/icon-1/Screen_shot_data_perbaikan.png' %}" alt="" style="max-width: 500px;">
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3"></div>
</div>
</div> -->
<script src="https://use.fontawesome.com/d232835e93.js"></script>
<!-- Core JS files -->
......@@ -861,11 +382,12 @@
<!-- /theme JS files -->
<div id ='scrapex'></div>
<div id ='scrcesium'></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 src="{% static 'js/leaflet-bing-layer.js' %}"></script>
<script type="text/javascript" src="{% static 'js/maps.js' %}"></script>
<script src="{% static 'js/scripts.js' %}"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
{% include 'includes/permission.html' %} {% include 'includes/js-o.html' %} {% include 'includes/js-m.html' %}
......@@ -3027,9 +2549,46 @@
$(".tombol-edit").html('ilang')
</script>
{% endif %}
{% include 'includes/permission.html' %}
<script src="{% static 'js/scripts_js_o.js' %}"></script>
<script src="{% static 'js/scripts_js_m.js' %}"></script>
<script src="{% static 'js/action.js' %}"></script>
<script src="{% static 'js/scripts_layout.js' %}"></script>
<script src="{% static 'js/scripts_sidebar.js' %}"></script>
</body>
</html>
</html>{% include 'includes/js-m.html' %}
<script>
// start disabled inspect
// document.addEventListener('contextmenu', function(e) {
// e.preventDefault();
// });
// document.onkeydown = function(e) {
// if(event.keyCode == 123) {
// return false;
// }
// if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) {
// return false;
// }
// if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)) {
// return false;
// }
// if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) {
// return false;
// }
// if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) {
// return false;
// }
// }
// end disabled inspect
</script>
<!-- <script>
$(function() {
......
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