Cistell

Inicialització de la sessió i connexió a la BD

Sempre que es treballa amb sessions, el primer que hem de fer és iniciar-la abans d'escriure el codi HTML

session_start();

A partir d'aquí, l'element principal d'aquesta aplicació és el cistell, el qual està present a la sessió i requerit per la majoria de codis. Per això, hem de comprovar que estigui creat, i en cas que no ho estigui, que es creï.

// Inicialitzar cistell
if (!isset($_SESSION['cistell'])) {

   $_SESSION['cistell'] = array();

}

A més d'incloure la connexió a la BD i requerir el fitxer funcions.php, on es troba la funció calcularPreus

require_once "funcions.php";
require_once "./connexioBD/connexioR.php";

Per últim, sempre inicialitzarem una variable que indicarà el total de compra. La inicialitzem aquí perquè s’utilitza dins d’un bucle i no hi ha cap altre lloc per declarar-la. Com que és un bucle, si la declaréssim dins, el valor del total es reiniciaria a 0 a cada iteració, i volem que el total s’acumuli al llarg de totes les iteracions

$total = 0; // Inicialitzem la variable del preu total

Mostra de missatges d'error o èxit

Quan s'afageix, es retira o s'elimina un producte del cistell des del propi cistell, el procés el realitza el codi processa.php, que depenent del resultat de l'operació, ens pot enviar un missatge d'èxit o d'error mitjançant la sessió

// Si processa.php realitza correctament l'operació, catàleg.php veuria el següent:
$_SESSION['missatge_ok'] = "S'ha retirat 1 unitat(s) de Teclat mecànic del cistell.";

// Si processa.php no realitza correctament l'operació, catàleg.php veuria el següent:
$_SESSION['missatge_error'] = "X" // Depenent de l'error es mostrarà un missatge o un altre 

