{"version":3,"file":"vcs-new-modal-discount-83ed2318.js","sources":["../../../resources/js/components/vcs-new-modal-discount.vue"],"sourcesContent":["<script>\nexport default {\n    name: \"vcs-new-modal-discount\",\n    data: function () {\n        return {\n            errors: {\n                email: null,\n                name: null,\n            },\n            discountForm: true,\n            input: {\n                email: '',\n                name: '',\n            },\n            success: false,\n            successCallback: null,\n        };\n    },\n    methods: {\n        next: function () {\n            // Store in local storage\n            localStorage.setItem('discountForm', false);\n\n            if (this.successCallback)\n                return this.successCallback();\n            this.discountForm = false;\n        },\n        opened: function () {\n            if (!this.discountForm &&\n                this.successCallback)\n                return this.successCallback();\n        },\n        setSuccessCallback: function (callback) {\n            this.successCallback = callback;\n        },\n        submit: function () {\n            // Reset errors\n            this.errors.email = null;\n            this.errors.name = null;\n\n            // Validate email\n            if (!this.input.email)\n                return this.errors.email = 'empty';\n            if (!this.input.email.includes('@') ||\n                !this.input.email.includes('.'))\n                return this.errors.email = 'invalid';\n\n            // Validate name\n            if (!this.input.name)\n                return this.errors.name = 'empty';\n\n\n            Vue.axios.post('/api/cart/discount', {\n                name: this.input.name,\n                email: this.input.email,\n            })\n                .then((response) => {\n                    this.$emit('success');\n\n                    if (this.successCallback)\n                        return this.successCallback();\n\n                    this.discountForm = false;\n                    this.success = true;\n                });\n        },\n    },\n    props: {\n        productUuid: {\n            default: null,\n            required: true,\n            type: String,\n        },\n        src: {\n            default: null,\n            required: false,\n            type: String,\n        }\n    },\n    mounted() {\n        // Check local storage\n        if (localStorage.getItem('discountForm') !== null)\n            this.next();\n\n        Vue.axios.get('/api/cart/get')\n            .then((response) => {\n                if (!response.data.cart.user ||\n                    response.data.cart.user.type !== 'guest' ||\n                    (response.data.cart.discount_email && response.data.cart.discount_name))\n                    this.discountForm = false;\n            });\n    },\n}\n</script>\n\n<template>\n    <div>\n        <div v-if=\"discountForm\"\n             class=\"p-4\">\n            <div class=\"flex flex-col gap-4\n                        lg:flex-row\">\n                <div class=\"aspect-video bg-center bg-cover bg-[image:--src] w-full\n                            lg:aspect-auto lg:w-1/2\"\n                     v-bind:style=\"{'--src': 'url(' + src + ')' }\"\n                     v-if=\"src\"></div>\n                <form class=\"flex-grow lg:p-10\"\n                      v-on:submit.prevent=\"submit\">\n                    <strong class=\"block font-bold mb-4 text-4xl text-center\">\n                        Get 30% Off<br>\n                        Your First Order!\n                    </strong>\n                    <p class=\"mb-4 text-xl text-center text-neutral-500\">\n                        Enter your name and e-mail below.\n                    </p>\n                    <input autocomplete=\"name\"\n                           class=\"form-input mb-2 rounded w-full focus:outline-none focus:shadow-none\"\n                           placeholder=\"First name\"\n                           type=\"text\"\n                           v-model=\"input.name\">\n                    <input autocomplete=\"email\"\n                           class=\"form-input mb-2 rounded w-full focus:outline-none focus:shadow-none\"\n                           placeholder=\"Email address\"\n                           type=\"email\"\n                           v-model=\"input.email\">\n                    <p v-if=\"errors.name === 'empty'\"\n                       class=\"mb-2 text-red-500 text-center\">\n                        Please enter your name\n                    </p>\n                    <p v-if=\"errors.email === 'empty'\"\n                       class=\"mb-2 text-red-500 text-center\">\n                        Please enter your e-mail address\n                    </p>\n                    <p v-if=\"errors.email === 'invalid'\"\n                       class=\"mb-2 text-red-500 text-center\">\n                        Please enter a valid e-mail address\n                    </p>\n                    <button\n                        class=\"block border border-primary-600 bg-primary-600 cursor-pointer font-bold mb-3 px-8 pt-2 pb-3 rounded text-2xl text-center text-white w-full\"\n                        type=\"submit\">\n                        Get 30% Off Now\n                    </button>\n                    <p class=\"cursor-pointer mt-4 text-center text-neutral-500\"\n                       v-on:click=\"next\">\n                        No discount, thanks\n                    </p>\n                </form>\n            </div>\n        </div>\n        <div class=\"p-4\" v-else>\n            <div class=\"bg-action-200 font-bold mb-4 p-4 rounded text-action-800 w-full\"\n                 v-if=\"success\">\n                We'll send you an e-mail with your discount code now!\n            </div>\n\n            <div class=\"flex flex-col gap-4 max-h-[calc(100vh-8em)] overflow-y-auto\n                        lg:flex-row\">\n                <div class=\"bg-neutral-100 flex flex-col gap-4 p-4 rounded-lg w-full\n                            lg:w-1/2\">\n                    <div>\n                        <strong class=\"block text-2xl\">\n                            Buy now\n                        </strong>\n                        <p>\n                            For a quick and easy purchase. Add the video at home and give the card to your loved one\n                            yourself.\n                        </p>\n                    </div>\n                    <ul class=\"flex-grow order-last lg:order-none\">\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Shipped directly to you\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Load videos yourself\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Free shipping available\n                        </li>\n                    </ul>\n                    <strong class=\"block text-center text-action-700 text-2xl\">\n                        $29.95\n                    </strong>\n                    <vcs-new-item-create class=\"block\"\n                                         v-bind:product-uuid=\"productUuid\">\n                        <template v-slot=\"create\">\n                            <button\n                                class=\"border border-action-500 bg-action-500 cursor-pointer font-bold px-8 pb-3 pt-2 rounded text-2xl text-center text-white w-full\"\n                                v-on:click=\"create.create(null, true)\">\n                                Buy now\n                            </button>\n                        </template>\n                    </vcs-new-item-create>\n                </div>\n                <div class=\"bg-neutral-100 flex flex-col gap-4 order-first p-4 rounded-lg w-full\n                            lg:order-none lg:w-1/2\">\n                    <div>\n                        <strong class=\"block text-2xl\">\n                            Personalize online\n                        </strong>\n                        <p>\n                            Personalize the layout, upload or record your video in our system. We'll load it onto your\n                            video\n                            card and send it directly to your loved one or your doorstep\n                        </p>\n                    </div>\n                    <ul class=\"flex-grow order-last lg:order-none\">\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Easy-to-use online video card builder\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Upload or record videos directly onto the video card\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            We'll load your video's onto the card\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Include personal message\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Add photos and images\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Add stickers\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Shipped to you or your recipient\n                        </li>\n                        <li class=\"flex\">\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\n                                 class=\"inline w-6 h-6 shrink-0\">\n                                <path fill-rule=\"evenodd\"\n                                      d=\"M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z\"\n                                      clip-rule=\"evenodd\"/>\n                            </svg>\n                            Free shipping available\n                        </li>\n                    </ul>\n                    <strong class=\"block text-center text-action-700 text-2xl\">\n                        $37.95\n                    </strong>\n                    <vcs-new-item-create class=\"block\"\n                                         v-bind:product-uuid=\"productUuid\">\n                        <template v-slot=\"create\">\n                            <button\n\n                                class=\"border border-action-500 bg-action-500 cursor-pointer font-bold px-8 pb-3 pt-2 rounded text-2xl text-center text-white w-full\"\n                                v-on:click=\"create.create\">\n                                Personalize now\n                            </button>\n                        </template>\n                    </vcs-new-item-create>\n                </div>\n            </div>\n        </div>\n    </div>\n</template>\n\n<style scoped>\n\n</style>"],"names":["_sfc_main","callback","response"],"mappings":"0DACA,MAAAA,EAAA,CACA,KAAA,yBACA,KAAA,UAAA,CACA,MAAA,CACA,OAAA,CACA,MAAA,KACA,KAAA,IACA,EACA,aAAA,GACA,MAAA,CACA,MAAA,GACA,KAAA,EACA,EACA,QAAA,GACA,gBAAA,IACA,CACA,EACA,QAAA,CACA,KAAA,UAAA,CAIA,GAFA,aAAA,QAAA,eAAA,EAAA,EAEA,KAAA,gBACA,OAAA,KAAA,kBACA,KAAA,aAAA,EACA,EACA,OAAA,UAAA,CACA,GAAA,CAAA,KAAA,cACA,KAAA,gBACA,OAAA,KAAA,iBACA,EACA,mBAAA,SAAAC,EAAA,CACA,KAAA,gBAAAA,CACA,EACA,OAAA,UAAA,CAMA,GAJA,KAAA,OAAA,MAAA,KACA,KAAA,OAAA,KAAA,KAGA,CAAA,KAAA,MAAA,MACA,OAAA,KAAA,OAAA,MAAA,QACA,GAAA,CAAA,KAAA,MAAA,MAAA,SAAA,GAAA,GACA,CAAA,KAAA,MAAA,MAAA,SAAA,GAAA,EACA,OAAA,KAAA,OAAA,MAAA,UAGA,GAAA,CAAA,KAAA,MAAA,KACA,OAAA,KAAA,OAAA,KAAA,QAGA,IAAA,MAAA,KAAA,qBAAA,CACA,KAAA,KAAA,MAAA,KACA,MAAA,KAAA,MAAA,KACA,CAAA,EACA,KAAAC,GAAA,CAGA,GAFA,KAAA,MAAA,SAAA,EAEA,KAAA,gBACA,OAAA,KAAA,kBAEA,KAAA,aAAA,GACA,KAAA,QAAA,EACA,CAAA,CACA,CACA,EACA,MAAA,CACA,YAAA,CACA,QAAA,KACA,SAAA,GACA,KAAA,MACA,EACA,IAAA,CACA,QAAA,KACA,SAAA,GACA,KAAA,MACA,CACA,EACA,SAAA,CAEA,aAAA,QAAA,cAAA,IAAA,MACA,KAAA,KAAA,EAEA,IAAA,MAAA,IAAA,eAAA,EACA,KAAAA,GAAA,EACA,CAAAA,EAAA,KAAA,KAAA,MACAA,EAAA,KAAA,KAAA,KAAA,OAAA,SACAA,EAAA,KAAA,KAAA,gBAAAA,EAAA,KAAA,KAAA,iBACA,KAAA,aAAA,GACA,CAAA,CACA,CACA"}