Opencart - Динамическая Цена Товара

Тема в разделе "Модули и дополнения", создана пользователем admin, 6 ноя 2016.

  1. TopicStarter Overlay
    Offline

    admin Команда форума Администратор

    Сообщения:
    2.041
    Симпатии:
    51.318
    Репутация:
    148
    Что это?
    Очень часто, меня просят сделать динамическую цену на товар. Это означает, что когда пользователь выбирает те или иные опции к товару, его цена должна динамично изменяться, т.е. сразу. Например, мы выбираем опцию «Подсветка (+1500 руб)» и цена товара изменяется (стрелка 2).
    dynamics_price_example.jpg


    «OpenCart из коробки» это сделать не позволяет, новую цена товару (с учетом выбранных опций) вы увидите только в корзине. В интернете существует огромное количество платных и бесплатных модулей позволяющий сделать данный функционал.

    Если вам нужна динамическая цена,
    • вам придется искать модули под вашу версию OpenCart
    • скорее, всего устанавливать vQmod , т.к. в последнее время модули его требуют
    • разбираться с настройками модуля.
    А зачем? Если это можно сделать с помощью нескольких строчек кода на jQuery. Когда ваш проект «не горит», рекомендую работать «чистым лезвием», а не раздувать систему устанавливая модули на каждую мелочь.

    Как это сделать?

    Откроем шаблон представления «catalog\view\theme\default\template\product\product.tpl«, отвечающий за страницу с описанием товара.

    Далее, найдите тег выводящий стоимость товара и пометьте его id=span.price-now, если вы используете в OpenCart акции и выводите стоимость до акции отдельным тегом, то пометьте его id=span.price-old (как в моем случаем). Таким образом, при выборе той или иной опции будет изменяться стоимость с акцией и без.

    Если мы используем опции типа radio, select или image, т.е. те опции, где выбор осуществляется по принципу «выбирается один из множества».

    То поступаем следующим образом, отыскиваем в коде следующий IF

    Код:
    <?phpif($option['type']=='radio'){?>
    ...
    ...
    <?php}?>
    P.S. если вам нужен select или image, делайте все по аналогии, только вместо if с $option[‘type’] == ‘radio’ищите if с $option[‘type’] == ‘selectили c ‘image’.

    В нем находим тэг input

    Код:
    <input type="radio"... />
    Добавляем в тэг input новый атрибут price.

    Код:
    <input price="<?phpecho$option_value['price'];?>"type="radio"... />
    P.S. многоточием я пометил все то, что идет после атрибута radio, удалять это не надо.

    И самое главное, добавляем к тэгу input обработчик события OnClick, должно получится так:

    Код:
    <input price="<?phpecho$option_value['price'];?>"type="radio"...
    
    onclick="
    //-----меняем цену товара в зависимости от цены выбранной опции------
    
      length_trash=4;//длина отрезаемого куска"руб."
    
      if(typeof(price_select_old)=='undefined'){
      price_select_old=0;//если переменная не объявлена, объявим её, переменная нужна для фиксации цены выбранной опции,что-бы было можно"откатиться назад"при выборе другой опции
      }     
    
      //узнаем текущую цену
      price_current_old=$('#span.price-old').text();
      price_current_now=$('#span.price-new').text();
      price_current_old=price_current_old.substring(0,price_current_old.length-length_trash);
      price_current_now=price_current_now.substring(0,price_current_now.length-length_trash);
      //конец узнаем текущую цену
    
      //узнаем цену выбранной опции
      price_select=$(this).attr('price');
      price_select=price_select.substring(0,price_select.length-length_trash);
      //конец узнаем цену выбранной опции
    
      //меняем цену на товар
      $('#span.price-new').text(parseFloat(price_current_now)-parseFloat(price_select_old)+parseFloat(price_select)+' руб.');
      $('#span.price-old').text(parseFloat(price_current_old)-parseFloat(price_select_old)+parseFloat(price_select)+' руб.');
      price_select_old=parseFloat(price_select);//фиксируем стоимость выбранной опции, т.к. при след. выборе опции ее нужно отнять,что-бы вернуть прежнюю цену товара
      //конец меняем цену на товар
    
      //-------конец меняем цену товара в зависимости от выбранной опции----------
      "
    />
    Вот и все, теперь данная опция при выборе будет динамично изменять стоимость товара на странице.

    Для опций типа checkbox, все также, находим input, добавляем также атрибут price, но обработчик события OnClik будет немного другой:

    Код:
    <input price="<?phpecho$option_value['price'];?>"type="checkbox"...
    
      onclick="     
    //----- меняем цену товара в зависимости от цены выбранной опции ------
    
      length_trash=4; //длина отрезаемого куска "руб."
    
      //узнаем текущую цену
      price_current_old=$('#span.price-old').text();
      price_current_now=$('#span.price-new').text();     
      price_current_old=price_current_old.substring(0,price_current_old.length-length_trash);
      price_current_now=price_current_now.substring(0,price_current_now.length-length_trash);   
      //конец узнаем текущую цену
    
      //узнаем цену выбранного габарита
      price_select=$(this).attr('price');
      price_select=price_select.substring(0,price_select.length-length_trash);
      //конец узнаем цену выбранного габарита
    
      //меняем цену на товар
      if ($(this).prop('checked')) {
    $('#span.price-new').text(parseFloat(price_current_now)+parseFloat(price_select)+' руб.');
    $('#span.price-old').text(parseFloat(price_current_old)+parseFloat(price_select)+' руб.');
      } else {
    $('#span.price-new').text(parseFloat(price_current_now)-parseFloat(price_select)+' руб.');
    $('#span.price-old').text(parseFloat(price_current_old)-parseFloat(price_select)+' руб.');
      };
      //конец меняем цену на товар
    
      //----- конец меняем цену товара в зависимости от цены выбранной опции ------         
    "
    />
    Единственное, что вам может понадобиться регулировать, так это параметр

    Код:
    length_trash=4;//длина отрезаемого куска"руб."
    Он отвечает, за длину которую нужно отрезать от стоимости товара, что-бы получить значение-цифру в чистом виду. Значение «4» подходит для рублевой валюты — «руб.«, для любой другой вы можете настроить сами.

    Если будут проблемы, пишите в комментариях, я обязательно отвечу.