{"version":3,"file":"DUgc49wO.js","sources":["../../../../components/tha/blocks/homeSwiperV3/homeBanner_v3.vue","../../../../components/tha/blocks/homeSwiperV3/index.vue"],"sourcesContent":["<template>\n    <div\n        :class=\"[\n            'loader-image-transparent relative w-full cursor-pointer lg:bg-black',\n            data.class,\n        ]\"\n        @click=\"data.action\"\n    >\n        <img\n            :src=\"data.img + locale + '.jpg'\"\n            class=\"hidden w-full object-contain lg:block lg:h-full lg:cursor-pointer lg:object-cover lg:px-0 2xl:object-fill\"\n            :alt=\"data.title\"\n            loading=\"lazy\"\n            @click=\"data.action\"\n        />\n        <img\n            :src=\"data.img_mobile + locale + '.jpg'\"\n            class=\"w-full rounded-xl object-contain lg:hidden\"\n            :alt=\"data.title\"\n            loading=\"lazy\"\n            @click=\"data.action\"\n        />\n        <div class=\"banner-info hidden lg:block\">\n            <div class=\"flex items-center\">\n                <div class=\"banner-info__title\">{{ data?.title }}</div>\n                <img\n                    v-if=\"data.imageTitle\"\n                    class=\"banner-info__img\"\n                    :src=\"data.imageTitle\"\n                    alt=\"sport\"\n                />\n            </div>\n            <div class=\"banner-info__sub-title\">{{ data?.subTitle }}</div>\n            <img\n                v-if=\"data.icon\"\n                class=\"banner-info__icon\"\n                :src=\"data.icon\"\n                alt=\"sport\"\n            />\n        </div>\n\n        <div class=\"banner-info-mb block lg:hidden\">\n            <div class=\"flex items-center\">\n                <div class=\"banner-info-mb__title\">{{ data?.titleMobile }}</div>\n                <img\n                    v-if=\"data.imageTitleMobile\"\n                    class=\"banner-info-mb__img\"\n                    :src=\"data.imageTitleMobile\"\n                    alt=\"sport\"\n                />\n            </div>\n            <div class=\"banner-info-mb__sub-title\">\n                {{ data?.subTitleMobile }}\n            </div>\n            <img\n                v-if=\"data.icon\"\n                class=\"banner-info-mb__icon\"\n                :src=\"data.icon\"\n                alt=\"sport\"\n            />\n        </div>\n    </div>\n</template>\n<script setup>\nimport { breakpointsTailwind, useBreakpoints } from '@vueuse/core'\n\nconst { data } = defineProps(['data'])\nconst breakpoints = useBreakpoints(breakpointsTailwind)\nconst largerThanSm = breakpoints.greater('lg') // only larger than sm\nconst imgSrc = ref('')\nconst { isMobile } = useDevice()\nconst { locale } = useI18n({})\nimgSrc.value = isMobile ? data.img_mobile : data.img\n\nwatch(\n    () => largerThanSm.value,\n\n    (newVal, _) => {\n        imgSrc.value = newVal ? data.img : data.img_mobile\n    }\n)\n</script>\n<style scoped lang=\"scss\">\n.banner-default {\n    display: flex;\n    justify-content: center;\n    font-family: 'inter';\n    .banner-info {\n        position: absolute;\n        color: white;\n        width: 100%;\n        max-width: 1512px;\n        padding-top: min(6.82vw, 130px);\n        padding-left: min(7.8125vw, 150px);\n        &__title {\n            font-weight: 600;\n            font-style: normal;\n            font-weight: 600;\n            font-size: min(2.083vw, 40px);\n            line-height: min(3.177vw, 61px);\n            background: linear-gradient(360deg, #fff2ae 17.5%, #f7d936 79.17%);\n            -webkit-background-clip: text;\n            -webkit-text-fill-color: transparent;\n            background-clip: text;\n            text-fill-color: transparent;\n            :deep() {\n                span {\n                    font-weight: 600;\n                    line-height: min(3.1515vw, 60.51px);\n                    font-size: min(2.604vw, 50px);\n                }\n            }\n        }\n        &__sub-title {\n            margin-top: min(0.521vw, 10px);\n            font-size: min(1.0416vw, 20px);\n            line-height: min(1.2604vw, 24.2px);\n        }\n        &__icon {\n            margin-top: min(30px, 1.563vw);\n            height: min(52px, 2.71vw);\n        }\n    }\n    .banner-info-mb {\n        position: absolute;\n        color: white;\n        top: max(16px, 6.451vw);\n        left: max(20px, 8.06451vw);\n        &__title {\n            font-weight: 700;\n            font-size: max(16px, 3.7209vw);\n            line-height: max(4.503vw, 19.36px);\n        }\n        &__sub-title {\n            margin-top: max(2.32558vw, 10px);\n            font-size: max(2.79vw, 12px);\n            line-height: max(3.3767vw, 14.52px);\n        }\n    }\n\n    &-sport {\n        .banner-info {\n            padding-top: min(3.856vw, 74px);\n            &__title {\n                line-height: min(3.784vw, 72.61px);\n                font-size: min(60px, 3.125vw);\n            }\n            &__img {\n                height: min(3.49vw, 67px);\n                margin-left: min(1.615vw, 31px);\n            }\n            &__sub-title {\n                font-weight: 300;\n                font-size: min(1.563vw, 30px);\n                line-height: min(1.891vw, 36.31px);\n            }\n        }\n        .banner-info-mb {\n            top: 6.047vw;\n            left: 4.651vw;\n            &__title {\n                font-size: 4.651vw;\n                line-height: 5.581vw;\n                background: linear-gradient(\n                    360deg,\n                    #fff2ae 17.5%,\n                    #f7d936 79.17%\n                );\n                -webkit-background-clip: text;\n                -webkit-text-fill-color: transparent;\n                background-clip: text;\n            }\n            &__icon {\n                margin-top: 4.651vw;\n                height: 5.581vw;\n            }\n            &__sub-title {\n                font-weight: 400;\n            }\n            &__img {\n                height: 6.977vw;\n                margin-left: 0.93vw;\n            }\n        }\n    }\n    &-two {\n        .banner-info {\n            &__title {\n                line-height: min(3.467vw, 66.56px);\n                font-size: min(55px, 2.865vw);\n            }\n            &__sub-title {\n                max-width: min(351px, 18.281vw);\n                line-height: min(2.206vw, 42.36px);\n                font-size: min(35px, 1.823vw);\n            }\n        }\n        .banner-info-mb {\n            &__title {\n                line-height: 5.581vw;\n                font-size: 4.651vw;\n            }\n            &__sub-title {\n                max-width: 28.837vw;\n                line-height: 3.721vw;\n                font-size: 2.791vw;\n            }\n        }\n    }\n    &-three {\n        .banner-info {\n            &__title {\n                line-height: min(4.097vw, 78.66px);\n                font-size: min(3.385vw, 65px);\n            }\n        }\n    }\n}\n</style>\n","<template>\n    <div\n        class=\"h-full min-h-[136px] overflow-hidden p-2 pb-0 xs:min-h-[150px] md:min-h-[268px] lg:min-h-[200px] lg:p-0 xl:min-h-[246px] 2xl:min-h-[18vw]\"\n    >\n        <Swiper\n            id=\"swiperhomev3\"\n            :modules=\"[Autoplay, Pagination]\"\n            :loop=\"true\"\n            :autoplay=\"{\n                delay: 5000,\n                disableOnInteraction: false,\n            }\"\n            :pagination=\"{\n                clickable: true,\n                el: `#swiper-pagination`,\n            }\"\n            class=\"h-full\"\n        >\n            <SwiperSlide\n                v-for=\"(card, index) in bannersList.filter(\n                    (banner) => banner?.enabled === true\n                )\"\n                :key=\"index\"\n                class=\"relative h-auto rounded-lg\"\n            >\n                <ThaBlocksHomeSwiperV3HomeBannerV3 :data=\"card\" />\n            </SwiperSlide>\n            <div class=\"relative\">\n                <div\n                    id=\"swiper-pagination\"\n                    class=\"absolute !left-1/2 z-10 h-7 !w-24 -translate-x-7\"\n                ></div>\n            </div>\n        </Swiper>\n    </div>\n</template>\n\n<script setup>\nimport { Autoplay, Pagination } from 'swiper/modules'\n// import { useModalStore, useUserStore, useGamesStore } from '~/stores'\n// const useModalStoreInstance = useModalStore()\n// const useUserStoreInstance = useUserStore()\n// const useGamesStoreInstance = useGamesStore()\n// const { getGameUrl } = useGamesStoreInstance\n// const { showLoginModal, showPromoBtiModal } = storeToRefs(useModalStoreInstance)\n// const { isLoggedIn } = storeToRefs(useUserStoreInstance)\n// const { t } = useI18n({})\n// the banners as components\nconst staticUrl = useRuntimeConfig().public.staticUrl\n// const { isMobile } = useDevice()\n\nconst bannersList = computed(() => {\n    return [\n        {\n            img: staticUrl + '/assets/img/banner/euro/banner-11-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-11-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/sports-cashback'),\n            class: '',\n            enabled: true,\n        },\n        {\n            // slots\n            img: staticUrl + '/assets/img/banner/euro/banner-13-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-13-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/slots-rebate'),\n            class: '',\n            enabled: true,\n        },\n        {\n            // weekly\n            img: staticUrl + '/assets/img/banner/euro/banner-9-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-9-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/weekly-rebate'),\n            class: '',\n            enabled: true,\n        },\n        {\n            // daily\n            img: staticUrl + '/assets/img/banner/euro/banner-10-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-10-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/daily-rebate'),\n            class: '',\n            enabled: true,\n        },\n\n        {\n            // bti\n            img: staticUrl + '/assets/img/banner/euro/banner-8-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-8-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/bti-risk-free'),\n            class: '',\n            enabled: true,\n        },\n        // {\n        //     // bti gamification\n        //     img: staticUrl + '/assets/img/banner/euro/banner-7-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-7-mobile-',\n        //     title: '',\n        //     subTitle: '',\n        //     titleMobile: '',\n        //     subTitleMobile: ``,\n        //     action: async () => {\n        //         if (isMobile) {\n        //             if (isLoggedIn.value) {\n        //                 const toSend = {\n        //                     partnerProvider: 'bti',\n        //                 }\n        //                 const { data } = await getGameUrl(toSend)\n        //                 if (data.value.status === 'OK') {\n        //                     const { url } = data.value.data\n        //                     setTimeout(() => {\n        //                         window.open(url, '_blank')\n        //                     })\n        //                 }\n        //             } else {\n        //                 showLoginModal.value = true\n        //             }\n        //         } else {\n        //             showPromoBtiModal.value = true\n        //         }\n        //     },\n        //     class: '',\n        //     enabled: true,\n        // },\n\n        // {\n        //     // euro\n        //     img: staticUrl + '/assets/img/banner/euro/banner-3-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-3-mobile-',\n        //     title: '',\n        //     subTitle: '',\n        //     titleMobile: '',\n        //     subTitleMobile: ``,\n        //     action: () => navigateTo('/promotions/8-percent'),\n        //     class: '',\n        // },\n\n        // {\n        //     img: staticUrl + '/assets/img/banner/euro/banner-4-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-4-mobile-',\n        //     title: '',\n        //     subTitle: '',\n        //     titleMobile: '',\n        //     subTitleMobile: ``,\n        //     action: async () => {\n        //         if (isLoggedIn.value) {\n        //             if (isMobile) {\n        //                 const toSend = {\n        //                     partnerProvider: 'bti',\n        //                 }\n        //                 const { data } = await getGameUrl(toSend)\n        //                 if (data.value.status === 'OK') {\n        //                     const { url } = data.value.data\n        //                     setTimeout(() => {\n        //                         window.open(url, '_blank')\n        //                     })\n        //                 }\n        //             } else {\n        //                 navigateTo('/btisports')\n        //             }\n        //         } else {\n        //             showLoginModal.value = true\n        //         }\n        //     },\n        //     class: '',\n        // },\n        // {\n        //     // 8 percent\n        //     img: staticUrl + '/assets/img/banner/euro/banner-1-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-1-mobile-',\n        //     title: '',\n        //     subTitle: '',\n        //     titleMobile: '',\n        //     subTitleMobile: ``,\n        //     action: () => navigateTo('/promotions/8-percent'),\n        //     class: '',\n        // },\n        // {\n        //     // welcome\n        //     img: staticUrl + '/assets/img/banner/euro/banner-5-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-5-mobile-',\n        //     title: t('home.banner.welcome_title'),\n        //     subTitle: t('home.banner.welcome_subtitle'),\n        //     titleMobile: t('home.banner.welcome_title_mb'),\n        //     subTitleMobile: `${t('home.banner.welcome_subtitle_mb')\n        //         .split('\\n')\n        //         .join('<br>')}`,\n        //     action: () => navigateTo('/promotions/bonus-100percent'),\n        //     class: '',\n        // },\n        {\n            // welcome\n            img: staticUrl + '/assets/img/banner/euro/banner-12-',\n            img_mobile: staticUrl + '/assets/img/banner/euro/banner-12-mobile-',\n            title: '',\n            subTitle: '',\n            titleMobile: '',\n            subTitleMobile: ``,\n            action: () => navigateTo('/promotions/bonus-100percent'),\n            class: '',\n            enabled: true,\n        },\n        // {\n        //     // choose fox\n        //     img: staticUrl + '/assets/img/banner/euro/banner-2-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-2-mobile-',\n        //     title: '',\n        //     subTitle: '',\n        //     titleMobile: '',\n        //     subTitleMobile: ``,\n        //     action: () => navigateTo('/sports'),\n        //     class: '',\n        //     enabled: true,\n        // },\n\n        // {\n        //     // livecasino\n        //     img: staticUrl + '/assets/img/banner/euro/banner-6-',\n        //     img_mobile: staticUrl + '/assets/img/banner/euro/banner-6-mobile-',\n        //     title: t('home.banner.live_casino_title'),\n        //     subTitle: `${t('home.banner.live_casino_subtitle')\n        //         .split('\\n')\n        //         .join('<br>')}`,\n        //     titleMobile: t('home.banner.live_casino_title'),\n        //     subTitleMobile: `${t('home.banner.live_casino_subtitle')\n        //         .split('\\n')\n        //         .join('<br>')}`,\n        //     action: () => navigateTo('/casino/all?partner='),\n        //     class: 'banner-default banner-default-sport banner-default-three',\n        // },\n    ]\n})\n</script>\n<style lang=\"scss\" scoped>\n:deep() {\n    #swiperhomev3 .swiper-pagination-bullet {\n        border: none;\n        background: rgba(255, 255, 255, 0.2) !important;\n        margin: 0 2px !important;\n        @media screen and (min-width: 1024px) {\n            width: 8px;\n            height: 8px;\n        }\n        @media screen and (max-width: 1023px) {\n            width: 0.93vw;\n            height: 0.93vw;\n        }\n    }\n    #swiperhomev3 .swiper-pagination-bullet-active {\n        background: rgba(255, 255, 255, 0.5) !important;\n    }\n}\n</style>\n"],"names":["largerThanSm","useBreakpoints","breakpointsTailwind","imgSrc","ref","isMobile","useDevice","locale","useI18n","__props","watch","newVal","_","staticUrl","useRuntimeConfig","bannersList","computed","navigateTo"],"mappings":"isBAoEA,MAAMA,EADcC,EAAeC,CAAmB,EACrB,QAAQ,IAAI,EACvCC,EAASC,EAAI,EAAE,EACf,CAAE,SAAAC,CAAU,EAAGC,EAAS,EACxB,CAAE,OAAAC,CAAM,EAAKC,EAAQ,CAAE,CAAA,EAC7B,OAAAL,EAAO,MAAQE,EAAWI,EAAI,KAAC,WAAaA,EAAI,KAAC,IAEjDC,EACI,IAAMV,EAAa,MAEnB,CAACW,EAAQC,IAAM,CACXT,EAAO,MAAQQ,EAASF,EAAI,KAAC,IAAMA,EAAA,KAAK,UAChD,CACA,klDChCA,MAAMI,EAAYC,EAAkB,EAAC,OAAO,UAGtCC,EAAcC,EAAS,IAClB,CACH,CACI,IAAKH,EAAY,qCACjB,WAAYA,EAAY,4CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,6BAA6B,EACtD,MAAO,GACP,QAAS,EACZ,EACD,CAEI,IAAKJ,EAAY,qCACjB,WAAYA,EAAY,4CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,0BAA0B,EACnD,MAAO,GACP,QAAS,EACZ,EACD,CAEI,IAAKJ,EAAY,oCACjB,WAAYA,EAAY,2CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,2BAA2B,EACpD,MAAO,GACP,QAAS,EACZ,EACD,CAEI,IAAKJ,EAAY,qCACjB,WAAYA,EAAY,4CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,0BAA0B,EACnD,MAAO,GACP,QAAS,EACZ,EAED,CAEI,IAAKJ,EAAY,oCACjB,WAAYA,EAAY,2CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,2BAA2B,EACpD,MAAO,GACP,QAAS,EACZ,EAkGD,CAEI,IAAKJ,EAAY,qCACjB,WAAYA,EAAY,4CACxB,MAAO,GACP,SAAU,GACV,YAAa,GACb,eAAgB,GAChB,OAAQ,IAAMI,EAAW,8BAA8B,EACvD,MAAO,GACP,QAAS,EACZ,CA6BT,CACC"}