Skip to content

O
OKU-GIS
Commit 74ad4e71 authored by Muhamad's avatar Muhamad
Browse files
Options

dashboard, insert all kurang dikit pointnya

parent 75b657e5
Show whitespace changes
Inline Side-by-side
Showing with 1316 additions and 555 deletions
API/urls.py
View file @ 74ad4e71
......@@ -49,6 +49,8 @@ urlpatterns = [
path('c_bangunan', views.createbang, name='c_bangunan'),
path('create-jalan', views.createjalan, name='create-jalan'),
path('create-point', views.createpoint, name='create-point'),
path('edit-tuplah', login_required(views.edittuplah), name='edit-tuplah'),
path('edit-tuplah-valid', views.edittuplahvalid, name='edit-tuplah-valid'),
......@@ -57,7 +59,4 @@ urlpatterns = [
path('edit-jalan-valid', views.editjalanvalid, name='edit-jalan-valid'),
path('3d-maps', views.maps3d, name='3d-maps'),
]
\ No newline at end of file
API/views.py
View file @ 74ad4e71
......@@ -1535,4 +1535,146 @@ def createbang(request):
respon={'data':data, 'info': info, 'status':status}
return Response(respon)
# @api_view(('GET',))
@api_view(('POST',))
def createjalan(request):
polyline = request.POST.get('polyline')
name_jalan = request.POST.get('name_jalan')
panjang_jalan = request.POST.get('panjang_jalan')
lebar_jalan = request.POST.get('lebar_jalan')
tipe_jalan = request.POST.get('tipe_jalan')
img_jalan = request.FILES.get('gambar')
coord = json.loads(str(polyline))
print(coord)
try:
if coord['features'][0]['geometry']['type'] == 'LineString':
for co in coord['features']:
ll = str(co["geometry"]['coordinates'])
ll += ll
ll = ll.replace(", "," ")
ll = ll.replace("]][[","),(")
ll = ll.replace("] [",", ")
ll = ll.replace("]]",")")
ll = ll.replace("[[","(")
coordinat = f'MULTILINESTRING({ll})'
except:
if coord['geometry']['type'] == 'LineString':
ll = str(coord["geometry"]['coordinates'])
ll = ll.replace(", "," ")
ll = ll.replace("]][[","),(")
ll = ll.replace("] [",", ")
ll = ll.replace("]]",")")
ll = ll.replace("[[","(")
coordinat = f'MULTILINESTRING({ll})'
fss_p = FileSystemStorage(location='static/image/jalan/')
try:
format = (img_jalan.name).split(".")
num = random.randrange(1, 10000000000000)
ngambar = f"{name_jalan}_{num}.{format[-1:][0]}"
ngambar = ngambar.replace(" ","-")
filename_p = fss_p.save(ngambar, img_jalan)
url_p = fss_p.url(filename_p)
except:
ngambar = 'None'
try:
with conn.cursor() as jalan:
jalan.execute("""INSERT INTO geo_jalan(geom, namrjl, panjang_jalan, lebar_jalan, remark, gambar) VALUES (ST_GeomFromEWKT('SRID=4326;%s'), '%s',%s,%s,'%s','%s')"""% (coordinat, name_jalan, panjang_jalan, lebar_jalan, tipe_jalan, ngambar))
conn.commit()
data = 'SUCCESS'
info = 'data telah diperbaharui'
status = 0
except:
data = 'Opss..!!'
info = 'Hubungi Developer'
status = 1
respon={'data':data, 'info': info, 'status':status}
return Response(respon)
@api_view(('POST',))
def createpoint(request):
gambar = request.FILES.get('gambar')
co_point = request.POST.get('point')
name_create_point = request.POST.get('name_create_point')
tipe_point = request.POST.get('tipe_point')
info_create_point = request.POST.get('info_create_point')
alamat_create_point = request.POST.get('alamat_create_point')
luas_bangunan_point = request.POST.get('luas_bangunan_point')
luas_tanah_point = request.POST.get('luas_tanah_point')
tinggi_bangunan_point = request.POST.get('tinggi_bangunan_point')
lantai_point = request.POST.get('lantai_point')
pemilik_point = request.POST.get('pemilik_point')
coord = json.loads(str(co_point))
coordinat = coord['geometry']['coordinates']
fss_p = FileSystemStorage(location='static/img/image/')
try:
format = (gambar.name).split(".")
num = random.randrange(1, 10000000000000)
ngambar = f"{name_create_point}_{num}.{format[-1:][0]}"
ngambar = ngambar.replace(" ","-")
filename_p = fss_p.save(ngambar, gambar)
url_p = fss_p.url(filename_p)
except:
ngambar = 'None'
# update geo_rumah_sakit set geom = st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), namobj = '%s', alamat = '%s', remark = '%s', luas_bangunan = '%s', luas_tanah = '%s', tinggi_bangunan = '%s', perangkat = '%s', gambar = '%s' where id = %s
try:
if tipe_point == 'administrasi':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_kantor_administrasi(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 5,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'layanankesehatan':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_layanan_kesehatan(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 6,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'puskesmas':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_puskesmas(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 7,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'rumahsakit':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_rumah_sakit(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 8,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'saranaibadah':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_sarana_ibadah(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 9,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'saranapendidikan':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_sarana_pendidikan(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 10,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
if tipe_point == 'cagarbudaya':
with conn.cursor() as point:
point.execute("""INSERT INTO geo_cagar_budaya(geom, namobj, remark, luas_bangunan, luas_tanah, tinggi_bangunan, alamat, perangkat, type_id, gambar) VALUES (st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), '%s','%s', %s, %s, %s, '%s', '%s', 3,'%s')"""% (coordinat, name_create_point, info_create_point, luas_bangunan_point, luas_tanah_point, tinggi_bangunan_point, alamat_create_point, pemilik_point, ngambar))
conn.commit()
data = 'SUCCESS'
info = 'data telah diperbaharui'
status = 0
except:
data = 'Opss..!!'
info = 'Hubungi Developer'
status = 1
respon={'data':data, 'info': info, 'status':status}
return Response(respon)
\ No newline at end of file
templates/includes/insert.html 0 → 100644
View file @ 74ad4e71
<script>
//klik kanan begin
map.on('contextmenu', function(e) {
$("#map-create").remove();
// document.getElementsByClassName('leaflet-popup-content').style.width = "550px";
var popup = L.popup()
.setLatLng(e.latlng)
.setContent(`
<div class="tab-pane has-padding" id="panel-tab2">
<div class="tab-pane" id="bottom-justified-data">
<div class="tabbable" style="width: 450px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href="#bangunan" data-toggle="tab" id="c_bangunan">Bangunan</a></li>
<li onclick="changetabs(this)"><a href=".koordinatjalan" data-toggle="tab" id="c_jalan">Jalan</a></li>
<li onclick="changetabs(this)"><a href=".point-insert" data-toggle="tab" id="point-insert">Point</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="bangunan">
<div class="tabbable" style="overflow:auto;height:450px!important;width: 450px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href="#right-tab2-feas-upl" data-toggle="tab">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#left-tab1-feas-upl" data-toggle="tab">Informasi Bangunan</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="right-tab2-feas-upl">
<div class="form-group">
<div id="map-create" style="height: 250px;">
<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">
</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="file" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
<input style="display:none;" id="gambar" type="text" class="form-control" value="" required>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="left-tab1-feas-upl">
<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 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" style="margin-top: 15px;">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" style="margin-top: 15px;">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" style="margin-top: 15px;">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" 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;">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" 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;">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" style="margin-top: 15px;">m</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;">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" style="margin-top: 15px;">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>
</div>
</div>
</div>
<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="">
</div>
<div class="tab-pane koordinatjalan">
<div class="tabbable" style="overflow:auto;height:450px!important;width: 450px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href=".koordinatjalan" data-toggle="tab">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#informasi_jalan" data-toggle="tab">Informasi Jalan</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane koordinatjalan" id="koordinatjalan">
<div class="form-group">
<div id="map-create-jalan" style="height: 250px;">
<input type="button" id="create-jal" value="Create" style="z-index: 1000;position:relative;">
</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>
</div>
<div class="tab-pane" id="informasi_jalan">
<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>
</div>
</div>
</div>
<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="">
</div>
<div class="tab-pane point-insert">
<div class="tabbable" style="overflow:auto;height:450px!important;width: 450px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href=".point-insert" data-toggle="tab">Koordinat</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane point-insert">
<div class="form-group">
<div id="map-create-admin" style="height: 250px;">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`)
.openOn(map);
map.openPopup(popup);
var map_create_bangunan = L.map('map-create', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([e.latlng.lat, e.latlng.lng], 20.5);
map_created = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
maxZoom: 22,
minZoom: 4,
}).addTo(map_create_bangunan);
map_create_bangunan.invalidateSize();
$('#create').click(function() {
polygonDraweredit.enable();
});
var Marker = {};
var Poly = {};
map_create_bangunan.on(L.Draw.Event.CREATED, function(e) {
var layer = e.layer;
$("#poly_create").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").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_bangunan, polygon_options);
polygonDraweredit.on("click", function(event) {
shapecoords.innerHTML = event.latlng.toString();
map_create_bangunan.fire("click", event); // Trigger a map click as well.
});
map_create_bangunan.on('draw:created', function(e) {
var type = e.layerType,
layer = e.layer;
var lay = layer.addTo(map_create_bangunan);
Poly = lay;
});
var map_create_jalan = L.map('map-create-jalan', {
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_jalan);
$("#c_jalan").click(function() {
setTimeout(function() {
map_create_jalan.invalidateSize();
}, 500);
})
var lineDraweredit = new L.Draw.Polyline(map_create_jalan, polygon_options);
lineDraweredit.on("click", function(event) {
shapecoords.innerHTML = event.latlng.toString();
map_create_jalan.fire("click", event); // Trigger a map click as well.
});
map_create_jalan.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_jalan);
});
$("#create-jal").click(function() {
lineDraweredit.enable();
})
var map_create_admin = L.map('map-create-admin', {
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_admin);
$("#point-insert").click(function() {
setTimeout(function() {
map_create_admin.invalidateSize();
}, 500);
})
$(".leaflet-draw-draw-marker").html('<span class="fa fa-expand"></span>')
var drawControl = new L.Control.Draw(drawPluginOptions);
map_create_admin.addControl(drawControl);
var editableLayers = new L.FeatureGroup();
map_create_admin.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_admin.addControl(drawControl);
var editableLayers = new L.FeatureGroup();
map_create_admin.addLayer(editableLayers);
map_create_admin.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-admin > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div > a.leaflet-draw-draw-marker").css("display", "block!important")
});
$(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').val();
var name_poly = $('#name_create').val();
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,
'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", $("#info_create_point").val())
data.append("alamat_create_point", $("#alamat_create_point").val())
data.append("luas_bangunan_point", $("#luas_bangunan_point").val())
data.append("luas_tanah_point", $("#luas_tanah_point").val())
data.append("tinggi_bangunan_point", $("#tinggi_bangunan_point").val())
data.append("lantai_point", $("#lantai_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();
}
});
});
//klik kanan end
</script>
\ No newline at end of file
templates/includes/js-m.html
View file @ 74ad4e71
{% for group in user.groups.all %} {% if group.name == 'Superadmin' %}
<style>
.leaflet-popup{
.leaflet-popup {
display: block;
}
#btn_edit_kelurahan {
display: block;
}
......@@ -46,6 +47,7 @@
#btn_edit_adm {
display: block;
}
#btn_delete_adm {
display: block;
}
......@@ -70,7 +72,7 @@
display: block;
}
.leaflet-popup{
.leaflet-popup {
display: block;
}
</style>
......@@ -4638,7 +4640,7 @@
}
}
//3d begin
//3d begin
function map3d() {
var checkBox_3d = document.getElementById("3d-maps");
if (checkBox_3d.checked == true) {
......@@ -4647,8 +4649,7 @@
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJhOTc0NDkxMi02N2NkLTQwYjMtOTE1Yi1iMGNkZDU0Zjg3MGMiLCJpZCI6NDQ1ODgsImlhdCI6MTYxNDE0NjM5NH0.sRHzNNa7uV_huqGxERySWlL8J5UVx1VwU-pRwNd0GJk';
var worldTerrain = new Cesium.ArcGISTiledElevationTerrainProvider({
url:
"https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer",
url: "https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer",
});
var map_cesium = new Cesium.Viewer('map-cesium');
// var map_cesium = new Cesium.Viewer('map-cesium', {
......@@ -4806,272 +4807,6 @@
$("#map-cesium").css('display', 'none');
}
}
//3d end
//klik kanan begin
map.on('contextmenu', function(e) {
$("#map-create").remove();
// document.getElementsByClassName('leaflet-popup-content').style.width = "550px";
var popup = L.popup()
.setLatLng(e.latlng)
.setContent(`
<div class="tab-pane has-padding" id="panel-tab2">
<div class="tab-pane" id="bottom-justified-data">
<div class="tabbable" style="overflow:auto;height:450px!important;width: 450px!important;">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href="#right-tab2-feas-upl" data-toggle="tab">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#left-tab1-feas-upl" data-toggle="tab">Informasi Umum</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="right-tab2-feas-upl">
<div class="form-group">
<div id="map-create" style="height: 250px;">
<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">
</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="file" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
<input style="display:none;" id="gambar" type="text" class="form-control" value=""required>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="left-tab1-feas-upl">
<div class="modal-body" style="overflow-y: auto;">
<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 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" style="margin-top: 15px;">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" style="margin-top: 15px;">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" style="margin-top: 15px;">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" 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;">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" 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;">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" style="margin-top: 15px;">m</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;">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" style="margin-top: 15px;">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>
</div>
</div>
</div>
</div>
<input type="button" class="btn btn-primary" id="create_save" value="SAVE" style="margin-right:30px;">
</div>
<input type="text" name="poly_create" class="hidden" id="poly_create" value="">
</div>
`)
.openOn(map);
map.openPopup(popup);
var map_create = L.map('map-create', {
editable: true,
zoomControl: false,
drawControl: true
}).setView([e.latlng.lat, e.latlng.lng], 20.5);
map_created = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
maxZoom: 22,
minZoom: 4,
}).addTo(map_create);
map_create.invalidateSize();
$('#create').click(function() {
polygonDraweredit.enable();
});
var Marker = {};
var Poly = {};
map_create.on(L.Draw.Event.CREATED, function(e) {
var layer = e.layer;
$("#poly_create").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").val(JSON.stringify(kordinat));
});
polygon_options = {
showArea: false,
shapeOptions: {
stroke: true,
color: '#6e83f0',
weight: 1.5,
opacity: 2,
fill: true,
fillColor: null, //same as color by default
fillOpacity: 0.3,
clickable: true
}
}
var polygonDraweredit = new L.Draw.Polygon(map_create, polygon_options);
polygonDraweredit.on("click", function(event) {
shapecoords.innerHTML = event.latlng.toString();
map_create.fire("click", event); // Trigger a map click as well.
});
map_create.on('draw:created', function(e) {
var type = e.layerType,
layer = e.layer;
var lay = layer.addTo(map_create);
Poly = lay;
});
});
$(document).on("click", "#create_save", function(e) {
var polygin = $('#poly_create').val();
var name_poly = $('#name_create').val();
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,
'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();
}
});
});
//klik kanan end
//3d end
</script>
{% include 'includes/insert.html' %}
\ No newline at end of file
templates/includes/js-o.html
View file @ 74ad4e71
......@@ -39,11 +39,12 @@
#btn_edit_adm {
display: block;
}
#btn_delete_adm {
display: block;
}
.leaflet-popup{
.leaflet-popup {
display: block;
}
</style>
......@@ -95,7 +96,7 @@
display: block;
}
.leaflet-popup{
.leaflet-popup {
display: block;
}
</style>
......@@ -171,10 +172,9 @@
display: block;
}
.leaflet-popup{
.leaflet-popup {
display: block;
}
</style>
{% elif group.name == 'Dinas Sosial' %}
<style>
......@@ -1204,7 +1204,7 @@
<span>Luas Lahan : ` + feature.legend.f3 + `</span>
</p>
<p class="text-center" style="margin-top: 25px;">
<a href="#" class="btn btn-default" data-toggle="modal" data-target="#modal-edit-tuplah" id="btn_edit_tuplah" data-backdrop="static" data-keyboard="false"><i>Edit Informasi Jalan</i></a>
<a href="#" class="btn btn-default" data-toggle="modal" data-target="#modal-edit-tuplah" id="btn_edit_tuplah" data-backdrop="static" data-keyboard="false"><i>Edit Informasi Tutupan Lahan</i></a>
</p>
</th>
</tr>
......@@ -1285,8 +1285,6 @@
}
$(document).on("click", "#btn_edit_tuplah", function() {
var map_edit_tuplah = L.map('map-edit-tuplah', {
editable: true,
zoomControl: false,
......@@ -1298,6 +1296,20 @@
minZoom: 4,
}).addTo(map_edit_tuplah);
var polygon_edit_tuplah = L.polygon([
[-4.1283969, 104.1674575],
[-4.128396, 104.1674947],
[-4.1284664, 104.1674964],
[-4.1284674, 104.1674593],
[-4.1283969, 104.1674575]
]).addTo(map_edit_tuplah)
$(document).on("click", "#btn_edit_tuplah", function() {
if (map_edit_tuplah.hasLayer(polygon_edit_tuplah)) {
polygon_edit_tuplah.remove()
}
if (group == "Dinas Pekerjaan Umum dan Penataan Ruang") {
var id_poly = $('#idtuplah').val();
......@@ -1316,18 +1328,24 @@
map_edit_tuplah.invalidateSize();
}, 1000);
map_edit_tuplah.setView([data['tuplah']['geometry']['coordinates'][0][0][1], data['tuplah']['geometry']['coordinates'][0][0][0]], 19);
let lop_poly_edit = data['tuplah']['geometry']['coordinates'][0];
let list_poly_edit = [];
var latt = 0;
var longg = 0;
for (var i = 0; i < lop_poly_edit.length; i++) {
geoj = lop_poly_edit[i][0];
polygigi = [lop_poly_edit[i][1], lop_poly_edit[i][0]]
list_poly_edit.push(polygigi);
latt += lop_poly_edit[i][0]
longg += lop_poly_edit[i][1]
};
var lattt = latt / list_poly_edit.length
var longgg = longg / list_poly_edit.length
map_edit_tuplah.setView([longgg, lattt], 14);
var polygon_edit_tuplah = L.polygon(list_poly_edit).addTo(map_edit_tuplah)
polygon_edit_tuplah = L.polygon(list_poly_edit).addTo(map_edit_tuplah)
polygon_edit_tuplah.enableEdit();
$('#btnsavetuplah').click(function() {
var hasil = (JSON.stringify(polygon_edit_tuplah.toGeoJSON()))
......@@ -1346,7 +1364,7 @@
},
})
} else {
$("#modal-edit-tuplah").css('display', 'none');
swal({
title: "Sorry",
text: group + " Tidak memiliki akses",
......@@ -1354,6 +1372,7 @@
icon: "error",
confirmButtonColor: "#00BCD4"
})
$("#modal-edit-tuplah").css('display', 'none');
}
......@@ -1629,8 +1648,6 @@
}
});
$(document).on("click", "#btn_edit_bangunan", function() {
var map_edit = new L.map('map-edit', {
editable: true,
zoomControl: false,
......@@ -1641,6 +1658,20 @@
maxZoom: 22,
minZoom: 4,
}).addTo(map_edit);
var polylyly = L.polygon([
[-4.1283969, 104.1674575],
[-4.128396, 104.1674947],
[-4.1284664, 104.1674964],
[-4.1284674, 104.1674593],
[-4.1283969, 104.1674575]
]).addTo(map_edit)
$(document).on("click", "#btn_edit_bangunan", function() {
if (map_edit.hasLayer(polylyly)) {
polylyly.remove()
}
var id_poly = $('#idbangunan').val();
loaderPage(true);
......@@ -1669,10 +1700,10 @@
list_poly_edit.push(polygigi);
};
var polyly = L.polygon(list_poly_edit).addTo(map_edit)
polyly.enableEdit();
polylyly = L.polygon(list_poly_edit).addTo(map_edit)
polylyly.enableEdit();
$('#btnsavebangunan').click(function() {
var hasil = (JSON.stringify(polyly.toGeoJSON()))
var hasil = (JSON.stringify(polylyly.toGeoJSON()))
$("#coordinatebangunan").val(hasil);
})
}
......@@ -2081,8 +2112,6 @@
}
}
$(document).on("click", "#btn_jalan", function() {
var map_edit_jalan = L.map('map-jalan', {
editable: true,
zoomControl: false,
......@@ -2093,7 +2122,21 @@
maxZoom: 22,
minZoom: 4,
}).addTo(map_edit_jalan);
var polygon_edit_jalan = new L.Polyline([
[-4.11941282399997, 104.170558774],
[-4.11965812399992, 104.170414073]
], {
color: 'blue',
weight: 3,
opacity: 0.5,
smoothFactor: 1
});
$(document).on("click", "#btn_jalan", function() {
if (map_edit_jalan.hasLayer(polygon_edit_jalan)) {
polygon_edit_jalan.remove()
}
var id_poly = $('#idjalan').val();
$.ajax({
......@@ -2128,7 +2171,7 @@
};
var polygon_edit_jalan = new L.Polyline(list_poly_edit, {
polygon_edit_jalan = new L.Polyline(list_poly_edit, {
color: 'blue',
weight: 3,
opacity: 0.5,
......@@ -2534,7 +2577,6 @@
weight: 10
}
},
// disable toolbar item by setting it to false
polyline: true,
},
edit: {
......@@ -2556,8 +2598,6 @@
var koordina = ""
if (type === 'polyline') {
// Calculating the distance of the polyline
var tempLatLng = null;
var totalDistance = 0.00000;
$.each(e.layer._latlngs, function(i, latlng) {
......@@ -2574,9 +2614,6 @@
$("#panjangjalanperbaikan").val((totalDistance).toFixed(2) + ' meter');
}
$("#poly_create_input").val(JSON.stringify(koordina));
editableLayers.addLayer(layer);
});
......@@ -2772,7 +2809,6 @@
data = new FormData()
data.append("proposal", $("input[id^='proposal']")[0].files[0]);
data.append("bukti_selesai", $("input[id^='buktiselesai']")[0].files[0]);
console.log(data)
for (var i = 0; i < data_umum.length; i++) {
var keyss = Object.keys(data_umum[i]);
data.append(keyss[0], data_umum[i][keyss[0]])
......
templates/includes/modal.html
View file @ 74ad4e71
......@@ -116,31 +116,43 @@
</div>
<!-- modal jalan -->
<div id="modal-jalan" class="modal fade">
<div class="modal-dialog" style="width: max-content;height: max-content;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-info" style="background-color: #40777c;">
<div class="modal-header bg-info" style="background-color:#40777c;">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h6 class="modal-title">Maps Jalan</h6>
<h6 class="modal-title">Edit Line Jalan dan Informasinya</h6>
</div>
<input type="text" name="idjalan" id="idjalan" class="form-control hidden" value="` + feature.properties.f1 + `">
<input type="text" name="coordinatejalan" id="coordinatejalan" class="form-control hidden" value="">
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<div class="tab-pane has-padding" id="panel-tab2">
<div class="tab-pane" id="bottom-justified-data">
<div class="tabbable">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href="#left-tab1-feas-upl" data-toggle="tab">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#right-tab2-feas-upl" data-toggle="tab">Informasi Umum</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="left-tab1-feas-upl">
<div id="map-jalan" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
<div id="map-jalan" style="width:400px;height: 350px;">
<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="imgbangunan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
<br>
<table>
<tr>
<th>
Image
</th>
<td>
<input type="file" id="imgjalan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</td>
</tr>
</div>
</div>
<div class="tab-pane" id="right-tab2-feas-upl">
<div class="row" style="height: 337px;">
<input type="text" class="hidden" name="coordinatebangunan" id="coordinatebangunan" value="">
<input type="text" name="idbangunan" id="idbangunan" class="form-control hidden" value="" disable>
<table style="margin-left: 50px;
width: 100vh;">
<tr>
<th>
Nama Jalan
......@@ -175,16 +187,25 @@
</tr>
</table>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
<button type="button" id="btnsavejalan" class="btn btn-info">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-link" onclick="destroyfade()" data-dismiss="modal">Close</button>
<button type="button" id="btnsavebangunan" class="btn btn-info">Save changes</button>
</div>
</div>
</div>
</div>
</div>
<div id="modal_theme_info" class="modal fade">
<div class="modal-dialog">
<div class="modal-content" style="width: 400px;margin-left: 100px;">
......@@ -216,36 +237,41 @@
<!-- modal bangunan -->
<div id="modal_bangunan_edit" class="modal fade">
<div class="modal-dialog" style="width: max-content;height: max-content;">
<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">Edit Polygon Bangunan dan Informasinya</h6>
</div>
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<div class="row">
<div class="col-md-5">
<div id="map-edit" style="width:400px;height: 350px;">
<div class="tab-pane has-padding" id="panel-tab2">
<div class="tab-pane" id="bottom-justified-data">
<div class="tabbable">
<ul class="nav nav-tabs nav-tabs-bottom nav-justified">
<li onclick="changetabs(this)" class="active"><a href="#left-tab1-feas-upl" data-toggle="tab">Koordinat</a></li>
<li onclick="changetabs(this)"><a href="#right-tab2-feas-upl" data-toggle="tab">Informasi Umum</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="left-tab1-feas-upl">
<div id="map-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></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="imgbangunan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
</div>
</div>
<div class="col-md-4">
</div>
<div class="tab-pane" id="right-tab2-feas-upl">
<div class="row" style="height: 337px;"></div>
<div class="col-md-6">
<input type="text" class="hidden" name="coordinatebangunan" id="coordinatebangunan" value="">
<table>
<tr>
<th>
Image
</th>
<td>
<input type="file" id="imgbangunan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
<input style="display:none;" id="gambar" type="text" class="form-control" value=""required>
</td>
</tr>
<tr>
<th>Id</th>
<td>
<input type="text" name="idbangunan" id="idbangunan" class="form-control hidden" value="" disable>
</td>
</tr>
<table>
<tr>
<th>Nama Bangunan</th>
<td>
......@@ -286,7 +312,7 @@
</table>
</div>
<div class="col-md-3 ">
<div class="col-md-6">
<table>
<tr>
......@@ -316,15 +342,22 @@
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer ">
<button type="button " class="btn btn-link " data-dismiss="modal ">Close</button>
<button type="button " id="btnsavebangunan" class="btn btn-info ">Save changes</button>
</div>
<button type="button" class="btn btn-link" onclick="destroyfade()" data-dismiss="modal">Close</button>
<button type="button" id="btnsavebangunan" class="btn btn-info">Save changes</button>
</div>
</div>
</div>
</div>
<div id="modal_bangunan_delete" class="modal fade">
<div class="modal-dialog" style="width: max-content;height: max-content;">
......@@ -332,7 +365,9 @@
<div class="modal-header bg-info" style="background-color:#40777c;">
<table>
<tr>
<th><h6 class="modal-title">Delete Bangunan dan Informasinya</h6></th>
<th>
<h6 class="modal-title">Delete Bangunan dan Informasinya</h6>
</th>
<td><button type="button" class="close" data-dismiss="modal">&times;</button></td>
</tr>
</table>
......@@ -372,7 +407,8 @@
<input type="text" name="coordinatetuplah" id="coordinatetuplah" class="form-control hidden" value="">
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<div id="map-edit-tuplah" style="width:400px;height: 350px;">
<div id="map-edit-tuplah" style="width: 400px;height: 300px;position: relative;margin-left: 100px;margin-left: 100px;
margin-right: 100px;">
</div>
<br>
<table>
......@@ -403,3 +439,142 @@
<div class="modal fade" id="modal_adm">
</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 Bangunan</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;">Tipe 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="administrasi">Kantor Administrasi</option>
<option value="layanankesehatan">Layanan Kesehatan</option>
<option value="puskesmas">Puskesmas</option>
<option value="rumahsakit">Rumah Sakit</option>
<option value="saranaibadah">Sarana Ibadah</option>
<option value="saranapendidikan">Sarana Pendidikan</option>
<option value="spbu">SPBU</option>
<option value="stasiun">Stasiun</option>
<option value="terminalbus">Terminal Bus</option>
<option value="cagarbudaya">Cagar Budaya dan Tempat Wisata</option>
<option value="gardulistrik">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;">Informasi Bangunan</label>
<div class="col-lg-9">
<input id="info_create_point" 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" 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 Bangunan</label>
<div class="col-lg-6">
<input id="luas_bangunan_point" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3">
<select id="satuan_luas_bangunan" 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;">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;">Tinggi Bangunan</label>
<div class="col-lg-6">
<input id="tinggi_bangunan_point" type="text" class="form-control" value="" required>
</div>
<div class="col-lg-3" style="margin-top: 15px;">m</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;">Jumlah Lantai</label>
<div class="col-lg-9">
<input id="lantai_point" 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" style="margin-top: 15px;">Pemilik</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>
</div>
\ No newline at end of file
templates/includes/navbar.html
View file @ 74ad4e71
......@@ -4,8 +4,13 @@
<div class="navbar-header">
<a class="navbar-brand gradient-text " href="{% url 'apps:dashboard' %}">
<!-- <h3>NationalAddress</h3> -->
<i class="icon-location4 fa-gradient"></i>
<b>&nbsp;&nbsp;OKU-GIS</b>
<i>
<img src="{% static 'img/logo-ok.png' %}" alt="" style="position: absolute;
width: 26px;
top: 7px;">
</i>
<!-- <i class="icon-location4 fa-gradient"></i> -->
<b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;OKU-GIS</b>
</a>
<ul class="nav navbar-nav pull-right visible-xs-block">
......
templates/includes/o.html
View file @ 74ad4e71
......@@ -230,7 +230,7 @@
</div>
</div>
<div class="footer" id="thisFooter" style="bottom: 0px; left: 0px;">
<div class="footer" id="thisFooter" style="bottom: 10px; left: 0px;">
<input type="hidden" id="infoLongitude">
<input type="hidden" id="infoLatitude">
<input type="hidden" id="infoLimitx">
......
templates/includes/plugin.html
View file @ 74ad4e71
{% load static %}
<ul class="dock" style="right: 0;position: absolute;">
<li class="fixed-plugin" style="top: 100px;">
<div class="dropdown show-dropdown">
<div class="dropdown show-dropdown" style="top: 1px;">
<a href="#" data-toggle="dropdown">
<i class="fa fa-map-o fa-2x" style="color: white;
padding: 10px;
border-radius: 0 0 6px 6px;
margin: 10px 10px;
width: auto;"> </i>
</a>
<ul class="dropdown-menu" x-placement="bottom-start">
......@@ -62,10 +61,9 @@
<a href="#" data-toggle="dropdown">
<i class="fa fa-cog fa-2x" style="font-size: 36px;
color: white;
margin: 4px;
margin-left: 10px;"> </i>
margin: 6px 9px;"> </i>
</a>
<ul class="dropdown-menu">
<ul class="dropdown-menu" style="top: -5px;">
<li class="header-title text-center">Sidebar Filters</li>
<!-- <div id="sidebar" onmouseleave="overll()">
<div class="sidebar-wrapper">
......
templates/layout/layout.html
View file @ 74ad4e71
......@@ -353,7 +353,7 @@
margin-right: 3px;
position: absolute;
top: calc(100% - 196px);
right: calc(50% - 0px);
right: calc(95% / 2);
z-index: 99999999;
border-radius: 8px 8px 0 0;
border: 0;
......@@ -373,7 +373,7 @@
margin-right: 3px;
position: absolute;
top: calc(100% - 23px);
right: calc(50% - 0px);
right: calc(95%/2);
z-index: 99999999;
border-radius: 8px 8px 0 0;
border: 0;
......@@ -391,14 +391,29 @@
left: 408px !important;
transform: translate(0, 0);
}
/*.fixed-plugin {*/
/* position: absolute;*/
/* z-index: 1000;*/
/* right: 0px;*/
/* background-color: #40777c;*/
/* border-top-left-radius: 10px;*/
/* border-bottom-left-radius: 10px;*/
/* margin-top: 5px;*/
/* width: 48px;*/
/* height: 48px;*/
/* box-shadow: 0 0 20px rgb(0 0 0 / 30%);*/
/* transition: 0.3s ease-out;*/
/* display: inline-block;*/
/*}*/
.fixed-plugin {
position: absolute;
z-index: 1000;
right: 0px;
right: 10px;
background-color: #40777c;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
border-radius: 10px;
margin-top: 5px;
width: 48px;
height: 48px;
......@@ -414,27 +429,29 @@
width: 550px;
margin-left: -560px !important;
margin-top: -40px !important;
top: 10px;
box-shadow: 0 0 20px rgb(0 0 0 / 30%);
border-radius: 8px 8px 8px 8px;
}
li.fixed-plugin:hover {
/*transform: scale(1.3);*/
right: 0;
transform: scale(1.3);
right: 10px;
/*margin-right: 7px;*/
position: relative;
/*position: relative;*/
}
li.fixed-plugin .dropdown-menu {
transform: scale(0.769230);
float: right;
position: absolute;
right: -550px;
width: 550px;
margin-left: -490px !important;
margin-top: -40px !important;
top: 10px;
margin-right: -550px;
}
/*li.fixed-plugin:hover .dropdown-menu {*/
/* transform: scale(0.769230);*/
/* float: right;*/
/* position: absolute;*/
/* right: -550px;*/
/* width: 550px;*/
/* margin-left: -490px !important;*/
/* margin-top: -40px !important;*/
/* top: 0;*/
/* margin-right: -550px;*/
/*}*/
li.fixed-plugin .fa:hover {
transform: rotate(180deg);
......@@ -454,6 +471,23 @@
display: block;
}
#map-create-admin>div.leaflet-control-container {
display: block;
}
#map-create-admin>a.leaflet-draw-draw-polyline {
display: none!important;
}
#map-create-admin>div.leaflet-control-container>div.leaflet-top.leaflet-left>div:nth-child(1)>div>div>a.leaflet-draw-draw-polyline,
#map-create-admin>div.leaflet-control-container>div.leaflet-top.leaflet-left>div:nth-child(2) {
display: none;
}
#map-create-admin>div.leaflet-control-container>div.leaflet-top.leaflet-right {
display: none!important;
}
#map-insert>div.leaflet-control-container>div.leaflet-top.leaflet-left>div:nth-child(2) {
display: none;
}
......@@ -461,7 +495,6 @@
.leaflet-draw-draw-polygon,
.leaflet-draw-draw-rectangle,
.leaflet-draw-draw-circle,
.leaflet-draw-draw-marker,
.leaflet-draw-draw-circlemarker {
display: none!important;
}
......@@ -478,6 +511,10 @@
.leaflet-container ul li a {
color: #333333;
}
.modal-dialog {
margin-top: 48px;
}
</style>
{% include 'includes/css-o.html' %} {% include 'includes/css-m.html' %}
......@@ -551,17 +588,77 @@
<div class="panel panel-default" id="features">
<div class="sidebar-table" id="isi_panel">
<!-- <input type="submit" value="submit"> -->
<!-- <a href="" id="btn_edit_kelurahan" style="position: absolute;
top: 240px;
right: 5px;">Edit</a> -->
<table class="table table-hover tasks-list">
<!-- panel samping js disini -->
<div class="sidebar-table" id="isi_panel" style="margin-top: 48px;">
<table class="table tasks-list">
<thead style="text-align: center;">
<tr>
<th class="text-center" style="padding: 0 0 0 0px;">
<img src="{% static 'img/logo-ok.png' %}" alt="" style="max-height: 368px">
</th>
</tr>
</thead>
<tbody>
<div class="container">
<tr style="height: 100px;">
<th class="text-center">
<div>
<h1 style="font-family: Google Sans,Roboto,Arial,sans-serif;
letter-spacing: 0;
font-weight: 400;">
<span style="font-size: x-large;">
OGAN KOMERING ULU
</span>
</h1>
</div>
</th>
</tr>
</div>
<div class="container">
<tr>
<th>
<div class="form-group" style="margin-left: 80px;">
<table>
<tr>
<th>Luas Wilayah</th>
<td>: {{ global.1 }} km2</td>
</tr>
<tr>
<th>Jumlah Kecamatan</th>
<td>: {{ global.5 }} Kecamatan</td>
</tr>
<tr>
<th>Jumlah Kelurahan</th>
<td>: {{ global.6 }} Kelurahan</td>
</tr>
<tr>
<th>Jumlah Penduduk</th>
<td>: {{ global.19 }} Jiwa</td>
</tr>
<tr>
<th>Jumlah KK</th>
<td>: {{ global.20 }} KK</td>
</tr>
<tr>
<th>Jumlah Laki-laki</th>
<td>: {{ global.21 }} Jiwa</td>
</tr>
<tr>
<th>Jumlah Perempuan</th>
<td>: {{ global.22 }} Jiwa</td>
</tr>
</table>
</div>
</th>
</tr>
</div>
</tbody>
</table>
</div>
</div>
</div>
......
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