189 lines
7.2 KiB
JavaScript
189 lines
7.2 KiB
JavaScript
import { defineComponent, ref, computed, nextTick, withAsyncContext, watch, resolveDirective, unref, mergeProps, useSSRContext } from 'vue';
|
|
import { ssrRenderComponent, ssrRenderAttrs, ssrRenderList, ssrInterpolate, ssrGetDirectiveProps, ssrRenderAttr, ssrRenderStyle } from 'vue/server-renderer';
|
|
import { _ as _sfc_main$2 } from './SearchButton-hLqVoTUX.mjs';
|
|
import { u as useRouter, a as useConfigStore, n as useIntersectionObserver, t as reactiveProjectName, x as getSupabaseStorageUrl } from './server.mjs';
|
|
import { l as loadGray, _ as _sfc_main$3 } from './gray-BanKC00A.mjs';
|
|
import { g as getStoreSearchPosts } from './media-BbtM6xvT.mjs';
|
|
import { u as useAsyncData } from './asyncData-C9E5x-0d.mjs';
|
|
import './search_gray-B8huMSPA.mjs';
|
|
import '../_/nitro.mjs';
|
|
import 'node:http';
|
|
import 'node:https';
|
|
import 'node:events';
|
|
import 'node:buffer';
|
|
import 'node:fs';
|
|
import 'node:url';
|
|
import 'consola';
|
|
import 'ipx';
|
|
import 'node:path';
|
|
import 'node:crypto';
|
|
import 'pinia';
|
|
import 'vue-router';
|
|
import '@supabase/supabase-js';
|
|
import '@babel/runtime/helpers/esm/extends';
|
|
import '@babel/runtime/helpers/esm/objectSpread2';
|
|
import '@ant-design/colors';
|
|
import '@ctrl/tinycolor';
|
|
import 'stylis';
|
|
import 'vue-types';
|
|
import 'lodash-es';
|
|
import 'axios';
|
|
import '@ant-design/icons-vue';
|
|
import 'vue3-lazyload';
|
|
import '../routes/renderer.mjs';
|
|
import 'vue-bundle-renderer/runtime';
|
|
import 'unhead/server';
|
|
import 'devalue';
|
|
import 'unhead/utils';
|
|
import 'unhead/plugins';
|
|
import 'vue-content-loader';
|
|
|
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
__ssrInlineRender: true,
|
|
async setup(__props) {
|
|
let __temp, __restore;
|
|
const router = useRouter();
|
|
const posts = ref([]);
|
|
const loading = ref(false);
|
|
const videoThumbnails = ref({});
|
|
const seller = computed(() => {
|
|
var _a;
|
|
return (_a = config.sellerConfig) == null ? void 0 : _a.store;
|
|
});
|
|
const config = useConfigStore();
|
|
const endPage = ref(false);
|
|
const currentPage = ref(0);
|
|
const limit = ref(15);
|
|
const total = ref(0);
|
|
const observer = ref();
|
|
useIntersectionObserver(
|
|
observer,
|
|
async ([{ isIntersecting }]) => {
|
|
var _a;
|
|
if (isIntersecting && !loading.value && !endPage.value) {
|
|
loading.value = true;
|
|
const nextPage = currentPage.value + 1;
|
|
setTimeout(async () => {
|
|
var _a2;
|
|
const res = await loadPosts(nextPage);
|
|
if ((_a2 = res.rows) == null ? void 0 : _a2.length) {
|
|
posts.value.push(...res.rows);
|
|
currentPage.value = nextPage;
|
|
}
|
|
}, 100);
|
|
if (((_a = posts.value) == null ? void 0 : _a.length) >= total.value) {
|
|
endPage.value = true;
|
|
}
|
|
loading.value = false;
|
|
}
|
|
},
|
|
{
|
|
threshold: 0.2,
|
|
// فقط وقتی 20٪ عنصر دیده بشه
|
|
rootMargin: "0px 0px 200px 0px"
|
|
// وقتی 200px به پایین نزدیک شد
|
|
}
|
|
);
|
|
const loadPosts = async (page = 1) => {
|
|
var _a;
|
|
try {
|
|
const sellerId = (_a = seller.value) == null ? void 0 : _a.user_id;
|
|
await nextTick();
|
|
const res = await getStoreSearchPosts(sellerId, {
|
|
page,
|
|
limit: limit.value,
|
|
filters: []
|
|
});
|
|
return res;
|
|
} catch (e) {
|
|
console.error(e);
|
|
return { data: [], count: 0 };
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
};
|
|
const { data } = ([__temp, __restore] = withAsyncContext(() => useAsyncData("explore", async () => {
|
|
return loadPosts(1);
|
|
})), __temp = await __temp, __restore(), __temp);
|
|
watch(data, () => {
|
|
var _a;
|
|
if (data.value) {
|
|
posts.value = data.value.rows;
|
|
total.value = data.value.count;
|
|
currentPage.value = 1;
|
|
if (((_a = posts.value) == null ? void 0 : _a.length) >= total.value) endPage.value = true;
|
|
}
|
|
});
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
const _directive_lazy = resolveDirective("lazy");
|
|
let _temp0;
|
|
_push(`<div${ssrRenderAttrs(_attrs)}><div class="absolute top-0 w-inherit right-0 left-0"><div class="flex justify-between w-full p-4">`);
|
|
_push(ssrRenderComponent(_sfc_main$2, {
|
|
class: "w-full mt-2",
|
|
onClick: ($event) => unref(router).push({ name: "search-main" })
|
|
}, null, _parent));
|
|
_push(`</div><div class="h-90vh overflow-y-auto pb-5vh">`);
|
|
if (!loading.value) {
|
|
_push(`<div class="w-full grid grid-cols-3 gap-2px"><!--[-->`);
|
|
ssrRenderList(posts.value, (post, i) => {
|
|
var _a2;
|
|
var _a;
|
|
_push(`<div class="w-full aspect-square relative">`);
|
|
if ((_a = post.files) == null ? void 0 : _a.length) {
|
|
_push(`<!--[-->`);
|
|
if (post.files[0].type === "image") {
|
|
_push(`<img${ssrRenderAttrs(_temp0 = mergeProps({
|
|
class: "w-full h-full object-cover",
|
|
alt: unref(reactiveProjectName)
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)(post.files[0].url), loading: unref(loadGray), error: unref(loadGray) })))}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a2 = _temp0.innerHTML) != null ? _a2 : ""}`);
|
|
} else if (post.files[0].type === "video") {
|
|
_push(`<div class="relative w-full h-full"><video${ssrRenderAttr("src", post.files[0].url)} class="hidden"></video><img${ssrRenderAttr("src", videoThumbnails.value[post.files[0].url])} class="w-full h-full object-cover"${ssrRenderAttr("alt", unref(reactiveProjectName))}><div class="absolute inset-0 flex items-center justify-center bg-black bg-opacity-30"><svg class="w-12 h-12 text-white" fill="currentColor" viewBox="0 0 24 24"><path d="M8 5v14l11-7z"></path></svg></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<!--]-->`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
});
|
|
_push(`<!--]--></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<div style="${ssrRenderStyle(!loading.value ? null : { display: "none" })}" class="w-full opacity-0 relative"> load </div>`);
|
|
if (loading.value) {
|
|
_push(ssrRenderComponent(_sfc_main$3, null, null, _parent));
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div></div></div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$1 = _sfc_main$1.setup;
|
|
_sfc_main$1.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/search/explore/index.vue");
|
|
return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
__ssrInlineRender: true,
|
|
setup(__props) {
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
_push(ssrRenderComponent(_sfc_main$1, _attrs, null, _parent));
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup = _sfc_main.setup;
|
|
_sfc_main.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("pages/search/index.vue");
|
|
return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
|
|
};
|
|
|
|
export { _sfc_main as default };
|
|
//# sourceMappingURL=index-CsJZDvEB.mjs.map
|