aqlrc

Installation

1. Add aqlrc to your package.json

2. Install package with yarn install

3. In your code, add "import NomDuComposant from 'aqlrc';" to use it

4. Use imported classes to use them as parent class, you can override functions etc...

5. Enjoy !

Pour compiler

1. Lancez "$ npm run build"

2. Ensuite, lors de la première utilisation, lancez "$ yarn link", ceci va ajouter le module aqlrc à la librairie de package locale sous le nom qui figure dans le package.json (en l'occurence ici aqlrc)

3. Ensuite, rendez vous à la racine d'Aquila et lancez "$ yarn link aqlrc", ceci permet d'installer le package aqlrc de votre bibliothèque locale, et donc fera reference à votre repo, si vous le rebuildez, les modifications seront appliquées

4. Enjoy !

Composants for React

• <_NSconfig /> : Export des composants disponibles dans les blocs CMS

• <NSAccordion /> : Affiche des blocs en accordéon

• <NSAddressMultiple /> : Gère les adresses

• <NSBlogArticles /> : Affiche la liste des articles du blog

• <NSBreadcrumb /> : Affiche un fil d'ariane basé sur l'URL

• <NSBundleProduct /> : Affiche la composition d'un produit bundle

• <NSButtonLoginAccount /> : Affiche l'icône du compte client

• <NSCartPaymentStep /> : TODO Explication

• <NSCartProductCounter /> : Affiche l'icône du panier avec le nombre de produits qu'il contient

• <NSCartResume /> : Affiche le bloc résumé du panier

• <NSCodePromo /> : Affiche le bloc pour entrer un code promo dans le panier

• <NSContact /> : Affiche le bouton pour valider le formulaire de contact et gère le traitement qui avec

  • Props:
    • button-title: Label du bouton submit
    • captchaKey: clé du captcha (requit si l'on veut utiliser le captcha)
    • mode: mode d'utilisation des données (default: 'send', alowed value: 'send', 'store', 'store&send')
  • Remplissage auto de certain champ :
    • Pour le nom, mettre id="contact_firstname"
    • Pour le prénom, mettre id="contact_lastname"
    • Pour l'email, insérer simplement un input type="email"

• <NSContext /> : Crée le contexte React

• <NSCookieBanner /> : Affiche la barre d'acceptation des cookies

• <NSCrossSelling /> : TODO Explication

• <NSDrawStars /> : Affiche 5 étoiles pour les avis

• <NSFilters /> : Affiche le bloc des filtres dans une page catégorie ou de recherche

• <NSGallery /> : Affiche une gallerie d'image / vidéo YouTube

• <NSGoToTopButton /> : Affiche un bouton pour scroller en haut de la page

• <NSInterObserver /> : Met en place un observer sur un bloc, permet de déclencher l'affichage seulement lorsqu'il est visible à l'écran

  • props:
    • threshold : Nombre entre 0 et 1 indiquant le pourcentage qui doit être visible avant le déclenchement
    • triggerOnce : booléen permettant de déclencher l'observer qu'une seule fois

• <NSLanguageChange /> : Affiche le bloc des langues

• <NSLogin /> : Formulaire de connexion

• <NSMegaMenu /> : Affiche le bloc du menu correspondant au code passé en prop (ns-code)

• <NSMenu /> : Affiche le bloc du menu correspondant au code passé en prop (ns-code)

• <NSNewsletter /> : TODO Explication

• <NSProductCard /> : Affiche une vignette produit

• <NSProductCardList /> : Affiche une liste de vignettes produit

• <NSProductStock /> : Affichage du label de stock pour un produit et la disponibilité

• <NSSearchBar /> : Affichage du champ de recherche

• <NSSidebarAccount /> : Affiche le bloc du menu compte client

• <NSSlider /> : Charge les informations du slider (via son ns-code), affiche les image en permettant un slide lattéral

• : Affiche les toasts

  • Insérez la balise dans votre application
  • Pour afficher un toast :
    • NSToast.error([message]) : erreur
    • NSToast.warn([message]) : avertissement
    • NSToast.success([message]) : succès

• <NSPageAccount /> : Page de type compte utilisateur

• <NSPageAccountOrders /> : Page des commandes utilisateurs

• <NSPageBlogArticle /> : Page blog

• <NSPageCart /> : Page panier

• <NSPageCategory /> : Page catégorie

• <NSPageProduct /> : Page produit

• <NSPageSearch /> : Page recherche

• <NSPageStatic /> : Page statique

Fonctions

Une grande partie des routes API d'Aquila sont liées à des fonctions. Voici une liste de chacune d'entre elles.

Route de type "cart"

• getCart(cartId, lang, PostBody = {}, ctx = undefined) : Récupère un panier

  • cartId : ID du panier
  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• getShipmentsCart(cart, withCountry = null, lang, PostBody = {}, ctx = undefined) : Récupère les modes de frais de port dans le panier

  • cart : l'objet panier
  • withCountry : le code du pays
  • lang : langue
  • ctx : contexte Next (requête côté serveur)

• getPayementMethodsCart(lang, PostBody, ctx = undefined) : Récupère les modes de paiement dans le panier

  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• addToCart(cartId, product, qty, selections = undefined, ctx = undefined) : Ajoute un produit au panier

  • product : Objet produit
  • qty : quantité du produit à ajouter dans le panier
  • selections :
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• addToCartKdo(product, qty, parent = undefined, ctx = undefined) : Ajoute un produit cadeau au panier

  • product : Objet produit
  • qty : quantité du produit à ajouter dans le panier
  • ctx : contexte Next (requête côté serveur)

• deleteItemCart(cartId, itemId, ctx = undefined) : Supprime un produit au panier

  • cartId : ID du panier
  • itemId : ID du produit dans le panier
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• updateQtyItemCart(cartId, itemId, quantity, ctx = undefined) : Modifie la quantité d'un produit au panier

  • cartId : ID du panier
  • itemId : ID du produit dans le panier
  • quantity : quantité à appliquer au produit dans le panier
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• addDiscountCart(cartId, code, ctx = undefined) : Ajoute un code promo au panier

  • cartId : ID du panier
  • code : code promo
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• deleteDiscountCart(cartId, ctx = undefined) : Supprime un code promo du panier

  • cartId : ID du panier
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• updateAddressesCart(cartId, addresses, ctx = undefined) : Modifie les adresses du panier

  • cartId : ID du panier
  • addresses : objet contenant les adresses de facturation et de livraison
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• getEstimatedShipmentFeeCart(cartId, shipmentId, countryCode, ctx = undefined) : Récupère l'estimation des frais de port d'un mode de livraison ainsi que les infos de ce dernier du panier

  • cartId : ID du panier
  • shipmentId : ID du mode livraison
  • countryCode : code du pays
  • ctx : contexte Next (requête côté serveur)

• updateDeliveryCart(cartId, shipment, isoCountryCode, lang, ctx = undefined) : Modifie le mode de livraison du panier

  • cartId : ID du panier
  • shipment : objet contenant le mode de livraison sélectionné
  • isoCountryCode : code du pays
  • lang : langue
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le panier à jour

• cartToOrder(cartId, lang, ctx = undefined) : Transforme un panier en commande

  • cartId : ID du panier
  • lang : langue
  • ctx : contexte Next (requête côté serveur)
  • => Retourne la commande créée

Route de type "gallery"

• getItemsGallery(code, ctx = undefined) : Récupère les items d'une gallerie en fonction du code
  • code : code de la gallerie
  • ctx : contexte Next (requête côté serveur)

Route de type "order"

• getOrder(lang, PostBody = {}, ctx = undefined) : Récupère la (les) commande(s) d'un utilisateur

  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• getOrderById(orderId, lang, PostBody = {}, ctx = undefined) : Récupère une commande en fonction de l'ID

  • orderId : ID de la commande
  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• deferredPaymentOrder(orderNumber, paymentMethod, lang, ctx = undefined) : Paye une commande en différé

  • orderNumber : numéro de commande
  • lang : langue
  • paymentMethod : code du mode de paiement
  • ctx : contexte Next (requête côté serveur)

• immediatePaymentOrder(orderNumber, paymentMethod, ctx = undefined) : Paye une commande immédiatement

  • orderNumber : numéro de commande
  • paymentMethod : mode de paiement
  • ctx : contexte Next (requête côté serveur)

• askCancelOrder(OrderId, ctx = undefined) : Envoi une demande d'annulation de commande

  • orderId : ID de commande
  • ctx : contexte Next (requête côté serveur)

• downloadbillOrder(billId, ctx = undefined) : Télécharge la facture d'une commande

  • billId : ID de la facture
  • ctx : contexte Next (requête côté serveur)
  • => Retourne le fichier en blob

Route de type "product"

• getProduct(lang, countviews, withFilters, PostBody = {}, ctx = undefined, params = undefined) : Récupère le(s) produit(s) en fonction du PostBody

  • lang : langue
  • countviews : booléen pour activer ou non les statistiques de vue sur le produit
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• getProductByCategory(categoryId, lang, PostBody = {}, ctx = undefined) : Récupère le(s) produit(s) d'une catégorie

  • categoryId : ID de catégorie
  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• downloadFreeVitualProduct(productId, ctx = undefined) : Télécharge un produit virtuel gratuit depuis la catégorie ou la page produit

  • productId : ID produit
  • ctx : contexte Next (requête côté serveur)
  • Retourne le fichier en blob

• downloadVitualProduct(itemId, ctx = undefined) : Télécharge un produit virtuel payant depuis la liste des commandes de l'utilisateur

  • itemId : ID produit dans la commande
  • ctx : contexte Next (requête côté serveur)
  • Retourne le fichier en blob

• storeCommentProduct(productId, review, title, rate, lang, questions, ctx = undefined) : Enregistre un avis sur un produit

  • productId : ID produit
  • review : commentaire
  • title : titre
  • rate : note
  • lang : langue
  • questions : questions
  • ctx : contexte Next (requête côté serveur)

Route de type "territory"

• getTerritories(lang, PostBody = {}, ctx = undefined) : Récupère les territoires

  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• getTerritory(lang, PostBody = {}, ctx = undefined) : Récupère un territoire

  • lang : langue
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

Route de type "user"

• getUser(userId, PostBody = {}, ctx = undefined) : Récupère un utilisateur

  • userId : ID de l'utilisateur
  • PostBody : paramètres de la requête
  • ctx : contexte Next (requête côté serveur)

• getNewsletterUser(email, ctx = undefined) : Récupère le(s) newsletter(s) correspdante(s) à d'un utilisateur

  • email : email utilisateur
  • ctx : contexte Next (requête côté serveur)

• createOrUpdateUser(user, ctx = undefined) : Crée / modifie un compte utilisateur

  • user : Objet user
  • ctx : contexte Next (requête côté serveur)

• anonymizeUser(userId, ctx = undefined) : Anonymise un compte utilisateur

  • userId : ID utilisateur
  • ctx : contexte Next (requête côté serveur)

• deleteUser(userId, ctx = undefined) : Supprime un compte utilisateur

  • userId : ID utilisateur
  • ctx : contexte Next (requête côté serveur)

• updateNewsletterUser(email, name, optin, ctx = undefined) : Modifie l'abonnement à la newsletter de utilisateur

  • email : email utilisateur
  • name : nom de la newsletter
  • optin : booléen acception de la newsletter
  • ctx : contexte Next (requête côté serveur)

• updateAddressUser(userId, billingAddress, deliveryAddress, addresses, ctx = undefined) : Ajoute une adresse à utilisateur

  • userId : Id de l'utilisateur
  • billingAddress : l'index de l'adresse de facturation
  • deliveryAddress : l'index de l'adresse de livraison
  • addresses : l'objet qui contient les adresses de l'utilisateur
  • ctx : contexte Next (requête côté serveur)
  • => Retourne l'utilisateur

• authUser(username, password, ctx = undefined) : Authentifie un utilisateur

  • username : identifiant
  • password : mot de passe
  • ctx : contexte Next (requête côté serveur)

• logoutUser(ctx = undefined) : Déconnecte un utilisateur

  • ctx : contexte Next (requête côté serveur)

• sendMailResetPasswordUser(email, lang, ctx = undefined) : Envoi un mail pour reset le mot de passe de l'utilisateur

  • email : email
  • ctx : contexte Next (requête côté serveur)

• resetPasswordUser(token, password = undefined, ctx = undefined) : Remet à zéro le mot de passe d'un utilisateur

  • token : token
  • password : mot de passe
  • ctx : contexte Next (requête côté serveur)