Skip to content

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

Merge branch 'master' of http://git.khansia.co.id/Nahrowi/oku-gis 

Conflicts:
templates/includes/js-m.html

search done
parents 701e640b 3a79ac61
Show whitespace changes
Inline Side-by-side
Showing with 3174 additions and 1766 deletions
static/css/layout-style.css
View file @ f0d124c1
...@@ -195,10 +195,45 @@ body>div.page-container>div>div.sidebar.sidebar-main>div>img { ...@@ -195,10 +195,45 @@ body>div.page-container>div>div.sidebar.sidebar-main>div>img {
margin-bottom: 20px; margin-bottom: 20px;
} }
#modal_detail_perbaikan_dash>div>div>div>div.isi.text>div>div>div:nth-child(1)>span {
font-size: 12px;
line-height: 14px;
}
#modal_detail_perbaikan_dash>div>div>div>div.isi.text>div>div>div:nth-child(2)>span {
font-size: 16px;
line-height: 19px;
font-family: 'gilroysemibold';
}
#modal_detail_perbaikan_dash>div>div>div>div.isi.text>div>div {
margin-left: 40px;
margin-bottom: 20px;
}
.hid { .hid {
transform: rotate( 180deg); transform: rotate( 180deg);
} }
#map-create-all>div.leaflet-control-container>div.leaflet-top.leaflet-left>div:nth-child(2)>div>div>a.leaflet-draw-draw-marker {
margin-top: -20px;
margin-left: -10px;
width: 40px;
height: 20px;
}
.tab_personal_information {
margin: 10px;
}
#formmen>div>div>div>div {
margin-bottom: 10px;
}
#formmen>div>div>div>div>div>input {
font-family: 'gilroylight';
}
@media (max-width: 1025px) { @media (max-width: 1025px) {
.dock { .dock {
position: absolute; position: absolute;
......
static/img/icon-1/Vectorpoint.svg 0 → 100644
View file @ f0d124c1
<svg width="28" height="37" viewBox="0 0 28 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d)">
<path d="M13.9966 6.99054e-10C11.8822 0.00183716 9.85438 0.874018 8.35608 2.42605C6.85779 3.97808 6.01076 6.08383 6 8.28339C6 11.5812 7.77853 14.3423 9.08188 16.3549L9.31947 16.7221C10.6162 18.6773 12.0073 20.5628 13.4875 22.3715L14.0034 23L14.5193 22.3715C15.9993 20.5626 17.3904 18.6771 18.6873 16.7221L18.9249 16.3479C20.2215 14.3353 22 11.5812 22 8.28339C21.9892 6.08261 21.1413 3.97579 19.6415 2.42356C18.1417 0.871329 16.1122 -2.84983e-05 13.9966 6.99054e-10ZM13.9966 12.0049C13.1159 12.0049 12.2549 11.7332 11.5226 11.2242C10.7903 10.7152 10.2195 9.99168 9.88246 9.1452C9.54541 8.29873 9.45723 7.36729 9.62905 6.46868C9.80088 5.57006 10.225 4.74463 10.8478 4.09677C11.4706 3.4489 12.264 3.0077 13.1278 2.82896C13.9917 2.65021 14.887 2.74195 15.7007 3.09257C16.5144 3.44319 17.2099 4.03695 17.6992 4.79876C18.1886 5.56057 18.4497 6.45621 18.4497 7.37243C18.4497 8.60104 17.9806 9.77933 17.1454 10.6481C16.3103 11.5168 15.1776 12.0049 13.9966 12.0049Z" fill="#5A9AFB"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0" width="28" height="37" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="8"/>
<feGaussianBlur stdDeviation="3"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.4875 0 0 0 0 0.6925 0 0 0 0 1 0 0 0 0.82 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</svg>
static/img/icon-1/help.svg 0 → 100644
View file @ f0d124c1
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.0748 24.6313C19.9049 24.6313 24.6311 19.9051 24.6311 14.075C24.6311 8.24499 19.9049 3.5188 14.0748 3.5188C8.24475 3.5188 3.51855 8.24499 3.51855 14.075C3.51855 19.9051 8.24475 24.6313 14.0748 24.6313Z" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.0748 21.1125C15.0465 21.1125 15.8342 20.3248 15.8342 19.3531C15.8342 18.3814 15.0465 17.5938 14.0748 17.5938C13.1031 17.5938 12.3154 18.3814 12.3154 19.3531C12.3154 20.3248 13.1031 21.1125 14.0748 21.1125Z" fill="#212232"/>
<path d="M14.075 14.9552C14.684 14.9552 15.2792 14.7746 15.7855 14.4363C16.2919 14.098 16.6865 13.6171 16.9195 13.0545C17.1526 12.4919 17.2135 11.8729 17.0947 11.2756C16.9759 10.6784 16.6827 10.1297 16.2521 9.69916C15.8215 9.26856 15.2729 8.97533 14.6757 8.85652C14.0784 8.73772 13.4594 8.7987 12.8968 9.03173C12.3342 9.26477 11.8533 9.6594 11.515 10.1657C11.1767 10.672 10.9961 11.2673 10.9961 11.8763" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
static/img/icon-1/infodatauser.svg 0 → 100644
View file @ f0d124c1
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5566 7.25269H23.7522" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.5571 14.2903H23.752" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.5571 21.328H23.752" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.39844 7.25269H6.15785" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.39893 14.2903H6.15766" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.39893 21.328H6.15766" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
static/img/icon-1/monitordatauser.svg 0 → 100644
View file @ f0d124c1
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.44582 21.1166L23.0399 21.1166C24.0116 21.1166 24.7993 20.3289 24.7993 19.3572V7.04131C24.7993 6.06961 24.0116 5.2819 23.0399 5.2819L5.44582 5.2819C4.47413 5.2819 3.68641 6.06961 3.68641 7.04131V19.3572C3.68641 20.3289 4.47413 21.1166 5.44582 21.1166Z" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M17.7618 25.0752H10.7241" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
static/img/icon-1/personalinfo.svg 0 → 100644
View file @ f0d124c1
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.0755 25.1478C19.9057 25.1478 24.6319 20.4215 24.6319 14.5914C24.6319 8.7612 19.9057 4.03491 14.0755 4.03491C8.24533 4.03491 3.51904 8.7612 3.51904 14.5914C3.51904 20.4215 8.24533 25.1478 14.0755 25.1478Z" stroke="url(#paint0_linear)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.0753 18.1103C16.5045 18.1103 18.4738 16.141 18.4738 13.7118C18.4738 11.2825 16.5045 9.31323 14.0753 9.31323C11.646 9.31323 9.67676 11.2825 9.67676 13.7118C9.67676 16.141 11.646 18.1103 14.0753 18.1103Z" stroke="url(#paint1_linear)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.01562 22.4399C7.67827 21.1371 8.68852 20.043 9.93452 19.2789C11.1805 18.5147 12.6137 18.1102 14.0753 18.1102C15.537 18.1102 16.9702 18.5147 18.2162 19.2789C19.4622 20.043 20.4724 21.1371 21.1351 22.4399" stroke="url(#paint2_linear)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear" x1="14.0755" y1="-15.7584" x2="41.667" y2="28.3032" gradientUnits="userSpaceOnUse">
<stop stop-color="#4C97DC"/>
<stop offset="1" stop-color="#4969DA"/>
</linearGradient>
<linearGradient id="paint1_linear" x1="14.0753" y1="1.066" x2="25.5717" y2="19.425" gradientUnits="userSpaceOnUse">
<stop stop-color="#4C97DC"/>
<stop offset="1" stop-color="#4969DA"/>
</linearGradient>
<linearGradient id="paint2_linear" x1="14.0753" y1="14.0511" x2="16.4049" y2="26.1829" gradientUnits="userSpaceOnUse">
<stop stop-color="#4C97DC"/>
<stop offset="1" stop-color="#4969DA"/>
</linearGradient>
</defs>
</svg>
static/img/icon-1/saranaibadah.svg 0 → 100644
View file @ f0d124c1
<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M24.4706 24.4612V6.10823C24.4706 3.93957 23.4876 1.76225 21.9052 0.42595L21.4118 0.00933838L20.9184 0.426001C19.3359 1.76225 18.3529 3.93957 18.3529 6.10823V11.6247C17.6896 10.5955 16.8272 9.68919 15.7973 8.96828L11.4706 5.93953L7.14383 8.96828C4.58589 10.7588 3.05882 13.6918 3.05882 16.8141V18.3435H1.52941V24.4612H0V25.9906H26V24.4612H24.4706ZM22.9412 7.63764H19.8824V6.10823H22.9412V7.63764ZM21.4118 2.07262C22.0362 2.76396 22.4976 3.6394 22.7425 4.57881H20.0811C20.3259 3.63945 20.7874 2.76396 21.4118 2.07262ZM8.02085 10.2212L11.4706 7.80638L14.9203 10.2212C16.6453 11.4287 17.8116 13.2547 18.2053 15.2847H4.73593C5.1296 13.2547 6.29593 11.4287 8.02085 10.2212ZM4.58824 16.8141H18.3529V18.3435H4.58824V16.8141ZM3.05882 19.8729H19.8824V21.4024H14.9774L11.9186 24.4612H3.05882V19.8729ZM14.0814 24.4612L15.6109 22.9318H19.8824V24.4612H14.0814ZM21.4118 24.4612V18.3435H19.8824C19.8824 17.9019 19.8824 9.56562 19.8824 9.16705H22.9412V24.4612H21.4118Z" fill="#7DC74F"/>
<path d="M4.58838 21.4024H6.11779V22.9318H4.58838V21.4024Z" fill="#7DC74F"/>
<path d="M7.64697 21.4024H9.17639V22.9318H7.64697V21.4024Z" fill="#7DC74F"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="26" height="26" fill="white"/>
</clipPath>
</defs>
</svg>
templates/includes/insert.html
View file @ f0d124c1
...@@ -309,7 +309,7 @@ ...@@ -309,7 +309,7 @@
for (var i = 0; i < data['result'].length; i++) { for (var i = 0; i < data['result'].length; i++) {
var data_k = data['result'][i][0]; var data_k = data['result'][i][0];
console.log(data_k) console.log(data_k)
var data_kab = `<option value="` + data_k +`">` + data_k + `</option>`; var data_kab = `<option value="` + data_k + `">` + data_k + `</option>`;
data_all_kab.push(data_kab) data_all_kab.push(data_kab)
}; };
$('#tipe_point_2_b').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab); $('#tipe_point_2_b').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab);
...@@ -334,7 +334,7 @@ ...@@ -334,7 +334,7 @@
for (var i = 0; i < data['result'].length; i++) { for (var i = 0; i < data['result'].length; i++) {
var data_id = data['result'][i][0]; var data_id = data['result'][i][0];
var data_po = data['result'][i][1]; var data_po = data['result'][i][1];
var data_kab = `<option value="` +data_id + `">` + data_po + `</option>`; var data_kab = `<option value="` + data_id + `">` + data_po + `</option>`;
data_all_kab.push(data_kab) data_all_kab.push(data_kab)
}; };
$('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>` + data_all_kab); $('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>` + data_all_kab);
......
templates/includes/js-m.html
View file @ f0d124c1
This source diff could not be displayed because it is too large. You can view the blob instead.
templates/includes/js-o.html
View file @ f0d124c1
...@@ -1132,7 +1132,20 @@ ...@@ -1132,7 +1132,20 @@
var path_img = `"static/image/tuplah/` + feature.legend.f4 + `"` var path_img = `"static/image/tuplah/` + feature.legend.f4 + `"`
} }
$(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:360px;height:290px;border-top-left-radius: 10px;border-top-right-radius: 10px;">`) $(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-right-radius: 10px;">`)
$(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="
background-color: #5A9AFB;
position: absolute;
width: 40px;
height: 40px;
bottom: 2px;
right: 5px;
border: 1pt solid rosybrown;
border-radius: 8px;
">
<a href="#" class="btn" id="btn_edit_tuplah" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
</div>`)
$(".nama_keterangan").html(feature.legend.f2) $(".nama_keterangan").html(feature.legend.f2)
...@@ -1252,7 +1265,6 @@ ...@@ -1252,7 +1265,6 @@
$(document).on("click", "#btn_edit_tuplah", function() { $(document).on("click", "#btn_edit_tuplah", function() {
if (map_edit_tuplah.hasLayer(polygon_edit_tuplah)) { if (map_edit_tuplah.hasLayer(polygon_edit_tuplah)) {
polygon_edit_tuplah.remove() polygon_edit_tuplah.remove()
} }
...@@ -1266,6 +1278,8 @@ ...@@ -1266,6 +1278,8 @@
}, },
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
$("#modal-edit-tuplah").modal("show")
$("#modal_detail_non_kelurahan").modal("toggle")
loaderPage(false); loaderPage(false);
let response = data let response = data
if (response.code == 0) { if (response.code == 0) {
...@@ -2015,29 +2029,67 @@ ...@@ -2015,29 +2029,67 @@
layer.on({ layer.on({
click: function(e) { click: function(e) {
$("#modal_detail_non_kelurahan").modal(show);
var geogeo = geocodeService.reverse().latlng(e.latlng).run(function(error, result) { $("#modal_detail_non_kelurahan").modal('show');
if (feature.properties.f2 == null) {
var namajalan = "unnamed"
}
if (feature.properties.f6 == 'None') { if (feature.properties.f6 == 'None') {
var path_img = "static/img/image_null.png" var path_img = "static/img/image_null.png"
} else { } else {
var path_img = `"static/image/jalan/` + feature.properties.f6 + `"` var path_img = `"static/image/jalan/` + feature.properties.f6 + `"`
} }
$(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:360px;height:290px;border-top-left-radius: 10px;border-top-right-radius: 10px;">`) $(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">`)
$(".nama_keterangan").html(feature.legend.f2) $(".nama_keterangan").html(namajalan)
$(".isi_keterangan").html(` $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
<input type="text" name="idtuplah" id="idtuplah" class="hidden" value=""> <a href="#" id="btn_jalan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
</div>
<div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
<a href="#" id="btn_hapus_jalan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-eraser2"></i></a>
</div>
`)
<input type="text" name="coordinatetuplah" id="coordinatetuplah" class="hidden" value=""> if (feature.properties.f7 != null) {
var list_history = feature.properties.f7
console.log(list_history[0].split(",")[0])
var perbaikan_jl = `<div class='row'>
<label class="col-md-8">` + list_history[0].split(",")[1] + `</label>
<a class="col-md-4" onclick="getdetailper(` + list_history[0].split(",")[0] + `)" data-toggle="modal" data-target="#modal_detail_perbaikan_dash"><i>Detail</i></a>
</div>
<a class="col-md-6" class="btn" id="btn_perbaikan_jalan"><i>Input Perbaikan</i></a>`
} else {
var perbaikan_jl = `<div class='row'>
<div class="col-md-6"> <div class="col-md-6">
<label class="col-md-6">Null</label>
</div>
<a class="col-md-6" class="btn" id="btn_perbaikan_jalan"><i>Input Perbaikan</i></a>
</div>`
}
$(".isi_keterangan").html(`
<input type="text" name="idjalan" id="idjalan" class="hidden" value="">
<input type="text" name="coordinatejalan" id="coordinatejalan" class="hidden" value="">
<div> <div>
<div> <div>
<span>Panjang Jalan</span> <span>Panjang Jalan</span>
</div> </div>
<div> <div>
<span>` + feature.legend.f3 + `m</span> <span>` + feature.properties.f3 + `m</span>
</div> </div>
</div> </div>
<div> <div>
...@@ -2048,8 +2100,7 @@ ...@@ -2048,8 +2100,7 @@
<span style="font-family: 'Roboto';">` + feature.properties.f4 + ` m</span> <span style="font-family: 'Roboto';">` + feature.properties.f4 + ` m</span>
</div> </div>
</div> </div>
</div>
<div class="col-md-6">
<div> <div>
<div> <div>
<span>Tipe Jalan</span> <span>Tipe Jalan</span>
...@@ -2058,7 +2109,16 @@ ...@@ -2058,7 +2109,16 @@
<span>` + feature.properties.f5 + `</span> <span>` + feature.properties.f5 + `</span>
</div> </div>
</div> </div>
<div>
<div>
<span>Perbaikan Terakhir</span>
</div>
<div>
<span>` + perbaikan_jl + `</span>
</div>
</div> </div>
`) `)
//if (result.address.Address != '') { //if (result.address.Address != '') {
// var nmjalan = result.address.Address // var nmjalan = result.address.Address
...@@ -2103,8 +2163,8 @@ ...@@ -2103,8 +2163,8 @@
//} //}
// //
$('#namajalan').val(feature.legend.f2); $('#namajalan').val(feature.properties.f2);
});
$('#idjalan').val(feature.properties.f1); $('#idjalan').val(feature.properties.f1);
$('#panjangjalan').val(feature.properties.f3); $('#panjangjalan').val(feature.properties.f3);
...@@ -2236,6 +2296,8 @@ ...@@ -2236,6 +2296,8 @@
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
loaderPage(false); loaderPage(false);
$("#modal-jalan").modal("show")
$(".modal_detail_non_kelurahan").modal("hide")
setTimeout(function() { setTimeout(function() {
map_edit_jalan.invalidateSize(); map_edit_jalan.invalidateSize();
}, 1000); }, 1000);
...@@ -2784,56 +2846,96 @@ ...@@ -2784,56 +2846,96 @@
}; };
function getdetailper(id) { function getdetailper(id) {
$.ajax({ $.ajax({
url: "{% url 'apps:get-detail-perbaikan' %}", url: "{% url 'apps:get-detail-perbaikan' %}",
data: { data: {
'id': id 'id': id
}, },
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
console.log(data)
isi_modal_detail = []
for (var i = 0; i < data.length; i++) { var map_detail_perbaikan = L.map('map_detail_perbaikan_dash', {
isi_modal_detail.push(`<tr> editable: true,
<td>` + i + `</td> zoomControl: false,
<td>` + data[i].name + `</td> drawControl: true
<td>` + data[i].type + `</td> }).setView([-4.125826277307029, 104.1881561279297], 10);
<td>` + data[i].tgl_perbaikan + `</td>
<td>` + data[i].anggaran + `</td> 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', {
<td>` + data[i].pj + `</td> maxZoom: 21,
<td>` + data[i].pj_lapangan + `</td> minZoom: 4,
<td>` + data[i].kontraktor + `</td> }).addTo(map_detail_perbaikan);
<td>` + data[i].pjg_jln_reno + `</td>
<td>` + data[i].lbr_jln_reno + `</td>
<td><a onclick="loadmapruas('` + data[i].id + `','` + data[i].id_object + `')" id="loaddetailcoord" data-toggle="modal" data-target="#modal_detail_ruas">View</a></td> setTimeout(function() {
<td><a href="media/proposal/` + data[i].proposal + `" id="downloadproposal" target="_blank">View</a></td> map_detail_perbaikan.invalidateSize();
<td><a href="media/bukti_penyelesaian/` + data[i].bukti_selesai + `" onclick="viewBukti()" id="view-bukti" target="_blank">View</a></td> }, 500);
</tr>`)
if (data.length === 0) {
$(".nama_detail_dash").text("Null");
$(".type_detail_dash").html("Null");
$(".tanggal_perbaikan_detail_dash").html("Null")
$(".anggaran_detail_dash").html("Null")
$(".penanggung_jawab_detail_dash").html("Null")
$(".penanggung_jawab_lapangan_detail_dash").html("Null")
$(".kontraktor_detail_dash").html("Null")
$(".panjang_jalan_detail_dash").html("Null")
$(".lebar_jalan_detail_dash").html("Null")
$(".proposal_detail_dash").html(`
<a href="media/proposal/null" id="downloadproposal ">
<img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
</a>`);
$(".bukti_detail_perbaikan_dash").html(`
<a href="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 {
$(".nama_detail_dash").html(data[0]['name']);
$(".type_detail_dash").html(data[0]['type'])
$(".tanggal_perbaikan_detail_dash").text(data[0]['tgl_perbaikan'])
$(".anggaran_detail_dash").html(data[0]['anggaran'])
$(".penanggung_jawab_detail_dash").html(data[0]['pj'])
$(".penanggung_jawab_lapangan_detail_dash").html(data[0]['pj_lapangan'])
$(".kontraktor_detail_dash").html(data[0]['kontraktor'])
$(".panjang_jalan_detail_dash").html(data[0]['panjang'])
$(".lebar_jalan_detail_dash").html(data[0]['lbr_jln_reno'])
$(".proposal_detail_dash").html(`
<a href="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_dash").html(`
<a href="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>`);
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);
} }
$("#isi_modal_detail").html(`
<table class="table table-responsive datatable-show-all table-sm" id="isi_detail" style="word-wrap:break-word;">
<thead>
<tr>
<th>No.</th>
<th>Nama</th>
<th>Type</th>
<th>Tanggal Perbaikan</th>
<th>Anggaran</th>
<th>Penanggung Jawab</th>
<th>Penanggung Jawab Lapangan</th>
<th>Kontraktor</th>
<th>panjang jalan yang di perbaiki</th>
<th>Lebar Jalan yang di Perbaiki</th>
<th>Ruas yang di perbaiki</th>
<th>Proposal</th>
<th>Bukti Penyelesaian</th>
</tr>
</thead>
<tbody>
` + isi_modal_detail + `
</tbody>
</table>`)
} }
}); });
...@@ -2881,6 +2983,7 @@ ...@@ -2881,6 +2983,7 @@
map_input.setView([latlngs['geometry']['coordinates'][0][0][1], latlngs['geometry']['coordinates'][0][0][0]], 17) map_input.setView([latlngs['geometry']['coordinates'][0][0][1], latlngs['geometry']['coordinates'][0][0][0]], 17)
geo_jalan_input.addData(data[3]); geo_jalan_input.addData(data[3]);
$("#map-insert > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(1) > div > div > a.leaflet-draw-draw-marker").css("display", "none")
} }
}) })
...@@ -3464,3 +3567,765 @@ ...@@ -3464,3 +3567,765 @@
} }
}); });
</script> </script>
<script>
//klik kanan begin
map.on('contextmenu', function(e) {
$("#modal_option_create").modal("show");
$("#map-create-all").remove();
$(".btn_create_jalan").click(function() {
$("#modal__create").modal("show");
$(".title-create").html("Create Jalan")
$(".tombol_action_create").html(`<input type="button" id="create-jal" value="Create" style="z-index: 1000;position:relative;">`)
$(".tab_1").html("Koordinat")
$(".tab_2").html("Informasi Jalan")
$(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="create_save_jalan" value="SAVE" style="margin-right:30px;">
<input type="text" name="poly_create" class="hidden" id="poly_create_jalan" value="">`)
$("#koordinatjalan").html(`
<div class="form-group">
<div id="map-create-all" style="height: 300px;">
<div class="tombol_action_create">
<input type="button" id="create-jal" value="Create" style="z-index: 1000;position:relative;">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
<div class="col-lg-9" style="margin-top:10px">
<input type="file" id="img_jalan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
</div>
</div>`)
$("#informasi_create").html(`
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-4 control-label lbl-top" style="margin-top: 15px;">Nama Jalan</label>
<div class="col-lg-8">
<input id="nama_jalan_create" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-4 control-label lbl-top" style="margin-top: 15px;">Panjang Jalan (m)</label>
<div class="col-lg-8">
<input id="panjang_jalan_create" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-4 control-label lbl-top" style="margin-top: 15px;">Lebar Jalan (m)</label>
<div class="col-lg-8">
<input id="lebar_jalan_create" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-4 control-label lbl-top" style="margin-top: 15px;">Tipe Jalan</label>
<div class="col-lg-8">
<input id="tipe_jalan_create" type="text" class="form-control" value="" required>
</div>
</div>
</div>
`);
var map_create_all = L.map('map-create-all', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([e.latlng.lat, e.latlng.lng], 20);
L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
maxZoom: 22,
minZoom: 4,
}).addTo(map_create_all);
setTimeout(function() {
map_create_all.invalidateSize();
}, 500);
var lineDraweredit = new L.Draw.Polyline(map_create_all, polygon_options);
lineDraweredit.on("click", function(event) {
shapecoords.innerHTML = event.latlng.toString();
map_create_all.fire("click", event); // Trigger a map click as well.
});
map_create_all.on('draw:created', function(e) {
var type = e.layerType,
layer = e.layer;
layer.options.color = 'yellow';
layer.options.weight = 10;
var koordina = ""
if (type === 'polyline') {
var tempLatLng = null;
var totalDistance = 0.00000;
$.each(e.layer._latlngs, function(i, latlng) {
if (tempLatLng == null) {
tempLatLng = latlng;
return;
}
totalDistance += tempLatLng.distanceTo(latlng);
tempLatLng = latlng;
});
e.layer.bindPopup((totalDistance).toFixed(2) + ' meter');
e.layer.openPopup();
$("#panjang_jalan_create").val((totalDistance).toFixed(2) + ' meter');
}
$("#poly_create_jalan").val(JSON.stringify(layer.toGeoJSON()));
layer.addTo(map_create_all);
});
$("#create-jal").click(function() {
lineDraweredit.enable();
})
$("#map-create-all>div.leaflet-control-container>div.leaflet-top.leaflet-left>div>div>div").css("display", "none")
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div").css("display", "none")
})
$(".btn_create_bangunan").click(function() {
$("#modal__create").modal("show");
$(".title-create").html("Create Bangunan")
$(".tombol_action_create").html(`<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">`)
$(".tab_1").html("Koordinat")
$(".tab_2").html("Informasi Bangunan")
$(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="create_save_bangunan" value="SAVE" style="margin-right:30px;">
<input type="text" name="poly_create" class="hidden" id="poly_create_bangunan" value="">`)
$("#koordinatjalan").html(`
<div class="form-group">
<div id="map-create-all" style="height: 300px;">
<div class="tombol_action_create">
<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
<div class="col-lg-9" style="margin-top:10px">
<input type="file" id="img_bangunan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
</div>
</div>`)
$("#informasi_create").html(`
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Nama Bangunan</label>
<div class="col-lg-9">
<input id="name_create" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Jenis Bangunan</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point_b" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Jenis Point --</option>
<option value="bangunan">Bangunan Biasa</option>
<option value="kantor_administrasi">Kantor Administrasi</option>
<option value="layanan_kesehatan">Layanan Kesehatan</option>
<option value="puskesmas">Puskesmas</option>
<option value="rumah_sakit">Rumah Sakit</option>
<option value="sarana_ibadah">Sarana Ibadah</option>
<option value="sarana_pendidikan">Sarana Pendidikan</option>
<option value="spbu">SPBU</option>
<option value="stasiun">Stasiun</option>
<option value="terminal_bus">Terminal Bus</option>
<option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
<option value="gardu_listrik">Gardu Listrik</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Tipe Bangunan</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_2_b" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Tipe Point --</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Nama Point</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_3_b" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Point --</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Informasi Bangunan</label>
<div class="col-lg-9">
<input id="info_create" type="text" class="form-control" value="" placeholder="Rumah/Gedung/Ruko/Pabrik/dsb" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Alamat</label>
<div class="col-lg-9">
<input id="alamat_create" type="text" class="form-control" value="" placeholder="cth : Jl. Contoh Rt 005/01 No.01" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Luas Bangunan</label>
<div class="col-lg-6">
<input id="luas_bangunan_create" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">
<select id="satuan_luas_bangunan" >
<option>m2</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top">Luas Tanah</label>
<div class="col-lg-6">
<input id="luas_tanah_create" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">
<select id="satuan_luas_tanah">
<option>m2</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top">Tinggi Bangunan</label>
<div class="col-lg-6">
<input id="tinggi_bangunan_create" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">m</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top">Jumlah Lantai</label>
<div class="col-lg-9">
<input id="lantai" type="text" class="form-control" value="" placeholder="Estimasi Per Lantai = 3m" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Pemilik</label>
<div class="col-lg-9">
<input id="pemilik_create" type="text" class="form-control" value="" placeholder="cth : Ali Budiman, S.Si." required>
</div>
</div>
</div>
`);
var map_create_all = L.map('map-create-all', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([e.latlng.lat, e.latlng.lng], 20);
L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
maxZoom: 22,
minZoom: 4,
}).addTo(map_create_all);
setTimeout(function() {
map_create_all.invalidateSize();
}, 500);
$('#create').click(function() {
map_create_all.enable();
});
var Marker = {};
var Poly = {};
map_create_all.on(L.Draw.Event.CREATED, function(e) {
var layer = e.layer;
$("#poly_create_bangunan").empty();
var type = e.layerType;
var layer = e.layer;
var shape = layer.toGeoJSON();
let geoShape = shape.geometry.coordinates[0];
let kordinat = "";
for (j in geoShape) {
kordinat += geoShape[j][0] + ' ' + geoShape[j][1];
if (j <= (geoShape.length - 2)) {
kordinat += ', ';
}
}
window.thisBaseDrawPolygonLayer = layer;
$("#poly_create_bangunan").val(JSON.stringify(kordinat));
});
polygon_options = {
showArea: false,
shapeOptions: {
stroke: true,
color: '#6e83f0',
weight: 1.5,
opacity: 2,
fill: false,
fillColor: null, //same as color by default
clickable: true
}
}
var polygonDraweredit = new L.Draw.Polygon(map_create_all, polygon_options);
map_create_all.on("click", function(event) {
shapecoords.innerHTML = event.latlng.toString();
map_create_all.fire("click", event); // Trigger a map click as well.
});
map_create_all.on('draw:created', function(e) {
var type = e.layerType,
layer = e.layer;
var lay = layer.addTo(map_create_all);
Poly = lay;
});
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div").css("display", "none")
});
$(".btn_create_point").click(function() {
$("#modal__create").modal("show");
$(".title-create").html("Create Point")
$(".tombol_action_create").html(``)
$(".tab_1").html("Koordinat")
$(".tab_2").html("Informasi Point")
$(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="btnsavepoint" value="SAVE" style="margin-right:30px;">
<input type="text" name="poly_create_point" class="hidden" id="poly_create_point" value="">`)
$("#koordinatjalan").html(`
<div class="form-group">
<div id="map-create-all" style="height: 300px;">
<!-- <div class="tombol_action_create">
<input type="button" class="leaflet-draw-draw-marker" value="Create" style="z-index: 1000;position:relative;">
</div> -->
</div>
<div class="form-group">
<label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
<div class="col-lg-9" style="margin-top:10px">
<input type="file" id="gambar_pitik" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
</div>
</div>`)
$("#informasi_create").html(`
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
<div class="col-lg-9">
<input id="name_create_point" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Jenis Point</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Jenis Point --</option>
<option value="kantor_administrasi">Kantor Administrasi</option>
<option value="layanan_kesehatan">Layanan Kesehatan</option>
<option value="puskesmas">Puskesmas</option>
<option value="rumah_sakit">Rumah Sakit</option>
<option value="sarana_ibadah">Sarana Ibadah</option>
<option value="sarana_pendidikan">Sarana Pendidikan</option>
<option value="spbu">SPBU</option>
<option value="stasiun">Stasiun</option>
<option value="terminal_bus">Terminal Bus</option>
<option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
<option value="gardu_listrik">Gardu Listrik</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_2" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Tipe Point --</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Alamat</label>
<div class="col-lg-9">
<input id="alamat_create_point" type="text" class="form-control" value="" placeholder="cth : Jl. Contoh Rt 005/01 No.01" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Luas Tanah</label>
<div class="col-lg-6">
<input id="luas_tanah_point" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">
<select id="satuan_luas_tanah" style="margin-top: 15px;">
<option>m2</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Pimpinan</label>
<div class="col-lg-9">
<input id="pemilik_point" type="text" class="form-control" value="" placeholder="cth : Ali Budiman, S.Si." required>
</div>
</div>
</div>
`);
var map_create_all = L.map('map-create-all', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([e.latlng.lat, e.latlng.lng], 20.5);
L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
maxZoom: 22,
minZoom: 4,
}).addTo(map_create_all);
setTimeout(function() {
map_create_all.invalidateSize();
}, 500);
$(".leaflet-draw-draw-marker").html('<span>Create</span>')
var drawControl = new L.Control.Draw(drawPluginOptions);
map_create_all.addControl(drawControl);
var editableLayers = new L.FeatureGroup();
map_create_all.addLayer(editableLayers);
// define custom marker
var MyCustomMarker = L.Icon.extend({
options: {
shadowUrl: null,
iconAnchor: new L.Point(12, 12),
iconSize: new L.Point(24, 24),
}
});
var drawPluginOptions = {
position: 'topright',
draw: {
marker: {
title: "soyel1",
icon: new MyCustomMarker()
},
marker: true
},
edit: {
featureGroup: editableLayers, //REQUIRED!!
remove: true
}
};
var drawControl = new L.Control.Draw(drawPluginOptions);
map_create_all.addControl(drawControl);
var editableLayers = new L.FeatureGroup();
map_create_all.addLayer(editableLayers);
map_create_all.on('draw:created', function(e) {
var type = e.layerType,
layer = e.layer;
editableLayers.addLayer(layer);
$("#poly_create_point").val(JSON.stringify(layer.toGeoJSON()));
$("#modal_point").modal()
map.closePopup();
});
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div").css("display", "none")
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-right").css("display", "none")
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(1) > div > div > a.leaflet-draw-draw-polyline").css("display", "none")
$("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div > a.leaflet-draw-draw-marker").css("display", "block!important")
})
$("#tipe_point").change(function() {
var tipe = $(this).val();
$.ajax({
url: "{% url 'api:change-tipe' %}",
data: {
'tipe': tipe
},
dataType: 'json',
success: function(data) {
console.log(data)
var data_all_kab = []
for (var i = 0; i < data['result'].length; i++) {
var data_k = data['result'][i][0];
var data_kab = `<option value="` +
data_k +
`">` +
data_k +
`</option>`;
data_all_kab.push(data_kab)
};
$('#tipe_point_2').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab);
}
});
});
$("#tipe_point_b").change(function() {
var tipe = $(this).val();
$.ajax({
url: "{% url 'api:change-tipe' %}",
data: {
'tipe': tipe
},
dataType: 'json',
success: function(data) {
var data_all_kab = []
for (var i = 0; i < data['result'].length; i++) {
var data_k = data['result'][i][0];
console.log(data_k)
var data_kab = `<option value="` + data_k + `">` + data_k + `</option>`;
data_all_kab.push(data_kab)
};
$('#tipe_point_2_b').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab);
}
});
});
$("#tipe_point_2_b").change(function() {
var jenis = $(this).val();
var tipx = $("#tipe_point_b").val();
$.ajax({
url: "{% url 'api:change-jenis' %}",
data: {
'tipe': tipx,
'jenis': jenis
},
dataType: 'json',
success: function(data) {
console.log(data)
var data_all_kab = []
for (var i = 0; i < data['result'].length; i++) {
var data_id = data['result'][i][0];
var data_po = data['result'][i][1];
var data_kab = `<option value="` + data_id + `">` + data_po + `</option>`;
data_all_kab.push(data_kab)
};
$('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>` + data_all_kab);
}
});
});
});
$(document).on("click", "#create_save_jalan", function(e) {
data = new FormData()
data.append("gambar", $("input[id^='img_jalan']")[0].files[0]);
data.append("polyline", $("#poly_create_jalan").val())
data.append("name_jalan", $("#nama_jalan_create").val())
data.append("panjang_jalan", $("#panjang_jalan_create").val())
data.append("lebar_jalan", $("#lebar_jalan_create").val())
data.append("tipe_jalan", $("#tipe_jalan_create").val())
$.ajax({
url: "{% url 'api:create-jalan' %}",
data: data,
dataType: 'json',
type: 'POST',
processData: false,
contentType: false,
success: function(data) {
let response = data
if (response.status == 0) {
swal({
title: response.info,
text: response.data,
type: "success",
icon: "success",
confirmButtonColor: "#00BCD4"
})
} else {
swal({
title: response.info,
text: response.data,
type: "warning",
icon: "error",
confirmButtonColor: "#00BCD4"
})
}
map.closePopup();
}
});
});
$(document).on("click", "#create_save_bangunan", function(e) {
var polygin = $('#poly_create_bangunan').val();
var name_poly = $('#name_create').val();
var tdb = $('#tipe_point_b').val();
var remark = $('#tipe_point_2_b').val();
var poin_id = $('#tipe_point_3_b').val();
var napo = $("#tipe_point_3_b option:selected").text();
var info_poly = $('#info_create').val();
var alamat_poly = $('#alamat_create').val();
var lb_poly = $('#luas_bangunan_create').val();
var lt_poly = $('#luas_tanah_create').val();
var tb_poly = $('#tinggi_bangunan_create').val();
var ltbang = $('#lantai').val();
var mpu_poly = $('#pemilik_create').val();
$.ajax({
url: "{% url 'api:c_bangunan' %}",
data: {
'polygon': polygin,
'name': name_poly,
'tipedb': tdb,
'poin_id': poin_id,
'nama_po': napo,
'remark': remark,
'info': info_poly,
'alamat': alamat_poly,
'lb': lb_poly,
'lt': lt_poly,
'tb': tb_poly,
'ltb': ltbang,
'pemilik': mpu_poly
},
dataType: 'json',
// type: 'POST',
// processData: false,
// contentType: false,
success: function(data) {
let response = data
if (response.status == 0) {
swal({
title: response.info,
text: response.data,
type: "success",
icon: "success",
confirmButtonColor: "#00BCD4"
})
} else {
swal({
title: response.info,
text: response.data,
type: "warning",
icon: "error",
confirmButtonColor: "#00BCD4"
})
}
map.closePopup();
}
});
});
$(document).on("click", "#btnsavepoint", function(e) {
data = new FormData()
data.append("gambar", $("input[id^='gambar_pitik']")[0].files[0]);
data.append("point", $("#poly_create_point").val())
data.append("name_create_point", $("#name_create_point").val())
data.append("tipe_point", $("#tipe_point").val())
data.append("info_create_point", $("#tipe_point_2").val())
data.append("alamat_create_point", $("#alamat_create_point").val())
data.append("luas_tanah_point", $("#luas_tanah_point").val())
data.append("pemilik_point", $("#pemilik_point").val())
$.ajax({
url: "{% url 'api:create-point' %}",
data: data,
dataType: 'json',
type: 'POST',
processData: false,
contentType: false,
success: function(data) {
let response = data
if (response.status == 0) {
swal({
title: response.info,
text: response.data,
type: "success",
icon: "success",
confirmButtonColor: "#00BCD4"
}, function() {
$("#modal_point").css('display', 'none');
})
} else {
swal({
title: response.info,
text: response.data,
type: "warning",
icon: "error",
confirmButtonColor: "#00BCD4"
})
}
map.closePopup();
}
});
});
</script>
\ No newline at end of file
templates/includes/m.html
View file @ f0d124c1
{% load static %} {% load static %}
<div class="legendapo" id="legendapo" style="bottom: 0px;display:none"> <!-- <div class="legendapo" id="legendapo" style="bottom: 0px;display:none">
<div> <div>
<a href="#" onclick="hidelegend()" class="btn btn-default" id="button_hide_point"><span class="caret" style="margin-left: -5px;"></span></a> <a href="#" onclick="hidelegend()" class="btn btn-default" id="button_hide_point"><span class="caret" style="margin-left: -5px;"></span></a>
</div> </div>
...@@ -303,4 +303,4 @@ ...@@ -303,4 +303,4 @@
</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> <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> </div> -->
\ No newline at end of file \ No newline at end of file
templates/includes/modal.html
View file @ f0d124c1
...@@ -320,111 +320,6 @@ ...@@ -320,111 +320,6 @@
<div class="modal fade" id="modal_tampak"> <div class="modal fade" id="modal_tampak">
</div> </div>
<div id="modal_point" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-info" style="background-color: #40777c;">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h6 class="modal-title">Insert Point</h6>
</div>
<input type="text" name="poly_create_point" class="hidden" id="poly_create_point" value="">
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label" style="margin-top:10px">Image</label>
<div class="col-lg-9" style="margin-top:10px">
<input type="file" id="gambar_pitik" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
<div class="col-lg-9">
<input id="name_create_point" type="text" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Jenis Point</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Jenis Point --</option>
<option value="kantor_administrasi">Kantor Administrasi</option>
<option value="layanan_kesehatan">Layanan Kesehatan</option>
<option value="puskesmas">Puskesmas</option>
<option value="rumah_sakit">Rumah Sakit</option>
<option value="sarana_ibadah">Sarana Ibadah</option>
<option value="sarana_pendidikan">Sarana Pendidikan</option>
<option value="spbu">SPBU</option>
<option value="stasiun">Stasiun</option>
<option value="terminal_bus">Terminal Bus</option>
<option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
<option value="gardu_listrik">Gardu Listrik</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
<div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_2" data-placeholder="select point.." class="select-size-md">
<option value="null" selected disabled>-- Pilih Tipe Point --</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Alamat</label>
<div class="col-lg-9">
<input id="alamat_create_point" type="text" class="form-control" value="" placeholder="cth : Jl. Contoh Rt 005/01 No.01" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Luas Tanah</label>
<div class="col-lg-6">
<input id="luas_tanah_point" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">
<select id="satuan_luas_tanah" style="margin-top: 15px;">
<option>m2</option>
</select>
</div>
</div>
</div>
<div class="row" style="margin-top: 15px;">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Pimpinan</label>
<div class="col-lg-9">
<input id="pemilik_point" type="text" class="form-control" value="" placeholder="cth : Ali Budiman, S.Si." required>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
<button type="button" id="btnsavepoint" class="btn btn-info">Save</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modalsearch3d" tabindex="-1" role="dialog"> <div class="modal fade" id="modalsearch3d" tabindex="-1" role="dialog">
<div class="modal-dialog modal-xs"> <div class="modal-dialog modal-xs">
<div class="modal-content"> <div class="modal-content">
...@@ -457,6 +352,11 @@ ...@@ -457,6 +352,11 @@
font-family: 'gilroysemibold'; font-family: 'gilroysemibold';
} }
#modal_detail_non_kelurahan>div>div>div.modal-body>fieldset>div>div:nth-child(2)>div>div>div>div:nth-child(2) {
margin-bottom: 10px;
font-family: 'gilroysemibold';
}
li.active>a:after { li.active>a:after {
border-bottom: 2pt solid #60B2FD; border-bottom: 2pt solid #60B2FD;
} }
...@@ -603,9 +503,9 @@ ...@@ -603,9 +503,9 @@
</div> </div>
</div> </div>
<div class="modal fade" id="modal_detail_non_kelurahan" tabindex="-1" role="dialog"> <div class="modal fade" id="modal_detail_non_kelurahan" tabindex="-1" role="dialog" style="z-index: 1;margin-left: 6%;">
<div class="modal-dialog modal-md" style="width: 362px;max-height: 500px;min-height: 500px;"> <div class="modal-dialog modal-md" style="top: 20%;">
<div class="modal-content" style="border-radius:10px;max-height: 500px;min-height: 500px;"> <div class="modal-content" style="border-radius:10px;">
<div class="modal-body" style="padding: 0px;"> <div class="modal-body" style="padding: 0px;">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style=" margin: 0px 8px 0px 0px; <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style=" margin: 0px 8px 0px 0px;
width: 25px; width: 25px;
...@@ -615,18 +515,23 @@ ...@@ -615,18 +515,23 @@
position: absolute; position: absolute;
right: 0px; right: 0px;
opacity: 1; opacity: 1;
z-index: 999;
border-radius: 12px;">×</button> border-radius: 12px;">×</button>
<fieldset> <fieldset>
<div class="row">
<div class="col-md-6">
<div class="gambar_keterangan"> <div class="gambar_keterangan">
<img src="/static/img/image_null.png" alt="" style="width:360px;height:290px;border-top-left-radius: 10px;border-top-right-radius: 10px;"> <img src="/static/img/image_null.png" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">
</div> </div>
<div style="margin: 10px;"> <div style="font-family: 'gilroybold';margin: 10px;" class="nama_keterangan">
<div style="font-family: 'gilroybold';margin-bottom: 10px;" class="nama_keterangan">
NAMADESA NAMADESA
</div> </div>
<div class="row isi_keterangan">
</div>
<div class="col-md-6">
<div style="margin: 10px;">
<div class="row isi_keterangan" style="margin-top: 25px;">
<div class="col-md-6"> <div class="col-md-6">
<div> <div>
<div> <div>
...@@ -666,23 +571,729 @@ ...@@ -666,23 +571,729 @@
</div> </div>
</div> </div>
</div>
</div>
</fieldset> </fieldset>
</div> </div>
<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB; <div class="btn_action">
<div class="tombol-edit-keterangan text-center" style="
background-color: #5A9AFB;
position: absolute; position: absolute;
border-bottom-left-radius: 8px; width: 40px;
border-top-right-radius: 8px; height: 40px;
width: 80px; bottom: 2px;
height: 45px; right: 5px;
bottom: 0px;"> border: 1pt solid rosybrown;
<a href="#" class="btn" style=" border-bottom-left-radius: 8px; border-radius: 8px;
border-top-right-radius: 8px; ">
width: 80px; <a href="#" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
height: 45px; </div>
bottom: 0px; <div class="tombol-delete-keterangan text-center" style="
color: white;">Edit</a> background-color: indianred;
position: absolute;
width: 40px;
height: 40px;
bottom: 2px;
right: 50px;
border: 1pt solid rosybrown;
border-radius: 10px;
">
<a href="#" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-eraser2"></i></a>
</div>
</div>
</div> </div>
</div>
</div>
<div class="modal fade" id="modal_option_create" tabindex="-1" role="dialog">
<div class="modal-dialog modal-xs" style="width: 350px;">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Pilih jenis create</h4>
</div>
<div class="modal-body">
<fieldset>
<div class="row">
<div class="col-md-4 text-center">
<a href="#" class="btn btn_create_jalan">
<div>
<img src="{% static 'img/icon-1/Vectorjalan.svg' %}" alt="" style="width: 35px;
height: 35px;">
</div>
<div style="margin-top: 10px;">
<span>
Jalan
</span>
</div> </div>
</a>
</div> </div>
<div class="col-md-4 text-center">
<a href="#" class="btn btn_create_bangunan">
<div>
<img src="{% static 'img/icon-1/Buildingsbangunan.svg' %}" alt="" style="width: 35px;
height: 35px;">
</div>
<div style="margin-top: 10px;">
<span>
Bangunan
</span>
</div>
</a>
</div>
<div class="col-md-4 text-center">
<a href="#" class="btn btn_create_point">
<div>
<img src="{% static 'img/icon-1/Vectorpoint.svg' %}" alt="" style="width: 35px;
height: 35px;">
</div>
<div style="margin-top: 10px;">
<span>Point</span>
</div>
</a>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal__create" tabindex="-1" role="dialog">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h5 class="modal-title title-create">Create</h5>
</div>
<div class="modal-body" id="create_all">
<div class="tabbable" style="height:450px!important;width: 560px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href=".koordinatjalan" data-toggle="tab" class="tab_1">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#informasi_create" data-toggle="tab" class="tab_2">Informasi Jalan</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active koordinatjalan" id="koordinatjalan">
</div>
<div class="tab-pane" id="informasi_create">
</div>
</div>
</div>
<div class="tombol_save_create">
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="user_profile" tabindex="-1" role="dialog" style="margin-left: 50px;">
<div class="modal-dialog" style="width: 100%;
margin: 0px;
height: 100vh;">
<div class="modal-content" style="height: 100vh;">
<div class="modal-body">
<div class="row">
<div class="col-md-3" style="border-right: 0.1pt solid #E2E2E2;">
<div style="height: 100vh;">
<div class="text-center">
<div style="margin-top: 90px;">
<div class="image_area">
<form method="post">
<label for="upload_image">
{% for us in thisUser %}
{% if us.filepath %}
<img src="{% static 'img/' %}{{us.filepath}}" id="uploaded_image" class="img-responsive img-circle" style="max-height: 120px!important;
width: 120px!important;
max-width: 120px!important;
height: 120px!important;"/>
{% else %}
<img src="{% static 'img/placeholder.jpg' %}" id="uploaded_image" class="img-responsive img-circle" style="max-height: 120px!important;
width: 120px!important;
max-width: 120px!important;
height: 120px!important;"/>
{% endif %}
{% endfor %}
<div class="overlay">
<div class="textover">
<i class="icon-camera" style="position: absolute;background-color: white;border-radius: 10px;top: 25%;right: 46%;width: 20px;height: 20px;" title="Ganti Foto Profil"></i>
</div>
</div>
<input type="file" name="image" class="image" id="upload_image" style="display:none" accept="image/png, image/gif, image/jpeg"/>
</label>
</form>
</div>
</div>
<div>
<span style="font-family: 'gilroysemibold';">{{user.username}}</span>
</div>
<div>
<span>{{user.email}}</span>
</div>
</div>
<div class="text-left" style="margin-top: 100px;">
<div style="margin-bottom: 10px;">
<a href="#personalinformation" data-toggle="tab" class="btn btn-default" style="
width: 90%;
background: #FFFFFF;
border: 1px solid #4A7ADB;
box-sizing: border-box;
border-radius: 5px;">
<div class="row">
<div class="col-sm-2">
<img src="{% static 'img/icon-1/personalinfo.svg' %}" alt="">
</div>
<div class="col-sm-8 text-left" style="margin-top: 4px;">
Personal Information
</div>
<div class="col-sm-2">
<i class="caret" style="transform: rotate(-90deg);margin-top: 4px;"></i>
</div>
</div>
</a>
</div>
{% if user.is_superuser %}
<div style="margin-bottom: 10px;">
<a href="#informationdatauser" data-toggle="tab" class="btn btn-default" style="
width: 90%;
background: #FFFFFF;
border: 1px solid #4A7ADB;
box-sizing: border-box;
border-radius: 5px;">
<div class="row">
<div class="col-sm-2">
<img src="{% static 'img/icon-1/infodatauser.svg' %}" alt="">
</div>
<div class="col-sm-8 text-left" style="margin-top: 4px;">
Information Data User
</div>
<div class="col-sm-2">
<i class="caret" style="transform: rotate(-90deg);margin-top: 4px;"></i>
</div>
</div>
</a>
</div>
{% endif %}
<div style="margin-bottom: 10px;">
<a href="#monitoringdatauser" data-toggle="tab" class="btn btn-default" style="
width: 90%;
background: #FFFFFF;
border: 1px solid #4A7ADB;
box-sizing: border-box;
border-radius: 5px;">
<div class="row">
<div class="col-sm-2">
<img src="{% static 'img/icon-1/monitordatauser.svg' %}" alt="">
</div>
<div class="col-sm-8 text-left" style="margin-top: 4px;">
Monitoring Data Area
</div>
<div class="col-sm-2">
<i class="caret" style="transform: rotate(-90deg);margin-top: 4px;"></i>
</div>
</div>
</a>
</div>
<div style="margin-bottom: 10px;">
<a href="#help" data-toggle="tab" class="btn btn-default" style="
width: 90%;
background: #FFFFFF;
border: 1px solid #4A7ADB;
box-sizing: border-box;
border-radius: 5px;">
<div class="row">
<div class="col-sm-2">
<img src="{% static 'img/icon-1/help.svg' %}" alt="">
</div>
<div class="col-sm-8 text-left" style="margin-top: 4px;">
Help
</div>
<div class="col-sm-2">
<i class="caret" style="transform: rotate(-90deg);margin-top: 4px;"></i>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="col-md-9">
<div class="tab-content">
<div class="tab-pane active" id="personalinformation" style="font-family: 'gilroysemibold';">
<div style="border-bottom: 1pt solid #E2E2E2;">
<div class="tab_personal_information" style="color: #4378C8;">
BASIC SETTING
</div>
</div>
<div style="border-bottom: 1pt solid #E2E2E2;">
<div class="tab_personal_information" style="margin:0px;">
<div class="alert alert-danger" id="notificationsprop" style="display: none">
</div>
<form class="form-horizontal" id="formmen" method="post" enctype="multipart/form-data">
<div class="panel-body">
<div class="row">
{% for us in thisUser %}
<input type="text" id="iduseredt" value="{{us.id}}" hidden>
<div class="col-md-6">
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Nama Depan:</label>
<input type="text" id="firstnameedt" class="form-control" value="{{us.firstname}}">
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Nama Belakang:</label>
<input type="text" id="lastnameedt" class="form-control" value="{{us.lastname}}">
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Email :</label>
<input type="text" id="emailedts" class="form-control" value="{{us.email}}">
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</form>
</div>
</div>
<div style="border-bottom: 1pt solid #E2E2E2;">
<div class="tab_personal_information" style="color: #4378C8;">
SECURITY SETTING
</div>
</div>
<div style="border-bottom: 1pt solid #E2E2E2;">
<div class="tab_personal_information" style="margin:0px;">
<div>
<div class="alert alert-danger" id="notifications" style="display: none">
</div>
</div>
<form class="form-horizontal" id="formmen" method="post" enctype="multipart/form-data">
<div class="panel-body">
<div class="row">
{% for us in thisUser %}
<input type="text" id="usernameedt" value="{{us.username}}" hidden>
<input type="text" id="iduseredt" value="{{us.id}}" hidden>
<!-- <input type="text" id="current" value="{{us.password}}"> -->
{% endfor %}
<div class="col-md-6">
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Password saat ini :</label>
<input type="password" id="currentPass" class="form-control">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Password baru :</label>
<input type="password" id="newPass" class="form-control">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label class="control-label"> Ulangi password baru :</label>
<input type="password" id="renewPass" class="form-control">
</div>
</div>
</div>
<div class="col-md-6">
<div class="text-center">
<img src="{% static 'img/icon-1/male-holding-magnifying-glass.png' %}" alt="" style="height: 138px;
width: 178px;">
</div>
<div class="help">
<span style="font-size: 12px;">
Password tidak boleh mirip dengan informasi pribadi Anda yang lain, Password harus mengandung setidaknya 8 karakter, Password Anda tidak boleh berupa kata sandi yang umum digunakan, Password tidak boleh sepenuhnya numerik.
</span>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
<div>
<div class="tab_personal_information">
<div style="float: right;">
<button type="button" class="btn btn-link" data-dismiss="modal" style="width: 120px;height: 35px;border-color: #BABABA;border-radius: 10px;">Close</button>
<button type="button" id="btnsaveuser" class="btn btn-info" style="width: 120px;height: 35px;border-radius: 10px;">Save changes</button>
</div>
</div>
</div>
<div>
</div>
</div>
{% if user.is_superuser %}
<div class="tab-pane" id="informationdatauser">
informationdatauser
</div>
{% endif %}
<div class="tab-pane" id="monitoringdatauser">
monitoringdatauser
</div>
<div class="tab-pane" id="help">
help
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="modal_detail_perbaikan_dash" class="modal fade mymodal" style="padding-top: 0px;padding-bottom: 0px;right: -11px;width: 100% !important;max-height: 657px;overflow-y:hidden; left: 0px;">
<div class="modal-dialog modal-sm " style="max-height: 657px;margin: 0;float: right;bottom: 0;
width: 320px;">
<div class="modal-content " style="background-color: #1B1F2D;max-height: 657px;color: white; ">
<div class="modal-body " style="padding: 0px;background-color: #1B1F2D; ">
<div style="float: right;margin: -42px 10px 0px 0px; ">
<button type="button " class="btn btn-link " onclick="cetakExcel() " style="color: white;padding-top: 2px;"><i class="icon-printer"></i>
<span>
&nbsp;&nbsp;Cetak
</span>
</button>
<!-- <button class="modalMinimize" style="right: 50px;"> <i class='fa fa-minus'></i> </button> -->
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color: white;padding: 3px;">
<span>x</span>
</button>
</div>
<div class="isi text " style="margin-top: 50px;overflow-y: scroll;max-height: 607px;overflow-x: hidden; ">
<div class="isi_detail_cek ">
<div>
<div>
<span>Nama</span>
</div>
<div>
<span class="nama_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Type</span>
</div>
<div>
<span class="type_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Tanggal perbaikan</span>
</div>
<div>
<span class="tanggal_perbaikan_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Anggaran</span>
</div>
<div>
<span class="anggaran_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Penanggung jawab</span>
</div>
<div>
<span class="penanggung_jawab_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Penanggung jawab lapangan</span>
</div>
<div>
<span class="penanggung_jawab_lapangan_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Kontraktor</span>
</div>
<div>
<span class="kontraktor_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Panjang jalan yang diperbaiki</span>
</div>
<div>
<span class="panjang_jalan_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div class="isi_detail_cek ">
<div>
<div>
<span>Lebar jalan yang diperbaiki</span>
</div>
<div>
<span class="lebar_jalan_detail_dash">NAMA JALAN</span>
</div>
</div>
</div>
<div style="margin-top: 20px; ">
<div class="row">
<div class="col-md-6 ">
<div>
<span>Proposal</span>
</div>
<div class="proposal_detail_dash ">
<img src="{% static 'img/icon-1/proposal.svg' %} " alt=" " style="height: 65px;width: 65px; ">
</div>
</div>
<div class="col-md-6 ">
<div>
<span>Bukti penyelesaian</span>
</div>
<div class="bukti_detail_perbaikan_dash">
<img src="{% static 'img/icon-1/bukti.svg' %} " alt=" " style="height: 65px;width: 65px; ">
</div>
</div>
</div>
<div>
<span>Ruas yang diperbaiki</span>
<!-- <div class="row">
<div class="col-sm-6">
<a href="#" class="btn" id="download_map" style="position: absolute;z-index:999">download maps</a>
</div>
<div class="col-sm-6">
<a href="#" class="btn" id="preview_map" style="position: absolute;z-index:999">preview</a>
</div>
</div>
<div id="previewImage" style="display: none;"></div> -->
<div class="map_detail_p">
<div id="map_detail_perbaikan_dash" style=" position: relative; height: 220px; width: 90%; border-radius: 5px; ">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content-wrapper modal" id="input_perbaikan" style="display: none;padding: 60px;margin-left: 10%;border-radius:10px;top: -40px;">
<div class="content modal-md" style="padding: 15px;max-height: 550px;">
<!-- Main charts -->
<div class="panel panel-flat" style="display: none;width: 1000px;">
<div class="panel-header" style="height: 50px;background: #1E2233;border-top-left-radius: 10px;border-top-right-radius: 10px;">
<!-- <button type="button" class="close" onclick="destroyWraper()" style=" width: 30px;
color: white;
height: 30px;">&times;</button> -->
<h5 class="modal-title title-create" style="color: white;margin-left: 25px;padding-top: 10px;">Input Perbaikan</h5>
</div>
<div class="panel-body" style="padding-top: 10px;">
<div class="tabbable">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li class="active"><a href="#left-tab-input-coordinat" data-toggle="tab">Koordinat</a></li>
<li><a href="#right-tab-input-informasi" data-toggle="tab">Insert Informasi</a></li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane active" id="left-tab-input-coordinat">
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<input type="text" class="hidden" id="poly_create_input">
<input type="text" class="hidden" id="id_jalan_perbaikan">
<input type="text" class="hidden" id="type_id">
<div id="map-insert" style="height: 375px;width: 100%">
</div>
</div>
</div>
<div class="tab-pane" id="right-tab-input-informasi">
<div class="modal-body" style="max-height: 415px;overflow-y: auto;">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>Nama Jalan :</label>
<input type="text" id="namajalan" class="form-control" value="">
</div>
<div class="form-group">
<label>Type Jalan :</label>
<input type="text" id="typejalan" class="form-control" value="">
</div>
<div class="form-group">
<label>Kelurahan :</label>
<input type="text" id="kelurahan" class="form-control" value="">
</div>
<div class="form-group">
<label>Kecamatan :</label>
<input type="text" id="kecamatan" class="form-control" value="">
</div>
<div class="form-group">
<label>Anggaran :</label>
<input type="text" id="anggaran" class="form-control" value="">
</div>
<div class="form-group">
<label>Pihak yang Mengesahkan :</label>
<input type="text" id="pihakpengesahan" class="form-control" value="">
</div>
<div class="form-group">
<label>Tanggal Disetujui :</label>
<input type="date" id="tgldisetujui" class="form-control" value="">
</div>
<div class="form-group">
<label>Tanggal Mulai Perbaikan :</label>
<input type="date" id="tglmulaiperbaikan" class="form-control" value="">
</div>
<div class="form-group">
<label>Tanggal Selesai Perbaikan :</label>
<input type="date" id="tglselesaiperbaikan" class="form-control" value="">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Penanggung Jawab Lapangan :</label>
<input type="text" id="pjlapangan" class="form-control" value="">
</div>
<div class="form-group">
<label>Kontraktor :</label>
<input type="text" id="kontraktor" class="form-control" value="">
</div>
<div class="form-group">
<label>Panjang Jalan Keseluruhan :</label>
<input type="text" id="panjangjalanall" class="form-control" value="">
</div>
<div class="form-group">
<label>Panjang Jalan Perbaikan :</label>
<input type="text" id="panjangjalanperbaikan" class="form-control" value="">
</div>
<div class="form-group">
<label>Lebar Jalan Perbaikan :</label>
<input type="text" id="lebarjalanperbaikan" class="form-control" value="">
</div>
<div class="form-group">
<label>Jenis Perbaikan :</label>
<input type="text" id="jenisperbaikan" class="form-control" value="">
</div>
<div class="form-group">
<label>Proposal (.pdf):</label>
<input type="file" id="proposal">
</div>
<div class="form-group">
<label>Bukti Selesai Perbaikan (.png/.jpg/.jpeg/):</label>
<input type="file" id="buktiselesai">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel-footer">
<button type="button" class="btn btn-info" id="save-perbaikan" style="float: right; margin-right: 40px;">SAVE</button>
<button type="button" class="btn btn-link" onclick="destroyWraper()" style="float: right;">Close</button>
</div>
</div>
</div>
<!-- /main charts -->
</div> </div>
\ No newline at end of file
templates/includes/sidebar.html
View file @ f0d124c1
{% load static %} {% load humanize %} {% load static %} {% load humanize %}
<style> <style>
#list_perbaikan_filter>label>input[type=search] { #list_perbaikan_filter>label>input[type=search] {
border-color: #393E54; border-color: #393E54;
} }
...@@ -249,7 +248,7 @@ ...@@ -249,7 +248,7 @@
<div class="row-bod row" style="border-bottom: 0.5pt solid #313649;color:white"> <div class="row-bod row" style="border-bottom: 0.5pt solid #313649;color:white">
<div class="col-sm-1"></div> <div class="col-sm-1"></div>
<div class="col-sm-2"> <div class="col-sm-2">
<img src="{% static 'img/icon-1/GraduationCap.svg' %}" alt=""> <img src="{% static 'img/icon-1/saranaibadah.svg' %}" alt="">
</div> </div>
<div class="col-sm-7" style="margin-bottom: 2px;margin-top: -8px;"> <div class="col-sm-7" style="margin-bottom: 2px;margin-top: -8px;">
Jumlah Sarana Ibadah Jumlah Sarana Ibadah
...@@ -646,8 +645,10 @@ ...@@ -646,8 +645,10 @@
</div> </div>
<div id="previewImage" style="display: none;"></div> --> <div id="previewImage" style="display: none;"></div> -->
<div class="map_detail_p">
<div id="map_detail_perbaikan" style=" position: relative; height: 220px; width: 90%; border-radius: 5px; "> <div id="map_detail_perbaikan" style=" position: relative; height: 220px; width: 90%; border-radius: 5px; ">
</div>
</div> </div>
</div> </div>
...@@ -668,17 +669,6 @@ ...@@ -668,17 +669,6 @@
<script type="text/javascript " src="{% static 'js/plugins/forms/selects/select2.min.js' %} "></script> <script type="text/javascript " src="{% static 'js/plugins/forms/selects/select2.min.js' %} "></script>
<script> <script>
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);
$("#sel-kec ").change(function() { $("#sel-kec ").change(function() {
var id_kec = $(this).val() var id_kec = $(this).val()
...@@ -842,21 +832,36 @@ ...@@ -842,21 +832,36 @@
}); });
function loaddetailid(id) { function loaddetailid(id) {
$(".map_detail_p").html(``)
var isObject = {}; var isObject = {};
isObject.id = id; isObject.id = id;
$("#iduser ").val(id) $("#iduser ").val(id)
setTimeout(function() {
map_detail_perbaikan.invalidateSize();
}, 500);
$.ajax({ $.ajax({
url: "{% url 'apps:loadDetail' %} ", url: "{% url 'apps:loadDetail' %} ",
data: isObject, data: isObject,
dataType: 'json', dataType: 'json',
type: 'post', type: 'post',
success: function(data) { success: function(data) {
$(".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) { if (data.length === 0) {
$(".nama_detail").text("Null"); $(".nama_detail").text("Null");
......
templates/layout/layout.html
View file @ f0d124c1
...@@ -485,6 +485,22 @@ ...@@ -485,6 +485,22 @@
margin-top: -4.5px; margin-top: -4.5px;
border-radius: 50%; border-radius: 50%;
} }
.modal-header {
background-color: #1B1F2D !important;
border: #1B1F2D;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
#modal_adm>.modal-content {
border-radius: 10px;
}
#modal_detail_non_kelurahan>div>div>div.modal-body>fieldset>div>div:nth-child(1)>div.gambar_keterangan>img {
border-bottom-left-radius: 0px!important;
border-bottom-right-radius: 10px;
}
</style> </style>
{% include 'includes/css-o.html' %} {% include 'includes/css-m.html' %} {% include 'includes/css-o.html' %} {% include 'includes/css-m.html' %}
...@@ -698,7 +714,7 @@ ...@@ -698,7 +714,7 @@
padding: 8px 16px; padding: 8px 16px;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
text-overflow: ellipsis;">Kelola Akun</a> text-overflow: ellipsis;" data-toggle="modal" data-target="#user_profile" data-backdrop="static" data-keyboard="false">Kelola Akun</a>
</div> </div>
</div> </div>
......
templates/layout/user_layout.html
View file @ f0d124c1
...@@ -38,7 +38,6 @@ ...@@ -38,7 +38,6 @@
.modal-backdrop { .modal-backdrop {
z-index: -1!important; z-index: -1!important;
} }
.sidebar { .sidebar {
...@@ -116,8 +115,7 @@ ...@@ -116,8 +115,7 @@
height: 270px; height: 270px;
} }
#placelg{ #placelg {
object-fit: cover; object-fit: cover;
object-position: center center; object-position: center center;
width: 30px; width: 30px;
...@@ -132,7 +130,7 @@ ...@@ -132,7 +130,7 @@
border: 1px solid red; border: 1px solid red;
} }
.modal-lg{ .modal-lg {
max-width: 1000px !important; max-width: 1000px !important;
} }
...@@ -164,8 +162,6 @@ ...@@ -164,8 +162,6 @@
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
text-align: center; text-align: center;
} }
</style> </style>
</head> </head>
...@@ -212,6 +208,7 @@ ...@@ -212,6 +208,7 @@
<ul class="dropdown-menu dropdown-menu-right"> <ul class="dropdown-menu dropdown-menu-right">
{% if user.is_superuser or user.is_staff %} {% if user.is_superuser or user.is_staff %}
<li><a href="{% url 'usermanagement' %}?page=userprofile"><i class="icon-user-tie"></i>User Profile</a></li>
<li><a href="{% url 'usermanagement' %}"><i class="icon-user"></i>User Management</a></li> <li><a href="{% url 'usermanagement' %}"><i class="icon-user"></i>User Management</a></li>
<li><a href="{% url 'apps:perbaikan' %}"><i class="icon-list"></i>Repair & Renovation</a></li> <li><a href="{% url 'apps:perbaikan' %}"><i class="icon-list"></i>Repair & Renovation</a></li>
{% endif %} {% endif %}
...@@ -239,14 +236,12 @@ ...@@ -239,14 +236,12 @@
<div class="sidebar-user"> <div class="sidebar-user">
<div class="category-content"> <div class="category-content">
<div class="media"> <div class="media">
{% for us in thisUser %} {% for us in thisUser %} {% if us.filepath %}
{% if us.filepath %}
<a href="?page=userprofile" class="media-left"><img src="{% static 'img/' %}{{us.filepath}}" class="img-circle img-sm" alt=""></a> <a href="?page=userprofile" class="media-left"><img src="{% static 'img/' %}{{us.filepath}}" class="img-circle img-sm" alt=""></a>
{% else %} {% else %}
<a href="?page=userprofile" class="media-left"><img src="{% static '/img/placeholder.jpg' %}" class="img-circle img-sm" alt=""></a> <a href="?page=userprofile" class="media-left"><img src="{% static '/img/placeholder.jpg' %}" class="img-circle img-sm" alt=""></a>
{% endif %} {% endif %} {% endfor %}
{% endfor %}
<div class="media-body"> <div class="media-body">
<span class="media-heading text-semibold">{{user.username}}</span> <span class="media-heading text-semibold">{{user.username}}</span>
...@@ -502,7 +497,7 @@ ...@@ -502,7 +497,7 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<label>Username </label> <label>Username </label>
<input type="text" id="username" class="form-control" value="{{us.username}}"readonly> <input type="text" id="username" class="form-control" value="{{us.username}}" readonly>
</div> </div>
</div> </div>
...@@ -532,7 +527,7 @@ ...@@ -532,7 +527,7 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<label>Email </label> <label>Email </label>
<input type="text" id="useremail" class="form-control" value="{{us.email}}"readonly> <input type="text" id="useremail" class="form-control" value="{{us.email}}" readonly>
</div> </div>
</div> </div>
...@@ -753,7 +748,7 @@ ...@@ -753,7 +748,7 @@
<h6 class="modal-title"> Edit Password</h6> <h6 class="modal-title"> Edit Password</h6>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div > <div>
<div class="alert alert-danger" id="notifications" style="display: none"> <div class="alert alert-danger" id="notifications" style="display: none">
</div> </div>
...@@ -773,7 +768,7 @@ ...@@ -773,7 +768,7 @@
<div class="col-md-12"> <div class="col-md-12">
<label class="control-label"> Password saat ini :</label> <label class="control-label"> Password saat ini :</label>
<input type="password" id="currentPass" class="form-control" > <input type="password" id="currentPass" class="form-control">
</div> </div>
</div> </div>
...@@ -782,7 +777,7 @@ ...@@ -782,7 +777,7 @@
<div class="col-md-12"> <div class="col-md-12">
<label class="control-label"> Password baru :</label> <label class="control-label"> Password baru :</label>
<input type="password" id="newPass" class="form-control" > <input type="password" id="newPass" class="form-control">
</div> </div>
</div> </div>
...@@ -791,7 +786,7 @@ ...@@ -791,7 +786,7 @@
<div class="col-md-12"> <div class="col-md-12">
<label class="control-label"> Ulangi password baru :</label> <label class="control-label"> Ulangi password baru :</label>
<input type="password" id="renewPass" class="form-control" > <input type="password" id="renewPass" class="form-control">
</div> </div>
</div> </div>
...@@ -973,8 +968,7 @@ ...@@ -973,8 +968,7 @@
<!-- <script type="text/javascript" src="{% static 'js/plugins/ui/ripple.min.js' %}"></script> --> <!-- <script type="text/javascript" src="{% static 'js/plugins/ui/ripple.min.js' %}"></script> -->
<!-- /theme JS files --> <!-- /theme JS files -->
{% include 'includes/scripts.html' %} {% include 'includes/scripts.html' %} {% include 'layout/userprofile.html' %}
{% include 'layout/userprofile.html' %}
<script src="{% static 'js/leaflet-bing-layer.js' %}"></script> <script src="{% static 'js/leaflet-bing-layer.js' %}"></script>
<!-- <script src="https://unpkg.com/sweetalert/dists/sweetalert.min.js"></script> --> <!-- <script src="https://unpkg.com/sweetalert/dists/sweetalert.min.js"></script> -->
...@@ -1054,15 +1048,15 @@ ...@@ -1054,15 +1048,15 @@
const urlParams = new URLSearchParams(queryString); const urlParams = new URLSearchParams(queryString);
const page = urlParams.get('page') const page = urlParams.get('page')
if (page == "group" ) { if (page == "group") {
$("#usergroup").css("display", "block"); $("#usergroup").css("display", "block");
$("#info-maps").css("display", "none"); $("#info-maps").css("display", "none");
$("#userprofile").css("display", "none"); $("#userprofile").css("display", "none");
} else if(page == "user" || page == null){ } else if (page == "user" || page == null) {
$("#usergroup").css("display", "none"); $("#usergroup").css("display", "none");
$("#info-maps").css("display", "block"); $("#info-maps").css("display", "block");
$("#userprofile").css("display", "none") $("#userprofile").css("display", "none")
} else{ } else {
$("#usergroup").css("display", "none"); $("#usergroup").css("display", "none");
$("#info-maps").css("display", "none"); $("#info-maps").css("display", "none");
$("#userprofile").css("display", "block"); $("#userprofile").css("display", "block");
...@@ -1577,11 +1571,11 @@ ...@@ -1577,11 +1571,11 @@
//user profile js //user profile js
$("#save-edt-password").on("click", function(){ $("#save-edt-password").on("click", function() {
changepassword(); changepassword();
}) })
function changepassword(){ function changepassword() {
var isObject = {}; var isObject = {};
isObject.id = $("#iduseredt").val(); isObject.id = $("#iduseredt").val();
...@@ -1590,7 +1584,7 @@ ...@@ -1590,7 +1584,7 @@
isObject.renewPass = $("#renewPass").val(); isObject.renewPass = $("#renewPass").val();
isObject.username = $("#usernameedt").val(); isObject.username = $("#usernameedt").val();
if(isObject.currPass == "" || isObject.newPass == "" || isObject.renewPass == ""){ if (isObject.currPass == "" || isObject.newPass == "" || isObject.renewPass == "") {
$("#notifications").css("display", "block") $("#notifications").css("display", "block")
$("#notifications").html("Inputan tidak boleh kosong") $("#notifications").html("Inputan tidak boleh kosong")
...@@ -1627,11 +1621,11 @@ ...@@ -1627,11 +1621,11 @@
} }
$("#save-edit-profile").on("click", function(){ $("#save-edit-profile").on("click", function() {
editprofile(); editprofile();
}) })
function editprofile(){ function editprofile() {
var isObject = {} var isObject = {}
isObject.id = $("#iduseredt").val(); isObject.id = $("#iduseredt").val();
...@@ -1639,14 +1633,14 @@ ...@@ -1639,14 +1633,14 @@
isObject.last_name = $("#lastnameedt").val(); isObject.last_name = $("#lastnameedt").val();
isObject.email = $("#emailedts").val() isObject.email = $("#emailedts").val()
if(isObject.first_name == "" || isObject.last_name == "" || isObject.email == ""){ if (isObject.first_name == "" || isObject.last_name == "" || isObject.email == "") {
$("#notificationsprop").css("display", "block"); $("#notificationsprop").css("display", "block");
$("#notificationsprop").html("Inputan tidak boleh kosong") $("#notificationsprop").html("Inputan tidak boleh kosong")
return false return false
}else{ } else {
var mail_format = /^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/; var mail_format = /^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/;
if(!isObject.email.match(mail_format)){ if (!isObject.email.match(mail_format)) {
$("#notificationsprop").css("display", "block"); $("#notificationsprop").css("display", "block");
$("#notificationsprop").html("Format email tidak valid, silahkan coba kembali.") $("#notificationsprop").html("Format email tidak valid, silahkan coba kembali.")
return false return false
...@@ -1737,6 +1731,4 @@ ...@@ -1737,6 +1731,4 @@
} }
}) })
}); });
</script> </script>
\ No newline at end of file
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