テーマ仕様書
shop
購入画面
注文情報確認プレビュー★

注文情報確認プレビュー(部分テンプレート)

注文情報入力画面で利用する注文情報確認プレビュー用部分テンプレートです。
注文情報入力画面で include して利用します。(注文情報入力画面以外では利用できません)

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

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

必要なコンポーネント

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

<div id="payment-preview-view">
  <div id="preview-content">
    <label>ご注文内容の確認</label>
    {% assign max_item_length = order.order_items.size | plus : bundled_items.size %}
 
    {% for item in (1..max_item_length) %}
      <div id="parsed_caution02_{{ forloop.index0 }}" aria-hidden="true"></div>
    {% endfor %}
 
    <div id="pickup_store_table">
      <div>
        <label>受取店舗</label>
        <span id="pickup_store_name"></span>
      </div>
      <div>
        <label>住所</label>
        <span id="pickup_store_full_address"></span>
      </div>
    </div>
 
    <div id="shipping_address_table">
      <div>
        <label>お名前</label>
        <span id="shipping_address_full_name"></span>
      </div>
      <div>
        <label>住所</label>
        <span id="shipping_address_full_address"></span>
      </div>
    </div>
 
    <div id="shipping_addresses_div">
      {% for index in (0..order.shipping_address_count_limit) %}
        {% if forloop.last %}
          {% break %}
        {% endif %}
        <div id="section_shipping_addresses_{{ index }}" style="display: none;">
          お名前<span id="shipping_addresses_{{ index }}_full_name"></span>
 
          住所<span id="shipping_addresses_{{ index }}_full_address"></span>
 
          商品情報
          {% for order_item in order.order_items %}
            <div id="shipping_addresses_{{ index }}_order_items_info_container_{{ order_item.id }}">
              {{ order_item.variant.name_with_option_values_presentation }}
              <span id="shipping_addresses_{{ index }}_order_items_info_{{order_item.id}}_quantity">0</span>
            </div>
          {% endfor %}
 
          <div id="shipping_addresses_{{ index }}_already_registered">
            お届け先登録
            <span id="shipping_addresses_{{ index }}_persist_as_customer_shipping_address">する</span>
            <span id="shipping_addresses_{{ index }}_not_persist_as_customer_shipping_address">しない</span>
          </div>
        </div>
      {% endfor %}
    </div>
 
    <div>
      <label>商品名</label>
      <label>単価</label>
      <label>個数</label>
      <label>小計</label>
    </div>
    <div>
      {% for item in (1..max_item_length) %}
        <div id="item_row_{{ forloop.index0 }}" style="display:none;">
          <span id="item_name_with_tax_{{ forloop.index0 }}"></span>
          <span id="item_price_{{ forloop.index0 }}"></span>
          <span id="item_quantity_{{ forloop.index0 }}"></span>
          <span id="item_subtotal_price_{{ forloop.index0 }}"></span>
        </div>
      {% endfor %}
    </div>
    <div>
      <label>小計</label>
      <span id="subtotal"></span>
    </div>
    <div>
      <label>割引</label>
      <span id="discount_not_with_point"></span>
    </div>
    <div id="discount_point_amount_exclude_tax">
      <label>ポイント利用</label>
      <span id="discount_point_amount_ex"></span>
    </div>
    <div id="misc_fee_row">
      <label>ラッピング代金</label>
      <span id="misc_fee"></span>
    </div>
    <div>
      <label>送料</label>
      <span id="deliv_fee"></span>
    </div>
    <div>
      <label>手数料</label>
      <span id="charge"></span>
    </div>
    <div>
      <label>消費税</label>
      <span id="tax"></span>
    </div>
    <div id="discount_point_amount_include_tax">
      <label>ポイント利用</label>
      <span id="discount_point_amount_in"></span>
    </div>
    <div>
      <label>合計</label>
      <span id="total"></span>
    </div>
    <div>
      {% if base_info.use_point? && guest_flag %}
        <label id="grant_plan_point_text">付与予定ポイント</label>
        <label id="grant_plan_total_point_text" style="display: none;">付与予定ポイント(合計)</label>
        <span id="grant_plan_point"></span>
        <label id="grant_plan_general_point_text" style="display: none;">付与予定ポイント(通常)</label>
        <span id="grant_plan_general_point" style="display: none;"></span>
        <label id="grant_plan_campaign_point_text" style="display: none;"></label>
        <span id="grant_plan_campaign_point" style="display: none;"></span>
      {% endif %}
    </div>
 
    <div id="subtotal8_row">
      <label>8%対象</label>
      <label>小計</label>
      <span id="subtotal8"></span>
      <label class="discount_area">割引</label>
      <span class="discount_area" id="discount8"></span>
      <label>消費税</label>
      <span id="tax8"></span>
    </div>
 
    <div id="subtotal10_row">
      <label>10%対象</label>
      <label>小計</label>
      <span id="subtotal10"></span>
      <label class="discount_area">割引</label>
      <span class="discount_area" id="discount10"></span>
      <label>消費税</label>
      <span id="tax10"></span>
    </div>
    <div>
      <span id="tax_symbol_texts"></span>
    </div>
    {% for item in (1..max_item_length) %}
      <div id="parsed_caution_{{ forloop.index0 }}" aria-hidden="true"></div>
    {% endfor %}
 
 
    <!-- ギフト設定情報 -->
    {% if gift_order_items.size > 0 %}
      {% for gift_oi in gift_order_items %}
        {% for gift_relation in gift_oi.gift_target_relations %}
          {% if forloop.index0 == 0 %}
            <!-- ギフト商品名 -->
            {{ gift_oi.name_with_tax_and_option_values_presentation }}
          {% endif %}
 
          <!-- ギフト対象商品名 -->
          {{ gift_relation.variant.name_with_option_values_presentation }}
 
          {% if gift_oi.gift.noshi? %}
            <!-- 表書き -->
            {% if gift_relation.description_part_of_noshi != blank %}
              {{ gift_relation.description_part_of_noshi }}
            {% endif %}
 
            <!-- 名入れ -->
            {% if gift_relation.name_part_of_noshi != blank %}
              {{ gift_relation.name_part_of_noshi | escape }}
            {% endif %}
          {% endif %}
 
          <!-- ギフト商品個数 -->
          {{ gift_relation.gift_quantity }}
        {% endfor %}
      {% endfor %}
    {% endif %}
 
  </div>
</div>