<template>
    <div class="checkoutButtonWrap primaryCheckoutButton">
        <button
            type="submit"
            name="submit[checkout]"
            v-if="canCheckout"
            @click.prevent="onCheckout"
            :disabled="busy"
            id="shipPayment"
            class="button"
        >
            Review and pay
        </button>
    </div>
</template>

<script>
export default {
    name: 'checkout-actions',

    props: {
        loaded: {
            type: Boolean,
            default: false
        },
        busy: {
            type: Boolean,
            default: false
        },
        basket: {
            type: Object,
            required: true
        }
    },

    computed: {
        canCheckout() {
            return this.loaded &&
                !this.basket.stock_error &&
                !this.basket.general_error;
        }
    },

    methods: {
        onCheckout() {
            this.$emit('try-checkout');
        }
    }
};
</script>
