app/Plugin/SeEnquete4/Resource/template/detail.twig line 1

Open in your IDE?
  1. {#
  2.  Copyright(c) 2020 Shadow Enterprise, Inc. All rights reserved.
  3.  http://www.shadow-ep.co.jp/
  4. #}
  6. {% extends 'default_frame.twig' %}
  8. {% set body_class = 'enquete_page' %}
  10. {% block javascript %}
  11.     <script>
  12.         $(function(){
  13.             // 選択肢が画像の場合は置換
  14.             var elem = 'form[name=enquete] .check-thumbnail label';
  15.             if ( $(elem).length ) {
  16.                 var prefix = "{{ asset('SeEnquete4/assets/img/', 'plugin') }}";
  17.                 var uploaded_extention = '{{ eccube_config['Se_Enquete_img_valid_extention'] }}';
  18.                 uploaded_extention = uploaded_extention.split(',');
  20.                 $(elem).each(function() {
  21.                     var nowElem = $(this);
  22.                     filename = $(nowElem).html();
  23.                     if ( typeof filename !== 'undefined' && filename != '' ) {
  24.                         var pos = filename.lastIndexOf('.');
  25.                         if (pos === -1) return true ;
  26.                         if ( $.inArray( filename.slice(pos), uploaded_extention ) ) {
  27.                             // $(nowElem).load(prefix + filename);  /* for svg */
  28.                             $(nowElem).html('<span class="radio-thumbnail"><img src="' + prefix + filename + '" /></span>');
  29.                         }
  30.                     }
  31.                 })
  32.             }
  34.             // エラーがあればその場所までスクロール
  35.             if ( $('.ec-required').length ) {
  36.                 // $("html,body").animate( {scrollTop: $('.ec-required').offset().top - 60 } );
  37.                 $("html,body").animate( {scrollTop: $('.ec-required').offset().top - 180 } );
  38.             }
  40.         })
  41.     </script>
  42. {% endblock %}
  44. {% block stylesheet %}
  45.     <style>
  46.         form[name="enquete"] {
  47.             width: 80%;
  48.             margin: 0 auto;
  49.         }
  50.         #enquete-header {
  51.             margin-bottom: 20px;
  52.         }
  53.         .enquete-detail-img {
  54.             margin-left: auto;
  55.             margin-right: auto;
  56.             max-width: 600px;
  57.         }
  58.         .enquete-detail-img img {
  59.             max-width: 100%;
  60.         }
  61.         .enquete-title {
  62.             font-weight: bold;
  63.         }
  64.         .enquete-subtitle {
  65.             font-size: 18px;
  66.         }
  67.         .enquete-form-radio {
  68.             display: -webkit-box;
  69.             display: -ms-flexbox;
  70.             display: -webkit-flex;
  71.             display: flex;
  72.             align-items: baseline;
  73.             -webkit-flex-wrap: wrap;
  74.             -ms-flex-wrap: wrap;
  75.             flex-wrap: wrap;
  76.         }
  77.         .enquete-form-radio > div:not(:last-child) {
  78.             margin-right: 10px;
  79.         }
  80.         textarea.enquete-form-textarea {
  81.             height: calc( 1.3em * 5 );
  82.             line-height: 1.3em;
  83.         }
  84.         .radio-thumbnail img {
  85.             max-width: 150px;
  86.             max-height: 150px;
  87.         }
  88.         .enquete-submit-block {
  89.             margin-top: 40px;
  90.         }
  91.         .mw-2 { max-width: 200px; }
  92.         .mw-4 { max-width: 400px; }
  93.         .mw-6 { max-width: 600px; }
  94.         .mw-8 { max-width: 800px; }
  95.         .col-form-normal-text {
  96.             margin-bottom: 20px;
  97.         }
  98.         .col-form-personal-agree {
  99.             background-color: #fff;
  100.             width: 100%;
  101.             margin: 15px auto;
  102.             overflow: auto;
  103.             height: 300px;
  104.             border: 1px solid #d5d5d5;
  105.             border-radius: 5px;
  106.             padding: 10px;
  107.         }
  108.     </style>
  109. {% endblock%}
  111. {% block main %}
  112.     {{ form_start(form) }}
  113.         {{ form_widget(form._token) }}
  114.         <div class="c-contentsArea__cols">
  115.             <div class="c-contentsArea__primaryCol">
  116.                 <div class="c-primaryCol">
  117.                     <div class="card rounded border-0 mb-4">
  119.                         <div id="enquete-header">
  120.                             <div class="row">
  121.                                 <div class="col-8">
  122.                                     {% if Enquete.thumbnail is not null %}
  123.                                     <p class="enquete-detail-img text-center">
  124.                                         <img src="{{ asset( 'SeEnquete4/assets/img/' ~ Enquete.thumbnail, 'plugin') }}">
  125.                                     </p>
  126.                                     {% else %}
  127.                                     <h3 class="enquete-title">{{ Enquete.title }}</h3>
  128.                                     {% endif %}
  129.                                 </div>
  130.                             </div>
  131.                             {% if Enquete.subTitle != '' %}
  132.                             <div class="row">
  133.                                 <div class="col">
  134.                                     <p class="enquete-subtitle">{{ Enquete.subTitle|raw|nl2br }}</p>
  135.                                     {# メールアドレスをお忘れの方、退会アンケートで使用するため、公開日時をコメントアウト #}
  136.                                     {# <div class="text-right">
  137.                                         {{ 'se_enquete.common.message.day_term'|trans }}{{ Enquete.startDate|date("Y/m/d", "Asia/Tokyo") }} 〜 {% if Enquete.endDate is not null %}{{ Enquete.endDate|date("Y/m/d", "Asia/Tokyo") }}{% endif %}
  138.                                     </div> #}
  139.                                 </div>
  140.                             </div>
  141.                             {% endif %}
  142.                         </div>
  144.                         <div class="collapse show ec-cardCollapse" id="ordererInfo">
  145.                             <div class="card-body">
  146.                                 {% for i, val in keyList %}
  147.                                 <div class="row mb-2">
  148.                                     <div class="col">
  149.                                         {% if val.key is defined %}
  150.                                             {% if personaliCheckKey != '' and val.key == personaliCheckKey %}
  151.                                             <fieldset class="form-group">
  152.                                                 {% if Enquete.personalText is defined and Enquete.personalText != '' %}
  153.                                                 <div class="col-form-personal-agree">
  154.                                                     {{ Enquete.personalText|raw|nl2br }}
  155.                                                 </div>
  156.                                                 {% endif %}
  157.                                                 <div class="col">
  158.                                                     {% if has_errors(form[val.key]) %}<p class=" ec-required">{{ form_errors(form[val.key]) }}</p>{% endif %}
  159.                                                     {{ form_widget(form[val.key]) }}
  160.                                                 </div>
  161.                                             </fieldset>
  162.                                             {% else %}
  163.                                             <fieldset class="form-group">
  164.                                                 <legend class="col-form-label required">
  165.                                                     {{ val.label }}
  166.                                                     {% if val.required %}<span class="badge badge-primary ml-1">{{ 'common.required'|trans }}</span>{% endif %}
  167.                                                 </legend>
  168.                                                 <div class="col">
  169.                                                     {% if has_errors(form[val.key]) %}<p class=" ec-required">{{ form_errors(form[val.key]) }}</p>{% endif %}
  170.                                                     {{ form_widget(form[val.key]) }}
  171.                                                 </div>
  172.                                             </fieldset>
  173.                                             {% endif %}
  174.                                         {% endif %}
  175.                                         {% if val.text is defined %}
  176.                                             <label class="col-form-normal-text">{{ val.text }}</label>
  177.                                         {% endif %}
  178.                                     </div>
  179.                                 </div>
  180.                                 {% endfor %}
  181.                             </div>
  182.                         </div>
  184.                     </div>
  185.                 </div>
  186.             </div>
  187.         </div>
  188.         <div class="ec-RegisterRole__actions enquete-submit-block">
  189.             <div class="ec-off4Grid">
  190.                 <div class="ec-off4Grid__cell">
  191.                     <button type="submit" class="ec-blockBtn--cancel">{{ Enquete.submitTitle }}</button>
  192.                 </div>
  193.             </div>
  194.         </div>
  195.     {{ form_end(form) }}
  196. {% endblock %}