app/Plugin/ProductOption42/Resource/template/default/Product/option_js.twig line 1

Open in your IDE?
  1. {#
  2. * Plugin Name : ProductOption
  3. *
  4. * Copyright (C) BraTech Co., Ltd. All Rights Reserved.
  5. * http://www.bratech.co.jp/
  6. *
  7. * For the full copyright and license information, please view the LICENSE
  8. * file that was distributed with this source code.
  10. 修正年月日：2025/07/24 k.saito
  11. 修正内容：function onOptionChange 内のcheckboxの処理が不十分。修正。
  12. #}
  14. {% block css %}
  15. <style type="text/css">
  16.     .datepicker-days th.dow:first-child,
  17.     .datepicker-days td:first-child {
  18.         color: #f00;
  19.     }
  21.     .datepicker-days th.dow:last-child,
  22.     .datepicker-days td:last-child {
  23.         color: #00f;
  24.     }
  25. </style>
  26. {% endblock %}
  27. {% block javascript %}
  28. <script src="{{ asset('../../plugin/ProductOption42/assets/js/jquery.plainmodal.min.js') }}"></script>
  29. <script>
  30. $(function() {
  31.     //デフォルトのデイトタイムピッカーが存在しない場合
  32.     if ($('[type="date"]').prop('type') !== 'date') {
  33.         $.getScript("{{ asset('assets/js/vendor/moment.min.js', 'admin') }}").done(function() {
  34.             $.getScript("{{ asset('assets/js/vendor/moment-with-locales.min.js', 'admin') }}").done(function() {
  35.                 $.getScript("{{ asset('assets/js/vendor/tempusdominus-bootstrap-4.min.js', 'admin') }}").done(function() {
  36.                     $('input[type=date]').datetimepicker({
  37.                         locale: '{{ eccube_config.locale }}',
  38.                         format: 'YYYY-MM-DD',
  39.                         useCurrent: false,
  40.                         buttons: {
  41.                             showToday: true,
  42.                             showClose: true
  43.                         }
  44.                     });
  45.                 });
  46.             });
  47.         });
  48.     }
  49. });
  51. var product_id;
  52. $(function() {
  53.     {% for ProductOption in ProductOptions %}
  54.     {% set Option = ProductOption.Option %}
  55.     {% set Product = ProductOption.Product %}
  56.         {% if Option.description_flg == constant('Plugin\\ProductOption42\\Entity\\OptionCategory::ON') %}
  57.             modal{{ Product.id }}_{{ Option.id }} = $('#option_description_{{ Product.id }}_{{ Option.id }}').plainModal();
  58.             $('#option_description_link_{{ Product.id }}_{{ Option.id }}').click(function() {
  59.                 modal{{ Product.id }}_{{ Option.id }}.plainModal('open');
  60.                 product_id = $(this).attr('data');
  61.                 return false;
  62.             });
  63.         {% endif %}
  64.     {% endfor %}
  65. });
  67. $(function() {
  68.     $("[id^=desc_btn_]").click(function(){
  69.         var form_id;
  70.         var id = $(this).attr('id').replace(/^desc_btn_/ig, '');
  71.         var ids = id.split('_');
  72.         if (eccube.hasOwnProperty('productsClassCategories')) {
  73.             form_id = product_id;
  74.         }else{
  75.             form_id = 1;
  76.         }
  77.         var $form = $("form[name=form"+form_id+"]");
  78.         func_submit($form,ids[0],ids[1]);
  79.         onOptionChange($form)
  80.     });
  81.     $("[name^=productoption]").change(function(){
  82.         $form = $(this).parents('form');
  83.         onOptionChange($form);
  84.     });
  85. });
  87. function func_submit($form,optionId, setValue) {
  88.     var $sele_option = $form.find("[name=productoption" + optionId + "]");
  89.     if($sele_option && $sele_option.length){
  90.         var kind = $sele_option.attr("type");
  91.         if(kind == 'radio'){
  92.             $sele_option.val([setValue]);
  93.         }else{
  94.             $sele_option.val(setValue);
  95.         }
  96.     }else{
  97.         var $sele_option = $form.find('[name="productoption' + optionId + '[]"]');
  98.         if($sele_option && $sele_option.length){
  99.             $sele_option.each(function(){
  100.                 if($(this).val() == setValue){
  101.                     $(this).prop('checked',true);
  102.                 }
  103.             });
  104.         }
  105.     }
  107.     $('#option_description_' + product_id + '_' + optionId).plainModal('close');
  108. }
  111. var optionPrice = {{ optionPrices|json_encode|raw }};
  112. var optionPoint = {{ optionPoints|json_encode|raw }};
  113. var optionMultiple = {{ optionMultiples|json_encode|raw }};
  114. var taxRules = {{ taxRules|json_encode|raw }};
  115. var default_class_id = {{ default_class_id|json_encode|raw }};
  117. function onOptionChange($form){
  118.     if(!$form.length){
  119.         return;
  120.     }
  121.     var optionPriceTotal = 0;
  122.     var optionPointTotal = 0;
  123.     var tax_rate = null;
  124.     var tax_rule = null;
  125.     var product_id = $form.find('input[name="product_id"]').val();
  126.     var $sele1 = $form.find('select[name=classcategory_id1]');
  127.     var $sele2 = $form.find('select[name=classcategory_id2]');
  129.     var classcat_id1 = $sele1.val() ? $sele1.val() : '__unselected';
  130.     var classcat_id2 = $sele2.val() ? $sele2.val() : '';
  131.     if (eccube.hasOwnProperty('productsClassCategories')) {
  132.         // 商品一覧時
  133.         classcat2 = eccube.productsClassCategories[product_id][classcat_id1]['#' + classcat_id2];
  134.     } else {
  135.         // 詳細表示時
  136.         classcat2 = eccube.classCategories[classcat_id1]['#' + classcat_id2];
  137.     }
  138.     $form.find("[id^=productoption]").each(function(){
  139.         var id = $(this).prop("id");
  140.         var name = $(this).attr("name");
  141.         var option_id = null;
  142.         if(name === undefined){
  143.             name = $(this).find("input").prop("id");
  144.         }
  145.         if(name === undefined)return;
  146.         option_id = name.replace(/productoption/ig,'');
  147.         option_id = option_id.replace(/_\d+/ig,'');
  148.         option_id = option_id.replace(/\[\]/ig,'');
  149.         if(id.match(/^productoption\d+$/)){
  150.             var kind = $(this).prop('tagName');
  151.             var type = $(this).attr('type');
  152.             var value = null;
  153.             // チェックボックス用配列
  154.             var chk_value = [];
  155.             var multi = 1;
  156.             switch(kind){
  157.                 case 'SELECT':
  158.                     value = $(this).val();
  159.                     break;
  160.                 case 'TEXTAREA':
  161.                 case 'INPUT':
  162.                     var text = $(this).val();
  163.                     if(text.length > 0){
  164.                         value = 0;
  165.                     }
  166.                     if(type == 'number'){
  167.                         if(optionMultiple[product_id][option_id]){
  168.                             multi = $(this).val();
  169.                             if(multi.length == 0)multi = 0;
  170.                         }
  171.                     }
  172.                     break;
  173.                 default:
  174.                     if($(this).find('input[type="checkbox"]').length > 0){
  175.                         chk_value = [];
  176.                         $(this).find('input[type="checkbox"]:checked').each(function(){
  177.                             chk_value.push($(this).val());
  178.                         });
  179.                     }else{
  180.                         value = $form.find("input[name='productoption" + option_id + "']:checked").val();
  181.                     }
  182.                     break;
  183.             }
  184.             // 配列(checkbox)　と、それ以外を分けて処理
  185.             // 配列(checkbox)
  186.             if(Array.isArray(chk_value)){
  187.                 for(var key in chk_value){
  188.                     optionPriceTotal += parseFloat(optionPrice[product_id][option_id][chk_value[key]]);
  189.                     optionPointTotal += parseFloat(optionPoint[product_id][option_id][chk_value[key]]);
  190.                 }
  191.             }
  192.             // それ以外
  193.             if($.isNumeric(value)){
  194.                 optionPriceTotal += parseFloat(optionPrice[product_id][option_id][value]*multi);
  195.                 optionPointTotal += parseFloat(optionPoint[product_id][option_id][value]*multi);
  196.             }
  197.         }
  198.     });
  200.     if(classcat2){
  201.         var product_class_id = classcat2.product_class_id;
  202.     }else{
  203.         var product_class_id = default_class_id[product_id];
  204.     }
  206.     var tax_rate = taxRules[product_class_id]['tax_rate'];
  207.     var tax_rule = taxRules[product_class_id]['tax_rule'];
  209.     var $option_price = $form.parent().find('#option_price_default').first();
  210.     $option_price.text(number_format(optionPriceTotal));
  211.     var $option_point = $form.parent().find('#option_price_inctax_default').first();
  212.     $option_point.text(number_format(optionPriceTotal + sfTax(optionPriceTotal, tax_rate, tax_rule)));
  213. }
  215. function number_format(num) {
  216.     return num.toString().replace(/([0-9]+?)(?=(?:[0-9]{3})+$)/g , '$1,');
  217. }
  219. function sfTax(price, tax_rate, tax_rule) {
  220.     real_tax = tax_rate / 100;
  221.     ret = price * real_tax;
  222.     tax_rule = parseInt(tax_rule);
  223.     switch (tax_rule) {
  224.         // 四捨五入
  225.         case {{ constant('Eccube\\Entity\\Master\\RoundingType::ROUND') }}:
  226.             $ret = Math.round(ret);
  227.             break;
  228.         // 切り捨て
  229.         case {{ constant('Eccube\\Entity\\Master\\RoundingType::FLOOR') }}:
  230.             $ret = Math.floor(ret);
  231.             break;
  232.         // 切り上げ
  233.         case {{ constant('Eccube\\Entity\\Master\\RoundingType::CEIL') }}:
  234.             $ret = Math.ceil(ret);
  235.             break;
  236.         // デフォルト:切り上げ
  237.         default:
  238.             $ret = Math.round(ret);
  239.             break;
  240.     }
  241.     return $ret;
  242. }
  244. </script>
  245. {% endblock %}