import { e as buildAssetsURL } from '../_/nitro.mjs';
import { u } from './Skeleton-DfjdyTna.mjs';
import { mergeProps, ref, watch, resolveComponent, unref, isRef, useSSRContext, computed } from 'vue';
import { ssrRenderAttrs, ssrRenderComponent, ssrRenderList, ssrRenderAttr, ssrInterpolate, ssrRenderClass, ssrRenderStyle } from 'vue/server-renderer';
import { f as cf, u as Qt, c as tf, i as Ma, a as Ts, d as gs, h as $a } from './server.mjs';
import { v } from './breadcrumb-DGU_YuMK.mjs';
import { g } from './SvgIcon-YE_5uJaI.mjs';
import { $ } from './ProductCard-BoLfosCH.mjs';
import { a } from './NoData-IIg4-CUc.mjs';
import 'node:http';
import 'node:https';
import 'node:fs';
import 'node:url';
import 'node:path';
import 'unhead';
import '@unhead/shared';
import 'vue-router';
import 'vue-rate';
import 'date-fns';
import '@hennge/vue3-pagination';
import 'axios';
import 'vue-social-sharing';
import './star-mqjJGHgV.mjs';

const F = {};
const S = F.setup;
F.setup = (e2, l2) => {
  const t2 = useSSRContext();
  return (t2.modules || (t2.modules = /* @__PURE__ */ new Set())).add("components/Shared/CategoriesSkelton.vue"), S ? S(e2, l2) : undefined;
};
const T = cf(F, [["ssrRender", function(s2, t2, a2, i2) {
  const n2 = u;
  t2(`<div${ssrRenderAttrs(mergeProps({ class: "my-6 lg:my-10" }, i2))}>`), t2(ssrRenderComponent(n2, { class: "h-[16px] w-[200px] mb-10" }, null, a2)), t2('<div class="grid grid-cols-1 lg:grid-cols-12 gap-x-2.5 2xl:gap-x-10"><div class="lg:col-span-3">'), s2.$route.query.brand ? t2('<div class="p-6 mb-8 bg-[#FBFCFF] flex items-center gap-5"><div class="size-[120px] bg-gray-200 animate-pulse"></div><div class="w-[58px] h-[28px] bg-gray-200 animate-pulse"></div></div>') : t2("<!---->"), t2('<div class="w-full p-4 bg-[#F9F9F9] h-fit space-y-6">'), t2(ssrRenderComponent(n2, { class: "h-[20px] w-[100px]" }, null, a2)), t2('<div class="space-y-4">'), t2(ssrRenderComponent(n2, { class: "h-[18px] w-[120px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[100%]" }, null, a2)), t2("</div>"), t2(ssrRenderComponent(n2, { class: "h-[16px] w-[120px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[8px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[8px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[10px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[40px] w-full" }, null, a2)), t2('</div></div><div class="flex-1 space-y-10 lg:col-span-9"><div class="grid p-4 lg:p-6 bg-[#F9F9F9] grid-cols-2 sm:grid-cols-3 xl:grid-cols-4 gap-y-8 gap-x-2.5"><!--[-->'), ssrRenderList(8, (e2) => {
    t2('<div class="space-y-4">'), t2(ssrRenderComponent(n2, { class: "h-[280px] sm:h-[320px] w-[100%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[70%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[40%]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[14px] w-[50%]" }, null, a2)), t2("</div>");
  }), t2('<!--]--><div class="mt-10 col-span-2 sm:col-span-3 xl:col-span-4 flex justify-center gap-4">'), t2(ssrRenderComponent(n2, { class: "h-[48px] !rounded-full w-[48px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[48px] !rounded-full w-[48px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[48px] !rounded-full w-[48px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[48px] !rounded-full w-[48px]" }, null, a2)), t2(ssrRenderComponent(n2, { class: "h-[48px] !rounded-full w-[48px]" }, null, a2)), t2("</div></div></div></div></div>");
}]]), C = 10, I = { __name: "Filter", __ssrInlineRender: true, setup(e2) {
  const s2 = tf();
  Qt().$axios, $a(), Ma();
  const l2 = ref([]), n2 = ref([]), r2 = ref(C), o2 = ref(5e3), g2 = ref(5e3), _2 = computed(() => (r2.value - C) / (g2.value - C) * 100), w2 = computed(() => (o2.value - C) / (g2.value - C) * 100), $2 = computed(() => w2.value - _2.value), k2 = ref(false), j2 = ref(false);
  l2.value = s2.categories.map((e3) => ({ ...e3, selected: false, showChildren: false, sub_categories: e3.sub_categories.map((e4) => ({ ...e4, selected: false, showSubChildren: false, sub_sub_categories: e4.sub_sub_categories || [] })) }));
  const F2 = ref([]), S2 = ref(false);
  return (e3, t2, a2, b2) => {
    var y2, f2, h2, w3, T2, I2, L2, E2, R2, B2, P2, U2, V, z;
    const A = g;
    t2(`<div${ssrRenderAttrs(b2)}>`), e3.$route.query.brand ? (t2('<div class="p-6 mb-8 bg-[#FBFCFF] flex items-center gap-5"><div class="relative w-[120px] h-[120px]">'), (null == (h2 = null == (f2 = null == (y2 = unref(F2)) ? undefined : y2.filter((s3) => s3.id == e3.$route.query.brand)[0]) ? undefined : f2.image) ? undefined : h2.media) ? t2(`<img${ssrRenderAttr("src", null == (I2 = null == (T2 = null == (w3 = unref(F2)) ? undefined : w3.filter((s3) => s3.id == e3.$route.query.brand)[0]) ? undefined : T2.image) ? undefined : I2.media)} width="120" height="120" alt="boss" class="size-[120px] object-cover">`) : t2('<div class="size-[120px] bg-gray-200 animate-pulse"></div>'), t2("</div>"), (null == (E2 = null == (L2 = unref(F2)) ? undefined : L2.filter((s3) => s3.id == e3.$route.query.brand)[0]) ? undefined : E2.title) ? t2(`<h5 class="font-medium text-xl">${ssrInterpolate(null == (B2 = null == (R2 = unref(F2)) ? undefined : R2.filter((s3) => s3.id == e3.$route.query.brand)[0]) ? undefined : B2.title)}</h5>`) : t2('<div class="w-[58px] h-[28px] bg-gray-200 animate-pulse"></div>'), t2("</div>")) : t2("<!---->"), t2(`<div class="bg-[#FBFCFF] p-3 lg:p-6"><div class="flex justify-between mb-5 pb-5 border-b border-[#E1E1E1] items-center gap-2"><h3 class="font-bold text-xl">${ssrInterpolate(e3.$t("TITLES.sortBy"))}</h3><button><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-restore"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M3.06 13a9 9 0 1 0 .49 -4.087"></path><path d="M3 4.001v5h5"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg></button></div><div class="space-y-8"><div><button class="flex w-full items-center justify-between gap-2"><h4 class="font-semibold text-primary">${ssrInterpolate(e3.$t("TITLES.categories"))}</h4><span class="outline-none">`), t2(ssrRenderComponent(A, { style: unref(k2) ? null : { display: "none" }, name: "minus" }, null, a2)), t2(ssrRenderComponent(A, { style: unref(k2) ? { display: "none" } : null, name: "add" }, null, a2)), t2("</span></button>"), unref(k2) ? (t2('<div class="mt-5 space-y-4 ps-4"><!--[-->'), ssrRenderList(unref(l2), (e4) => {
      t2(`<div class="flex flex-col space-y-4"><div class="flex items-center gap-3 !text-sm cursor-pointer"><div class="${ssrRenderClass(["w-[18px] h-[18px] flex-shrink-0 border border-black rounded-full flex items-center justify-center", e4.selected && "bg-black"])}">`), e4.selected ? t2(ssrRenderComponent(A, { name: "check", class: "[&_path]:fill-white" }, null, a2)) : t2("<!---->"), t2(`</div><span>${ssrInterpolate(e4.title)}</span><button class="ms-auto">`), t2(ssrRenderComponent(A, { style: e4.showChildren ? null : { display: "none" }, name: "minus" }, null, a2)), t2(ssrRenderComponent(A, { style: e4.showChildren ? { display: "none" } : null, name: "add" }, null, a2)), t2("</button></div>"), e4.showChildren ? (t2('<div class="ps-6 space-y-4"><!--[-->'), ssrRenderList(e4.sub_categories, (e5) => {
        t2(`<div class="flex flex-col space-y-4"><div class="flex items-center !text-sm gap-3 cursor-pointer"><div class="${ssrRenderClass(["w-[18px] h-[18px] border flex-shrink-0 border-black rounded-full flex items-center justify-center", e5.selected && "bg-black"])}">`), e5.selected ? t2(ssrRenderComponent(A, { name: "check", class: "[&_path]:fill-white" }, null, a2)) : t2("<!---->"), t2(`</div><span>${ssrInterpolate(e5.title)}</span><button class="ms-auto">`), t2(ssrRenderComponent(A, { style: e5.showSubChildren ? null : { display: "none" }, name: "minus" }, null, a2)), t2(ssrRenderComponent(A, { style: e5.showSubChildren ? { display: "none" } : null, name: "add" }, null, a2)), t2("</button></div>"), e5.showSubChildren ? (t2('<div class="ps-8 space-y-4"><!--[-->'), ssrRenderList(e5.sub_sub_categories, (e6) => {
          t2(`<div class="flex flex-col space-y-4"><div class="flex items-center !text-sm gap-3 cursor-pointer"><div class="${ssrRenderClass(["w-[18px] h-[18px] border flex-shrink-0 border-black rounded-full flex items-center justify-center", e6.selected && "bg-black"])}">`), e6.selected ? t2(ssrRenderComponent(A, { name: "check", class: "[&_path]:fill-white" }, null, a2)) : t2("<!---->"), t2(`</div><span>${ssrInterpolate(e6.title)}</span></div></div>`);
        }), t2("<!--]--></div>")) : t2("<!---->"), t2("</div>");
      }), t2("<!--]--></div>")) : t2("<!---->"), t2("</div>");
    }), t2("<!--]--></div>")) : t2("<!---->"), t2(`</div><div><button class="flex w-full items-center justify-between gap-2"><h4 class="font-semibold text-primary">${ssrInterpolate(e3.$t("TITLES.brands"))}</h4><span class="outline-none">`), t2(ssrRenderComponent(A, { style: unref(S2) ? { display: "none" } : null, name: "add" }, null, a2)), t2(ssrRenderComponent(A, { style: unref(S2) ? null : { display: "none" }, name: "minus" }, null, a2)), t2("</span></button>"), unref(S2) ? (t2('<div class="mt-5 space-y-4 ps-4"><!--[-->'), ssrRenderList(unref(F2), (e4) => {
      t2(`<div class="flex flex-col space-y-4"><div class="flex items-center !text-sm gap-3 cursor-pointer"><div class="${ssrRenderClass(["w-[18px] h-[18px] border flex-shrink-0 border-black rounded-full flex items-center justify-center", e4.selected && "bg-black"])}">`), e4.selected ? t2(ssrRenderComponent(A, { name: "check", class: "[&_path]:fill-white" }, null, a2)) : t2("<!---->"), t2(`</div><span>${ssrInterpolate(e4.title)}</span></div></div>`);
    }), t2("<!--]--></div>")) : t2("<!---->"), t2(`</div><div><button class="flex w-full items-center justify-between gap-2"><h4 class="font-semibold text-primary">${ssrInterpolate(e3.$t("TITLES.colors"))}</h4><span class="outline-none">`), t2(ssrRenderComponent(A, { style: unref(j2) ? { display: "none" } : null, name: "add" }, null, a2)), t2(ssrRenderComponent(A, { style: unref(j2) ? null : { display: "none" }, name: "minus" }, null, a2)), t2("</span></button>"), unref(j2) ? (t2('<div class="flex flex-wrap gap-2 mt-4"><!--[-->'), ssrRenderList(unref(n2), (e4) => {
      t2(`<div class="${ssrRenderClass([e4.selected && "!border-[1.5px] !border-black", "w-6 h-6 flex-shrink-0 rounded-full border border-gray-400 cursor-pointer"])}" style="${ssrRenderStyle(`background: ${e4.hex}`)}"></div>`);
    }), t2("<!--]--></div>")) : t2("<!---->"), t2(`</div><div><h4 class="font-semibold mb-4 text-primary">${ssrInterpolate(e3.$t("TITLES.priceRange"))}</h4><div class="slider-container"><div class="slider-track"></div><div class="slider-range" style="${ssrRenderStyle({ insetInlineStart: `${unref(_2)}%`, width: `${unref($2)}%` })}"></div><div class="range-input"><input type="range"${ssrRenderAttr("min", C)}${ssrRenderAttr("max", unref(g2))}${ssrRenderAttr("value", unref(r2))} class="min-range-input"><input type="range"${ssrRenderAttr("min", C)}${ssrRenderAttr("max", unref(g2))}${ssrRenderAttr("value", unref(o2))} class="max-range-input"></div></div><div class="flex mt-3 items-center font-medium justify-between gap-2 text-black"><div><span class="text-lg font-semibold">${ssrInterpolate(unref(r2))}</span> ${ssrInterpolate(null == (U2 = null == (P2 = unref(s2).countries) ? undefined : P2.find((s3) => s3.id == e3.countryId)) ? undefined : U2.currency)}</div><div><span class="text-lg font-semibold">${ssrInterpolate(unref(o2))}</span> ${ssrInterpolate(null == (z = null == (V = unref(s2).countries) ? undefined : V.find((s3) => s3.id == e3.countryId)) ? undefined : z.currency)}</div></div></div><button type="button" class="base-btn w-full !h-12">${ssrInterpolate(e3.$t("TITLES.apply"))}</button></div></div></div>`);
  };
} }, L = I.setup;
I.setup = (e2, l2) => {
  const t2 = useSSRContext();
  return (t2.modules || (t2.modules = /* @__PURE__ */ new Set())).add("components/Shared/Filter.vue"), L ? L(e2, l2) : undefined;
};
const E = "" + buildAssetsURL("flashsale-bg.CbEknVXT.png"), R = "" + buildAssetsURL("80Off.BSWkS4LL.webp"), B = "" + buildAssetsURL("1trend.T7UNp7Py.png"), P = { __name: "index", __ssrInlineRender: true, setup(e2) {
  var s2;
  const a2 = Qt().$axios, v2 = tf(), m2 = Ma(), g2 = ref(+(null == (s2 = m2.query) ? undefined : s2.page) || 1), { data: f2, status: F2 } = Ts("products", () => {
    var e3;
    return a2.get("product", { params: { main_category_id: m2.query.main_category ? m2.query.main_category : null, sub_category_id: m2.query.sub_category ? m2.query.sub_category : null, sub_sub_category_id: m2.query.sub_sub_category ? m2.query.sub_sub_category : null, color_id: m2.query.color ? m2.query.color : null, price_from: m2.query.minPrice ? m2.query.minPrice : null, price_to: m2.query.maxPrice ? m2.query.maxPrice : null, type: m2.query.type ? m2.query.type : null, brand_id: m2.query.brand ? m2.query.brand : null, page: null == (e3 = m2.query) ? undefined : e3.page } }).then((e4) => e4.data).catch((e4) => e4.response);
  }, { watch: [() => m2.query] });
  ref(null);
  const S2 = ref(false), { t: C2 } = gs(), L2 = (e3) => {
    if (!e3 || !v2.categories) return null;
    const s3 = (e4, l3 = v2.categories) => {
      if (!l3) return null;
      const t2 = l3.find((s4) => s4.id === parseInt(e4));
      if (t2) return t2;
      for (const a3 of l3) {
        if (a3.sub_categories) {
          const l4 = s3(e4, a3.sub_categories);
          if (l4) return l4;
        }
        if (a3.sub_sub_categories) {
          const l4 = s3(e4, a3.sub_sub_categories);
          if (l4) return l4;
        }
      }
      return null;
    }, l2 = s3(e3);
    return (null == l2 ? undefined : l2.title) || null;
  }, P2 = ref([{ name: C2("NAV.home"), to: "/" }, { name: C2("NAV.categories"), to: "/categories", disabled: false }]);
  return watch(() => m2.query, () => {
    (() => {
      P2.value = P2.value.slice(0, 2), m2.query.type && P2.value.push({ name: C2("TITLES." + m2.query.type), to: `/categories?type=${m2.query.type}`, disabled: true });
      const e3 = (s4, l2 = v2.categories) => {
        if (!l2) return [];
        const t2 = l2.find((e4) => e4.id === parseInt(s4));
        if (t2) return [t2];
        for (const a3 of l2) {
          if (a3.sub_categories) {
            const l3 = e3(s4, a3.sub_categories);
            if (l3.length) return [a3, ...l3];
          }
          if (a3.sub_sub_categories) {
            const l3 = e3(s4, a3.sub_sub_categories);
            if (l3.length) return [a3, ...l3];
          }
        }
        return [];
      }, s3 = L2(m2.query.main_category);
      if (L2(m2.query.sub_category), L2(m2.query.sub_sub_category), m2.query.sub_sub_category) {
        const s4 = e3(m2.query.sub_sub_category);
        for (let e4 = 0; e4 < s4.length; e4++) {
          const l2 = s4[e4], t2 = e4 === s4.length - 1;
          P2.value.push({ name: l2.title, to: `/categories?main_category=${s4[0].id}${e4 > 0 ? `&sub_category=${s4[1].id}` : ""}${e4 > 1 ? `&sub_sub_category=${s4[2].id}` : ""}`, disabled: t2 });
        }
      } else if (m2.query.sub_category) {
        const s4 = e3(m2.query.sub_category);
        for (let e4 = 0; e4 < s4.length; e4++) {
          const l2 = s4[e4], t2 = e4 === s4.length - 1;
          P2.value.push({ name: l2.title, to: `/categories?main_category=${s4[0].id}${e4 > 0 ? `&sub_category=${s4[1].id}` : ""}`, disabled: t2 });
        }
      } else m2.query.main_category && P2.value.push({ name: s3, to: `/categories?main_category=${m2.query.main_category}`, disabled: true });
    })();
  }, { deep: true }), (e3, s3, t2, a3) => {
    var n2, v3, m3, b2;
    const y2 = T, h2 = v, _2 = g, w2 = I, C3 = $, L3 = resolveComponent("VPagination"), U2 = a;
    "pending" === unref(F2) ? (s3(`<div${ssrRenderAttrs(mergeProps({ class: "container my-10" }, a3))}>`), s3(ssrRenderComponent(y2, null, null, t2)), s3("</div>")) : "success" === unref(F2) ? (s3(`<div${ssrRenderAttrs(mergeProps({ class: "my-6 lg:my-10" }, a3))}>`), s3(ssrRenderComponent(h2, { "data-aos": "fade-right", class: "container", items: unref(P2) }, null, t2)), "flash_sale" === e3.$route.query.type ? s3(`<div data-aos="fade-in" class="relative my-14 w-full h-[120px] lg:h-[200px]"><img${ssrRenderAttr("src", E)} alt="flashsale" class="w-full h-full object-cover"></div>`) : "offer" === e3.$route.query.type ? s3(`<div data-aos="fade-in" class="relative my-14 w-full h-[120px] lg:h-[200px]"><img${ssrRenderAttr("src", R)} alt="80% Off" class="w-full h-full object-cover"><div class="absolute inset-0 flex items-center justify-center"><h2 class="!text-3xl lg:!text-6xl text-white">${ssrInterpolate(e3.$t("TITLES.offerDiscountTitle", { upTo: e3.$route.query.off }))}</h2></div></div>`) : "popular" === e3.$route.query.type ? s3(`<div data-aos="fade-in" class="relative my-14 w-full h-[120px] lg:h-[200px]"><img${ssrRenderAttr("src", B)} alt="trend" class="w-full h-full object-cover"></div>`) : s3("<!---->"), s3(`<div class="my-6 lg:my-10 grid container grid-cols-1 lg:grid-cols-12 gap-x-2.5 2xl:gap-x-10 gap-y-6"><button class="lg:hidden flex items-center gap-2 w-fit ms-auto text-primary p-2 lg:p-6 rounded-full"><span class="text-lg">${ssrInterpolate(e3.$t("TITLES.filter"))}</span>`), s3(ssrRenderComponent(_2, { name: "filter", class: "scale-125 !stroke-1" }, null, t2)), s3("</button>"), s3(ssrRenderComponent(w2, { "data-aos": "fade-right", class: "lg:col-span-3 h-fit hidden lg:block" }, null, t2)), unref(S2) ? s3(ssrRenderComponent(w2, { "data-aos": "fade-up", class: "lg:col-span-3 h-fit block lg:hidden" }, null, t2)) : s3("<!---->"), s3('<div data-aos="fade-left" class="lg:col-span-9 bg-[#FBFCFF] p-2 lg:p-6">'), (null == (v3 = null == (n2 = unref(f2)) ? undefined : n2.data) ? undefined : v3.length) ? (s3('<!--[--><div class="grid grid-cols-2 sm:grid-cols-3 xl:grid-cols-4 gap-y-4 lg:gap-y-8 gap-x-2 xl:gap-x-2.5 lg:gap-x-2.5"><!--[-->'), ssrRenderList(null == (m3 = unref(f2)) ? undefined : m3.data, (e4) => {
      s3(ssrRenderComponent(C3, { key: e4.id, product: e4 }, null, t2));
    }), s3('<!--]--></div><div class="mt-10">'), s3(ssrRenderComponent(L3, { modelValue: unref(g2), "onUpdate:modelValue": [(e4) => isRef(g2) ? g2.value = e4 : null, (s4) => e3.$router.push({ query: Object.assign({}, e3.$route.query, { page: s4 }) })], pages: null == (b2 = unref(f2)) ? undefined : b2.meta.last_page, "range-size": 1, "active-color": "#DCEDFF" }, null, t2)), s3("</div><!--]-->")) : (s3("<div>"), s3(ssrRenderComponent(U2, { class: "!min-h-[35vh]" }, null, t2)), s3("</div>")), s3("</div></div></div>")) : s3("<!---->");
  };
} }, U = P.setup;
P.setup = (e2, l2) => {
  const t2 = useSSRContext();
  return (t2.modules || (t2.modules = /* @__PURE__ */ new Set())).add("pages/categories/index.vue"), U ? U(e2, l2) : undefined;
};

export { P as default };
//# sourceMappingURL=index-DAOT_alU.mjs.map
