Skip to content

O
OKU-GIS
Commit 592304dd authored by Muhamad's avatar Muhamad
Browse files
Options

tampilan mobile stlh login smentara

parent d288374b
Hide whitespace changes
Inline Side-by-side
Showing with 678 additions and 456 deletions
myauth/views.py
View file @ 592304dd
...@@ -234,6 +234,7 @@ def addUser(request): ...@@ -234,6 +234,7 @@ def addUser(request):
password = request.POST.get('username') password = request.POST.get('username')
iduser = request.POST.get('id') iduser = request.POST.get('id')
isStaff = request.POST.get('isStaff') isStaff = request.POST.get('isStaff')
phone = request.POST.get('phone')
# arrGroup = group.split("~") # arrGroup = group.split("~")
...@@ -245,10 +246,11 @@ def addUser(request): ...@@ -245,10 +246,11 @@ def addUser(request):
try: try:
if iduser: if iduser:
with conn.cursor() as cursor: with conn.cursor() as cursor:
cursor.execute("UPDATE auth_user SET first_name = '"+first_name+"', last_name = '"+last_name+"', email = '"+email+"' WHERE id="+iduser) cursor.execute("UPDATE auth_user SET first_name = '"+first_name+"', last_name = '"+last_name+"', email = '"+email+"', phone = '"+phone+"' WHERE id="+iduser)
with conn.cursor() as curGroup: if group != 'none':
curGroup.execute("DELETE FROM auth_user_groups WHERE user_id="+iduser) with conn.cursor() as curGroup:
curGroup.execute("DELETE FROM auth_user_groups WHERE user_id="+iduser)
users = User.objects.get(username=usernames) users = User.objects.get(username=usernames)
...@@ -282,13 +284,19 @@ def addUser(request): ...@@ -282,13 +284,19 @@ def addUser(request):
user.password = make_password(password) user.password = make_password(password)
user.save() user.save()
# add user to group # add user to group
userinsert = User.objects.get(username=usernames) userinsert = User.objects.get(username=usernames)
insertgroups = Group.objects.get(name=group) insertgroups = Group.objects.get(name=group)
insertgroups.user_set.add(userinsert) insertgroups.user_set.add(userinsert)
# add phone
with conn.cursor() as cursor:
cursor.execute("UPDATE auth_user SET phone = '%s' WHERE username = '%s' and first_name = '%s' and last_name = '%s'"%(phone, usernames, first_name, last_name))
print(user)
data = { data = {
"code" : 0, "code" : 0,
...@@ -424,7 +432,8 @@ def loadUserbyId(request): ...@@ -424,7 +432,8 @@ def loadUserbyId(request):
"last" : rows[2], "last" : rows[2],
"group" : group_res, "group" : group_res,
"is_staff" : rows[9], "is_staff" : rows[9],
"filepath" : rows[11] "filepath" : rows[11],
"phone" : rows[12]
} }
user_res.append(datas) user_res.append(datas)
......
static/css/layout-style.css
View file @ 592304dd
...@@ -832,6 +832,19 @@ input#change_stat { ...@@ -832,6 +832,19 @@ input#change_stat {
margin: 10px; margin: 10px;
} }
.navbar .navbar-inverse {
display: none
}
.page-content {
display: table;
}
body>ul>li.fixed-plugin.no3d.overlay-cek>div.dropdown.show-dropdown.open>ul {
width: 300px;
margin-left: -270px!important;
}
@media (max-width: 1025px) { @media (max-width: 1025px) {
.dock { .dock {
position: absolute; position: absolute;
...@@ -859,4 +872,135 @@ input#change_stat { ...@@ -859,4 +872,135 @@ input#change_stat {
#map>div.col-md-6.col-md-offset-3.input-group.content-group.foot>div>div.col-md-2>button { #map>div.col-md-6.col-md-offset-3.input-group.content-group.foot>div>div.col-md-2>button {
right: 0px!important; right: 0px!important;
} }
}
@media (max-width: 720px) {
/* html {
transform: rotate(-90deg);
transform-origin: left top;
width: 100vh;
height: 100vw;
overflow-x: hidden;
position: absolute;
top: 100%;
left: 0;
} */
.dock {
position: absolute;
top: -4px;
left: 95%;
}
#map>div.leaflet-control-container>div.leaflet-bottom.leaflet-right {
right: 5px;
}
#map .head {
top: 1%!important;
}
.dock {
left: 93%;
}
.navbar .navbar-inverse {
display: block
}
#map>div.row>div.col-sm-4.input-group.content-group.head {
width: 80%;
margin-top: -15px;
margin-left: 60px;
}
.user-p-nav {
display: none
}
li.fixed-plugin .dropdown-menu {
transform: scale(0.769230);
float: right;
position: absolute;
right: -550px;
width: 190px;
margin-left: -175px !important;
margin-top: -137px !important;
top: 20px;
margin-right: -550px;
}
li.overlay-cek .dropdown-menu {
transform: scale(0.769230);
float: right;
position: absolute;
right: -550px;
width: 190px;
margin-left: -175px !important;
margin-top: -127px !important;
top: 13px;
margin-right: -550px;
}
.menu-heading {
color: black;
}
.menu-list>a>img {
min-width: 120px!important;
min-height: 20px!important;
max-height: 90px!important;
}
#bottom-tab2>div>div:nth-child(2) {
display: none;
}
#panel-sm {
width: 100%!important;
top: 0px;
}
#panel-sm>div {
margin-left: 0px
}
body>div.page-container>div>div.sidebar.sidebar-main {
/* transform: rotate( 270deg);
height: 100%;
float: right;
margin-left: 282px;
top: -290px; */
display: block;
}
#bottom-tab1>div {
margin-left: 10px;
}
#bottom-tab1>div>div.col-sm-2 {
display: none;
}
#bottom-tab2>div>div:nth-child(4) {
margin-left: 18px;
}
#bottom-tab2>div>div {
margin-left: 10px;
}
#panel-sm>div>div.bod>div>ul {
background: #1B1F2D;
}
#panel-sm>div>div.bod>div>ul>li.active>a {
background: #353847;
}
#panel-sm>div>div.bod>div>ul {
border-top: none;
border-left: none;
}
#panel-sm>div>div.bod>div>div {
margin-left: 10px;
}
body>ul>li.fixed-plugin.no3d.overlay-cek>div.dropdown.show-dropdown.open>ul {
width: 270px!important;
margin-left: -245px!important;
}
body>div.page-container>div>div.sidebar.sidebar-main>div.sidebar-category.sidebar-category-visible>div>ul:nth-child(1) {
margin-bottom: 47vh!important;
}
body>div.page-container>div>div.sidebar.sidebar-main>div.sidebar-category.sidebar-category-visible>div>ul:nth-child(2)>li:nth-child(1)>a {
display: none
}
.modal-dialog {
margin-top: 0px;
top: 7%!important;
}
.modal-content {
margin-left: 20px!important;
}
#modal_detail_non_kelurahan>div>div>div.modal-body>fieldset>div>div:nth-child(2)>div>div {
margin-left: 5px
}
} }
\ No newline at end of file
static/js/action.js
View file @ 592304dd
...@@ -274,6 +274,17 @@ function load_manage() { ...@@ -274,6 +274,17 @@ function load_manage() {
targets: [0], targets: [0],
}, ], }, ],
dom: '<"float-left "B>frtip', dom: '<"float-left "B>frtip',
buttons: [{
text: 'Add new button',
action: function(e, dt, node, config) {
dt.button().add(1, {
text: 'Button ' + (counter++),
action: function() {
this.remove();
}
});
}
}],
language: { language: {
search: ' _INPUT_', search: ' _INPUT_',
searchPlaceholder: 'Data User...', searchPlaceholder: 'Data User...',
...@@ -285,6 +296,7 @@ function load_manage() { ...@@ -285,6 +296,7 @@ function load_manage() {
'previous': '&larr;' 'previous': '&larr;'
} }
}, },
drawCallback: function() { drawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup'); $(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
}, },
...@@ -647,6 +659,7 @@ function loaduserbyid(id) { ...@@ -647,6 +659,7 @@ function loaduserbyid(id) {
$("#inNameF").val(user.firstname); $("#inNameF").val(user.firstname);
$("#inNameL").val(user.lastname); $("#inNameL").val(user.lastname);
$("#inEmail").val(user.email); $("#inEmail").val(user.email);
$("#phone").val(user.phone)
if (user.is_staff) { if (user.is_staff) {
$('input[name=isStaff][value=true]').attr('checked', true) $('input[name=isStaff][value=true]').attr('checked', true)
} else { } else {
...@@ -750,16 +763,6 @@ function modal_detail_point_pengaturan(id, db) { ...@@ -750,16 +763,6 @@ function modal_detail_point_pengaturan(id, db) {
$("#saveuser").on("click", function() { $("#saveuser").on("click", function() {
addUser()
})
// function destroyfade() {
// $(".modal-backdrop").css("display", "none")
// $(".modal-backdrop").removeClass('show');
// $("body").css('padding-right', '0px !important')
// }
function addUser() {
var isObject = {}; var isObject = {};
var ars = '' var ars = ''
var group = $("#select_group").val(); var group = $("#select_group").val();
...@@ -769,18 +772,11 @@ function addUser() { ...@@ -769,18 +772,11 @@ function addUser() {
isObject.id = iduser; isObject.id = iduser;
} }
// for(i in group){
// if(i < group.length-1){
// ars += group[i]+"~";
// }else{
// ars += group[i];
// }
// }
// return false
isObject['username'] = $("#inUsername").val(); isObject['username'] = $("#inUsername").val();
isObject['first_name'] = $("#inNameF").val(); isObject['first_name'] = $("#inNameF").val();
isObject['last_name'] = $("#inNameL").val(); isObject['last_name'] = $("#inNameL").val();
isObject['email'] = $("#inEmail").val(); isObject['email'] = $("#inEmail").val();
isObject['phone'] = $("#phone").val();
isObject.group = group isObject.group = group
isObject.isStaff = $('input[name="isStaff"]:checked').val(); isObject.isStaff = $('input[name="isStaff"]:checked').val();
...@@ -794,8 +790,6 @@ function addUser() { ...@@ -794,8 +790,6 @@ function addUser() {
if (response.code == 0) { if (response.code == 0) {
$("#modal_edit_user").css('display', 'none'); $("#modal_edit_user").css('display', 'none');
// destroyfade();
swal({ swal({
title: response.info, title: response.info,
text: response.data + "reload untuk mendapatkan update", text: response.data + "reload untuk mendapatkan update",
...@@ -815,7 +809,21 @@ function addUser() { ...@@ -815,7 +809,21 @@ function addUser() {
} }
} }
}); });
} })
$("#add_user").click(function() {
$("#modal_edit_user").modal("show")
$(".modstit").html("Tambah User")
$("#inUsername").attr("disabled", false)
$("#group_use").css("display", "none")
$("#inUsername").val("")
$("#inNameF").val("")
$("#inNameL").val("")
$("#inEmail").val("")
$("#phone").val("")
$("#iduser").val("")
})
$("#saveedit_p").click(function() { $("#saveedit_p").click(function() {
var idka = $('#id_adm_edit').val(); var idka = $('#id_adm_edit').val();
......
templates/includes/js-o.html
View file @ 592304dd
...@@ -84,448 +84,460 @@ ...@@ -84,448 +84,460 @@
onEachFeature: function(feature, layer) { onEachFeature: function(feature, layer) {
layer.on({ layer.on({
click: function(e) { click: function(e) {
$('#modal_detail_kelurahan').modal('show'); var x = window.matchMedia("(max-width: 700px)")
if (x.matches) { // If media query matches
if (feature.administrasi.f9 == 'NONE') { swal({
var path_img = "static/img/image_null.png" title: "Sorry",
text: "Untuk di mobile tampilan detail kelurahan tidak mendukung, Silahkan akses menggunakan laptop atau PC",
type: "warning",
icon: "error",
confirmButtonColor: "#00BCD4"
})
setTimeout(function() {
}, 500);
} else { } else {
var path_img = `"static/image/kelurahan/` + feature.administrasi.f9 + `"` $('#modal_detail_kelurahan').modal('show');
}
if (feature.administrasi.f9 == 'NONE') {
var path_img = "static/img/image_null.png"
} else {
var path_img = `"static/image/kelurahan/` + feature.administrasi.f9 + `"`
}
$(".gambar_kelurahan").html(`<img src="` + path_img + `" alt="" style="width:360px;height:290px;border-top-left-radius: 10px;">`) $(".gambar_kelurahan").html(`<img src="` + path_img + `" alt="" style="width:360px;height:290px;border-top-left-radius: 10px;">`)
$(".nama_kelurahan").html(feature.administrasi.f2 + ` , ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4) $(".nama_kelurahan").html(feature.administrasi.f2 + ` , ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4)
$(".kode_kelurahan").html(feature.administrasi.f1) $(".kode_kelurahan").html(feature.administrasi.f1)
$(".jumlah_penduduk_kelurahan").html(feature.administrasi.f6) $(".jumlah_penduduk_kelurahan").html(feature.administrasi.f6)
$(".luas_wilayah_kelurahan").html(feature.administrasi.f10) $(".luas_wilayah_kelurahan").html(feature.administrasi.f10)
$(".jumlah_kk_kelurahan").html(feature.administrasi.f7) $(".jumlah_kk_kelurahan").html(feature.administrasi.f7)
$(".tombol-edit").html(`<a href="/editkelurahan?kode_dagri=` + encodeURIComponent(feature.administrasi.f1) + `" class='btn'>Edit</a>`) $(".tombol-edit").html(`<a href="/editkelurahan?kode_dagri=` + encodeURIComponent(feature.administrasi.f1) + `" class='btn'>Edit</a>`)
var nama_data_penduduk = ['pria', 'wanita', 'belum_kawin', 'kawin', 'cerai_hidup', 'cerai_mati', 'wajib_ktp']; var nama_data_penduduk = ['pria', 'wanita', 'belum_kawin', 'kawin', 'cerai_hidup', 'cerai_mati', 'wajib_ktp'];
var dataset_penduduk = [feature.penduduk.f1, feature.penduduk.f2, feature.penduduk.f3, feature.penduduk.f4, feature.penduduk.f5, feature.penduduk.f6, feature.penduduk.f7]; var dataset_penduduk = [feature.penduduk.f1, feature.penduduk.f2, feature.penduduk.f3, feature.penduduk.f4, feature.penduduk.f5, feature.penduduk.f6, feature.penduduk.f7];
var nama_data_agama = ['islam', 'kristen', 'khatolik', 'hindu', 'budha', 'konghucu', 'kepercayaan_lain', ] var nama_data_agama = ['islam', 'kristen', 'khatolik', 'hindu', 'budha', 'konghucu', 'kepercayaan_lain', ]
var dataset_agama = [feature.penduduk.f8, feature.penduduk.f9, feature.penduduk.f10, feature.penduduk.f11, feature.penduduk.f12, feature.penduduk.f13, feature.penduduk.f14] var dataset_agama = [feature.penduduk.f8, feature.penduduk.f9, feature.penduduk.f10, feature.penduduk.f11, feature.penduduk.f12, feature.penduduk.f13, feature.penduduk.f14]
var nama_data_pendidik = ['tidak_sekolah', 'belum_tamat', 'tamat_sd', 'sltp', 'slta', 'diploma_i', 'diploma_ii', 'diploma_iv', 'strata_ii', 'strata_iii']; var nama_data_pendidik = ['tidak_sekolah', 'belum_tamat', 'tamat_sd', 'sltp', 'slta', 'diploma_i', 'diploma_ii', 'diploma_iv', 'strata_ii', 'strata_iii'];
var dataset_pendidik = [feature.pekerjaan_pendidikan.f1, feature.pekerjaan_pendidikan.f2, feature.pekerjaan_pendidikan.f3, feature.pekerjaan_pendidikan.f4, feature.pekerjaan_pendidikan.f5, feature.pekerjaan_pendidikan.f6, feature.pekerjaan_pendidikan.f7, feature.pekerjaan_pendidikan.f8, feature.pekerjaan_pendidikan.f9, feature.pekerjaan_pendidikan.f10]; var dataset_pendidik = [feature.pekerjaan_pendidikan.f1, feature.pekerjaan_pendidikan.f2, feature.pekerjaan_pendidikan.f3, feature.pekerjaan_pendidikan.f4, feature.pekerjaan_pendidikan.f5, feature.pekerjaan_pendidikan.f6, feature.pekerjaan_pendidikan.f7, feature.pekerjaan_pendidikan.f8, feature.pekerjaan_pendidikan.f9, feature.pekerjaan_pendidikan.f10];
var nama_data_umur = ['Umur 0-4', 'Umur 5-9', 'Umur 10-14', 'Umur 15-19', 'Umur 20-24', 'Umur 25-29', 'Umur 30-34', 'Umur 35-39', 'Umur 40-44', 'Umur 45-49', 'Umur 50-54', 'Umur 55-59', 'Umur 60-64', 'Umur 65-69', 'Umur 70-74', 'Umur > 75']; var nama_data_umur = ['Umur 0-4', 'Umur 5-9', 'Umur 10-14', 'Umur 15-19', 'Umur 20-24', 'Umur 25-29', 'Umur 30-34', 'Umur 35-39', 'Umur 40-44', 'Umur 45-49', 'Umur 50-54', 'Umur 55-59', 'Umur 60-64', 'Umur 65-69', 'Umur 70-74', 'Umur > 75'];
var dataset_umur = [feature.penduduk.f16, feature.penduduk.f17, feature.penduduk.f18, feature.penduduk.f19, feature.penduduk.f20, feature.penduduk.f21, feature.penduduk.f22, feature.penduduk.f23, feature.penduduk.f24, feature.penduduk.f25, feature.penduduk.f26, feature.penduduk.f27, feature.penduduk.f28, feature.penduduk.f29, feature.penduduk.f30]; var dataset_umur = [feature.penduduk.f16, feature.penduduk.f17, feature.penduduk.f18, feature.penduduk.f19, feature.penduduk.f20, feature.penduduk.f21, feature.penduduk.f22, feature.penduduk.f23, feature.penduduk.f24, feature.penduduk.f25, feature.penduduk.f26, feature.penduduk.f27, feature.penduduk.f28, feature.penduduk.f29, feature.penduduk.f30];
var nama_data_pekerja = ['tidak_bekerja', 'aparatur_pemerintah', 'tenaga_pendidik', 'wiraswasta', 'pertanian', 'tenaga_kesehatan', 'pegawai', 'dokter', 'bidan', 'perawat', 'lainnya']; var nama_data_pekerja = ['tidak_bekerja', 'aparatur_pemerintah', 'tenaga_pendidik', 'wiraswasta', 'pertanian', 'tenaga_kesehatan', 'pegawai', 'dokter', 'bidan', 'perawat', 'lainnya'];
var dataset_pekerja = [feature.pekerjaan_pendidikan.f11, feature.pekerjaan_pendidikan.f12, feature.pekerjaan_pendidikan.f13, feature.pekerjaan_pendidikan.f14, feature.pekerjaan_pendidikan.f15, feature.pekerjaan_pendidikan.f16, feature.pekerjaan_pendidikan.f18, feature.pekerjaan_pendidikan.f40, feature.pekerjaan_pendidikan.f41, feature.pekerjaan_pendidikan.f42, feature.pekerjaan_pendidikan.f45]; var dataset_pekerja = [feature.pekerjaan_pendidikan.f11, feature.pekerjaan_pendidikan.f12, feature.pekerjaan_pendidikan.f13, feature.pekerjaan_pendidikan.f14, feature.pekerjaan_pendidikan.f15, feature.pekerjaan_pendidikan.f16, feature.pekerjaan_pendidikan.f18, feature.pekerjaan_pendidikan.f40, feature.pekerjaan_pendidikan.f41, feature.pekerjaan_pendidikan.f42, feature.pekerjaan_pendidikan.f45];
var colorPalette = ['#00D8B6', '#008FFB', '#FEB019', '#FF4560', '#775DD0'] var colorPalette = ['#00D8B6', '#008FFB', '#FEB019', '#FF4560', '#775DD0']
var options_penduduk = { var options_penduduk = {
series: [{ series: [{
name: 'Penduduk', name: 'Penduduk',
data: dataset_penduduk data: dataset_penduduk
}], }],
chart: { chart: {
type: 'bar', type: 'bar',
height: 350, height: 350,
toolbar: { toolbar: {
tools: { tools: {
download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>', download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>',
}
} }
}
},
plotOptions: {
bar: {
horizontal: false,
columnWidth: '55%',
endingShape: 'rounded'
}, },
}, plotOptions: {
dataLabels: { bar: {
enabled: false horizontal: false,
}, columnWidth: '55%',
stroke: { endingShape: 'rounded'
show: true, },
width: 2,
colors: ['transparent']
},
xaxis: {
categories: nama_data_penduduk,
},
yaxis: {
title: {
text: 'Jumlah'
}, },
show: true dataLabels: {
}, enabled: false
fill: { },
type: 'gradient', stroke: {
gradient: { show: true,
type: "vertical", width: 2,
shadeIntensity: 1, colors: ['transparent']
opacityFrom: 0.7, },
opacityTo: 0.9, xaxis: {
colorStops: [{ categories: nama_data_penduduk,
offset: 0, },
color: "#6BB8FF", yaxis: {
opacity: 1 title: {
}, { text: 'Jumlah'
offset: 20, },
color: "#6BB8FF", show: true
opacity: 1 },
}, { fill: {
offset: 60, type: 'gradient',
color: "#7282D8", gradient: {
opacity: 1 type: "vertical",
}, { shadeIntensity: 1,
offset: 100, opacityFrom: 0.7,
color: "#7282D8", opacityTo: 0.9,
opacity: 1 colorStops: [{
}] offset: 0,
} color: "#6BB8FF",
}, opacity: 1
tooltip: { }, {
y: { offset: 20,
formatter: function(val) { color: "#6BB8FF",
var reverse = val.toString().split('').reverse().join(''), opacity: 1
ribuan = reverse.match(/\d{1,3}/g); }, {
var ribuan = ribuan.join('.').split('').reverse().join(''); offset: 60,
return ribuan color: "#7282D8",
opacity: 1
}, {
offset: 100,
color: "#7282D8",
opacity: 1
}]
}
},
tooltip: {
y: {
formatter: function(val) {
var reverse = val.toString().split('').reverse().join(''),
ribuan = reverse.match(/\d{1,3}/g);
var ribuan = ribuan.join('.').split('').reverse().join('');
return ribuan
}
} }
} }
} };
};
var options_agama = { var options_agama = {
series: [{ series: [{
name: 'Agama', name: 'Agama',
data: dataset_agama data: dataset_agama
}], }],
chart: { chart: {
type: 'bar', type: 'bar',
height: 350, height: 350,
toolbar: { toolbar: {
tools: { tools: {
download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>', download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>',
}
} }
}
},
plotOptions: {
bar: {
horizontal: false,
columnWidth: '55%',
endingShape: 'rounded'
}, },
}, plotOptions: {
dataLabels: { bar: {
enabled: false horizontal: false,
}, columnWidth: '55%',
stroke: { endingShape: 'rounded'
show: true, },
width: 2,
colors: ['transparent']
},
xaxis: {
categories: nama_data_agama,
},
yaxis: {
title: {
text: 'Jumlah'
}, },
show: true dataLabels: {
}, enabled: false
fill: { },
type: 'gradient', stroke: {
gradient: { show: true,
type: "vertical", width: 2,
shadeIntensity: 1, colors: ['transparent']
opacityFrom: 0.7, },
opacityTo: 0.9, xaxis: {
colorStops: [{ categories: nama_data_agama,
offset: 0, },
color: "#6BB8FF", yaxis: {
opacity: 1 title: {
}, { text: 'Jumlah'
offset: 20, },
color: "#6BB8FF", show: true
opacity: 1 },
}, { fill: {
offset: 60, type: 'gradient',
color: "#7282D8", gradient: {
opacity: 1 type: "vertical",
}, { shadeIntensity: 1,
offset: 100, opacityFrom: 0.7,
color: "#7282D8", opacityTo: 0.9,
opacity: 1 colorStops: [{
}] offset: 0,
} color: "#6BB8FF",
opacity: 1
}, {
offset: 20,
color: "#6BB8FF",
opacity: 1
}, {
offset: 60,
color: "#7282D8",
opacity: 1
}, {
offset: 100,
color: "#7282D8",
opacity: 1
}]
}
}, },
tooltip: { tooltip: {
y: { y: {
formatter: function(val) { formatter: function(val) {
var reverse = val.toString().split('').reverse().join(''), var reverse = val.toString().split('').reverse().join(''),
ribuan = reverse.match(/\d{1,3}/g); ribuan = reverse.match(/\d{1,3}/g);
var ribuan = ribuan.join('.').split('').reverse().join(''); var ribuan = ribuan.join('.').split('').reverse().join('');
return ribuan return ribuan
}
} }
} }
} };
};
var options_pendidik = { var options_pendidik = {
series: [{ series: [{
name: 'Informasi Pendidikan', name: 'Informasi Pendidikan',
data: dataset_pendidik data: dataset_pendidik
}], }],
chart: { chart: {
type: 'bar', type: 'bar',
height: 350, height: 350,
toolbar: { toolbar: {
tools: { tools: {
download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>', download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>',
}
} }
}
},
plotOptions: {
bar: {
horizontal: false,
columnWidth: '55%',
endingShape: 'rounded'
}, },
}, plotOptions: {
dataLabels: { bar: {
enabled: false horizontal: false,
}, columnWidth: '55%',
stroke: { endingShape: 'rounded'
show: true, },
width: 2,
colors: ['transparent']
},
xaxis: {
categories: nama_data_pendidik,
},
yaxis: {
title: {
text: 'Jumlah'
}, },
show: true dataLabels: {
}, enabled: false
fill: { },
type: 'gradient', stroke: {
gradient: { show: true,
type: "vertical", width: 2,
shadeIntensity: 1, colors: ['transparent']
opacityFrom: 0.7, },
opacityTo: 0.9, xaxis: {
colorStops: [{ categories: nama_data_pendidik,
offset: 0, },
color: "#6BB8FF", yaxis: {
opacity: 1 title: {
}, { text: 'Jumlah'
offset: 20, },
color: "#6BB8FF", show: true
opacity: 1 },
}, { fill: {
offset: 60, type: 'gradient',
color: "#7282D8", gradient: {
opacity: 1 type: "vertical",
}, { shadeIntensity: 1,
offset: 100, opacityFrom: 0.7,
color: "#7282D8", opacityTo: 0.9,
opacity: 1 colorStops: [{
}] offset: 0,
} color: "#6BB8FF",
opacity: 1
}, {
offset: 20,
color: "#6BB8FF",
opacity: 1
}, {
offset: 60,
color: "#7282D8",
opacity: 1
}, {
offset: 100,
color: "#7282D8",
opacity: 1
}]
}
}, },
tooltip: { tooltip: {
y: { y: {
formatter: function(val) { formatter: function(val) {
var reverse = val.toString().split('').reverse().join(''), var reverse = val.toString().split('').reverse().join(''),
ribuan = reverse.match(/\d{1,3}/g); ribuan = reverse.match(/\d{1,3}/g);
var ribuan = ribuan.join('.').split('').reverse().join(''); var ribuan = ribuan.join('.').split('').reverse().join('');
return ribuan return ribuan
}
} }
} }
} };
};
var options_umur = { var options_umur = {
series: [{ series: [{
name: 'Umur', name: 'Umur',
data: dataset_umur data: dataset_umur
}], }],
chart: { chart: {
type: 'bar', type: 'bar',
height: 350, height: 350,
toolbar: { toolbar: {
tools: { tools: {
download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>', download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>',
}
} }
}
},
plotOptions: {
bar: {
horizontal: true,
columnWidth: '55%',
endingShape: 'rounded'
}, },
}, plotOptions: {
dataLabels: { bar: {
enabled: false horizontal: true,
}, columnWidth: '55%',
stroke: { endingShape: 'rounded'
show: true, },
width: 2,
colors: ['transparent']
},
xaxis: {
categories: nama_data_umur,
},
yaxis: {
title: {
text: 'Jumlah'
}, },
show: true dataLabels: {
}, enabled: false
fill: { },
type: 'gradient', stroke: {
gradient: { show: true,
type: "horizontal", width: 2,
shadeIntensity: 1, colors: ['transparent']
opacityFrom: 0.7, },
opacityTo: 0.9, xaxis: {
colorStops: [{ categories: nama_data_umur,
offset: 0, },
color: "#6BB8FF", yaxis: {
opacity: 1 title: {
}, { text: 'Jumlah'
offset: 20, },
color: "#6BB8FF", show: true
opacity: 1 },
}, { fill: {
offset: 60, type: 'gradient',
color: "#7282D8", gradient: {
opacity: 1 type: "horizontal",
}, { shadeIntensity: 1,
offset: 100, opacityFrom: 0.7,
color: "#7282D8", opacityTo: 0.9,
opacity: 1 colorStops: [{
}] offset: 0,
} color: "#6BB8FF",
opacity: 1
}, {
offset: 20,
color: "#6BB8FF",
opacity: 1
}, {
offset: 60,
color: "#7282D8",
opacity: 1
}, {
offset: 100,
color: "#7282D8",
opacity: 1
}]
}
}, },
tooltip: { tooltip: {
y: { y: {
formatter: function(val) { formatter: function(val) {
var reverse = val.toString().split('').reverse().join(''), var reverse = val.toString().split('').reverse().join(''),
ribuan = reverse.match(/\d{1,3}/g); ribuan = reverse.match(/\d{1,3}/g);
var ribuan = ribuan.join('.').split('').reverse().join(''); var ribuan = ribuan.join('.').split('').reverse().join('');
return ribuan return ribuan
}
} }
} }
} };
};
var options_pekerja = { var options_pekerja = {
series: [{ series: [{
name: 'Informasi Pekerjaan', name: 'Informasi Pekerjaan',
data: dataset_pekerja data: dataset_pekerja
}], }],
chart: { chart: {
type: 'bar', type: 'bar',
height: 350, height: 350,
toolbar: { toolbar: {
tools: { tools: {
download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>', download: '<div style="margin-left: 25px;"><i class=" icon-download4"></i><span>&nbsp;&nbsp; Download</span></div>',
}
} }
}
},
plotOptions: {
bar: {
borderRadius: 4,
horizontal: true,
}, },
}, plotOptions: {
dataLabels: { bar: {
enabled: false borderRadius: 4,
}, horizontal: true,
xaxis: { },
categories: nama_data_pekerja, },
}, dataLabels: {
fill: { enabled: false
type: 'gradient', },
gradient: { xaxis: {
type: "horizontal", categories: nama_data_pekerja,
shadeIntensity: 1, },
opacityFrom: 0.7, fill: {
opacityTo: 0.9, type: 'gradient',
colorStops: [{ gradient: {
offset: 0, type: "horizontal",
color: "#6BB8FF", shadeIntensity: 1,
opacity: 1 opacityFrom: 0.7,
}, { opacityTo: 0.9,
offset: 20, colorStops: [{
color: "#6BB8FF", offset: 0,
opacity: 1 color: "#6BB8FF",
}, { opacity: 1
offset: 60, }, {
color: "#7282D8", offset: 20,
opacity: 1 color: "#6BB8FF",
}, { opacity: 1
offset: 100, }, {
color: "#7282D8", offset: 60,
opacity: 1 color: "#7282D8",
}] opacity: 1
} }, {
offset: 100,
color: "#7282D8",
opacity: 1
}]
}
}, },
tooltip: { tooltip: {
y: { y: {
formatter: function(val) { formatter: function(val) {
var reverse = val.toString().split('').reverse().join(''), var reverse = val.toString().split('').reverse().join(''),
ribuan = reverse.match(/\d{1,3}/g); ribuan = reverse.match(/\d{1,3}/g);
var ribuan = ribuan.join('.').split('').reverse().join(''); var ribuan = ribuan.join('.').split('').reverse().join('');
return ribuan return ribuan
}
} }
} }
} };
};
var chart_penduduk = new ApexCharts(document.querySelector("#info_penduduk"), options_penduduk);
setTimeout(function() {
chart_penduduk.render();
}, 100);
var chart_pendidik = new ApexCharts(document.querySelector("#info_pendidik"), options_pendidik);
setTimeout(function() {
chart_pendidik.render();
}, 100);
var chart_umur = new ApexCharts(document.querySelector("#info_umur"), options_umur);
setTimeout(function() {
chart_umur.render();
}, 100);
var chart_pekerja = new ApexCharts(document.querySelector("#info_pekerjaan"), options_pekerja);
setTimeout(function() {
chart_pekerja.render();
}, 100);
var chart_agama = new ApexCharts(document.querySelector("#info_agama"), options_agama);
setTimeout(function() {
chart_agama.render();
}, 100);
var chart_penduduk = new ApexCharts(document.querySelector("#info_penduduk"), options_penduduk);
setTimeout(function() {
chart_penduduk.render();
}, 100);
var chart_pendidik = new ApexCharts(document.querySelector("#info_pendidik"), options_pendidik);
setTimeout(function() {
chart_pendidik.render();
}, 100);
var chart_umur = new ApexCharts(document.querySelector("#info_umur"), options_umur);
setTimeout(function() {
chart_umur.render();
}, 100);
var chart_pekerja = new ApexCharts(document.querySelector("#info_pekerjaan"), options_pekerja);
setTimeout(function() {
chart_pekerja.render();
}, 100);
var chart_agama = new ApexCharts(document.querySelector("#info_agama"), options_agama);
setTimeout(function() {
chart_agama.render();
}, 100);
}
}, },
mouseover: function(e) { mouseover: function(e) {
...@@ -3004,10 +3016,6 @@ ...@@ -3004,10 +3016,6 @@
$("body").css("padding-right", "0px !important") $("body").css("padding-right", "0px !important")
}) })
$("#saveuser").on("click", function() {
addUser()
})
function loadjlbyid(id) { function loadjlbyid(id) {
var isObject = {}; var isObject = {};
......
templates/includes/modal.html
View file @ 592304dd
...@@ -1036,8 +1036,13 @@ ...@@ -1036,8 +1036,13 @@
</div> </div>
</a> </a>
</div>
<div style="position: absolute;left: 250px;font-size: 10pt;background: #2196F3;border-radius: 10px;">
<a class="btn side-bar-but" id="add_user" style="z-index:9;color:white;">
<div>
<span>Tambah User</span>
</div>
</a>
</div> </div>
<thead style="font-size: 12px;line-height: 14px;font-family: 'gilroysemibold';text-transform: capitalize;"> <thead style="font-size: 12px;line-height: 14px;font-family: 'gilroysemibold';text-transform: capitalize;">
<tr> <tr>
...@@ -1810,6 +1815,14 @@ ...@@ -1810,6 +1815,14 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top">Phone</label>
<div class="col-lg-9">
<input id="phone" type="number" class="form-control" value="" required>
</div>
</div>
</div>
<div class="row" style="margin-top: 20px;"> <div class="row" style="margin-top: 20px;">
<div class="form-group"> <div class="form-group">
...@@ -1828,12 +1841,12 @@ ...@@ -1828,12 +1841,12 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row" group_use>
<div class="form-group" style="margin-top: 10px !important;"> <div class="form-group" style="margin-top: 10px !important;">
<label class="col-lg-3 control-label lbl-top">Groups</label> <label class="col-lg-3 control-label lbl-top">Groups</label>
<div class="col-lg-9"> <div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs"> <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs">
<option></option> <option value="none"></option>
</select> </select>
</div> </div>
</div> </div>
......
templates/includes/plugin.html
View file @ 592304dd
...@@ -81,9 +81,7 @@ ...@@ -81,9 +81,7 @@
<img src="{% static 'img/icon-1/Vectoroverlay.svg' %}" alt="" style="height: 50px; <img src="{% static 'img/icon-1/Vectoroverlay.svg' %}" alt="" style="height: 50px;
width: 50px;"> width: 50px;">
</a> </a>
<ul class="dropdown-menu" style="top: 12px; <ul class="dropdown-menu">
width: 300px;
margin-left: -270px!important;">
<li class="header-title text-center">Sidebar Filters</li> <li class="header-title text-center">Sidebar Filters</li>
<!-- <div id="sidebar" onmouseleave="overll()"> <!-- <div id="sidebar" onmouseleave="overll()">
<div class="sidebar-wrapper"> <div class="sidebar-wrapper">
......
templates/includes/sidebar.html
View file @ 592304dd
...@@ -9,6 +9,17 @@ ...@@ -9,6 +9,17 @@
border-bottom: 0.5pt solid #313649; border-bottom: 0.5pt solid #313649;
} }
</style> </style>
<!-- <div class="navbar navbar-inverse" style="z-index: 1;
top: 45px;
position: absolute;
background: none;border-color: transparent;">
<div class="navbar-header" style="min-width: 0px;">
<ul class="nav navbar-nav visible-xs-block">
<li><a class="sidebar-mobile-main-toggle" style="border-radius: 5px;"><i class="icon-paragraph-justify3"></i></a></li>
</ul>
</div>
</div> -->
<div class="sidebar sidebar-main"> <div class="sidebar sidebar-main">
<div class="sidebar-content"> <div class="sidebar-content">
<img src="{% static 'img/logo-ok.png' %}" alt="" style="width: 25px;height:32px;"> <img src="{% static 'img/logo-ok.png' %}" alt="" style="width: 25px;height:32px;">
......
templates/layout/layout.html
View file @ 592304dd
...@@ -129,9 +129,41 @@ ...@@ -129,9 +129,41 @@
<div class="content"> <div class="content">
<div id="map"> <div id="map">
<div class="help_bangunan" style="position: absolute;z-index: 999;top: 0px;right: 60px;"></div> <div class="help_bangunan" style="position: absolute;z-index: 999;top: 0px;right: 60px;"></div>
<div class="col-md-4 col-md-offset-4 input-group content-group head"> <div class="row" style="margin-top: 20px;">
<div class="col-sm-4 head">
<!-- <div class="input-group"> </div>
<div class="col-sm-4 input-group content-group head">
<div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="true" id="btn_s_s">
<span class="caret"></span>
</button>
<ul class="dropdown-menu" id="search_spes">
<li><input type="hidden" value="bangunan" /><a href="#"><i class="icon-home4 text-muted text-size-base" style="color: #5A9AFB;"></i> Bangunan</a></li>
<li><input type="hidden" value="jalan" /><a href="#"><i class="icon-git-branch text-muted text-size-base" style="color: #5A9AFB;"></i> Jalan</a></li>
<li><input type="hidden" value="point" /><a href="#"><i class="icon-location4 text-muted text-size-base" style="color: #5A9AFB;"></i> Point</a></li>
</ul>
</div>
<!-- </div> -->
<input type="text" id="input_search" class="form-control" placeholder="search...">
<input type="text" id="input_search_id" class="form-control hidden">
<span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="border-radius: 0px 10px 10px 0px;
outline: none;
background: linear-gradient(
201.55deg
, #72BBFF -24.21%, #3D5CCA 130.65%);"><i class="icon-search4 text-muted text-size-base" style="color: white;"></i></button>
</span>
</div>
<div class="col-sm-4 head">
</div>
</div>
<!-- <div class="col-md-4 input-group content-group head"> -->
<!-- <div class="input-group">
<input type="TextBox" ID="datebox" Class="form-control"></input> <input type="TextBox" ID="datebox" Class="form-control"></input>
<div class="input-group-btn"> <div class="input-group-btn">
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown"> <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
...@@ -144,32 +176,11 @@ ...@@ -144,32 +176,11 @@
</ul> </ul>
</div> </div>
</div> --> </div> -->
<!-- <div class="input-group"> <!-- <div class="input-group">
<input type="TextBox" ID="valss" Class="form-control" type="hidden"></input> --> <input type="TextBox" ID="valss" Class="form-control" type="hidden"></input> -->
<div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="true" id="btn_s_s">
<span class="caret"></span>
</button>
<ul class="dropdown-menu" id="search_spes">
<li><input type="hidden" value="bangunan" /><a href="#"><i class="icon-home4 text-muted text-size-base" style="color: #5A9AFB;"></i> Bangunan</a></li>
<li><input type="hidden" value="jalan" /><a href="#"><i class="icon-git-branch text-muted text-size-base" style="color: #5A9AFB;"></i> Jalan</a></li>
<li><input type="hidden" value="point" /><a href="#"><i class="icon-location4 text-muted text-size-base" style="color: #5A9AFB;"></i> Point</a></li>
</ul>
</div>
<!-- </div> -->
<input type="text" id="input_search" class="form-control" placeholder="search...">
<input type="text" id="input_search_id" class="form-control hidden"> <!-- </div> -->
<span class="input-group-btn">
<button type="submit" id="btn_search_spes" class="btn btn-primary " style="border-radius: 0px 10px 10px 0px;
outline: none;
background: linear-gradient(
201.55deg
, #72BBFF -24.21%, #3D5CCA 130.65%);"><i class="icon-search4 text-muted text-size-base" style="color: white;"></i></button>
</span>
</div>
{% if user.is_authenticated %} {% else %} {% if user.is_authenticated %} {% else %}
...@@ -197,7 +208,7 @@ ...@@ -197,7 +208,7 @@
</div> </div>
{% if user.is_authenticated %} {% if user.is_authenticated %}
<div style="height: 10%;width: 10%;position: absolute;top: 30px;right: 65px;z-index: 999;"> <div class="user-p-nav" style="height: 10%;width: 10%;position: absolute;top: 30px;right: 65px;z-index: 999;">
<!-- <a href="#"> <!-- <a href="#">
<div> <div>
<img src="{% static 'img/placeholder.jpg' %}" style="width: 37px;height: 37px;border-radius: 25px;" /> <img src="{% static 'img/placeholder.jpg' %}" style="width: 37px;height: 37px;border-radius: 25px;" />
...@@ -2186,6 +2197,25 @@ ...@@ -2186,6 +2197,25 @@
}); });
} }
$("#perbaikan_manage").click(function() {
var x = window.matchMedia("(max-width: 700px)")
if (x.matches) { // If media query matches
swal({
title: "Sorry",
text: "Untuk di mobile tampilan manajemen perbaikan tidak mendukung, Silahkan akses menggunakan laptop atau PC",
type: "warning",
icon: "error",
confirmButtonColor: "#00BCD4"
})
setTimeout(function() {
$("#panel-sm2").removeClass('active')
$("#manage_perbaikan").removeClass('active')
$("#btn-hide-all").css("display", "none")
}, 500);
}
})
$('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').html(`Powered by <a href="https://khansia.co.id" target="_blank">Khansia</a> with <a href="https://leafletjs.com" target="_blank">Leaflet</a>`) $('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').html(`Powered by <a href="https://khansia.co.id" target="_blank">Khansia</a> with <a href="https://leafletjs.com" target="_blank">Leaflet</a>`)
$('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').css("right", "50px") $('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').css("right", "50px")
</script> </script>
......
templates/layout/user_layout.html
View file @ 592304dd
...@@ -632,7 +632,8 @@ ...@@ -632,7 +632,8 @@
<label class="col-lg-3 control-label lbl-top">Groups</label> <label class="col-lg-3 control-label lbl-top">Groups</label>
<div class="col-lg-9"> <div class="col-lg-9">
<select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs"> <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs">
<option></option> <option value="Select Group"></option>
</select> </select>
</div> </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