<template>
  <b-row>
    <b-col cols="12" class="order-1" :class="{ 'order-2': !showItemsMobile, 'col-lg-9 pr-lg-3': showSummary }">
      <slot name="items">
        <order-item
          class="order-items mb-4"
          :class="{ 'd-sm-d-none': !showItemsMobile }"
          :show-item-image="showItemImage"
          :show-item-cv="showItemCv"
          :order-item="orderItem"
          :show-note-for-foc-pwp-items="showNoteForFocPwpItems"
          :currency-symbol="currencySymbol"
          :has-cv-transfer-option="hasCvTransfer"
          v-model="value.cvTransferList"
          :show-remove-cart-item="showRemoveCartItem"
        />
        <slot />
      </slot>
    </b-col>
    <b-col cols="12" lg="3" class="order-2 mb-3" :class="{ 'order-1': !showItemsMobile }" v-if="showSummary">
      <div :class="{ 'sticky-top': stickySummary }">
        <order-summary
          :show-pay-cycle="$appSettings.evo.enable"
          :pay-cycle="payCycle"
          class="order-summary"
          :summary-count="summaryCount"
          :summary-amount="summaryAmount"
          :show-ewallet="showEwallet"
          :ewallet-amount="ewalletAmount"
          :grand-total="grandTotal"
          :show-continue-button="showContinueButton"
          :continue-action="continueAction"
          @continueAction="
            () => {
              $emit('continueAction')
            }
          "
          :continue-text="continueText"
          :continue-disabled="continueDisabled"
          :show-promo-code="showPromoCode"
          :promo-code="promoCode"
          :apply-promo-code="applyPromoCode"
          :currency-symbol="currencySymbol"
          :summary-redeem="(showRedeemSummary && summaryRedeem) || []"
        />
      </div>
    </b-col>
  </b-row>
</template>
<script>
import orderItem from '../blocks/OrderItem'
import orderSummary from '../blocks/OrderSummary'
import OrderPageTemplatePropsMixin from '../../mixins/orderPageTemplatePropsMixin'

export default {
  name: 'OrderPageTemplate',
  mixins: [OrderPageTemplatePropsMixin],
  props: {
    showRemoveCartItem: { type: Boolean, default: false },
    showSummary: { type: Boolean, default: true },
    hasCvTransfer: { type: Boolean, default: false },
    value: {
      type: Object,
      default: () => ({
        cvTransferList: [],
      }),
    },
    stickySummary: { type: Boolean, default: true },
    showRedeemSummary: { type: Boolean, default: false },
  },
  components: {
    orderItem,
    orderSummary,
  },
  data() {
    return {
      localShippingInfo: {
        continueDisabled: true,
      },
      loadingData: true,
      cvTransferList: [],
    }
  },
  methods: {
    getData() {
      return {
        cvTransferList: this.cvTransferList,
      }
    },
  },
  watch: {
    value: {
      handler(val) {
        this.$emit('input', val)
      },
      deep: true,
    },
  },
}
</script>
