{"version":3,"file":"HardwareCheckout-DRzSreva.js","sources":["../../../src/components/Checkout/HardwareCheckout.vue"],"sourcesContent":["<template>\n    <div v-if=\"selectedHardware\">\n        <h3 class=\"text-lg font-semibold my-4\">Equipment Order</h3>\n        <LineItem>\n            <template #default>\n                {{ selectedHardware.label }}\n            </template>\n            <template #description>\n                {{ selectedHardware.description }}\n            </template>\n            <template #price>\n                {{ formatCurrency(selectedHardware.price) }}\n                <span v-if=\"selectedHardware.max_quantity !== 1\">/ea</span>\n            </template>\n        </LineItem>\n\n        <div\n            v-if=\"false && selectedHardware.max_quantity !== 1\"\n            class=\"flex gap-6 items-center my-4\"\n        >\n            <div class=\"mb-1 mt-2 border-gray-200 h-2 border-t\"></div>\n            <label for=\"hardwareQty\" class=\"font-medium text-zinc-900\"> Qty </label>\n            <select\n                id=\"hardwareQty\"\n                name=\"hardwareQty\"\n                v-model=\"store.$state.selectedHardwareQty\"\n                class=\"rounded-md border-0 py-1.5 pl-3 pr-10 text-zinc-900 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-primary-500 sm:text-sm sm:leading-6\"\n                :disabled=\"cart.$state.couponPromo ? true : false\"\n            >\n                <option v-for=\"i in 20\" :value=\"i\" :key=\"i\">\n                    {{ i }}\n                </option>\n            </select>\n            <div class=\"flex-auto text-right\">x {{ store.$state.selectedHardwareQty }}</div>\n        </div>\n\n        <div class=\"mb-1 mt-2 border-gray-200 h-2 border-t\"></div>\n\n        <div class=\"my-4\">\n            <RadioInput\n                v-model=\"cart.$state.shipping\"\n                label=\"Shipping method\"\n                name=\"shipping-method\"\n                :options=\"shippingOptionsFormatted\"\n            />\n        </div>\n\n        <div class=\"mb-1 mt-2 border-gray-200 h-2 border-t\"></div>\n\n        <!-- TOTALS -->\n        <TotalSection />\n\n        <div class=\"mb-1 mt-2 border-gray-200 h-2 border-t\"></div>\n\n        <StripeElements\n            v-if=\"selectedHardware\"\n            :handler=\"paymentHandler\"\n            :validatorFn=\"prePaymentValidator\"\n        />\n\n        <!-- PAYMENT MODAL -->\n        <ProgressModal\n            v-if=\"state.showProgressModal\"\n            :steps=\"steps\"\n            :loading=\"state.showProgressModal\"\n        >\n            <template v-if=\"state.orderComplete\">\n                <p class=\"text-center my-6\">\n                    <template v-if=\"redirectCountDown >= 0\">\n                        You will be redirected in {{ redirectCountDown }} seconds\n                    </template>\n                    <template v-else> Redirecting you now... </template>\n                </p>\n                <a class=\"button button--primary\" :href=\"state.orderCompletePage\">\n                    Click here to Get Started!\n                </a>\n            </template>\n        </ProgressModal>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useCheckoutStore } from '@/store/checkout'\nimport { useCartStore } from '@/store/cart'\nimport TotalSection from '@/components/Shared/TotalSection.vue'\nimport { createHardwareOrder } from '@/api/memberships'\nimport { trackOrder } from '@/utils/trackers'\nimport { computed, reactive, ref } from 'vue'\nimport { formatCurrency } from '@/utils/currency'\nimport { shipping as shippingOptions } from '@/data'\nimport RadioInput from '@/components/Form/RadioInput.vue'\nimport { isValidEmail } from '@/api/memberships'\nimport ProgressModal from '../Shared/ProgressModal.vue'\nimport StripeElements from '../Shared/StripeElements.vue'\nimport LineItem from '../Shared/LineItem.vue'\n\nconst store = useCheckoutStore()\nconst cart = useCartStore()\nconst state = reactive({\n    paymentComplete: false,\n    equipmentComplete: false,\n    trackingComplete: false,\n    finalizingComplete: false,\n    orderComplete: false,\n    trackingResponse: {\n        tracked: [] as any[],\n        errors: [] as unknown[],\n    },\n    redirectInterval: null as number | null,\n    showProgressModal: false,\n    orderCompletePage: `/order-submitted/${document.location.search}`,\n})\n\nconst selectedHardware = computed(() => {\n    return cart.selectedHardware?.[0]\n})\n\nconst shippingOptionsFormatted = (selectedHardware.value?.shipping_options || shippingOptions).map((option) => {\n    return {\n        ...option,\n        price: option.price === 0 ? 'Free' : `${formatCurrency(option.price)}`,\n    }\n})\n\nconst redirectCountDown = ref(5)\n\nconst steps = computed((): ProgressStep[] => [\n    {\n        name: 'Verifying payment',\n        status: state.paymentComplete ? 'complete' : 'current',\n    },\n    {\n        name: 'Processing order',\n        status: !state.paymentComplete\n            ? 'upcoming'\n            : state.equipmentComplete\n                ? 'complete'\n                : 'current',\n    },\n    {\n        name: 'Order complete',\n        status: !state.finalizingComplete\n            ? 'upcoming'\n            : state.orderComplete\n                ? 'complete'\n                : 'current',\n    },\n])\n\nconst redirect = () => {\n    window.location.href = state.orderCompletePage\n}\n\nconst finalizeOrder = () => new Promise((resolve) => {\n    setTimeout(() => {\n        state.trackingComplete = true\n        setTimeout(() => {\n            state.finalizingComplete = true\n            setTimeout(() => {\n                state.orderComplete = true\n                state.redirectInterval = window.setInterval(() => {\n                    if (redirectCountDown.value <= 1) {\n                        if (state.redirectInterval) {\n                            clearInterval(state.redirectInterval)\n                        }\n                        state.showProgressModal = false\n                        redirect()\n                    }\n                    redirectCountDown.value--\n                }, 1000)\n                resolve(true)\n            }, 350)\n        }, 250)\n    }, 150)\n})\n\nconst handleTracking = (membershipOrder: any, equipmentOrder: any) => {\n    try {\n        state.trackingResponse = trackOrder(membershipOrder, equipmentOrder)\n    } catch (error) {\n        console.error(error)\n    }\n}\n\nconst resetProgress = () => {\n    state.paymentComplete = false\n    state.equipmentComplete = false\n    state.trackingComplete = false\n    state.finalizingComplete = false\n    state.orderComplete = false\n    state.trackingResponse = {\n        tracked: [],\n        errors: [],\n    }\n    state.redirectInterval = null\n    state.showProgressModal = false\n}\n\nconst handleEquipmentPurchase = async(paymentMethodId: string, stripeCustomerId: string) => {\n    const params = store.getCheckoutParams()\n    const orderParams = {\n        ...params,\n        payment_method: paymentMethodId || store.$state.paymentMethodId,\n        customer_id: stripeCustomerId || store.$state.stripeCustomerId || undefined,\n        account_id: store.$state.accountId || undefined,\n    }\n    const orderResponse = await createHardwareOrder(orderParams)\n    state.equipmentComplete = true\n    return orderResponse\n}\n\nconst prePaymentValidator = async(): Promise<boolean> => {\n    const isEmailValid = isValidEmail(store.$state.email)\n    if (!isEmailValid) {\n        return Promise.reject('Please enter a valid email address')\n    }\n    return Promise.resolve(true)\n}\n\nconst paymentHandler = async(paymentMethodId: string, stripeCustomerId: string) => {\n    state.showProgressModal = true\n    setTimeout(() => {\n        state.paymentComplete = true\n    }, 500)\n    try {\n        const equipmentOrder = await handleEquipmentPurchase(paymentMethodId, stripeCustomerId)\n        handleTracking(null, equipmentOrder)\n        await finalizeOrder()\n        store.$state.steps.paymentMethod.complete = true\n        return Promise.resolve(true)\n    } catch (e: any) {\n        resetProgress()\n        if (e?.message && typeof e.message === 'string') {\n            try {\n                const message = JSON.parse(e.message || '{}')\n                if (message?.message) {\n                    throw new Error(message.message)\n                }\n            } catch (error) {\n                //throw e\n            }\n        } else if (e?.message && typeof e.message !== 'string') {\n            console.error(e)\n            throw new Error('Something went wrong. Please contact support')\n        }\n        throw e\n    }\n}\n</script>\n"],"names":["store","useCheckoutStore","cart","useCartStore","state","reactive","selectedHardware","computed","_a","shippingOptionsFormatted","shippingOptions","option","formatCurrency","redirectCountDown","ref","steps","redirect","finalizeOrder","resolve","handleTracking","membershipOrder","equipmentOrder","trackOrder","error","resetProgress","handleEquipmentPurchase","paymentMethodId","stripeCustomerId","orderParams","orderResponse","createHardwareOrder","prePaymentValidator","isValidEmail","paymentHandler","e","message"],"mappings":"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"}