app/Plugin/CustomerSupportPro42/Resource/template/default/Contact/index.twig line 1

Open in your IDE?
  1. {#
  2.  This file is part of the ContactManagement Plugin
  4.  Copyright (C) 2020 Diezon.
  6.  For the full copyright and license information, please view the LICENSE
  7.  file that was distributed with this source code.
  8. #}
  9. {% form_theme form.ContactPurpose 'CustomerSupportPro42/Resource/template/default/Form/custom_checkbox_theme.twig' %}
  11. {% block stylesheet %}
  12.     {{ include('@CustomerSupportPro42/default/Contact/style.twig') }}
  13. {% endblock %}
  14. {% block javascript %}
  15.     <script src="{{ asset('CustomerSupportPro42/assets/fileupload/vendor/jquery.ui.widget.js', 'plugin') }}"></script>
  16.     <script src="{{ asset('CustomerSupportPro42/assets/fileupload/jquery.iframe-transport.js', 'plugin') }}"></script>
  17.     <script src="{{ asset('CustomerSupportPro42/assets/fileupload/jquery.fileupload.js', 'plugin') }}"></script>
  18.     <script src="{{ asset('CustomerSupportPro42/assets/fileupload/jquery.fileupload-process.js', 'plugin') }}"></script>
  19.     <script src="{{ asset('CustomerSupportPro42/assets/fileupload/jquery.fileupload-validate.js', 'plugin') }}"></script>
  20.     <script>
  21.         $(function () {
  22.             $('#contact_purpose').insertAfter('dl:nth-of-type(5)');
  23.             $('#contact_image').appendTo('div.ec-borderedDefs');
  25.             {% if form.ContactComment.image_name_1.vars.value is not empty %}
  26.                 $('#name_contact_comment_1').replaceWith('<div class="imgUpBox--main--name" id="name_contact_comment_1"></div>');
  27.                 $('#name_contact_comment_1').append('{{ form.ContactComment.image_name_1.vars.value }}');
  28.             {% endif %}
  30.             {% if form.ContactComment.image_name_2.vars.value is not empty %}
  31.                 $('#name_contact_comment_2').replaceWith('<div class="imgUpBox--main--name" id="name_contact_comment_2"></div>');
  32.                 $('#name_contact_comment_2').append('{{ form.ContactComment.image_name_2.vars.value }}');
  33.             {% endif %}
  35.             var proto_del = '{{ form_widget(form.ContactComment.delete_images.vars.prototype) }}';
  36.             {% for delete_image in form.ContactComment.delete_images %}
  37.                 $("#contact_image").append('{{ form_widget(delete_image) }}');
  38.             {% endfor %}
  40.             $('#{{ form.ContactComment.image_file_upload_1.vars.id }}').fileupload(getUploadProcess(
  41.                 'contact_comment_1',
  42.                 '{{ form.ContactComment.image_name_1.vars.id }}',
  43.             ));
  45.             $('#{{ form.ContactComment.image_file_upload_2.vars.id }}').fileupload(getUploadProcess(
  46.                 'contact_comment_2',
  47.                 '{{ form.ContactComment.image_name_2.vars.id }}',
  48.             ));
  50.             var count_del = 0;
  52.             $(document).ready(function(){
  54.                 checkVisibleDeleteButton();
  56.                 $('#delete_contact_comment_1').on('click', function() {
  57.                     var $new_delete_image = $(proto_del.replace(/__name__/g, count_del));
  58.                     $new_delete_image.val($('#' + '{{ form.ContactComment.image_name_1.vars.id }}').val());
  59.                     $('#contact_image').append($new_delete_image);
  61.                     $('#' + '{{ form.ContactComment.image_name_1.vars.id }}').val('');
  62.                     $('#name_contact_comment_1').replaceWith('<div class="imgUpBox--main--name" id="name_contact_comment_1"></div>');
  63.                     $('#delete_contact_comment_1').hide();
  64.                     count_del++
  65.                 });
  67.                 $('#delete_contact_comment_2').on('click', function() {
  68.                     var $new_delete_image = $(proto_del.replace(/__name__/g, count_del));
  69.                     $new_delete_image.val($('#' + '{{ form.ContactComment.image_name_2.vars.id }}').val())
  70.                     $('#contact_image').append($new_delete_image);
  72.                     $('#' + '{{ form.ContactComment.image_name_2.vars.id }}').val('');
  73.                     $('#name_contact_comment_2').replaceWith('<div class="imgUpBox--main--name" id="name_contact_comment_2"></div>');
  74.                     $('#delete_contact_comment_2').hide();
  75.                     count_del++
  76.                 });
  77.             });
  79.             function getUploadProcess(key, valueId) {
  80.                 return {
  81.                     url: "{{ url('front_contact_image_add') }}",
  82.                     type: "post",
  83.                     sequentialUploads: true,
  84.                     dataType: 'json',
  85.                     singleFileUploads: true,
  86.                     add: function (e, data) {
  87.                         if (data.files.length > 1) {
  88.                             alert("{{ 'front.contact.contact_image_length'|trans }}");
  89.                             return;
  90.                         } else {
  91.                             if (data.files[0].size > {{ eccube_config.eccube_contact_image_max_file_size }}) {
  92.                                 alert("{{ 'front.contact.contact_image_size'|trans }}");
  93.                                 return;
  94.                             }
  95.                             data.submit();
  96.                         }
  97.                     },
  98.                     done: function(e, data) {
  99.                         var file = data.result.file;
  101.                         $('#name_' + key).replaceWith('<div class="imgUpBox--main--name" id="name_' + key + '"></div>');
  102.                         $('#name_' + key).append(file);
  103.                         if ($('#' + valueId).val() && $('#' + valueId).val().length > 0) {
  104.                             var $new_delete_image = $(proto_del.replace(/__name__/g, count_del));
  105.                             $new_delete_image.val($('#' + valueId).val())
  106.                             $('#contact_image').append($new_delete_image);
  107.                             count_del++
  108.                         }
  109.                         $('#'+ valueId ).val(file);
  110.                         $('#delete_' + key).show();
  111.                     },
  112.                     fail: function(e, data) {
  113.                         alert("{{ 'admin.common.upload_error'|trans }}");
  114.                     },
  115.                     acceptFileTypes: /(\.|\/)(jpe?g|png)$/i,
  116.                     maxFileSize: {{ eccube_config.eccube_contact_image_max_file_size }},
  117.                     maxNumberOfFiles: 1,
  118.                     processalways: function(e, data) {
  119.                         if (data.files.error) {
  120.                             alert("{{ 'admin.common.upload_error'|trans }}");
  121.                         }
  122.                     }
  123.                 }
  124.             }
  126.             function checkVisibleDeleteButton() {
  127.                 {% if form.ContactComment.image_name_1.vars.value %}
  128.                     $("#delete_contact_comment_1").show();
  129.                 {% else %}
  130.                     $("#delete_contact_comment_1").hide();
  131.                 {% endif %}
  133.                 {% if form.ContactComment.image_name_2.vars.value %}
  134.                     $("#delete_contact_comment_2").show();
  135.                 {% else %}
  136.                     $("#delete_contact_comment_2").hide();
  137.                 {% endif %}
  138.             }
  139.         });
  140.     </script>
  141. {% endblock %}
  143. {% block main %}
  144.     <div style="display:none;">
  145.         <dl id="contact_purpose">
  146.             <dt>
  147.                 {{ form_label(form.ContactPurpose, 'front.contact.contact_purpose', { 'label_attr': { 'class': 'ec-label' }}) }}
  148.             </dt>
  149.             <dd>
  150.                 <div class="ec-radio{{ has_errors(form.ContactPurpose) ? ' error' }}">
  151.                     {{ form_widget(form.ContactPurpose) }}
  152.                     {{ form_errors(form.ContactPurpose) }}
  153.                 </div>
  154.             </dd>
  155.         </dl>
  156.         <dl id="contact_image">
  157.             <dt>
  158.                 <strong>{{ 'front.contact.contact_image_file'|trans }}</strong><br>
  159.                 <small>{{ 'front.contact.contact_image_file_description'|trans }}</small>
  160.             </dt>
  161.             <dd>
  162.                 <div class="imgUpBox">
  163.                     <div class="imgUpBox--main">
  164.                         <label class="imgUpBox--main--bt">
  165.                             {{ form_widget(form.ContactComment.image_file_upload_1, { attr : { accept : 'image/*' } }) }}
  166.                             <strong>{{ 'front.contact.contact_select_file'|trans }}</strong>
  167.                             {{ form_widget(form.ContactComment.image_name_1) }}
  168.                         </label>
  169.                         <div class="uploaded show">
  170.                             <div class="imgUpBox--main--name" id="name_contact_comment_1">
  171.                             </div>
  172.                             <button type="button" id="delete_contact_comment_1" class="ec-inlineBtn">
  173.                                 <span>{{ 'common.delete'|trans }}</span>
  174.                             </button>
  175.                         </div>
  176.                     </div>
  177.                     {{ form_errors(form.ContactComment.image_name_1) }}
  178.                     {{ form_errors(form.ContactComment.image_file_upload_1) }}
  179.                 </div>
  180.                 <div class="imgUpBox mt30 mt15sp">
  181.                     <div class="imgUpBox--main">
  182.                         <label class="imgUpBox--main--bt">
  183.                             {{ form_widget(form.ContactComment.image_file_upload_2, { attr : { accept : 'image/*' } }) }}
  184.                             <strong>{{ 'front.contact.contact_select_file'|trans }}</strong>
  185.                             {{ form_widget(form.ContactComment.image_name_2) }}
  186.                         </label>
  187.                         <div class="uploaded show">
  188.                             <div class="imgUpBox--main--name" id="name_contact_comment_2">
  189.                             </div>
  190.                             <button type="button" id="delete_contact_comment_2" class="ec-inlineBtn">
  191.                                 <span>{{ 'common.delete'|trans }}</span>
  192.                             </button>
  193.                         </div>
  194.                     </div>
  195.                     {{ form_errors(form.ContactComment.image_name_2) }}
  196.                     {{ form_errors(form.ContactComment.image_file_upload_2) }}
  197.                 </div>
  198.             </dd>
  199.         </dl>
  200.     </div>
  201. {% endblock %}