Galerie

Gestion de stock

Un modèle de données Produit, un tableau et un formulaire modal pour suivre un stock.

Télécharger l'exempleFichier .zip depuis la dernière release GitHub.

Type : BERKIOS Code · Niveau : intermédiaire · Fichiers : stock.fr.bk, stock.fr.berkios.json

Ce que vous allez apprendre

Décrire la forme des données avec un modèle.
Lier un tableau à ce modèle.
Ouvrir une fenêtre modale pour saisir un nouveau produit, avec validation.

Avant de commencer

Avoir fait Ma première application.

Étape 1 : récupérer l'exemple

Téléchargez et décompressez. Le fichier stock.fr.bk est la source ; stock.fr.berkios.json est le même projet, déjà compilé pour le Studio.

Étape 2 : le code

langue français

application "Gestion de stock"
  version 1.0
  auteur "BERKIOS"
  description "Suivi simple des produits"
  type interface
  plateformes windows, macos, linux, android
  édition pro

modèle Produit
  sku : texte, unique, obligatoire
  nom : texte, obligatoire
  quantité : nombre entier, minimum 0
  prix : montant

interface Accueil
  titre "Produits en stock"
  taille 1280 sur 720
  fond #f8fafc

  panneau en-tête
    disposition ligne
    étiquette titre "Produits en stock"
      taille du texte 26
      gras
    bouton ajouter "Ajouter un produit"
      quand on clique : ouvrir Formulaire produit

  tableau liste
    source : Produit
    colonnes : sku, nom, quantité, prix

interface Formulaire produit
  affichage modale
  titre "Nouveau produit"

  champ sku "Référence"
    obligatoire
  champ nom "Nom du produit"
    obligatoire
  champ quantité "Quantité"
    format nombre
    minimum 0
  bouton enregistrer "Enregistrer"
    quand on clique : envoyer le formulaire
  bouton annuler "Annuler"
    quand on clique : fermer

Étape 3 : vérifier et voir

berkios valider stock.fr.bk
berkios apercu stock.fr.bk

Dans l'aperçu :

Cliquez sur Ajouter un produit : la fenêtre modale s'ouvre.
Essayez d'enregistrer sans rien remplir : la référence et le nom sont obligatoires.
Saisissez une référence, un nom et une quantité, puis Enregistrer : le produit apparaît dans le tableau.
Ajoutez un second produit avec la même référence : elle est refusée, car sku est unique.
Essayez une quantité négative : refusée (minimum 0).

Étape 4 : l'ouvrir dans le Studio

Dans le Studio : Fichier → Importer, puis stock.fr.berkios.json. Vous retrouvez les deux interfaces, le tableau et le formulaire, que vous pouvez modifier à la souris.

Le code expliqué

Partie	Rôle
`modèle Produit`	Décrit une fiche produit : ses champs, leur type et leurs règles.
`sku : texte, unique, obligatoire`	Texte obligatoire, sans doublon.
`quantité : nombre entier, minimum 0`	Entier qui ne peut pas être négatif.
`prix : montant`	Un montant d'argent.
`panneau en-tête` + `disposition ligne`	Un conteneur qui aligne ses éléments sur une ligne.
`tableau liste` / `source : Produit`	Un tableau alimenté par le modèle ; `colonnes` choisit ce qu'on affiche.
`interface Formulaire produit` + `affichage modale`	Un second écran, affiché comme une fenêtre par-dessus le premier.
`ouvrir Formulaire produit`	Action du bouton Ajouter : ouvre cette fenêtre.
`envoyer le formulaire`	Valide la saisie selon le modèle, puis l'ajoute au tableau.
`fermer`	Ferme la fenêtre.

À savoir

Dans l'aperçu du navigateur, les données restent dans le navigateur et ne sont pas enregistrées dans une base de données. Voir Interfaces et modèles de données pour les limites.

À vous de jouer

Ajoutez un champ fournisseur : texte au modèle, puis la colonne correspondante dans le tableau et un champ dans le formulaire. Relancez berkios valider.

Pour aller plus loin

Exemple suivant : Gestion des clients (la même idée, dessinée à la souris dans le Studio)
Actions SQLite pour enregistrer vraiment les données

Cette page en Markdown · llms.txt · documentation complète pour les IA