ラッピング（部分テンプレート）

注文情報入力画面で利用するラッピング入力フォーム用部分テンプレートです。
注文情報入力画面で include して利用します。（注文情報入力画面以外では利用できません）

テーマ管理のファイルパス

ec_force/shop/orders/_view_wrapping_information.html.liquid
ec_force/shop/orders/_view_wrapping_information.html+smartphone.liquid

必要なコンポーネント

任意とあるもの以外はシステム上必要なコンポーネントとなりますので、必ず使用するようにしてください。

<!-- 部分テンプレート(ラッピングの選択) -->
<div id='view-wrapping-information'>
 
  {% if shop_form_settings['wrapping'] %}
 
    <!-- 複数のお届け先の可否 -->
    {% assign multiple_shipping = false %}
    {% if multiple_shipping_is_available == true and order_is_multiple_shipping  == true%}
      {% assign multiple_shipping = true %}
    {% endif %}
 
    <div id="container-wrapping" style="{% if multiple_shipping %}display:none;{% endif %}">
 
      <!-- ラッピングの選択 -->
      <label>ラッピング</label>
      <select id='wrapping-id' name='order[wrapping_id]'>
        <option value=''>無し</option>
        {% for wrapping in wrappings %}
          {% if wrapping.active %}
            <option value="{{ wrapping.id }}" {% if order.wrapping_id == wrapping.id %}selected{% endif %} data-thumbnail-url="{{ wrapping.thumbnail.url }}">{{ wrapping.name }} {{ wrapping.price | number_to_currency : format: '%n %u' }}</option>
          {% endif %}
        {% endfor %}
      </select>
 
      <!-- ラッピングサムネイル画像 -->
      <div id='wrapping-thumbnail-box' style='display:none;'>
        <img id='wrapping-thumbnail' src=''>
      </div>
    </div>
 
    <!-- 複数のお届け先がある場合の注釈 -->
    <div id="container-wrapping-for-multiple-shipping" style="{% unless multiple_shipping %}display:none;{% endunless %}">
      ※複数のお届け先を指定する場合は、ラッピングは選択できません
    </div>
 
  {% endif %}
</div>