Per tant, dins del cistell hem de comprovar si hem rebut aquest missatge (ja sigui el d'error o èxit), i en cas afirmatiu, mostrar-lo

<!-- Missatge de confirmació d'accions -->

           <center>
           <?php if (isset($_SESSION['missatge_ok'])): // Quan s'enviï un missatge de confirmació?>
               <p style="color: green; font-weight: bold;">
                   <?php
                       echo htmlspecialchars($_SESSION['missatge_ok']); // Mostrem el missatge
                       unset($_SESSION['missatge_ok']); // Eliminem el missatge, així al recarregar la pàgina no tornarà a sortir, únicament mostrant-se un sol cop
                   ?>
               </p>
           <?php endif; ?>
           </center>

           <!-- Missatge d'error -->
           <center>
           <?php if (isset($_SESSION['missatge_error'])): // Quan s'enviï un missatge d'error?>
               <p style="color: red; font-weight: bold;">
                   <?php
                       echo htmlspecialchars($_SESSION['missatge_error']); // Mostrem el missatge
                       unset($_SESSION['missatge_error']); // Eliminem el missatge, així al recarregar la pàgina no tornarà a sortir, únicament mostrant-se un sol cop
                   ?>
               </p>
           <?php endif; ?>
           </center>

Un exemple d'un missatge seria el següent:

Mostra de productes

La mostra de productes és bàsicament una taula amb les següents columnes:

• Imatge
• Nom del producte
• Preu unitari
• Quantitat
• Subtotal
• Accions

Mitjançant un foreach, per cada producte es crearà una fila on es definiràn els aspectes abans comentats, a més de realitzar un càlcul de preu i descompte

Càlcul de totals, subtotals i descomptes

Primerament, calcularem el subtotal de cada producte mitjançant la funció calcularPreus, la qual ens retorna:

• Preu original (Quantitat * Preu unitari)
• Preu descomptat, si és el cas
• % descomptat

$preusProducte = calcularPreus($prod['preu'], $prod['quantitat']); // Calculem el seu preu segons la quantitat i els possibles descomptes (també retorna el preu sense descopmpte)

Seguidament, afagarem el preu descomptat (ja que si no hi ha cap descompte, té el mateix valor que el preu original) i el sumem a la variable $total declarada a l'inici del codi, que indica el total de la compra

$total += $preusProducte['total_final']; //Sumem el preu final del producte al total de la compra

Gestió de l'stock

Més endavant veurem com s'implementa una funcionalitat que permet afegir més untiats d'un producte des del propi cistell. Això significa que hem de fer el mateix que al catàleg i mantenir un control de l'stock per evitar poder afegir més unitats al cistell de les que realment hi ha.

Per això, farem una consulta SQL per recuperar l'stock de la BD del producte

// Obtenim el seu stock
$stmt = $pdo->prepare("SELECT estoc FROM productes WHERE id = :id");
$stmt->bindParam(":id", $id);
$stmt->execute();
$stockBD = (int)$stmt->fetchColumn();

Per a continuació, definir el nombre màxim d'unitats que es poden afegir al cistell restant a l'stock de la BD les unitats del cistell

$maxAfegir = $stockBD - $prod['quantitat']; // Stock real (BD - Cistell)
if ($maxAfegir < 0) {

       $maxAfegir = 0;

}

Mostra de característiques bàsiques del producte

A continuació, començarem a imprimir files HTML i inserint els valors del producte. Aquests valors s'agafan directament del cistell (es pot consultar l'Exemple de model de dades de l'array $SESSION[cistell] amb productes per entendre el model de dades del cistell).

<!-- Mostrem tots els detalls dels productes -->
                        <tr> <!-- Una fila per cada producte --> 
                            <!-- Imatge -->
                            <td><img src="imatges/<?php echo htmlspecialchars($prod['imatge']); ?>" width="80"></td>
                            <!-- Nom -->
                            <td><?php echo htmlspecialchars($prod['nom']); ?></td>
                            <!-- Preu -->
                            <td><?php echo number_format($prod['preu'],2); ?> €</td>
                            <!-- Quantitat -->
                            <td><?php echo $prod['quantitat']; ?></td>

Mostra del preu

La següent cel·la és el subtotal del producte. En aquesta cel·la es poden donar dues casuístiques:

1. Que al producte se li hagi aplicat un descompte
2. Que no s'hagi aplicat cap descompte

En cas de que s'apliqui el descompte, mostrarem el preu original tatxat i al costat el preu descomptat més el % descomptat. En cas que no hi hagi descompte únicament es mostrarà el preu original.

És per això que hem de comprovar, del retornat per la funcio calcularPreus, el "descompte_percent" i verificar si és major a 0 (i per tant hi ha descompte). En cas afirmatiu, es mostrarà l'anteriorment comentat

<?php if($preusProducte['descompte_percent'] > 0): ?> <!-- Si el percentatge de descompte és major a 0 (s'aplica un descompte) -->
                                    <span style="text-decoration: line-through;"><?php echo number_format($preusProducte['total_original'],2); ?> €</span> <!-- Mostrem el total original sense descompte tatxat -->
                                    →<!-- És el símbol "→" --> <?php echo number_format($preusProducte['total_final'],2); ?> € <!-- Imprimim "→" i el preu amb el descompte aplicat -->
                                    (<?php echo $preusProducte['descompte_percent']; ?>% desc.) <!-- Mostrem el % de descompte aplicat -->

Que es veuria de la següent manera

En cas que no hi hagi descompte, únicament s'imprimirà el preu original.

<?php else: ?>
<?php echo number_format($preusProducte['total_original'],2); ?> € <!-- En cas que no tingui descompte, únicament mostrem el total original (sense cap descompte calculat)-->
<?php endif; ?>

Que es veuria de la següent forma

Botons d'acció

Retirar productes

En el cistell donem la possibilitat de retirar una quantitat de productes. L'operació la realitza el codi processa.php, i mitjançant l'acció del formulari, definim el valor "retirar" a la variable "accio". Com a part del formulari enviem la ID del producte i la quantitat a retirar.

<!-- Retirar productes -->
<form action="processa.php?accio=retirar" method="post">
    <input type="hidden" name="id" value="<?php echo $id; ?>">
    <input 
        type="number"
        name="quantitat"
        value="1"
        min="1"
        max="<?php echo $prod['quantitat']; ?>"
    >
    <input type="submit" value="Retira">
</form>

Eliminar un producte del cistell

En el cistell donem la possibilitat d'eliminar per complet un producte. L'operació la realitza el codi processa.php, i mitjançant l'acció del formulari, definim el valor "eliminar" a la variable "accio". Com a part del formulari enviem la ID del producte a eliminar.

<!-- Eliminar un producte del cistell -->
<br>
<form action="processa.php?accio=eliminar" method="post">
    <input type="hidden" name="id" value="<?php echo $id; ?>">
    <input type="submit" value="Eliminar producte">
</form>

Visualització dels botons d'acció

Aquesta seria la visualització dels tres botons d'acció