Added basic item management
This commit is contained in:
keplyx
parent
57b8c341bc
commit
3677b8165c
7 changed files with 215 additions and 14 deletions
66
admin/index.php
Normal file
66
admin/index.php
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
<?php
|
||||
$relativePath = "../";
|
||||
ob_start();
|
||||
?>
|
||||
<div class="stock-container">
|
||||
|
||||
<h1 class="text-center">Gestion des Stocks</h1>
|
||||
<h2 class="text-center">Ajouter un article</h2>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th class="name-column">Nom</th>
|
||||
<th>Quantité</th>
|
||||
<th>Prix</th>
|
||||
<th class="code-column">Code Barre</th>
|
||||
<th class="image-column">Image</th>
|
||||
<th class="actions-column">Actions</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<input type="text" class="form-control" id="nameInput" placeholder="Nom">
|
||||
</td>
|
||||
<td>
|
||||
<input type="number" class="form-control" id="quantityInput" placeholder="Quantité">
|
||||
</td>
|
||||
<td>
|
||||
<input type="text" class="form-control" id="priceInput" placeholder="Prix">
|
||||
</td>
|
||||
<td>
|
||||
<input type="text" class="form-control" id="codeInput" placeholder="Code Barre">
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-primary">Importer</button>
|
||||
</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-success" onclick="addNewItem()"><i class="fas fa-check"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h2 class="text-center">Liste d'articles</h2>
|
||||
<table id="stockTable">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th class="name-column">Nom</th>
|
||||
<th>Quantité</th>
|
||||
<th>Prix</th>
|
||||
<th class="code-column">Code Barre</th>
|
||||
<th class="image-column">Image</th>
|
||||
<th class="actions-column">Actions</th>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/stock.css" media="screen,projection"/>
|
||||
|
||||
|
||||
<?php
|
||||
$pageContent = ob_get_clean();
|
||||
$pageTitle = "Gestion";
|
||||
$pageScripts = "<script type=\"text/javascript\" src=\"" . $relativePath . "assets/js/stock.js\"></script>";
|
||||
include($relativePath . "includes/template.php");
|
||||
?>
|
||||
25
assets/css/stock.css
Normal file
25
assets/css/stock.css
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
table {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.name-column {
|
||||
width : 30%;
|
||||
}
|
||||
|
||||
.code-column {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.stock-container {
|
||||
width: 90%;
|
||||
margin: 50px auto auto auto;
|
||||
}
|
||||
|
||||
.actions-column {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.image-column {
|
||||
width: 150px;
|
||||
}
|
||||
102
assets/js/stock.js
Normal file
102
assets/js/stock.js
Normal file
|
|
@ -0,0 +1,102 @@
|
|||
let defaultStock = [
|
||||
{
|
||||
name: 'Granola',
|
||||
quantity: '2',
|
||||
price: '1.3',
|
||||
code: '7622210601988',
|
||||
type: [
|
||||
'Alimentaire',
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
let currentDataset = [];
|
||||
|
||||
$(document).ready(function () {
|
||||
currentDataset = defaultStock;
|
||||
generateTable(currentDataset);
|
||||
});
|
||||
|
||||
|
||||
function generateTable(dataset) {
|
||||
for (let i = 0; i < dataset.length; i++) {
|
||||
generateLine(dataset[i]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function generateLine(item) {
|
||||
$.selector_cache('#stockTable').append(
|
||||
'<tr id="row_' + item.code + '">' +
|
||||
'<td>' + item.name + '</td>' +
|
||||
'<td>' + item.quantity + '</td>' +
|
||||
'<td>' + item.price + '</td>' +
|
||||
'<td>' + item.code + '</td>' +
|
||||
'<td><a href="">LINK</a></td>' +
|
||||
'<td>' +
|
||||
'<button class="btn btn-danger" id="delete_' + item.code + '" onclick="deleteItem(this)"><i class="fas fa-times"></i></button>' +
|
||||
'<button class="btn btn-primary" id="edit_' + item.code + '" onclick="editItem(this)"><i class="fas fa-edit"></i></button>' +
|
||||
'</td>' +
|
||||
'</tr>'
|
||||
);
|
||||
}
|
||||
|
||||
function getItemOfCode(code) {
|
||||
let item = {};
|
||||
for (let i = 0; i < currentDataset.length; i++) {
|
||||
if (currentDataset[i].code === code) {
|
||||
item = currentDataset[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
return item;
|
||||
}
|
||||
|
||||
|
||||
function editItem(elem) {
|
||||
if (isItemInputEmpty()) {
|
||||
let code = elem.id.replace('edit_', '');
|
||||
let item = getItemOfCode(code);
|
||||
console.log(item);
|
||||
setEditFieldValues(item.name, item.quantity, item.price, item.code);
|
||||
removeItemFromList(item); // Move the item in the edit fields
|
||||
}
|
||||
}
|
||||
|
||||
function deleteItem(elem) {
|
||||
let code = elem.id.replace('delete_', '');
|
||||
let item = getItemOfCode(code);
|
||||
console.log(item);
|
||||
removeItemFromList(item);
|
||||
}
|
||||
|
||||
function removeItemFromList(item) {
|
||||
currentDataset.splice(currentDataset.indexOf(item), 1);
|
||||
$('#row_' + item.code).remove();
|
||||
}
|
||||
|
||||
function setEditFieldValues(name, quantity, price, code) {
|
||||
$.selector_cache('#nameInput').val(name);
|
||||
$.selector_cache('#quantityInput').val(quantity);
|
||||
$.selector_cache('#priceInput').val(price);
|
||||
$.selector_cache('#codeInput').val(code);
|
||||
}
|
||||
|
||||
function isItemInputEmpty() {
|
||||
return $.selector_cache('#nameInput').val() === '' &&
|
||||
$.selector_cache('#quantityInput').val() === '' &&
|
||||
$.selector_cache('#priceInput').val() === '' &&
|
||||
$.selector_cache('#codeInput').val() === '';
|
||||
}
|
||||
|
||||
function addNewItem() {
|
||||
let item = {
|
||||
name: $.selector_cache('#nameInput').val(),
|
||||
quantity: $.selector_cache('#quantityInput').val(),
|
||||
price: $.selector_cache('#priceInput').val(),
|
||||
code: $.selector_cache('#codeInput').val(),
|
||||
};
|
||||
setEditFieldValues('', '', '', '');
|
||||
currentDataset.push(item);
|
||||
generateLine(item);
|
||||
}
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
</li>
|
||||
<li class="nav-item">
|
||||
<div class="link-effect clipped"></div>
|
||||
<a class="nav-link" href="<?= $relativePath ?>about.php">
|
||||
<a class="nav-link" href="<?= $relativePath ?>admin">
|
||||
<!--Place and access-->
|
||||
<i class="fas fa-sign-in-alt mr-2"></i>
|
||||
Connexion
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
</li>
|
||||
<li class="nav-item">
|
||||
<div class="link-effect clipped"></div>
|
||||
<a class="nav-link" href="<?= $relativePath ?>about.php">
|
||||
<a class="nav-link" href="<?= $relativePath ?>admin">
|
||||
<!--Place and access-->
|
||||
<i class="fas fa-sign-in-alt mr-2"></i>
|
||||
Connexion
|
||||
|
|
|
|||
|
|
@ -6,6 +6,9 @@ if (!isset($relativePath))
|
|||
if (!isset($pageScripts))
|
||||
$pageScripts = "";
|
||||
|
||||
if (!isset($hasHeader))
|
||||
$hasHeader = false;
|
||||
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
|
@ -22,7 +25,8 @@ if (!isset($pageScripts))
|
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/general.css" media="screen,projection"/>
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/index.css" media="screen,projection"/>
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/hamburger.css" media="screen,projection"/>
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/hamburger.css"
|
||||
media="screen,projection"/>
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/sidenav.css" media="screen,projection"/>
|
||||
<link type="text/css" rel="stylesheet" href="<?= $relativePath ?>assets/css/bootstrapOverwrite.css"
|
||||
media="screen,projection"/>
|
||||
|
|
@ -35,22 +39,18 @@ if (!isset($pageScripts))
|
|||
|
||||
<div id="mainContainer">
|
||||
|
||||
<div id="headerJumbotron" class="jumbotron text-center d-flex">
|
||||
<div id="headerTitleContainer">
|
||||
<h1 id="headerTitle"><?= $title ?></h1>
|
||||
<h2 id="headerSubTitle"><?= $subTitle ?></h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<?php
|
||||
if (isset($header)) {
|
||||
echo $header;
|
||||
}
|
||||
include($relativePath . "includes/navbar.php");
|
||||
include($relativePath . "includes/sidenav.php");
|
||||
?>
|
||||
|
||||
<div class="mt-4" id="contentContainer">
|
||||
<?= $pageContent ?>
|
||||
</div>
|
||||
|
||||
<?php include($relativePath . "includes/footer.php") ?>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
14
index.php
14
index.php
|
|
@ -1,6 +1,17 @@
|
|||
<?php
|
||||
ob_start();
|
||||
?>
|
||||
<div id="headerJumbotron" class="jumbotron text-center d-flex">
|
||||
<div id="headerTitleContainer">
|
||||
<h1 id="headerTitle">Proximo</h1>
|
||||
<h2 id="headerSubTitle">La supérette de l'INSA</h2>
|
||||
</div>
|
||||
</div>
|
||||
<?php
|
||||
$header = ob_get_clean();
|
||||
ob_start();
|
||||
?>
|
||||
|
||||
<div class="container">
|
||||
<h1 class="text-center">Coucou</h1>
|
||||
<p class="text-center">Ceci est du texte</p>
|
||||
|
|
@ -9,9 +20,6 @@ ob_start();
|
|||
<?php
|
||||
$pageContent = ob_get_clean();
|
||||
$pageTitle = "Accueil";
|
||||
$title = "Proximo";
|
||||
$subTitle = "La supérette de l'INSA !";
|
||||
$relativePath = "";
|
||||
|
||||
include($relativePath . "includes/template.php");
|
||||
?>
|
||||
|
|
|
|||
Loading…
Reference in a new issue