import { defineComponent, ref, watch, onMounted, onBeforeUnmount, mergeProps, unref, withCtx, createTextVNode, toDisplayString, nextTick, useSSRContext } from "vue";
import { ssrRenderAttrs, ssrInterpolate, ssrRenderStyle, ssrRenderList, ssrRenderClass, ssrRenderAttr, ssrRenderComponent } from "vue/server-renderer";
import { Link } from "@inertiajs/vue3";
import Swiper from "swiper";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "ProductList6",
  __ssrInlineRender: true,
  props: {
    status: {},
    component_id: {},
    data: {}
  },
  setup(__props) {
    const props = __props;
    const activeCategory = ref(props.data.categories[0]);
    watch(
      () => props.data.categories,
      (newCategories) => {
        if (newCategories && newCategories.length > 0) {
          activeCategory.value = newCategories[0];
        } else {
          activeCategory.value = void 0;
        }
      },
      { deep: true }
    );
    let swiperInstance = null;
    const swiperBoxProductSliderContainer = async () => {
      if (swiperInstance) {
        swiperInstance.destroy(true, true);
        swiperInstance = null;
      }
      await nextTick();
      swiperInstance = new Swiper(".swiper-related-product-slider-" + props.component_id, {
        slidesPerView: 6,
        spaceBetween: 1,
        loop: false,
        breakpoints: {
          120: {
            slidesPerView: 1,
            spaceBetween: 1
          },
          360: {
            slidesPerView: 2,
            spaceBetween: 3
          },
          600: {
            slidesPerView: 3,
            spaceBetween: 3
          },
          768: {
            slidesPerView: 4,
            spaceBetween: 3
          },
          992: {
            slidesPerView: 5,
            spaceBetween: 3
          },
          1205: {
            slidesPerView: 6,
            spaceBetween: 3
          }
        },
        observer: true
      });
    };
    watch(activeCategory, (value) => {
      swiperBoxProductSliderContainer();
    });
    onMounted(() => {
      swiperBoxProductSliderContainer();
    });
    onBeforeUnmount(() => {
      if (swiperInstance) {
        swiperInstance.destroy(true, true);
        swiperInstance = null;
      }
    });
    return (_ctx, _push, _parent, _attrs) => {
      var _a, _b, _c;
      _push(`<div${ssrRenderAttrs(mergeProps({
        id: "component-" + _ctx.component_id,
        class: { container: true, readonly: _ctx.status == "dev" },
        style: "margin-top:" + ((_a = _ctx.data.style) == null ? void 0 : _a.margin.top) + "px; margin-bottom:" + (((_b = _ctx.data.style) == null ? void 0 : _b.margin.bottom) != null ? (_c = _ctx.data.style) == null ? void 0 : _c.margin.bottom : 20) + "px;"
      }, _attrs))}><div class="products-tabs-by-category"><div class="row"><div class="col-12 d-flex align-items-center justify-content-center justify-content-sm-start lts-05 fs-6 fw-bold mb-3"><div class="wg-title w-100">`);
      if (_ctx.data.filter != null) {
        _push(`<div class="d-flex w-100 align-items-center justify-content-between"><span class="text-primary">${ssrInterpolate(_ctx.data.filter["label"])}</span><span class="text-gray ms-1 fs-8 fw-normal">${ssrInterpolate(_ctx.$t("messages.word.categories"))}</span></div>`);
      } else {
        _push(`<div>${ssrInterpolate(_ctx.$t("messages.sentence.not_set"))}</div>`);
      }
      _push(`</div></div><div class="col-12 mb-4"><div class="wg-tabs br-15"><div class="simplebar-container w-100" style="${ssrRenderStyle({ "max-width": "100%" })}"><ul><!--[-->`);
      ssrRenderList(_ctx.data.categories, (category) => {
        _push(`<li class="${ssrRenderClass({ clickable: true, active: activeCategory.value.id == category.id })}">${ssrInterpolate(category.title)}</li>`);
      });
      _push(`<!--]--></ul></div></div></div><div class="col-12"><div class="related-product-container"><div class="${ssrRenderClass("swiper swiper-related-product-slider swiper-related-product-slider-" + _ctx.component_id)}"><div class="swiper-wrapper">`);
      if (activeCategory.value != void 0 && activeCategory.value.products != void 0 && activeCategory.value.products.length > 0) {
        _push(`<!--[--><!--[-->`);
        ssrRenderList(activeCategory.value.products, (product) => {
          _push(`<div class="swiper-slide"><div class="card product"><div class="card-body"><div class="product-thumbnail"><img${ssrRenderAttr("src", product.get_images[0]["link"])}${ssrRenderAttr("alt", product.title)} loading="lazy"></div><div class="product-body"><h3 class="product-title">`);
          _push(ssrRenderComponent(unref(Link), {
            href: _ctx.route("main.products.show", product.slug)
          }, {
            default: withCtx((_, _push2, _parent2, _scopeId) => {
              if (_push2) {
                _push2(`${ssrInterpolate(product.title)}`);
              } else {
                return [
                  createTextVNode(toDisplayString(product.title), 1)
                ];
              }
            }),
            _: 2
          }, _parent));
          _push(`</h3></div><div class="product-footer d-flex justify-content-between"><div class="d-flex flex-row align-items-end"><span class="product-rating-average">${ssrInterpolate(product.comments_info.rating == "0" ? "-" : product.comments_info.rating)} <i class="ri-star-fill"></i></span></div>`);
          if (!product.in_stock_status) {
            _push(`<div class="d-flex flex-column justify-content-end"><span class="product-price-now lts-05 fs-8">${ssrInterpolate(_ctx.$t("messages.sentence.inventory_inquiry"))}</span></div>`);
          } else if (product.inventory) {
            _push(`<!--[-->`);
            if (product.best_normal_price.discount_price != null) {
              _push(`<div class="d-flex flex-column justify-content-end"><span class="product-price-old fs-9 lts-05">${ssrInterpolate(product.best_normal_price.price)}</span><span class="product-price-now lts-05">${ssrInterpolate(product.best_normal_price.discount_price)} <span class="unit"></span></span></div>`);
            } else {
              _push(`<div class="d-flex flex-column justify-content-end"><span class="product-price-now lts-05">${ssrInterpolate(product.best_normal_price.price)} <span class="unit"></span></span></div>`);
            }
            _push(`<!--]-->`);
          } else {
            _push(`<div class="d-flex flex-column justify-content-end"><span class="product-price-now lts-05 fs-8">${ssrInterpolate(_ctx.$t("messages.word.non_existent"))}</span></div>`);
          }
          _push(`</div>`);
          _push(ssrRenderComponent(unref(Link), {
            class: "product--link",
            href: _ctx.route("main.products.show", product.slug)
          }, null, _parent));
          if (product.in_stock_status && product.inventory && product.best_normal_price.discount_price != null) {
            _push(`<div class="discount-percent bg-secondary shadow-secondary shadow-1">${ssrInterpolate(product.best_normal_price.percent)}<i class="ri-percent-fill"></i></div>`);
          } else {
            _push(`<!---->`);
          }
          _push(`<ul class="product-colors"><!--[-->`);
          ssrRenderList(Array.isArray(product.unique_color) ? product.unique_color.slice(0, 8) : Object.values(product.unique_color || {}).slice(0, 8), (color, index) => {
            _push(`<li style="${ssrRenderStyle("background-color:" + color.value.color)}" data-bs-toggle="tooltip" data-bs-placement="top"${ssrRenderAttr("title", color.value.label)} class="${ssrRenderClass({ "color-is-white": color.value.color === "#ffffff" })}"></li>`);
          });
          _push(`<!--]-->`);
          if ((Array.isArray(product.unique_color) ? product.unique_color.length : Object.keys(product.unique_color || {}).length) > 8) {
            _push(`<li class="more-colors" title="مشاهده رنگ‌های بیشتر"> + </li>`);
          } else {
            _push(`<!---->`);
          }
          _push(`</ul></div></div></div>`);
        });
        _push(`<!--]-->`);
        if (activeCategory.value.products.length == 0) {
          _push(`<div class="w-100"><span class="d-block text-center lts-05 fs-7 text-gray py-3">${ssrInterpolate(_ctx.$t("messages.sentence.no_items_found"))}</span></div>`);
        } else {
          _push(`<!---->`);
        }
        _push(`<!--]-->`);
      } else {
        _push(`<!--[-->`);
        ssrRenderList(new Array(7), (temp, index) => {
          _push(`<div class="${ssrRenderClass({ "swiper-slide": true, readonly: _ctx.status == "dev" })}"><div class="card product"><div class="card-body"><div class="product-thumbnail"><a href="#"><img${ssrRenderAttr("src", _ctx.$page.props.appUrl + "/img/temp/pre-load-product.png")} alt="محصول" loading="lazy"></a></div><div class="product-body"><h3 class="product-title"><a href="#" class="sk sk-text">لورم ایپسوم متن ساختگی برای طراحان</a></h3></div><div class="product-footer d-flex justify-content-between"><div class="d-flex flex-row align-items-end"><a class="add-to-basket d-lg-flex d-none shadow-2 el-center" href="#"><i class="ri-shopping-basket-fill"></i></a><span class="product-rating-average"><span class="sk sk-text-sm d-inline-block">4.9</span> <i class="ri-star-fill"></i></span></div><div class="d-flex flex-column justify-content-end"><span class="product-price-now lts-05"><span class="sk sk-text-sm">900,000</span> <span class="unit"></span></span></div></div><ul class="product-colors"><li style="${ssrRenderStyle({ "background-color": "#c5c2cb" })}"></li><li style="${ssrRenderStyle({ "background-color": "#c5c2cb" })}"></li></ul></div></div></div>`);
        });
        _push(`<!--]-->`);
      }
      _push(`</div><div class="cover-border-right"></div></div></div></div></div></div></div>`);
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/Components/Main/UI/Lists/Products/ProductList6.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
export {
  _sfc_main as default
};
