Commit b88eff76 authored by reynaldi adriantama's avatar reynaldi adriantama

group management/user management

parent 2f08a104
...@@ -32,5 +32,7 @@ urlpatterns = [ ...@@ -32,5 +32,7 @@ urlpatterns = [
path('adduser/', views.addUser, name="adduser"), path('adduser/', views.addUser, name="adduser"),
path('getallGroups/', views.listGroup, name="getallGroups"), path('getallGroups/', views.listGroup, name="getallGroups"),
path('switchStatus/', views.deactivateUser, name="switchStatus"), path('switchStatus/', views.deactivateUser, name="switchStatus"),
path('loadUserbyId/', views.loadUserbyId, name="loadUserbyId") path('loadUserbyId/', views.loadUserbyId, name="loadUserbyId"),
path('addGroup/', views.addGroup, name="addGroup"),
path('deleteGroup/', views.deleteGroup, name="deleteGroup")
] ]
...@@ -52,10 +52,22 @@ class Usermanagement(generic.TemplateView): ...@@ -52,10 +52,22 @@ class Usermanagement(generic.TemplateView):
} }
user_res.append(datas) user_res.append(datas)
with conn.cursor() as grouplist_:
grouplist_.execute("SELECT * FROM auth_group ORDER BY name ASC")
allGroup = grouplist_.fetchall()
group_res = []
for rows in allGroup:
datas = {
"id" : rows[0],
"name" : rows[1],
}
group_res.append(datas)
context = { context = {
'title' : 'user management', 'title' : 'user management',
'data' : user_res 'data' : user_res,
'dataGroup' : group_res
} }
print(context) print(context)
...@@ -130,7 +142,7 @@ def addUser(request): ...@@ -130,7 +142,7 @@ def addUser(request):
@api_view(('POST',)) @api_view(('POST',))
def listGroup(request): def listGroup(request):
if request.method == "POST": if request.method == "POST":
groupList = Group.objects.all() groupList = Group.objects.all().order_by('name')
group = [] group = []
for g in groupList: for g in groupList:
...@@ -247,3 +259,74 @@ def loadGroupById(iduser): ...@@ -247,3 +259,74 @@ def loadGroupById(iduser):
print(resGroup) print(resGroup)
return resGroup return resGroup
@api_view(('POST',))
def addGroup(request):
if request.method == "POST":
name = request.POST.get('name')
idgroup = request.POST.get('id')
try:
if idgroup:
with conn.cursor() as cursor:
cursor.execute("UPDATE auth_group SET name = '"+name+"' WHERE id="+idgroup)
result = cursor.rowcount
print(result)
data = {
"code" : 0,
"data" : "Group telah diperbaharui.",
"info" : "success"
}
else:
group = Group.objects.get(name=name)
data = {
"code" : 4,
"data" : "Group telah tersedia.",
"info" : "failed"
}
except Group.DoesNotExist:
Group.objects.create(name=name)
if Group.objects.get(name=name):
data = {
"code" : 0,
"info" : "success",
"data" : "Group berhasil ditambahkan"
}
else:
data = {
"code" : 4,
"info" : "failed",
"data" : "Group gagal ditambahkan"
}
return Response(data)
@api_view(('POST',))
def deleteGroup(request):
if request.method == "POST":
id = request.POST.get('id')
with conn.cursor() as cursor:
cursor.execute("DELETE FROM auth_group WHERE id="+id)
result = cursor.rowcount
if result > 0:
data = {
"code" : 0,
"info" : "success",
"data" : "data berhasil dihapus"
}
else:
data = {
"code" : 4,
"info" : "success",
"data" : "data berhasil dihapus"
}
return Response(data)
\ No newline at end of file
...@@ -93,6 +93,7 @@ $(function() { ...@@ -93,6 +93,7 @@ $(function() {
// Mini // Mini
$('.select-size-xs').select2({ $('.select-size-xs').select2({
maximumSelectionLength: 5,
containerCssClass: 'select-xs' containerCssClass: 'select-xs'
}); });
......
...@@ -37,6 +37,6 @@ ...@@ -37,6 +37,6 @@
Notific{% static 'Plugin --> Notific{% static 'Plugin -->
<script src="{% static '/js/plugins/bootstrap-notify.js' %}"></script> <script src="{% static '/js/plugins/bootstrap-notify.js' %}"></script>
<!-- Control {% static 'for Material Dashboard: parallax effects, scripts for the example pages etc --> <!-- Control {% static 'for Material Dashboard: parallax effects, scripts for the example pages etc -->
<script src="{% static '/js/material-dashboard.js' %}" type="text/javascript"></script> <!-- <script src="{% static '/js/material-dashboard.js' %}" type="text/javascript"></script> -->
<!-- Material{% static 'ard DEMO methods, don't include it in your project! --> <!-- Material{% static 'ard DEMO methods, don't include it in your project! -->
<script src="{% static '/demo/demo.js' %}"></script> <!-- <script src="{% static '/demo/demo.js' %}"></script> -->
\ No newline at end of file \ No newline at end of file
...@@ -11,6 +11,7 @@ ...@@ -11,6 +11,7 @@
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" /> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.css"> <link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.Default.css"> <link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.Default.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet.locatecontrol/dist/L.Control.Locate.min.css" /> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet.locatecontrol/dist/L.Control.Locate.min.css" />
...@@ -56,10 +57,6 @@ ...@@ -56,10 +57,6 @@
margin-right: 0px; margin-right: 0px;
} }
th {
min-width: 150px;
}
.modal-colors{ .modal-colors{
background-color: #1a222f; background-color: #1a222f;
} }
...@@ -68,6 +65,25 @@ ...@@ -68,6 +65,25 @@
margin-top: 10px; margin-top: 10px;
} }
.select2-selection--multiple:not([class*=bg-]) .select2-selection__choice {
background-color: #eee;
color: #333333;
margin-top: 3px;
margin-bottom: 3px;
border-radius: 0px;
}
.page_loader {
position: fixed;
background: url('../../static/img/loadingz.gif') 50% 50% no-repeat rgb(249, 249, 249);
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
opacity: .5;
}
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 10px; width: 10px;
} }
...@@ -144,7 +160,7 @@ ...@@ -144,7 +160,7 @@
<div class="sidebar-user"> <div class="sidebar-user">
<div class="category-content"> <div class="category-content">
<div class="media"> <div class="media">
<a href="#" class="media-left"><img src="assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></a> <a href="#" class="media-left"><img src="{% static '/img/placeholder.jpg' %}" class="img-circle img-sm" alt=""></a>
<div class="media-body"> <div class="media-body">
<span class="media-heading text-semibold">{{user.username}}</span> <span class="media-heading text-semibold">{{user.username}}</span>
<div class="text-size-mini text-muted"> <div class="text-size-mini text-muted">
...@@ -172,14 +188,13 @@ ...@@ -172,14 +188,13 @@
<!-- Main --> <!-- Main -->
<li class="navigation-header"> <i class="icon-menu" title="Main pages"></i></li> <li class="navigation-header"> <i class="icon-menu" title="Main pages"></i></li>
<li><a class="tablinks" onclick="openInfo(event, 'info-maps')" id="defaultOpen"><span>User Management</span></a></li> <li><a href="?page=user" class="tablinks" id="defaultOpen"><i class="icon-user"></i><span>User Management</span></a></li>
<li><a href="?page=group" class="tablinks" id="defaultOpen"><i class="icon-users4"></i><span>Group</span></a></li>
<!-- <li><a class="tablinks" onclick="openInfo(event, 'info-penduduk')" id="defaultOpen"><span>Kependudukan</span></a></li> <!-- <li><a class="tablinks" onclick="openInfo(event, 'info-penduduk')" id="defaultOpen"><span>Kependudukan</span></a></li>
<li><a class="tablinks" onclick="openInfo(event, 'info-pendidikan')" id="defaultOpen"><span>Pendidikan</span></a></li> <li><a class="tablinks" onclick="openInfo(event, 'info-pendidikan')" id="defaultOpen"><span>Pendidikan</span></a></li>
<li><a class="tablinks" onclick="openInfo(event, 'info-pekerjaan')" id="defaultOpen"><span>Pekerjaan</span></a></li> <li><a class="tablinks" onclick="openInfo(event, 'info-pekerjaan')" id="defaultOpen"><span>Pekerjaan</span></a></li>
<li><a class="tablinks" onclick="openInfo(event, 'info-poi')" id="defaultOpen"><span>POI</span></a></li> --> <li><a class="tablinks" onclick="openInfo(event, 'info-poi')" id="defaultOpen"><span>POI</span></a></li> -->
</ul>
</li>
<!-- /page kits --> <!-- /page kits -->
</ul> </ul>
...@@ -193,6 +208,7 @@ ...@@ -193,6 +208,7 @@
<!-- Main content --> <!-- Main content -->
<!-- User management Tab -->
<div class="content-wrapper" id="info-maps"> <div class="content-wrapper" id="info-maps">
<div> <div>
<!-- Page header --> <!-- Page header -->
...@@ -209,7 +225,7 @@ ...@@ -209,7 +225,7 @@
<div class="content" style="padding: 15px;"> <div class="content" style="padding: 15px;">
<!-- Main charts --> <!-- Main charts -->
<!-- Sales stats --> <!-- Sales stats -->
<div class="panel panel-flat"> <div class="panel panel-flat" style="display: none;">
<div class="panel-heading"> <div class="panel-heading">
<h6 class="panel-title">Table User</h6> <h6 class="panel-title">Table User</h6>
<button id="modalAddButton" class="btn btn-primary btn-sm" value="SAVE" style="bottom: 15px; float: right; display:none;" data-toggle="modal" data-target="#modal_theme_info"></button> <button id="modalAddButton" class="btn btn-primary btn-sm" value="SAVE" style="bottom: 15px; float: right; display:none;" data-toggle="modal" data-target="#modal_theme_info"></button>
...@@ -218,7 +234,7 @@ ...@@ -218,7 +234,7 @@
<hr style="margin-top: 0px;"> <hr style="margin-top: 0px;">
<div class="panel-body"> <div class="panel-body">
<table class="table table-responsive datatable-show-all" id="userList"> <table class="table table-responsive datatable-show-all table-sm" id="userList">
<thead> <thead>
<tr> <tr>
<th>No.</th> <th>No.</th>
...@@ -274,6 +290,73 @@ ...@@ -274,6 +290,73 @@
<!-- /main charts --> <!-- /main charts -->
</div> </div>
</div> </div>
<!-- end user management tab -->
<div class="content-wrapper" id="usergroup" style="display: none;">
<div>
<!-- Page header -->
<div class="page-header page-header-default" style="margin-bottom: 0px;">
<div class="breadcrumb-line">
<ul class="breadcrumb">
<li>Group</li>
</ul>
</div>
</div>
<!-- /page header -->
<!-- Content area -->
<div class="content" style="padding: 15px;">
<!-- Main charts -->
<!-- Sales stats -->
<div class="panel panel-flat" style="display: none;">
<div class="panel-heading">
<h6 class="panel-title">Table Group</h6>
<button id="modalAddButtong" class="btn btn-primary btn-sm" value="SAVE" style="bottom: 15px; float: right; display:none;" data-toggle="modal" data-target="#modal_group"></button>
</div>
<hr style="margin-top: 0px;">
<div class="panel-body">
<table class="table table-responsive datatable-groups table-sm" id="usergroup" >
<thead>
<tr>
<th>No.</th>
<th>Name</th>
<th class="text-center">Actions</th>
</tr>
</thead>
<tbody>
{% for group in dataGroup %}
<tr>
<td>{{forloop.counter}}</td>
<td>{{group.name}}</td>
<td class="text-center">
<ul class="icons-list">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-menu9"></i>
</a>
<ul class="dropdown-menu dropdown-menu-right">
<li><a onclick="deletegroup('{{group.id}}', '{{group.name}}')" ><i class="icon-user-block"></i> Delete group</a></li>
<li><a onclick="showmodalgroup('{{group.id}}', '{{group.name}}')"><i class="icon-users"></i> Edit group</a></li>
</ul>
</li>
</ul>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!-- /form validation -->
</div>
</div>
<!-- /main charts -->
</div>
</div>
<!-- /main content --> <!-- /main content -->
</div> </div>
<!-- /page content --> <!-- /page content -->
...@@ -337,9 +420,38 @@ ...@@ -337,9 +420,38 @@
</div> </div>
</div> </div>
<div id="modal_group" class="modal fade">
<div class="modal-dialog md">
<div class="modal-content">
<div class="modal-header bg-info" style="background-color: #1a222f !important;">
<button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
<h6 class="modal-title modstitg">Modal Tambah Group</h6>
</div>
<div class="modal-body" style="max-height: 450px;overflow-y: auto;">
<input type="hidden" id="idgroup">
<div class="form-group">
<label class="col-lg-3 control-label lbl-top" >Nama Group</label>
<div class="col-lg-9">
<input id="inGroupName" type="text" class="form-control" value=""required>
</div>
</div>
</div>
<hr>
<div class="modal-footer">
<button type="button" class="btn btn-link" data-dismiss="modal" onclick="destroyfade()">Close</button>
<button type="button" class="btn btn-info" id="savegroup">Save changes</button>
</div>
</div>
</div>
</div>
<div class="page_loader"></div>
<!-- Core JS files --> <!-- Core JS files -->
<script type="text/javascript" src="{% static 'js/plugins/loaders/pace.min.js' %}"></script> <script type="text/javascript" src="{% static 'js/plugins/loaders/pace.min.js' %}"></script>
<script type="text/javascript" src="{% static 'js/core/libraries/jquery.min.js' %}"></script> <script type="text/javascript" src="{% static 'js/core/libraries/jquery.min.js' %}"></script>
...@@ -454,6 +566,19 @@ ...@@ -454,6 +566,19 @@
evt.currentTarget.className += " active"; evt.currentTarget.className += " active";
} }
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const page = urlParams.get('page')
if(page == "group"){
$("#usergroup").css("display", "block");
$("#info-maps").css("display", "none");
}else{
$("#usergroup").css("display", "none");
$("#info-maps").css("display", "block");
}
function destroyfade(){ function destroyfade(){
$(".modal-backdrop").css("display","none") $(".modal-backdrop").css("display","none")
$(".modal-backdrop").removeClass('show'); $(".modal-backdrop").removeClass('show');
...@@ -499,6 +624,48 @@ ...@@ -499,6 +624,48 @@
}); });
$('.datatable-groups').DataTable({
autoWidth: false,
columnDefs: [
{
orderable: false,
width: '100px',
targets: [ 2 ]
},
{
orderable: false,
width: '100px',
targets: [ 0 ]
}
],
dom: '<"float-left"B>frtip',
buttons: [
{
text: 'Tambah Group',
action: function ( e, dt, node, config ) {
$("#modalAddButtong").click();
$("#idgroup").val(null);
$(".modstitg").html("Tambah Group")
loadGroups(null)
}
}
],
language: {
search: '<span>Filter:</span> _INPUT_',
searchPlaceholder: 'Type to filter...',
lengthMenu: '<span>Show:</span> _MENU_',
paginate: { 'first': 'First', 'last': 'Last', 'next': '&rarr;', 'previous': '&larr;' }
},
drawCallback: function () {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
},
preDrawCallback: function() {
$(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').removeClass('dropup');
}
});
$("#modalAddButton").click(function(){ $("#modalAddButton").click(function(){
$("body").css("padding-right","0px !important") $("body").css("padding-right","0px !important")
}) })
...@@ -532,7 +699,7 @@ ...@@ -532,7 +699,7 @@
console.log(isObject); console.log(isObject);
// return false
$.ajax({ $.ajax({
url: "{% url 'adduser' %}", url: "{% url 'adduser' %}",
...@@ -571,7 +738,6 @@ ...@@ -571,7 +738,6 @@
$("#select_group").on("click", function(e){ $("#select_group").on("click", function(e){
e.preventDefault() e.preventDefault()
}) })
function loadGroups(isSelect){ function loadGroups(isSelect){
...@@ -622,6 +788,7 @@ ...@@ -622,6 +788,7 @@
}); });
} }
function switchuserstatus(id, isactive){ function switchuserstatus(id, isactive){
var isObject = {} var isObject = {}
var params = id.split(","); var params = id.split(",");
...@@ -722,4 +889,127 @@ ...@@ -722,4 +889,127 @@
} }
}); });
} }
loaderPage(false);
function loaderPage(stat) {
if (stat == true) {
$('.page_loader').show();
} else {
$('.page_loader').hide();
$(".panel-flat").css("display", "block")
}
};
$("#savegroup").on("click", function(){
addGroup();
})
function addGroup(){
var isObject = {}
var idgroup = $("#idgroup").val();
isObject.name = $("#inGroupName").val();
if(idgroup){
isObject.id = idgroup;
}
$.ajax({
url: "{% url 'addGroup' %}",
data: isObject,
dataType: 'json',
type: 'post',
success: function(data) {
let response = data;
if(response.code == 0){
$("#modal_group").modal('toggle');
destroyfade();
swal({
title : response.info,
text : response.data,
type : "success",
icon : "success",
confirmButtonColor: "#00BCD4"
}).then((isok) => {
window.location.href = window.location.origin+"/usermanagement/?page=group"
})
}else{
swal({
title : response.info,
text : response.data,
type : "alert",
icon : "error",
confirmButtonColor: "#00BCD4"
})
}
}
});
}
function showmodalgroup(id, name){
console.log(id);
console.log(name);
$("#idgroup").val(id);
$("#inGroupName").val(name);
$(".modstitg").html("Edit Group");
$("#modalAddButtong").click();
}
function deletegroup(id, group){
var isObject = {}
var params = id;
isObject.id = params;
swal({
title: "Hapus group?",
text: "Group "+group+" akan dihapus",
type: "warning",
showCancelButton: true,
confirmButtonClass: "btn-danger",
confirmButtonText: "Ya!",
cancelButtonText: "Tidak!",
closeOnConfirm: false,
closeOnCancel: false
}).then((isConfirm) =>{
console.log(isConfirm)
if (isConfirm.value) {
$.ajax({
url: "{% url 'deleteGroup' %}",
data: isObject,
dataType: 'json',
type: 'post',
success: function(data) {
let response = data;
if(response.code == 0){
swal({
title : "sukses",
text : "Group berhasil dihapus",
type : "success",
icon : "success",
confirmButtonColor: "#00BCD4"
}).then((isok) => {
location.reload();
})
}else{
alert("no data in database")
}
}
});
} else {
swal("Dibatalkan", "User status tidak berubah", "error");
}
});
}
</script> </script>
\ No newline at end of file
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<div> <div>
{% if form.errors %} {% if form.errors %}
<div class="alert alert-danger"> <div class="alert alert-danger">
Username atau Password kamu salah. Silahkan coba kembali. Username atau Password salah. Silahkan coba kembali.
</div> </div>
{% endif %} {% endif %}
</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