Commit 28104b46 authored by Mat's avatar Mat

affichage mainDisplay, corrige la pagination, design form

parent 0a912121
......@@ -143,11 +143,17 @@ class LegumeController extends MasterController
/**
* @return \Symfony\Component\HttpFoundation\Response
* @throws \Doctrine\ORM\NoResultException
* @throws \Doctrine\ORM\NonUniqueResultException
*/
public function mainDisplayAction()
{
$nbRows = $this->getDoctrine()->getManager()
->getRepository('PotageBundle:Legume')->countRowsForMainDisplay();
$form = $this->createForm(LegumeAPIType::class);
return $this->render('@Potage/Legume/mainDisplay.html.twig', array(
'nbRows' => $nbRows,
'formLegume' => $form->createView()
));
}
......
......@@ -80,7 +80,7 @@ class LegumeType extends AbstractType
));
$builder->add('sauver', SubmitType::class, array(
'label' => 'Enregistrer',
'attr' => array('class' => 'btn btn-primary mb-2')
'attr' => array('class' => 'btn btn-dark mb-2')
));
}
......
......@@ -134,5 +134,18 @@ class LegumeRepository extends \Doctrine\ORM\EntityRepository
->setParameter(':id', $id);
return $qb->getQuery()->getOneOrNullResult();
}
/**
* @return mixed
* @throws \Doctrine\ORM\NoResultException
* @throws \Doctrine\ORM\NonUniqueResultException
*/
public function countRowsForMainDisplay()
{
$qb = $this->createQueryBuilder('l')
->select('count(l.id)');
return $qb->getQuery()->getSingleScalarResult();
}
}
......@@ -8,34 +8,52 @@
{{ block('breadcrumb') }}
<h1>{{ block('title') }}</h1>
<a href="javascript: void(0);" class="btn btn-outline-dark btn-sm btn-create">
<i class="fas fa-plus"></i>
Ajouter un nouveau légume
</a>
<a href="javascript: void(0);" class="btn btn-outline-dark btn-sm btn-reload">
<i class="fas fa-sync-alt"></i>
Rafraîchir la liste
</a>
<form id="pagination">
<select class="custom-select custom-select-sm">
<option value="-1" selected>Pagination</option>
<option value="3">3</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="50">50</option>
</select>
</form>
<a id="form-legume"></a>
<div class="hidden" style="margin: -3em 0;">
<div class="row">
<div class="col left">
<div>
<span id="t_rows">{{ nbRows }}</span> légumes
<span id="t_pages"></span>
{# TODO nbRows doit être rafraichis si on crée ou si on efface #}
</div>
<form id="pagination">
<select class="custom-select custom-select-sm">
<option value="-1" selected>Pagination</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</form>
</div>
<div class="col right">
<a href="javascript: void(0);" class="btn btn-outline-dark btn-sm btn-reload">
<i class="fas fa-sync-alt"></i>
Rafraîchir la liste
</a>
<a href="javascript: void(0);" class="btn btn-dark btn-sm btn-create">
<i class="fas fa-plus"></i>
Ajouter un nouveau légume
</a>
</div>
</div>
<div id="sidebar-form" class="hidden">
<a id="form-legume"></a>
<a href="javascript: void(0);" class="btn btn-outline-secondary btn-sm btn-hide" style="float: right; margin-top: -0.5em;">
<i class="fas fa-times"></i>
</a>
{{ form_start(formLegume) }}
{{ form_errors(formLegume) }}
{{ form_row(formLegume.nom) }}
{{ form_row(formLegume.description) }}
{{ form_row(formLegume.unite) }}
{{ form_row(formLegume.prixUnitaire) }}
<hr>
{{ form_widget(formLegume) }}
<hr>
{{ form_rest(formLegume) }}
{{ form_end(formLegume) }}
</div>
......@@ -81,6 +99,8 @@
let submitURL = null;
let table = document.querySelector('table#maintab.legumes');
let tbody = table.querySelector('tbody');
let total = parseInt(document.querySelector('#t_rows').textContent);
let tpage = document.querySelector('#t_pages');
let paginate = { 'step': 10, 'page': 1, 'column': 'id', 'order': 'DESC' };
/*
......@@ -88,12 +108,10 @@
*/
function reloadTableLegume(paginate)
{
console.log(paginate);
//console.log(paginate);
tbody.innerHTML = null;
let membreURL = Routing.generate('api_legume_read', paginate);
AJAX('GET', membreURL, function(request)
{
let json = JSON.parse(request.responseText);
......@@ -140,7 +158,7 @@
form.querySelector('#legume_nom').value = json.nom;
form.querySelector('#legume_description').value = json.description;
form.querySelector('#legume_unite').value = json.unite;
form.querySelector('#legume_prix_unitaire').value = json.prix_unitaire;
form.querySelector('#legume_prixUnitaire').value = json.prix_unitaire;
form.parentNode.classList.remove('hidden');
});
});
......@@ -175,11 +193,11 @@
* Pagenav, pagination par page
*/
let pageNav = document.querySelector('nav#pagenav ul.pagination');
AJAX('GET', Routing.generate('api_legume_read'), function(request)
AJAX('GET', Routing.generate('api_legume_read', paginate), function(request)
{
tpage.innerHTML = null;
pageNav.innerHTML = null;
let json = JSON.parse(request.responseText);
let total = json.length;
let perPage = paginate.step;
if (total > perPage)
{
......@@ -203,8 +221,11 @@
pageItem.appendChild(pageItemChild);
pageNav.appendChild(pageItem);
}
tpage.innerHTML = '— page '+ currentPage + ' sur '+ nbPages;
}
});
});
}
reloadTableLegume(paginate);
......@@ -216,12 +237,23 @@
*/
let reloadBtns = document.querySelectorAll('.btn-reload');
reloadBtns.forEach(function(reloadBtn) {
reloadBtn.addEventListener('dblclick', function(e)
reloadBtn.addEventListener('click', function(e)
{
reloadTableLegume(paginate);
});
});
/*
*
*/
let hideBtns = document.querySelectorAll('.btn-hide');
hideBtns.forEach(function(hideBtn) {
hideBtn.addEventListener('click', function(e)
{
form.parentNode.classList.add('hidden');
});
});
/*
* Ajouter une nouveau membre
*/
......@@ -232,7 +264,7 @@
form.querySelector('#legume_nom').value = null;
form.querySelector('#legume_description').value = null;
form.querySelector('#legume_unite').value = null;
form.querySelector('#legume_prix_unitaire').value = null;
form.querySelector('#legume_prixUnitaire').value = null;
form.parentNode.classList.remove('hidden');
submitURL = Routing.generate('api_legume_create');
});
......
......@@ -7,6 +7,10 @@ body {
font-family: 'Open Sans', sans-serif;
font-size: 12pt;
}
header {
z-index: 10;
position: relative;
}
div#content {
margin: 2em;
}
......@@ -19,9 +23,32 @@ form.formulaire {
padding: 2em;
border: 1px solid #ececec;
}
.left {
text-align: left;
}
.right {
text-align: right;
}
.hidden {
display: none;
}
#pagination {
width: 140px;
margin: 0.5em 0 2em;
}
#sidebar-form {
position: fixed;
z-index: 5;
right: 0;
width: 50%;
min-width: 300px;
max-width: 650px;
background: white;
top: 0;
bottom: 0;
padding: 5em 3em;
opacity: 0.95;
box-shadow: 0 0 15px #8e8e8e;
}
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