Add rows table to geofence page with Delete action. #220

This commit is contained in:
Korina Cordero 2019-06-04 07:15:56 +00:00
parent 0f6229405e
commit eaf77fc634
4 changed files with 178 additions and 24 deletions

View file

@ -172,6 +172,8 @@ access_keys:
label: List
- id: geofence.add
label: Add
- id: geofence.delete
label: Delete
- id: rider
label: Rider Access

View file

@ -4,6 +4,11 @@ geofence_list:
path: /geofence
controller: App\Controller\GeofenceController::index
geofence_rows:
path: /geofence/rows
controller: App\Controller\GeofenceController::rows
methods: [POST]
geofence_upload_kml:
path: /geofence/upload
controller: App\Controller\GeofenceController::uploadKML
@ -13,3 +18,8 @@ geofence_create:
path: /geofence/create
controller: App\Controller\GeofenceController::addForm
methods: [GET]
geofence_delete:
path: /geofence/{id}
controller: App\Controller\GeofenceController::destroy
methods: [DELETE]

View file

@ -26,13 +26,53 @@ class GeofenceController extends BaseController
$params = $this->initParameters('geofence_list');
// get query builder
$params['areas'] = $this->getDoctrine()
->getRepository(SupportedArea::class)
->findAll();;
return $this->render('geofence/list.html.twig', $params);
}
public function rows(Request $req)
{
$this->denyAccessUnlessGranted('geofence.list', null, 'No access.');
$params = $this->initParameters('geofence_list');
// get query builder
$obj_rows = $this->getDoctrine()
->getRepository(SupportedArea::class)
->findAll();
// add metadata
$meta = [
'sort' => 'asc',
'field' => 'id'
];
// process rows
$rows = [];
foreach($obj_rows as $orow) {
// add row data
$row['id'] = $orow->getID();
$row['name'] = $orow->getName();
// add row metadata
$row['meta'] = [
'delete_url' => ''
];
if ($this->isGranted('geofence.delete'))
$row['meta']['delete_url'] = $this->generateUrl('geofence_delete', ['id' => $row['id']]);
$rows[] = $row;
}
// response
return $this->render('geofence/list.html.twig', $params);
return $this->json([
'meta' => $meta,
'data' => $rows
]);
}
public function addForm()
@ -64,4 +104,27 @@ class GeofenceController extends BaseController
'filename' => $filename
]);
}
public function destroy($id)
{
$this->denyAccessUnlessGranted('geofence.delete', null, 'No access.');
$params = $this->initParameters('geofence_list');
// get object data
$em = $this->getDoctrine()->getManager();
$obj = $em->getRepository(SupportedArea::class)->find($id);
if (empty($obj))
throw $this->createNotFoundException('The item does not exist');
// delete this object
$em->remove($obj);
$em->flush();
// response
$response = new Response();
$response->setStatusCode(Response::HTTP_OK);
$response->send();
}
}

View file

@ -32,17 +32,19 @@
</span>
</a>
</h3>
</div>
</div>
</div>
<form id="row-form" class="m-form m-form--fit m-form--label-align-right m-form--group-seperator-dashed" }}">
<div class="m-portlet__body">
<div class="form-group m-form__group row">
<div class="col-lg-12">
<div id="m_gmap" style="height:600px;"></div>
</div>
</div>
<div class="col-lg-12">
<div id="m_gmap" style="height:600px;"></div>
</div>
</div>
<!--begin: Datatable -->
<div id="data-rows"></div>
<!--end: Datatable -->
</div>
</form>
</div>
@ -56,9 +58,10 @@
<script src="/assets/vendors/custom/gmaps/gmaps.js" type="text/javascript"></script>
<script>
// BEGIN google maps stuff
initMap();
// BEGIN google maps stuff
function initMap() {
var map = new google.maps.Map(document.getElementById('m_gmap'),
{
@ -67,29 +70,105 @@ function initMap() {
zoom: 13
});
{% for obj in areas %}
var pointsArray = new Array();
{% if areas %}
{% for obj in areas %}
var pointsArray = new Array();
{% for point in obj.getCoverageArea.getRing(0).getPoints() %}
var polylatlng = new google.maps.LatLng(
{{ point.getLatitude }},
{{ point.getLongitude }});
{% for point in obj.getCoverageArea.getRing(0).getPoints() %}
var polylatlng = new google.maps.LatLng(
{{ point.getLatitude }},
{{ point.getLongitude }});
pointsArray.push(polylatlng);
pointsArray.push(polylatlng);
{% endfor %}
var coveredarea = new google.maps.Polygon({
paths: pointsArray,
fillColor: "#FF0000",
fillOpacity: .5,
mapTypeId: 'roadmap'
});
coveredarea.setMap(map);
{% endfor %}
var coveredarea = new google.maps.Polygon({
paths: pointsArray,
fillColor: "#FF0000",
fillOpacity: .5,
mapTypeId: 'roadmap'
});
coveredarea.setMap(map);
{% endfor %}
{% endif %}
}
// END google maps stuff
$(function() {
var options = {
data: {
type: 'remote',
source: {
read: {
url: '{{ url("geofence_rows") }}',
method: 'POST',
}
},
saveState: {
cookie: false,
webstorage: false
},
serverFiltering: false,
serverSorting: true
},
columns: [
{
field: 'id',
title: 'ID',
width: 30
},
{
field: 'name',
title: 'Name'
},
{
field: 'Actions',
width: 110,
title: 'Actions',
sortable: false,
overflow: 'visible',
template: function (row, index, datatable) {
var actions = '';
if (row.meta.delete_url != '') {
actions += '<a href="' + row.meta.delete_url + '" class="m-portlet__nav-link btn m-btn m-btn--hover-danger m-btn--icon m-btn--icon-only m-btn--pill btn-delete" data-id="' + row.name + '" title="Delete"><i class="la la-trash"></i></a>';
}
return actions;
},
}
],
};
var table = $("#data-rows").mDatatable(options);
$(document).on('click', '.btn-delete', function(e) {
var url = $(this).prop('href');
var id = $(this).data('id');
var btn = $(this);
e.preventDefault();
swal({
title: 'Confirmation',
html: 'Are you sure you want to delete <strong>' + id + '</strong>?',
type: 'warning',
showCancelButton: true
}).then((result) => {
if (result.value) {
$.ajax({
method: "DELETE",
url: url
}).done(function(response) {
table.row(btn.parents('tr')).remove();
table.reload();
});
}
});
});
});
</script>
{% endblock %}