app/template/default/Entry/index.twig line 1

Open in your IDE?
  1. {#
  2. カスタマイズTwig
  3. #}
  4. {% extends 'default_frame.twig' %}
  6. {% set body_class = 'registration_page' %}
  8. {% form_theme form 'Form/form_div_layout.twig' %}
  10. {% block stylesheet %}
  11. <style>
  12.     #entry_company_name {
  13.         width: 100%;
  14.     }
  16.     .form_comments {
  17.         font-size: 12px;
  18.         color: #525263;
  19.         margin: 3px 0px 3px 0px;
  20.         font-weight: normal;
  21.         line-height: 2;
  22.     }
  24.     .ec-checkbox label {
  25.         font-weight: normal;
  26.     }
  27.     .ec-registerRole .ec-registerRole__actions {
  28.         text-align: left;
  29.         padding-top: 0px;
  30.     }
  31.     .related_line {
  32.         background-color: #F5F5F5;
  33.         padding: 16px 10px;
  34.         font-size: 14px;
  35.         margin: 12px 0px 24px 0px;
  36.     }
  37.     .progress_bar_step {
  38.         margin: 0 auto;
  39.         max-width: 280px;
  40.         padding: 18px 0;
  41.     }
  42.     @media only screen and (max-width: 767px) {
  43.         .progress_bar_step {
  44.             max-width: 230px;
  45.         }
  46.     }
  47. </style>
  48. {% endblock %}
  50. {% block javascript %}
  51.     <script>
  52.         $(function() {
  54.             var userAgent = navigator.userAgent.toLowerCase();
  55.             var isInstagramOrFacebook = userAgent.includes("instagram") || userAgent.includes("facebook");
  57.              const passwordField = document.getElementById("entry_plain_password");
  58.             const toggleLink = document.getElementById("show_password");
  60.             if (passwordField && toggleLink) {
  61.                 toggleLink.addEventListener("click", function(event) {
  62.                     event.preventDefault();
  63.                     if (passwordField.type === "password") {
  64.                         passwordField.type = "text";
  65.                         toggleLink.textContent = "パスワードを非表示";
  66.                     } else {
  67.                         passwordField.type = "password";
  68.                         toggleLink.textContent = "パスワードを表示";
  69.                     }
  70.                 });
  71.             }
  73.             var hasValue = false;
  74.             $("input[type='text']").each(function() {
  75.                 if ($(this).val().trim() !== "") {
  76.                     hasValue = true;
  77.                     return false; // ループを抜ける
  78.                 }
  79.             });
  81.             {% set current_domain = app.request.getHost() %}
  83.             {% set is_prod = 'web-order.shikomel.com' in current_domain %}
  84.             {% set is_stg = 'web-order-stg.shikomel.com' in current_domain %}
  86.             // 会員情報入力画面の表示イベント
  87.             {% if is_prod %}
  89.                 fbq('trackCustom', 'ce_show_entry', {
  90.                     content_type: "ShowEntry",
  91.                     value: 63
  92.                 });
  94.                 window.dataLayer.push({
  95.                     event: 'ce_show_entry',
  96.                     custom_event_name: 'ce_show_entry',
  97.                     custom_customer_id: '',
  98.                     custom_user_agent: $("#user_agent").val(),
  99.                     custom_is_ig: $("#is_ig").val(),
  100.                     custom_is_line: $("#is_line").val(),
  101.                     custom_referer: $("#referer").val(),
  102.                     custom_real_ip: $("#real_ip").val(),
  103.                 });
  105.                 _lt('send', 'cv', {
  106.                     type: 'ce_show_entry'
  107.                 },['d6fb195c-aa19-4109-8ea0-7b1d883fb349']);
  109.                 $('#input_entry').click(function() {
  111.                     // 会員情報入力確定
  112.                     fbq('trackCustom', 'ce_inputed_entry', {
  113.                         content_type: "InputedEntry",
  114.                         value: 65
  115.                     });
  117.                     window.dataLayer.push({
  118.                         event: 'ce_inputed_entry',
  119.                         custom_event_name: 'ce_inputed_entry',
  120.                         custom_customer_id: '',
  121.                         custom_user_agent: $("#user_agent").val(),
  122.                         custom_is_ig: $("#is_ig").val(),
  123.                         custom_is_line: $("#is_line").val(),
  124.                         custom_referer: $("#referer").val(),
  125.                         custom_real_ip: $("#real_ip").val(),
  126.                     });
  128.                     _lt('send', 'cv', {
  129.                         type: 'ce_inputed_entry'
  130.                     },['d6fb195c-aa19-4109-8ea0-7b1d883fb349']);
  131.                 });
  132.             {% endif %}
  134.             const requiredInputs = document.querySelectorAll("input[required]");
  135.             const button = document.getElementById("submit_btn");
  136.             const checkbox = document.getElementById("entry_user_policy_check");
  138.             function toggleButton() {
  139.                 // 全ての input に値が入っているかチェック
  140.                 const allFilled = Array.from(requiredInputs).every(input => input.value.trim() !== "");
  141.                 const isCheckboxChecked = checkbox.checked;
  142.     
  143.                 if (allFilled && isCheckboxChecked) {
  144.                     button.classList.remove("disabled"); // クラス削除で有効化
  145.                 } else {
  146.                     button.classList.add("disabled"); // クラス追加で無効化
  147.                 }
  148.             }
  150.             // 全ての input にイベントリスナーを設定
  151.             requiredInputs.forEach(input => input.addEventListener("input", toggleButton));
  153.             // 画面表示時に処理実行
  154.             toggleButton();
  155.         });
  158.     </script>
  160.     {% if is_prod %}
  161.     <!-- Ptengine Tag -->
  162.     <script src="https://js.ptengine.jp/21yt6a2v.js">
  163.     </script>
  164.     <!-- End Ptengine Tag -->
  165.     {% endif %}
  166.     
  167. {% endblock javascript %}
  169. {% block main %}
  171.     <div class="ec-registerRole">
  172.         <div class="ec-pageHeader">
  173.             <h1 style="margin-top: 10px; margin-bottom: 10px; border-top: none; border-bottom: 1px solid #ccc;">会員登録（無料）</h1>
  174.         </div>
  175.         <div class="progress_bar_step">
  176.             <img src="{{ asset('assets/img/common/entry_progress_step1.png', 'user_data') }}">
  177.         </div>
  178.         <div class="ec-off1Grid" style="max-width: 430px; margin: auto;">
  179.             <div class="">
  180.                 <form method="post" action="{{ url('entry') }}" class="h-adr formByMailArea" id="form">
  181.                     {% if isFromLine %}
  182.                     <div class="related_line">
  183.                         LINEアカウントと連携しました。<br>
  184.                         会員登録完了で、クーポンを獲得できます。
  185.                     </div>
  186.                     {% endif %}
  188.                     <span class="p-country-name" style="display:none;">Japan</span>
  189.                     {{ form_widget(form._token) }}
  190.                     <div class="">
  191.                         <dl>
  192.                             <dt>
  193.                                 {{ form_label(form.email, 'メールアドレス', { 'label_attr': { 'class': 'ec-label' }}) }}
  194.                             </dt>
  195.                             <dd>
  196.                                 <div class="ec-input{{ has_errors(form.email) ? ' error' }}">
  197.                                     {{ form_widget(form.email, { 'attr': { 'placeholder': 'shikomel-store@gmail.com' }}) }}
  198.                                     {{ form_errors(form.email) }}
  199.                                 </div>
  200.                             </dd>
  201.                         </dl>
  203.                         {% if isFromLine %}
  204.                         {# Line連携ログインの場合はパスワード共通のダミーを設定する #}
  205.                         {{ form_widget(form.plain_password, { type : 'hidden', value : dummyPass }) }}
  206.                         {% else %}
  207.                         <dl>
  208.                             <dt>
  209.                                 {{ form_label(form.plain_password, 'パスワード', { 'label_attr': {'class': 'ec-label' }}) }}
  210.                                 <div class="form_comments">{{ '半角英数記号%min%〜%max%文字'|trans({ '%min%': eccube_config.eccube_password_min_len, '%max%': eccube_config.eccube_password_max_len }) }}<div>
  211.                             </dt>
  212.                             <dd>
  213.                                 <div class="ec-input{{ has_errors(form.plain_password) ? ' error' }}">
  214.                                     {{ form_widget(form.plain_password, {
  215.                                         'attr': { 'placeholder': ''},
  216.                                         'type': 'password'
  217.                                     }) }}
  218.                                     <div style="text-align: right;">
  219.                                         <a id="show_password" href="#" style="top: -5px; position: relative; font-size: 12px; color: #1F9FCB">パスワードを表示</a>
  220.                                     </div>
  221.                                     {{ form_errors(form.plain_password) }}
  222.                                 </div>
  223.                             </dd>
  224.                         </dl>
  225.                         {% endif %}
  226.                         <dl>
  227.                             <dt>
  228.                                 {{ form_label(form.company_name, '店舗名・事業者名', { 'label_attr': { 'class': 'ec-label' }}) }}
  229.                                 <div class="form_comments">当サイトは事業を営む企業、個人の方向けのサービスです。個人事業主の方は屋号または個人名をご入力ください。<div>
  230.                             </dt>
  231.                             <dd>
  232.                                 <div class="ec-halfInput{{ has_errors(form.company_name) ? ' error' }}">
  233.                                     {{ form_widget(form.company_name, { 'attr': { 'placeholder': '株式会社シコメルキッチン' }}) }}
  234.                                     {{ form_errors(form.company_name) }}
  235.                                 </div>
  236.                                 <div style="font-size: 16px; line-height: 1.5;"></div>
  237.                             </dd>
  238.                         </dl>
  239.                     </div>
  240.                     <div class="ec-registerRole__actions">
  241.                         <div class="ec-checkbox{{ has_errors(form.user_policy_check) ? ' error' }}">
  242.                             <label>
  243.                                 {{ form_widget(form.user_policy_check) }}
  244.                                 {{ 'シコメルの<a class="ec-link" href="https://shikomel.com/terms/" target="_blank">利用規約</a>に同意'|raw }}
  245.                             </label>
  246.                             {{ form_errors(form.user_policy_check) }}
  247.                         </div>
  248.                         <div>
  249.                             <button id="submit_btn" class="ec-blockBtn--action disabled" type="submit" id="input_entry" name="mode" value="confirm">{{ '確認へ進む'|trans }}</button>
  250.                         </div>
  251.                     </div>
  253.                     {# 名前、住所等は購入時に入力してもらうように変更 #}
  254.                     <input type="hidden" id="entry_name_name01" name="entry[name][name01]" value="未入力"/>
  255.                     <input type="hidden" id="entry_name_name01" name="entry[name][name02]" value="未入力"/>
  256.                     <input type="hidden" id="entry_kana_kana01" name="entry[kana][kana01]" value="カナ"/>
  257.                     <input type="hidden" id="entry_kana_kana02" name="entry[kana][kana02]" value="カナ"/>
  258.                     <input type="hidden" id="entry_postal_code" name="entry[postal_code]" value="0000000"/>
  259.                     <input type="hidden" id="entry_address_pref" name="entry[address][pref]" value="13"/>
  260.                     <input type="hidden" id="entry_address_addr01" name="entry[address][addr01]" value="未入力"/>
  261.                     <input type="hidden" id="entry_address_addr02" name="entry[address][addr02]" value="未入力"/>
  262.                     <input type="hidden" id="entry_phone_number" name="entry[phone_number]" value="00000000000"/>
  263.                 </form>
  264.             </div>
  265.         </div>
  266.     </div>
  267. {% endblock %}