{"version":3,"file":"DZIXCCO7.js","sources":["../../../../components/AppAntiFakeQrx.vue"],"sourcesContent":["<script setup>\nconst listProduct = [\n  {\n    title: \"Điện tử tiêu dùng\",\n    data: [\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/xac-pisen.png\",\n        slug: \"xac-pisen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/xac-pisen-1.png\",\n        slug: \"xac-pisen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/cong-chuyen-doi-pisen.png\",\n        slug: \"hub-pinsen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/tu-lanh-pisen.png\",\n        slug: \"tu-lanh-pisen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/loa-pisen.png\",\n        slug: \"loa-pisen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/binh-phun-xuong-pisen.png\",\n        slug: \"binh-phun-xuong-pisen\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"images/pisen/xac-pisen-2.png\",\n        slug: \"xac-pisen-2\",\n      },\n      {\n        title: \"Điện tử tiêu dùng\",\n        images: \"/images/pisen/quat-pisen.png\",\n        slug: \"quat-pinsen\",\n      },\n    ],\n  },\n  {\n    title: \"Dược phẩm\",\n    data: [\n      {\n        title: \"Dược phẩm\",\n        images: \"/images/pisen/duoc-pham2.png\",\n        slug: \"duoc-pham2\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"/images/pisen/duoc-pham4.png\",\n        slug: \"duoc-pham4\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"images/pisen/duoc-pham5.png\",\n        slug: \"duoc-pham5\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"images/pisen/duoc-pham6.png\",\n        slug: \"duoc-pham6\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"images/pisen/duoc-pham7.png\",\n        slug: \"duoc-pham7\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"/images/pisen/duoc-pham8.png\",\n        slug: \"duoc-pham8\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"/images/pisen/duoc-pham9.png\",\n        slug: \"duoc-pham9\",\n      },\n      {\n        title: \"Dược phẩm\",\n        images: \"/images/pisen/duoc-pham10.png\",\n        slug: \"duoc-pham10\",\n      },\n    ],\n  },\n  {\n    title: \"Hàng tiêu dùng\",\n    data: [\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/duoc-pham.png\",\n        slug: \"duoc-pham\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/tra-xanh.png\",\n        slug: \"tra-xanh\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/tieudung6.png\",\n        slug: \"tieudung6\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/tieudung2.png\",\n        slug: \"tieudung2\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"images/pisen/golden_pen_in_boxes_mockup-2.png\",\n        slug: \"golden_pen_in_boxes_mockup-2\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"images/pisen/tieudung3.png\",\n        slug: \"tieudung3\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/tieudung4.png\",\n        slug: \"tieudung4\",\n      },\n      {\n        title: \"Hàng tiêu dùng\",\n        images: \"/images/pisen/tieudung5.png\",\n        slug: \"tieudung5\",\n      },\n    ],\n  },\n  {\n    title: \"Thực phẩm, đồ uống\",\n    data: [\n      {\n        title: \"Thực phẩm, đồ uống\",\n        images: \"/images/pisen/thuc-pham.png\",\n        slug: \"thuc-pham\",\n      },\n      {\n        title: \"Thực phẩm, đồ uống\",\n        images: \"/images/pisen/thuc-pham2.png\",\n        slug: \"thuc-pham2\",\n      },\n      {\n        title: \"Thực phẩm, đồ uống\",\n        images: \"/images/pisen/tieudung2.png\",\n        slug: \"tieudung2\",\n      },\n      {\n        title: \"Thực phẩm, đồ uống\",\n        images: \"/images/pisen/thuc-pham3.png\",\n        slug: \"thuc-pham3\",\n      },\n      {\n        title: \"Thực phẩm, đồ uống\",\n        images: \"/images/pisen/thuc-pham4.png\",\n        slug: \"thuc-pham4\",\n      },\n    ],\n  },\n  {\n    title: \"Mỹ phẩm\",\n    data: [\n      {\n        title: \"Mỹ phẩm\",\n        images: \"/images/pisen/my-pham1.png\",\n        slug: \"my-pham1\",\n      },\n      {\n        title: \"Mỹ phẩm\",\n        images: \"/images/pisen/my-pham2.png\",\n        slug: \"my-pham2\",\n      },\n      {\n        title: \"Mỹ phẩm\",\n        images: \"/images/pisen/my-pham3.png\",\n        slug: \"my-pham3\",\n      },\n      {\n        title: \"Mỹ phẩm\",\n        images: \"/images/pisen/my-pham4.png\",\n        slug: \"my-pham4\",\n      },\n      {\n        title: \"Mỹ phẩm\",\n        images: \"/images/pisen/my-pham5.png\",\n        slug: \"my-pham5\",\n      },\n    ],\n  },\n];\nconst stepCurrent = ref(0);\n</script>\n\n<template>\n  <section class=\"xl:-mx-20 py-[80px] bg-[#FAFAFA]\">\n    <div class=\"text-center w-[715px] max-lg:w-3/4 m-auto\">\n      <h2>Các mẫu thiết kế mã QR Code</h2>\n      <p class=\"ubtitle-2 text-third mt-4\">\n        Mẫu tem QR Code của QRX với nhiều thiết kế đa dạng, phù hợp sẽ đáp ứng mọi yêu cầu và sở thích của khách hàng\n      </p>\n    </div>\n    <div class=\"flex lg:flex-wrap max-lg:overflow-scroll gap-[5px] justify-center max-lg:justify-start py-[24px]\">\n      <div v-for=\"(products, index) in listProduct\" :key=\"index\" @click=\"stepCurrent = index\">\n        <button class=\"w-max h-fit rounded-[24px] border-[3px]\" :class=\"{ 'border-[#ED7F22]': stepCurrent === index }\">\n          {{ products.title }}\n        </button>\n      </div>\n    </div>\n    <div\n      class=\"flex flex-wrap justify-center max-xl:justify-around mt-[40px]\"\n      v-for=\"(products, index) in listProduct\"\n      :key=\"index\"\n      :class=\"{ hidden: index != stepCurrent }\"\n    >\n      <div class=\"w-1/5 m-[5px] max-lg:w-1/3\" v-for=\"product in products.data\" :key=\"product.slug\">\n        <nuxt-picture loading=\"lazy\" :src=\"product.images\" :imgAttrs=\"{ alt: product.slug }\" />\n      </div>\n    </div>\n  </section>\n</template>\n"],"names":["listProduct","stepCurrent","ref"],"mappings":"u5CACA,MAAMA,EAAc,CAClB,CACE,MAAO,oBACP,KAAM,CACJ,CACE,MAAO,oBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,oBACP,OAAQ,gCACR,KAAM,WACP,EACD,CACE,MAAO,oBACP,OAAQ,0CACR,KAAM,YACP,EACD,CACE,MAAO,oBACP,OAAQ,kCACR,KAAM,eACP,EACD,CACE,MAAO,oBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,oBACP,OAAQ,0CACR,KAAM,uBACP,EACD,CACE,MAAO,oBACP,OAAQ,+BACR,KAAM,aACP,EACD,CACE,MAAO,oBACP,OAAQ,+BACR,KAAM,aACP,CACF,CACF,EACD,CACE,MAAO,YACP,KAAM,CACJ,CACE,MAAO,YACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,8BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,8BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,8BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,YACP,OAAQ,gCACR,KAAM,aACP,CACF,CACF,EACD,CACE,MAAO,iBACP,KAAM,CACJ,CACE,MAAO,iBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,iBACP,OAAQ,6BACR,KAAM,UACP,EACD,CACE,MAAO,iBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,iBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,iBACP,OAAQ,gDACR,KAAM,8BACP,EACD,CACE,MAAO,iBACP,OAAQ,6BACR,KAAM,WACP,EACD,CACE,MAAO,iBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,iBACP,OAAQ,8BACR,KAAM,WACP,CACF,CACF,EACD,CACE,MAAO,qBACP,KAAM,CACJ,CACE,MAAO,qBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,qBACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,qBACP,OAAQ,8BACR,KAAM,WACP,EACD,CACE,MAAO,qBACP,OAAQ,+BACR,KAAM,YACP,EACD,CACE,MAAO,qBACP,OAAQ,+BACR,KAAM,YACP,CACF,CACF,EACD,CACE,MAAO,UACP,KAAM,CACJ,CACE,MAAO,UACP,OAAQ,6BACR,KAAM,UACP,EACD,CACE,MAAO,UACP,OAAQ,6BACR,KAAM,UACP,EACD,CACE,MAAO,UACP,OAAQ,6BACR,KAAM,UACP,EACD,CACE,MAAO,UACP,OAAQ,6BACR,KAAM,UACP,EACD,CACE,MAAO,UACP,OAAQ,6BACR,KAAM,UACP,CACF,CACF,CACH,EACMC,EAAcC,EAAI,CAAC"}