[Résolu]Affichage "en stock" ou "en cours de réappro" sur la page produit Presta 1.6.1.17

[Grouik]

Bonjour,

Je tourne en rond, j'en peux plus.

Je souhaite simplement afficher un label vert "en stock" quand le stock d'un article est >0 est un label orange "En cours de réappro" quand le stock est <= 0.
Je maitrise un peu le css et les traductions de Prestashop pour modifier les textes, mais je transpire sur le PHP.

Voici le code qui concerne le stock dans mon product.tpl :

{if ($display_qties == 1 && !$PS_CATALOG_MODE && $PS_STOCK_MANAGEMENT && $product->available_for_order)}
                <!-- number of item in stock -->
                <p id="pQuantityAvailable"{if $product->quantity <= 0} style="display: none;"{/if}>
                    <span id="quantityAvailable">{$product->quantity|intval}</span>
                    <span {if $product->quantity > 1} style="display: none;"{/if} id="quantityAvailableTxt">{l s='Item'}</span>
                    <span {if $product->quantity == 1} style="display: none;"{/if} id="quantityAvailableTxtMultiple">{l s='Items'}</span>
                </p>
            {/if}
            <!-- availability or doesntExist -->
                        
                <p id="availability_statut"{if !$PS_STOCK_MANAGEMENT || ($product->quantity <= 0 && !$product->available_later && $allow_oosp) || ($product->quantity > 0 && !$product->available_now) || !$product->available_for_order || $PS_CATALOG_MODE} style="display: none;"{/if}>
                {*<span id="availability_label">{l s='Availability:'}</span>*}
                
                <span id="availability_value" class="label{if $product->quantity <= 0 && !$allow_oosp} label-danger{elseif $product->quantity <= 0} label-warning{else} label-success{/if}">{if $product->quantity <= 0}{if $PS_STOCK_MANAGEMENT && $allow_oosp}{$product->available_later}{else}{l s='This product is no longer in stock'}{/if}{elseif $PS_STOCK_MANAGEMENT}{$product->available_now}{/if}</span>
            </p>
            {if $PS_STOCK_MANAGEMENT}
                {if !$product->is_virtual}{hook h="displayProductDeliveryTime" product=$product}{/if}
                <p class="warning_inline" id="last_quantities"{if ($product->quantity > $last_qties || $product->quantity <= 0) || $allow_oosp || !$product->available_for_order || $PS_CATALOG_MODE} style="display: none"{/if} >{l s='Warning: Last items in stock!'} </p>
            {/if}
            <p id="availability_date"{if ($product->quantity > 0) || !$product->available_for_order || $PS_CATALOG_MODE || !isset($product->available_date) || $product->available_date < $smarty.now|date_format:'%Y-%m-%d'} style="display: none;"{/if}>
                <span id="availability_date_label">{l s='Availability date:'}</span>
                <span id="availability_date_value">{if Validate::isDate($product->available_date)}{dateFormat date=$product->available_date full=false}{/if}</span>
            </p>
            <!-- Out of stock hook -->
            <div id="oosHook"{if $product->quantity > 0} style="display: none;"{/if}>
                {$HOOK_PRODUCT_OOS}
            </div>
            {if isset($HOOK_EXTRA_RIGHT) && $HOOK_EXTRA_RIGHT}{$HOOK_EXTRA_RIGHT}{/if}
            {if !$content_only}
                <!-- usefull links-->
                <ul id="usefull_link_block" class="clearfix no-print">
                    {if $HOOK_EXTRA_LEFT}{$HOOK_EXTRA_LEFT}{/if}
                    <li class="print">
                        <a href="javascript:print();">
                            {l s='Print'}
                        </a>
                    </li>
                </ul>
            {/if}

Ma version de Prestashop est la 1.6.1.17, il s'agit du thème par défaut à peine retouché.
Je vous remercie d'avance de l'aide que l'on pourra m'apporter.

Bonne journée,
 

Edited June 17, 2021 by Grouik (see edit history)

[Eolia]

y a pas de php ici, c'est un tpl.

Le code qui vous concerne se trouve ici

 <span id="availability_value" class="label{if $product->quantity <= 0 && !$allow_oosp} label-danger{elseif $product->quantity <= 0} label-warning{else} label-success{/if}">{if $product->quantity <= 0}{if $PS_STOCK_MANAGEMENT && $allow_oosp}{$product->available_later}{else}{l s='This product is no longer in stock'}{/if}{elseif $PS_STOCK_MANAGEMENT}{$product->available_now}{/if}</span>

Vous avez donc déjà 3 classes possibles suivant la quantité:

label-danger si inférieur à 0 et interdit à la vente hors-stock

label-warning si inférieur à 0 mais commandable

et label-success si dispo

Vous avez pour chacune un message:

- {l s='This product is no longer in stock'} "produit plus en stock"

- {$product->available_later} "produit disponible plus tard"

- {$product->available_now} "Produit disponible"

remplacez-les par vos images

<img src="chemin_de_l_image" /> et adaptez votre css pour leurs tailles

.product .label-danger img { witdth: .....; height:....; etc....}

.product .label-warning img { witdth: .....; height:....; etc....}

.product .label-success img { witdth: .....; height:....; etc....}

 

[Grouik]

Bonjour Eolia,

Merci, votre réponse est juste parfaite. En plus de résoudre mon problème, je comprends mieux certaines choses.
Vous m'aviez déjà dépanné il y a quelques années !
Je vous souhaite une excellente journée,

Jeff

 

[zoomzoom]

salut et merci pour cette info précieuse.

Dans le cas d'un template responsive comme bootstrap dans la V1.6.1+, dans la page categorie, on a les cartouches de chaque produit, le code et partiellement le même que dans le product.tpl pour la partie "availability". En mode responsive, si on redimensionne l'écran pour galaxy ou iphone, l'information de dispo stock dans le cartouche bascule en dessous du bouton "acheter". Mais comment faire pour préserver un espace fixe, ou une hauteur de ligne fixe entre le bouton "acheter" et l'information de product label? selon la config d'écran et le nombre de caractères de l'information; le product label passe par dessus le bouton "acheter", les deux info se superposent, sachant que le "label" n'est pas une image mais juste une couleur de fond de cellule. Donc pour info l'astuce est la suivante, mettre en commentaire la partie position absolute dans le feuille de style global css de votre template et conserver le reste :

ul.product_list li.ajax_block_product .availability_statut {
    /* position: absolute;
    bottom: 10px;*/
    margin: 0 12px 15px;
}

ça fonctionne et j'ai rajouté un saut de ligne </br> dans le product-sort.tpl et dans la feuille CSS. merci à pierre qui m'a aidé et se reconnaitra sûrement.

Edited October 13, 2021 by zoomzoom (see edit history)