app/Plugin/RestockMail/Resource/template/default/index.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) LOCKON CO.,LTD. All Rights Reserved.
  6. http://www.lockon.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  13. {% block javascript %}
  14. <script type="text/javascript">
  16. {% if is_granted('ROLE_USER') %}
  17.     var logon = true;
  18. {% else %}
  19.     var logon =false;
  22. {% endif %}
  26. var oldcid = "";
  28. function Restock(){
  29.     if(oldcid != document.querySelector("input[name=ProductClass]").value){
  30.        oldcid = document.querySelector("input[name=ProductClass]").value
  31.     if(typeof stock_data == "undefined"){
  33.        if(
  34.            document.querySelector("#form1 > div.ec-productRole__btn > button").innerText == "ただいま品切れ中です"  ||
  35.            document.querySelector("#form1 > div.ec-productRole__btn > button").innerText == "ただいま品切れ中です。"
  37.        ){
  38.             if(logon == false){
  39.                 document.getElementById("RestockInfo").style.display = "";
  40.                 document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  41.             }else{
  42.                 document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "";
  43.                 $.ajax({
  44.                 dataType:"json",
  45.                    type: "POST",
  46.                    url: "{{ url('restock_mail_get') }}",
  47.                    data: "cid="+document.querySelector("input[name=ProductClass]").value,
  48.                    success: function(msg){
  49.                     if(msg.status == "OK"){
  50.                         if(msg.count == 0){
  51.                             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  52.                                 document.getElementById("RestockButton").style.display = "";
  53.                                 document.getElementById("RestockButton").removeAttribute("disabled")
  54.                                 document.getElementById('RestockButton').textContent = '再入荷のお知らせ登録';
  55.                         }else{
  56.                             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  57.                                 document.getElementById("RestockButton").style.display = "";
  58.                                 document.getElementById("RestockButton").setAttribute("disabled","disabled")
  59.                                 document.getElementById('RestockButton').textContent = '再入荷のお知らせ登録済み';
  60.                         }
  61.                     }
  62.                     }
  63.                 });
  64.             }
  65.         }else{
  66.             document.getElementById("RestockInfo").style.display = "none";
  67.             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "";
  68.             document.getElementById("RestockButton").style.display = "none";
  69.         }
  70.     }else{
  71.           if(
  73.   (document.getElementById("stockview") == null && stock_data[0] == "×")
  74.   || document.getElementById("stockview").innerHTML == "在庫: ×"
  75.   ){
  76.       if(logon == false){
  78.               document.getElementById("RestockInfo").style.display = "";
  79.          document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  80.   //                                   document.getElementById("RestockButton").setAttribute("disabled","disabled")
  81.     //    document.getElementById("RestockButton").style.display = "";
  86.       }else{
  87.             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "";
  88.         $.ajax({
  89. dataType:"json",
  90.    type: "POST",
  91.    url: "{{ url('restock_mail_get') }}",
  92.    data: "cid="+document.querySelector("input[name=ProductClass]").value,
  93.    success: function(msg){
  94.     if(msg.status == "OK"){
  95.         if(msg.count == 0){
  96.             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  97.                 document.getElementById("RestockButton").style.display = "";
  98.                 document.getElementById("RestockButton").removeAttribute("disabled")
  99.         }else{
  100.             document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "none";
  101.                 document.getElementById("RestockButton").style.display = "";
  102.                 document.getElementById("RestockButton").setAttribute("disabled","disabled")
  103.         }
  104.     }
  105.    }
  106.  });
  107.       }
  108.   }else{
  109.        document.getElementById("RestockInfo").style.display = "none";
  110.          document.querySelector(".ec-productRole__btn").querySelector("button").style.display = "";
  111.         document.getElementById("RestockButton").style.display = "none";
  112.   }
  113.     }
  114.     }
  115. }
  117. function RestockAdd(){
  118.                 document.getElementById("RestockButton").setAttribute("disabled","disabled")
  119.         $.ajax({
  120. dataType:"json",
  121.    type: "POST",
  122.    url: "{{ url('restock_mail_set') }}",
  123.    data: "pid=" +document.querySelector("input[name=product_id]").value + "&classid="+document.querySelector("input[name=ProductClass]").value +"&code=" + document.querySelector(".product-code-default").innerText,
  124.    success: function(msg){
  125.     if(msg.status == "OK"){
  126.         window.location.reload();
  127.     }
  128.    }
  129.  });
  130. }
  132. $(function() {
  134. $(document.querySelector(".ec-productRole__btn")).after('<div id="RestockInfo" class="ec-productRole__btn"><button id="openModal" class="ec-blockBtn--action " type="button">再入荷お知らせ登録</button>' +
  135. '<section id="modalArea" class="modalArea">'+
  136. '<div id="modalBg" class="modalBg"></div>'+
  137. '  <div class="modalWrapper">'+
  138. '    <div class="modalContents">'+
  139. '      <h3>再入荷お知らせ登録</h3>'+
  140. '<p>ログインしますと再入荷のお知らせメールを受信できます。<br><a href="{{ url("mypage_login") }}">⇨こちらからログイン</a></p>' +
  141. '<p>会員登録がお済でない方は会員登録をお願いいたします。<br><a href="{{ url("entry") }}">⇨こちらから会員登録</a></p>\n'+
  142. '    </div>\n'+
  143. '<div id="closeModal" class="closeModal">×</div>'+
  144. '</div>'+
  145. '</section></div>');
  146. $(document.querySelector(".ec-productRole__btn")).after('<div class="ec-productRole__btn"><button type="button" class="ec-blockBtn--action " onclick="RestockAdd()" id="RestockButton">再入荷お知らせ登録</button></div>');
  147. document.getElementById("RestockButton").style.display = "none";
  148. document.getElementById("RestockInfo").style.display = "none";
  150. if(logon == false){
  151.       const modalArea = document.getElementById('modalArea');
  152.   const openModal = document.getElementById('openModal');
  153.   const closeModal = document.getElementById('closeModal');
  154.   const modalBg = document.getElementById('modalBg');
  155.   const toggle = [openModal,closeModal,modalBg];
  157.   for(let i=0, len=toggle.length ; i<len ; i++){
  158.     toggle[i].addEventListener('click',function(){
  159.       modalArea.classList.toggle('is-show');
  160.     },false);
  161.   }
  163. }
  165. setInterval(function(){
  166.     Restock();
  167. },100);
  168. });
  170. </script>
  171. {% endblock %}
  172. {% block stylesheet %}
  173.     <style>
  174.         #restock_mail_recommend_level {
  175.             display: flex;
  176.             flex-direction: column;
  177.             flex-wrap: wrap;
  178.         }
  179.         #restock_mail_recommend_level label {
  180.             position: relative;
  181.             bottom: 18px;
  182.             left: 20px;
  183.             line-height: 0;
  184.         }
  189.         /* モーダルCSSここから */
  190.         .modalArea {
  191.             visibility: hidden; /* displayではなくvisibility */
  192.             opacity : 0;
  193.             position: fixed;
  194.             z-index: 9999; /* サイトによってここの数値は調整 */
  195.             top: 0;
  196.             left: 0;
  197.             width: 100%;
  198.             height: 100%;
  199.             transition: .4s;
  200.             font-size: small;
  201.         }
  203.         .modalBg {
  204.             width: 100%;
  205.             height: 100%;
  206.             background-color: rgba(30,30,30,0.9);
  207.         }
  209.         .modalWrapper {
  210.             position: absolute;
  211.             top: 50%;
  212.             left: 50%;
  213.             transform:translate(-50%,-50%);
  214.             width: 70%;
  215.             max-width: 500px;
  216.             padding: 10px 30px;
  217.             background-color: #fff;
  218.         }
  220.         .closeModal {
  221.             position: absolute;
  222.             top: 0.5rem;
  223.             right: 1rem;
  224.             cursor: pointer;
  225.         }
  227.         .is-show { /* モーダル表示用クラス */
  228.             visibility: visible;
  229.             opacity : 1;
  230.         }
  231.         /* モーダルCSSここまで */
  234.         /* 以下ボタンスタイル */
  235.         button {
  236.             padding: 10px;
  237.             background-color: #fff;
  238.             border: 1px solid #282828;
  239.             border-radius: 2px;
  240.             cursor: pointer;
  241.         }
  244.     </style>
  245. {% endblock %}
  247. {% block main %}
  248. {% endblock %}