{"version":3,"file":"products.d198a1f3.js","sources":["../../../app/javascript/components/products/Products.vue?vue&type=template&lang.js","../../../app/javascript/components/products/Products.vue","../../../app/javascript/entrypoints/products.js"],"sourcesContent":["\n<div>\n    <ul class=\"nav nav-tabs justify-content-center\" id=\"ProductsTab\" role=\"tablist\">\n        <li v-for=\"section in options\"\n            class=\"nav-item product-menu\" @click=\"setNewSection( section.slug_url )\"\n            :class=\"'product-menu-4'\">\n            <a class=\"nav-link h-100 d-flex flex-column justify-content-center\"\n               :class=\"[currentSection === section.slug_url ? 'active' : '']\" role=\"tab\">\n                <img v-if=\"section.titulo === 'Todos'\" loading=\"lazy\" :src=\"section.imagen.public_path\" :alt=\"section.imagen.alt\" :width=\"50\" :height=\"50\">\n                <img v-else loading=\"lazy\" :src=\"section.imagen.public_path\" :alt=\"section.imagen.alt\" :width=\"50\" :height=\"59\">\n                <span>{{section.titulo}}</span>\n            </a>\n        </li>\n    </ul>\n    <div class=\"tab-content\" id=\"ProductsTabContent\" v-if=\"products.length > 0\">\n        <div class=\"tab-pane fade show active\" id=\"dinero\" role=\"tabpanel\" aria-labelledby=\"dinero-tab\">\n            <Products :products=\"orderProducts\"/>\n        </div>\n    </div>\n</div>\n","<template>\r\n    <div>\r\n        <ul class=\"nav nav-tabs justify-content-center\" id=\"ProductsTab\" role=\"tablist\">\r\n            <li v-for=\"section in options\"\r\n                class=\"nav-item product-menu\" @click=\"setNewSection( section.slug_url )\"\r\n                :class=\"'product-menu-4'\">\r\n                <a class=\"nav-link h-100 d-flex flex-column justify-content-center\"\r\n                   :class=\"[currentSection === section.slug_url ? 'active' : '']\" role=\"tab\">\r\n                    <img v-if=\"section.titulo === 'Todos'\" loading=\"lazy\" :src=\"section.imagen.public_path\" :alt=\"section.imagen.alt\" :width=\"50\" :height=\"50\">\r\n                    <img v-else loading=\"lazy\" :src=\"section.imagen.public_path\" :alt=\"section.imagen.alt\" :width=\"50\" :height=\"59\">\r\n                    <span>{{section.titulo}}</span>\r\n                </a>\r\n            </li>\r\n        </ul>\r\n        <div class=\"tab-content\" id=\"ProductsTabContent\" v-if=\"products.length > 0\">\r\n            <div class=\"tab-pane fade show active\" id=\"dinero\" role=\"tabpanel\" aria-labelledby=\"dinero-tab\">\r\n                <Products :products=\"orderProducts\"/>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\nimport Products from \"../templates/Products.vue\";\r\nimport { trackClick } from \"@/helpers/clickTracker\";\r\n\r\nexport default {\r\n    components: {Products},\r\n    props: {\r\n        products: {\r\n            type: Array,\r\n            default: () => []\r\n        },\r\n        options:{ type : Array}\r\n    },\r\n    data() {\r\n        return {\r\n            currentSection: 'all',\r\n            selectedProducts: this.products\r\n        }\r\n    },\r\n    created() {\r\n        let uri = window.location.search.substring(1)\r\n        let params = new URLSearchParams(uri)\r\n        let section = params.get('tipo')\r\n        let slugSections = this.options.map(section => section.slug_url)\r\n        if (section && slugSections.includes(section))\r\n            this.setNewSection(section)\r\n    },\r\n    watch: {\r\n        currentSection(newValue, oldValue){\r\n            if(newValue === 'all') return this.selectedProducts = this.products;\r\n            this.products.map(product => {\r\n                product.taxonomies['slug']\r\n            })\r\n            this.selectedProducts = this.products.filter(product => this.haveSection(product,newValue))\r\n        }\r\n    },\r\n    methods: {\r\n        trackClick,\r\n        setNewSection(section) {\r\n            if (this.currentSection !== section) this.currentSection = section\r\n            trackClick('Descubre_los_productos_Presta_Prenda', `Filtro_${section}`)\r\n        },\r\n        haveSection(product, section){\r\n            if (!product.taxonomies ) return false;\r\n            let taxonomies = product.taxonomies\r\n            let sections = taxonomies.filter( taxonomi => taxonomi.slug === section)\r\n            return sections.length > 0\r\n        }\r\n    },\r\n    computed: {\r\n        orderProducts() {\r\n            return this.selectedProducts.sort((a, b) => a.order - b.order);\r\n        },\r\n    }\r\n}\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n#ProductsTab {\r\n    border-bottom: 0;\r\n    @media (max-width: 570px) {\r\n        margin-bottom: 20px !important;\r\n    }\r\n    .product-menu {\r\n        width: 20%;\r\n        padding: 0 5px;\r\n        @media (max-width: 845px) {\r\n            width: 33%;\r\n        }\r\n        @media (max-width: 570px) {\r\n            width: 50%;\r\n            margin-bottom: 6px !important;\r\n        }\r\n    }\r\n    .product-menu-4 {\r\n        width: 15%;\r\n        padding: 0 5px;\r\n        @media (max-width: 845px) {\r\n            width: 50%;\r\n        }\r\n        @media (max-width: 570px) {\r\n            width: 50%;\r\n            margin-bottom: 6px !important;\r\n        }\r\n    }\r\n    .product-menu {\r\n        cursor: pointer;\r\n        margin-bottom: 20px;\r\n        .nav-link {\r\n            border: 1px solid #EAEAEA;\r\n            border-radius: 5px;\r\n            text-align: center;\r\n            font-size: 0.9em;\r\n            color: #757575;\r\n            padding: 4px 0;\r\n            width: 100% !important;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: center;\r\n            @media (max-width: 1090px) {\r\n                font-size: 18px;\r\n            }\r\n            @media (max-width: 946px) {\r\n                font-size: 16px;\r\n                padding: 10px 20px;\r\n            }\r\n\r\n            @media (max-width: 569px) {\r\n                font-size: 14px;\r\n                padding: 5px 10px;\r\n            }\r\n            img {\r\n                width: 50px;\r\n                filter: brightness(0) invert(.8);\r\n            }\r\n        }\r\n        .active{\r\n            background: #133C92;\r\n            color: white;\r\n            img {\r\n               filter: brightness(0) invert(1);\r\n            }\r\n        }\r\n    }\r\n\r\n}\r\n#ProductsTabContent {\r\n    .product-item {\r\n        margin-bottom: 20px;\r\n        cursor: pointer;\r\n        .card-body {\r\n            padding: 0 15px !important;\r\n            @media (max-width: 574px){\r\n                padding: 0 4px !important;\r\n            }\r\n            .btn {\r\n                @media (max-width: 1101px){\r\n                    padding: 4px 14px!important;\r\n                    font-size: 14px !important;\r\n                }\r\n                @media (max-width: 893px){\r\n                    font-size: 12px !important;\r\n                }\r\n                @media (max-width: 816px){\r\n                    font-size: 10px !important;\r\n                }\r\n                @media (max-width: 767px){\r\n                    padding: 6px 40px !important;\r\n                    font-size: 14px !important;\r\n                }\r\n                @media (max-width: 550px){\r\n                    padding: 4px 14px!important;\r\n                    font-size: 10px !important;\r\n                }\r\n                @media (max-width: 370px){\r\n                    padding: 4px 5px !important;\r\n                    font-size: 9px !important;\r\n                }\r\n            }\r\n        }\r\n        .card-header {\r\n            background: #F3EBDA;\r\n            border-bottom: 0;\r\n            img {\r\n                max-height: 117px;\r\n            }\r\n        }\r\n        .product-title-card {\r\n            text-transform: none;\r\n            margin: 10px auto 4px;\r\n            font-weight: 600;\r\n            @media (max-width: 1005px){\r\n                height: 60px;\r\n            }\r\n            @media (max-width: 823px){\r\n                font-size: 18px;\r\n            }\r\n            @media (max-width: 780px){\r\n                height: 60px;\r\n                font-size: 18px;\r\n            }\r\n            @media (max-width: 767px){\r\n                height: auto;\r\n                font-size: 18px;\r\n            }\r\n            @media (max-width: 574px){\r\n                height: 47px;\r\n                font-size: 14px;\r\n            }\r\n        }\r\n        .txt-product {\r\n            margin: 10px 0 0;\r\n            min-height: 72px;\r\n            font-weight: 600;\r\n\r\n            @media (max-width: 936px){\r\n                min-height: 96px;\r\n            }\r\n            @media (max-width: 767px){\r\n                min-height: 50px;\r\n            }\r\n            @media (max-width: 574px){\r\n                min-height: 72px;\r\n                font-size: 14px;\r\n            }\r\n        }\r\n    }\r\n}\r\n.img-product-card-wrapper{\r\n    height: 150px!important;\r\n    width: 100%;\r\n}\r\n</style>","import Vue from 'vue'\nimport App from '../components/products/Products.vue'\n\nimport {BootstrapVue} from 'bootstrap-vue'\n\n// Import Bootstrap an BootstrapVue CSS files (order is important)\nimport 'bootstrap/dist/css/bootstrap.css'\nimport 'bootstrap-vue/dist/bootstrap-vue.css'\n\nVue.use(BootstrapVue)\n\ndocument.addEventListener('DOMContentLoaded', () => {\n    const app = new Vue({\n        render: h => h(App, {\n            props: {\n                products: products ? products : null,\n                options: options ? options : null\n            }\n        })\n    }).$mount('#products')\n})\n"],"names":["render","_vm","_h","_c","section","$event","staticRenderFns","__vue2_script","Products","uri","slugSections","newValue","oldValue","product","trackClick","taxonomi","a","b","Vue","BootstrapVue","h","App"],"mappings":"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"}