Obsługa prezentacji wagi netto oraz wagi brutto towaru dla wskazanej jednostki miary

W tym artykule dowiesz się jak zmodyfikować szablon, aby umożliwić przeliczanie i wyświetlanie wagi netto oraz wagi brutto towaru w zależności od wybranej jednostki.

Szafir

Na początku zmodyfikuj plik product/product-presentation-data.html. Należy znaleźć narzędziem wyszukiwania divy o klasie child-lq i dopisać atrybuty data z informacjami o wadze netto i brutto produktu w tagu otwierającym div (będą dwa takie divy). W pierwszym należy dopisać:

Cała linijka może wyglądać następująco:

W kolejnym divie należy dopisać

Cała linijka może wyglądać następująco:

Następnie w tym samym pliku należy wyszukać po frazie translations.Weight element listy, który zawiera informacje o wadze produktu ( znajdziesz trzy takie elementy ). Będą one wyglądać w ten sposób:

Ten kod należy usunąć a następnie dodać poniższy (w obu znalezionych miejscach).

W tym samym pliku trzeba wyszukać frazę data-unit-ratio-info=”{{unitRatioInfo}}”. Powinieneś znaleźć dwie linie w kodzie. W każdej z nich należy dodać jeszcze jeden atrybut data oraz klasę unit-ratio-lq:

Kolejnym krokiem będzie modyfikacja kodu w pliku js/init-ui1.js.

Narzędziem wyszukiwania wyszukaj function saveChildsProps() . W funkcji saveChildProps() znajdziesz zainicjowane zmienne, których wartości pobierane są z atrubutów data. Pod nimi możemy dodać zmienne dotyczące wag.

A następnie:

W tej samej funkcji znajdziesz obiekt child. Należy do jego pól dopisać wagi:

 Zaraz potem znajdziesz funkcję function loadChildsProps(). Pod linią:

należy dopisać poniższy kod:

Ostatnim krokiem będzie stworzenie funkcji przeliczającej wagi. W tym samym pliku należy wkleić poniższy kod (np. pod funkcją function changePrices(){ … }) :

Bursztyn i Opal

W powyższych szablonach należy najpierw zmodyfikować plik productdetails.html. W pierwszej kolejności wyszukaj sekcję (section) o klasie technical-info. Należy w niej dopisać atrybuty data, zawierające informacje o wagach produktu.

Cała linijka może wówczas wyglądać następująco:

Zaraz pod tym znajdziesz element listy zawierający informacje o wadze:

Ten fragment należy usunąć a wkleić poniższy zawierający informacje o wadze netto i brutto:

Teraz przejdź do pliku js/ details.js. W pierwszych liniach kodu znajdziesz zainicjowane zmienne. Należy do nich dopisać również:

Następnie wyszukaj frazę jednostka pomocnicza. Pod znalezionym komentarzem znajdziesz funkcję obsługującą zmianę elementu o id unitId. Pod linią zawierającą frazę prevPriceNode.data należy umieścić następujący kod:

W ostatnim kroku narzędziem wyszukiwania znajdź funkcję function SetProduct(s,stock). Po kilku linijkach, przed instrukcją warunkową if (stock) umieść następujący kod:

Należy także usunąć z kodu w tym samym pliku linijkę

Agat

W pliku partials/product/product-popup.html należy znaleźć input o id supplyId (pierwszy znaleziony) i wkleić atrybuty data:

Cała linijka może wyglądać następująco:

Następnie w tym samym pliku wyszukaj frazę {% if product.Units[1] -%} . Pod nią znajdziesz div o klasie input-group. Pod tagiem otwierającym div wklej następujący kod:

Przejdź do pliku product-page.html. Należy wyszukać w nim div o klasie product-attributes. Wewnątrz niego znajdziesz input o nazwie „translations”. Wklej do niego poniższy kod.

Cała linijka może wyglądać następująco:

Następnie, kilka linii poniżej w liście ul znajdź fragment:

Należy go usunąć.
Zamiast niego wklej poniższy fragment:

Teraz przejdź do pliku js/init.js.
Znajdziesz w nim warunek:

, a kilka linijek poniżej:

Pod tą linijką należy dopisać obsługę wagi netto, czyli fragment:

Kilkadziesiąt linii dalej znajdziesz warunek:

Pod kodem

doklej

W tym samym pliku znajdź funkcję changeValues: function(e) {. Wewnątrz instrukcji warunkowej:

pod koniec dopisz poniższy kod

Następnie wyszukaj komentarz reload product attributes i wklej poniższy kod pod zainicjowanymi zmiennymi

Na koniec należy usunąć z kodu w pliku poniższy fragment:

Topaz

Wskazówka
Poniższa instrukcja jest uniwersalna dla obu wariantów widoku szczegółów towaru w szablonie Topaz. Jeśli chcesz dodać obsługę wag w pierwszym wariancie, należy zmodyfikować pliki src/assets/elements/productDetails/product-details1/html.js oraz src/assets/elements/productDetails/product-details1/js.js. Natomiast jeżeli chcesz dodać obsługę wag w drugim wariancie, należy zmodyfikować plikisrc/assets/elements/productDetails/product-details2/html.js oraz src/assets/elements/productDetails/product-details2/js.js

Na początku zmodyfikuj plik src/assets/elements/productDetails/product-details(1 lub 2)/html.js. Wyszukaj input o id supplyId i wklej do niego atrybuty data:

Następnie około 35 linijek poniżej znajdziesz instrukcję warunkową

a pod nią div o klasie input-group. Będą się tam znajdować inputy o nazwie initial-…. Należy dopisać jeszcze dwa takie elementy widoczne poniżej:

Następnie wyszukaj div o klasie product-attributes. Tuż pod tagiem otwierającym znajdziesz input o nazwie translations. Należy dokleić do niego atrybut data:

Kilka linii poniżej znajdziesz tag otwierający listę ul a w niej kawałek kodu wyglądający tak jak poniżej

Tuż pod nim wklej poniższy kod:

Kolejnym krokiem jest modyfikacja pliku js.js (w tym samym katalogu).

Narzędziem wyszukiwania wyszukaj frazę spLast.Product.Weight. Pod linijką, która ją zawiera wklej poniższy kod:

Następnie wyszukaj frazę s.Product.Weight. Pod znalezioną linią wklej poniższy kod:

Podobnie wyszukaj frazę $('.quantity-field').trigger(’change');

Pod znalezioną linijką znajdziesz klamrę zamykającą } . Tuż pod nią wklej poniższy kod:

Wyszukaj frazę reload product attributes. Powinieneś znaleźć taki komentarz. Pod nim wklej poniższe linijki:

Około 50 linii dalej znajdziesz linię wyglądającą następująco:

Nad nią należy wkleić poniższy kod:

Dodatkowo będziesz musiał dodać tłumaczenia do panelu administracyjnego. W tym celu należy wejść w zakładkę Wygląd sklepu/ Ustawienia/ Tłumaczenia i kliknąć w przycisk Dodaj. Należy wpisać Id tłumaczenia oraz Tekst, który będzie się wyświetlał na stronie. Zmiany należy zatwierdzić przyciskiem Dodaj.

Lista tłumaczeń:
  • Id: NetWeight , Tekst: Waga netto

Czy ten artykuł był pomocny?