Commit 3cb00ccd authored by Mat's avatar Mat

mainDisplay: placement des images dans le formulaire et dans la vue

parent 24a2c1d2
......@@ -16,6 +16,7 @@
!/var/SymfonyRequirements.php
/vendor/
/web/bundles/
/web/uploads/images
## ?? GIT or NOT GIT ??
bin/
......@@ -30,4 +31,3 @@ chmod-cache.sh
.git_webhook/
.idea/
nbproject/
File mode changed from 100644 to 100755
......@@ -11,6 +11,7 @@ use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolver;
use PotageBundle\Entity\Legume;
use Vich\UploaderBundle\Form\Type\VichImageType;
class LegumeType extends AbstractType
{
......@@ -22,7 +23,7 @@ class LegumeType extends AbstractType
parent::buildForm($builder, $options);
$builder->add('nom', TextType::class, array(
'label' => "Nom",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
'autofocus' => true,
......@@ -30,54 +31,61 @@ class LegumeType extends AbstractType
));
$builder->add('description', TextareaType::class, array(
'label' => "Description",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('logoPath', TextType::class, array(
'required' => false,
'label' => "Chemin du logo",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label' => "Origine",
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('unite', TextType::class, array(
'label' => "Unité",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('quantiteMin', NumberType::class, array(
'label' => "Quantité minimale",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('quantiteMax', NumberType::class, array(
'label' => "Quantité maximale",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('quantiteStep', NumberType::class, array(
'label' => "Écart (step)",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('prixUnitaire', MoneyType::class, array(
'label' => "Prix unitaire",
'label_attr' => array('class' => 'col-sm-4 col-form-label'),
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control form-control-sm',
),
));
$builder->add('imageFile', VichImageType::class, array(
'label' => "Téléverser une image",
'label_attr' => array('class' => 'col-form-label'),
'attr' => array(
'class' => 'form-control-sm',
),
));
$builder->add('sauver', SubmitType::class, array(
'label' => 'Enregistrer',
'attr' => array('class' => 'btn btn-dark mb-2')
......
......@@ -19,39 +19,53 @@
{{ form_start(formLegume) }}
{{ form_errors(formLegume) }}
<div class="form-group row">{{ form_label(formLegume.nom) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.nom) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.nom) }}</div>
{{ form_errors(formLegume.nom) }}</div>
<div class="form-group row">{{ form_label(formLegume.description) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.description) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.description) }}</div>
{{ form_errors(formLegume.description) }}</div>
<div class="form-group row">{{ form_label(formLegume.logoPath) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.logoPath) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.logoPath) }}</div>
{{ form_errors(formLegume.logoPath) }}</div>
<div class="form-group row">{{ form_label(formLegume.unite) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.imageFile) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.imageFile) }}</div>
{{ form_errors(formLegume.imageFile) }}</div>
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.unite) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.unite) }}</div>
{{ form_errors(formLegume.unite) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteMin) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteMin) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteMin) }}</div>
{{ form_errors(formLegume.quantiteMin) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteMax) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteMax) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteMax) }}</div>
{{ form_errors(formLegume.quantiteMax) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteStep) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteStep) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteStep) }}</div>
{{ form_errors(formLegume.quantiteStep) }}</div>
<div class="form-group row">{{ form_label(formLegume.prixUnitaire) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.prixUnitaire) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.prixUnitaire) }}</div>
{{ form_errors(formLegume.prixUnitaire) }}</div>
<div class="form-group row">{{ form_label(formLegume.sauver) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.sauver) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.sauver) }}</div>
</div>
......
......@@ -9,7 +9,6 @@
<h1>{{ block('title') }}</h1>
<div class="row">
<div class="col left">
<div>
<span id="t_rows">{{ nbRows }}</span> légumes
......@@ -27,7 +26,6 @@
</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>
......@@ -40,23 +38,7 @@
</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_widget(formLegume) }}
<hr>
{{ form_rest(formLegume) }}
{{ form_end(formLegume) }}
</div>
{% include '@Potage/Legume/mainSidebarForm.html.twig' %}
<table id="maintab" class="table legumes">
<thead>
......@@ -67,6 +49,9 @@
<th scope="col">
<a href="javascript: void(0);" id="nom" class="btn-sort">Nom</a>
</th>
<th scope="col">
<a href="javascript: void(0);" id="image" class="btn-sort">Vignette</a>
</th>
<th scope="col">
<a href="javascript: void(0);" id="description" class="btn-sort">Description</a>
</th>
......@@ -84,6 +69,7 @@
<tbody>
</tbody>
</table>
<nav id="pagenav" aria-label="page navigation legume">
<ul class="pagination justify-content-center">
</ul>
......@@ -101,6 +87,7 @@
let tbody = table.querySelector('tbody');
let total = parseInt(document.querySelector('#t_rows').textContent);
let tpage = document.querySelector('#t_pages');
let titleForm = document.querySelector('#form-legume');
let paginate = { 'step': 10, 'page': 1, 'column': 'id', 'order': 'DESC' };
/*
......@@ -115,6 +102,7 @@
AJAX('GET', membreURL, function(request)
{
let json = JSON.parse(request.responseText);
console.log(json);
for (var i = 0; i < json.length; i++)
{
tr = document.createElement('tr');
......@@ -128,18 +116,24 @@
tr.appendChild(td2);
td3 = document.createElement('td');
td3.textContent = json[i].description;
td3.innerHTML = json[i].image ?
'<div class="logo-sm"><div class="crop"><img src="/web/uploads/images/legumes/'
+ json[i].image + '" /></div></div>': null;
tr.appendChild(td3);
td4 = document.createElement('td');
td4.textContent = json[i].prix_unitaire + '';
td4.textContent = json[i].description;
tr.appendChild(td4);
td5 = document.createElement('td');
td5.textContent = json[i].unite;
td5.textContent = json[i].prix_unitaire + '';
tr.appendChild(td5);
td6 = document.createElement('td');
td6.textContent = json[i].unite;
tr.appendChild(td6);
td7 = document.createElement('td');
/*
* Editer une rangée
......@@ -155,6 +149,7 @@
AJAX('GET', submitURL, function(request)
{
let json = JSON.parse(request.responseText);
titleForm.textContent = '# ' + json.id;
form.querySelector('#legume_nom').value = json.nom;
form.querySelector('#legume_description').value = json.description;
form.querySelector('#legume_unite').value = json.unite;
......@@ -162,7 +157,7 @@
form.parentNode.classList.remove('hidden');
});
});
td6.appendChild(editBtn);
td7.appendChild(editBtn);
/*
* Supprimer une rangée
......@@ -184,8 +179,8 @@
});
}
});
td6.appendChild(deleteBtn);
tr.appendChild(td6);
td7.appendChild(deleteBtn);
tr.appendChild(td7);
tbody.appendChild(tr);
}
......@@ -261,6 +256,7 @@
createBtns.forEach(function(createBtn) {
createBtn.addEventListener('click', function(e)
{
titleForm.textContent = 'Nouveau légume';
form.querySelector('#legume_nom').value = null;
form.querySelector('#legume_description').value = null;
form.querySelector('#legume_unite').value = null;
......
<div id="sidebar-form" class="hidden">
<h2 id="form-legume" style="margin-bottom: 1em"></h2>
{{ form_start(formLegume) }}
{{ form_errors(formLegume) }}
<div class="form-group row">
<div class="col-sm-4">
{{ form_label(formLegume.nom) }}
</div>
<div class="col-sm-8">
{{ form_widget(formLegume.nom) }}
{{ form_errors(formLegume.nom) }}
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
{{ form_label(formLegume.description) }}
</div>
<div class="col-sm-8">
{{ form_widget(formLegume.description) }}
{{ form_errors(formLegume.description) }}
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
{{ form_label(formLegume.logoPath) }}
</div>
<div class="col-sm-8">
{{ form_widget(formLegume.logoPath) }}
{{ form_errors(formLegume.logoPath) }}
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
{{ form_label(formLegume.imageFile) }}
</div>
<div class="col-sm-8">
{{ form_widget(formLegume.imageFile) }}
{{ form_errors(formLegume.imageFile) }}
</div>
</div>
<div class="form-group row">
<div class="col-sm-4">
{{ form_label(formLegume.quantiteMin) }}
{{ form_widget(formLegume.quantiteMin) }}
{{ form_errors(formLegume.quantiteMin) }}
</div>
<div class="col-sm-4">
{{ form_label(formLegume.quantiteMax) }}
{{ form_widget(formLegume.quantiteMax) }}
{{ form_errors(formLegume.quantiteMax) }}
</div>
<div class="col-sm-4">
{{ form_label(formLegume.quantiteStep) }}
{{ form_widget(formLegume.quantiteStep) }}
{{ form_errors(formLegume.quantiteStep) }}
</div>
</div>
<div class="form-group row">
<div class="col-sm-6">
{{ form_label(formLegume.prixUnitaire) }}
{{ form_widget(formLegume.prixUnitaire) }}
{{ form_errors(formLegume.prixUnitaire) }}
</div>
<div class="col-sm-6">
{{ form_label(formLegume.unite) }}
{{ form_widget(formLegume.unite) }}
{{ form_errors(formLegume.unite) }}
</div>
</div>
<div class="form-group row">
{{ form_label(formLegume.sauver) }}
<div class="col-sm-12 right">
<button class="btn btn-outline-secondary btn-hide mb-2">Annuler</button>
{{ form_widget(formLegume.sauver) }}
</div>
</div>
{{ form_rest(formLegume) }}
{{ form_end(formLegume) }}
</div>
......@@ -20,39 +20,53 @@
{{ form_start(formLegume) }}
{{ form_errors(formLegume) }}
<div class="form-group row">{{ form_label(formLegume.nom) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.nom) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.nom) }}</div>
{{ form_errors(formLegume.nom) }}</div>
<div class="form-group row">{{ form_label(formLegume.description) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.description) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.description) }}</div>
{{ form_errors(formLegume.description) }}</div>
<div class="form-group row">{{ form_label(formLegume.logoPath) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.logoPath) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.logoPath) }}</div>
{{ form_errors(formLegume.logoPath) }}</div>
<div class="form-group row">{{ form_label(formLegume.unite) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.imageFile) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.imageFile) }}</div>
{{ form_errors(formLegume.imageFile) }}</div>
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.unite) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.unite) }}</div>
{{ form_errors(formLegume.unite) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteMin) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteMin) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteMin) }}</div>
{{ form_errors(formLegume.quantiteMin) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteMax) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteMax) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteMax) }}</div>
{{ form_errors(formLegume.quantiteMax) }}</div>
<div class="form-group row">{{ form_label(formLegume.quantiteStep) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.quantiteStep) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.quantiteStep) }}</div>
{{ form_errors(formLegume.quantiteStep) }}</div>
<div class="form-group row">{{ form_label(formLegume.prixUnitaire) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.prixUnitaire) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.prixUnitaire) }}</div>
{{ form_errors(formLegume.prixUnitaire) }}</div>
<div class="form-group row">{{ form_label(formLegume.sauver) }}
<div class="form-group row">
<div class="col-sm-4">{{ form_label(formLegume.sauver) }}</div>
<div class="col-sm-8">{{ form_widget(formLegume.sauver) }}</div>
</div>
......
......@@ -48,7 +48,39 @@ form.formulaire {
background: white;
top: 0;
bottom: 0;
padding: 5em 3em;
opacity: 0.95;
padding: 7em 3em 3em; /*
opacity: 0.95; */
box-shadow: 0 0 15px #8e8e8e;
}
.logo-sm {
width: 50px;
height: 50px;
display: inline-block;
vertical-align: top;
overflow: hidden;
}
.logo-sm, .logo-sm .crop {
border-radius: 5px;
}
.logo-sm .crop {
height: 100%;
position: relative;
overflow: hidden;
}
.logo-sm .crop img {
height: 50px;
min-width: 100%;
min-height: 100%;
display: block;
position: absolute;
margin: auto;
top: -100%;
right: -100%;
bottom: -100%;
left: -100%;
}
#legume_imageFile label {
display: none;
}
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