Compare commits
1 Commits
main
...
rezae/feat
Author | SHA1 | Date | |
---|---|---|---|
![]() |
c3eabf2cf2 |
|
@ -67,7 +67,13 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { mapActions, mapState } from "pinia";
|
import { mapActions, mapState } from "pinia";
|
||||||
import { useResearchStore } from "~/stores/researchStore";
|
|
||||||
|
import { useAuthStore } from "@stores/authStore";
|
||||||
|
import { useCommonStore } from "@stores/commonStore";
|
||||||
|
import { useEntityStore } from "@entity/entityStore";
|
||||||
|
import { useSearchStore } from "@search/stores/searchStore";
|
||||||
|
import { useResearchStore } from "@research/stores/researchStore";
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mounted() {
|
mounted() {
|
||||||
|
@ -102,13 +108,18 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions("common", ["systemsSetter", "activeSystemSetter"]),
|
...mapActions(useCommonStore, [
|
||||||
|
"systemsSetter",
|
||||||
|
"activeSystemSetter",
|
||||||
|
"searchActiveTabSetter",
|
||||||
|
]),
|
||||||
|
|
||||||
...mapActions("aiTools", [
|
...mapActions("aiTools", [
|
||||||
"aiToolsActiveActionSetter",
|
"aiToolsActiveActionSetter",
|
||||||
"aiToolsSchemaSetter",
|
"aiToolsSchemaSetter",
|
||||||
"aiToolsActiveDomainSetter",
|
"aiToolsActiveDomainSetter",
|
||||||
]),
|
]),
|
||||||
...mapActions("entity", [
|
...mapActions(useEntityStore, [
|
||||||
"activeTabSetter",
|
"activeTabSetter",
|
||||||
"entityViewSchemaSetter",
|
"entityViewSchemaSetter",
|
||||||
"activeEntityViewSchemaSetter",
|
"activeEntityViewSchemaSetter",
|
||||||
|
@ -119,10 +130,9 @@ export default {
|
||||||
"domainActiveSetter",
|
"domainActiveSetter",
|
||||||
"selectionFilterItemsSetter",
|
"selectionFilterItemsSetter",
|
||||||
]),
|
]),
|
||||||
...mapActions("search", [
|
...mapActions(useSearchStore, [
|
||||||
"domainActiveSetter", //3
|
"domainActiveSetter", //3
|
||||||
"activeTabSetter", //2
|
"activeTabSetter", //2
|
||||||
"searchActiveTabSetter",
|
|
||||||
"searchSchemaSetter",
|
"searchSchemaSetter",
|
||||||
"helpSchemaSetter",
|
"helpSchemaSetter",
|
||||||
"helpActiveSchemaSetter",
|
"helpActiveSchemaSetter",
|
||||||
|
@ -134,8 +144,8 @@ export default {
|
||||||
]),
|
]),
|
||||||
|
|
||||||
reloadPage() {
|
reloadPage() {
|
||||||
let appVersion = useStorage("app-version", '0.0.0');
|
let appVersion = useStorage("app-version", "0.0.0");
|
||||||
appVersion.vlaue = this.envVersion;
|
appVersion.vlaue = this.envVersion;
|
||||||
|
|
||||||
this.clearStorage();
|
this.clearStorage();
|
||||||
// this.clearCookies();
|
// this.clearCookies();
|
||||||
|
|
|
@ -1,58 +1,18 @@
|
||||||
// composables/useInfiniteScroll.ts
|
// composables/useInfiniteScroll.ts
|
||||||
import { ref, onMounted, onBeforeUnmount } from "vue";
|
|
||||||
|
|
||||||
export default function useInfiniteScroll(
|
export default function useInfiniteScroll(
|
||||||
callback: () => Promise<void>,
|
callback: () => void,
|
||||||
elementId?: string
|
elementId: string
|
||||||
) {
|
) {
|
||||||
const route = useRoute();
|
|
||||||
const isFetching = ref(false);
|
const isFetching = ref(false);
|
||||||
const infiniteScroll = ref<HTMLElement | Window | null>(null);
|
const infiniteScroll = ref<HTMLElement | null>(null);
|
||||||
|
|
||||||
// Throttle function to limit scroll event frequency
|
const handleScroll = () => {
|
||||||
const throttle = (func: (...args: any[]) => void, limit: number) => {
|
if (isFetching.value) return;
|
||||||
let lastFunc: ReturnType<typeof setTimeout>;
|
const scrollPosition =
|
||||||
let lastRan: number;
|
infiniteScroll.value.scrollTop + infiniteScroll.value.clientHeight;
|
||||||
return function (this: any, ...args: any[]) {
|
const threshold = infiniteScroll.value.scrollHeight - 100;
|
||||||
const context = this;
|
|
||||||
if (!lastRan) {
|
|
||||||
func.apply(context, args);
|
|
||||||
lastRan = Date.now();
|
|
||||||
} else {
|
|
||||||
clearTimeout(lastFunc);
|
|
||||||
lastFunc = setTimeout(() => {
|
|
||||||
if (Date.now() - lastRan >= limit) {
|
|
||||||
func.apply(context, args);
|
|
||||||
lastRan = Date.now();
|
|
||||||
}
|
|
||||||
}, limit - (Date.now() - lastRan));
|
|
||||||
}
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkScrollPosition = () => {
|
if (scrollPosition >= threshold) {
|
||||||
if (isFetching.value || !infiniteScroll.value) return;
|
|
||||||
|
|
||||||
let scrollPosition: number;
|
|
||||||
let threshold: number;
|
|
||||||
let clientHeight: number;
|
|
||||||
let scrollHeight: number;
|
|
||||||
|
|
||||||
if (infiniteScroll.value === window) {
|
|
||||||
scrollPosition = window.scrollY || window.pageYOffset;
|
|
||||||
clientHeight = document.documentElement.clientHeight;
|
|
||||||
scrollHeight = document.documentElement.scrollHeight;
|
|
||||||
} else {
|
|
||||||
const el = infiniteScroll.value as HTMLElement;
|
|
||||||
scrollPosition = el.scrollTop;
|
|
||||||
clientHeight = el.clientHeight;
|
|
||||||
scrollHeight = el.scrollHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
threshold = scrollHeight - 100;
|
|
||||||
const currentPosition = scrollPosition + clientHeight;
|
|
||||||
|
|
||||||
if (currentPosition >= threshold) {
|
|
||||||
isFetching.value = true;
|
isFetching.value = true;
|
||||||
callback().finally(() => {
|
callback().finally(() => {
|
||||||
isFetching.value = false;
|
isFetching.value = false;
|
||||||
|
@ -60,57 +20,28 @@ export default function useInfiniteScroll(
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Throttled version of scroll handler
|
|
||||||
const throttledScrollHandler = throttle(checkScrollPosition, 200);
|
|
||||||
|
|
||||||
const handleTouchEnd = () => {
|
const handleTouchEnd = () => {
|
||||||
setTimeout(throttledScrollHandler, 100);
|
// Add a slight delay to ensure scroll position is updated
|
||||||
|
setTimeout(handleScroll, 100);
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
console.info(route.name)
|
const targetElement = document.getElementById(elementId);
|
||||||
|
infiniteScroll.value = targetElement;
|
||||||
|
|
||||||
if (route.name == "hadithaSearch" || route.name == "hadithaLibrary") {
|
if (targetElement) {
|
||||||
const targetElement = elementId
|
targetElement.addEventListener("scroll", handleScroll);
|
||||||
? document.getElementById(elementId)
|
targetElement.addEventListener("touchend", handleTouchEnd);
|
||||||
: window;
|
|
||||||
|
|
||||||
if (!targetElement) {
|
|
||||||
console.warn(
|
|
||||||
`Element ${elementId || "window"} not found for infinite scroll`
|
|
||||||
);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
infiniteScroll.value = targetElement;
|
|
||||||
|
|
||||||
if (targetElement === window) {
|
|
||||||
window.addEventListener("scroll", throttledScrollHandler);
|
|
||||||
window.addEventListener("touchend", handleTouchEnd);
|
|
||||||
} else {
|
|
||||||
targetElement.addEventListener("scroll", throttledScrollHandler);
|
|
||||||
targetElement.addEventListener("touchend", handleTouchEnd);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
if (route.name == "hadithaSearch" || route.name == "hadithaLibrary") {
|
const targetElement = document.getElementById(elementId);
|
||||||
if (!infiniteScroll.value) return;
|
infiniteScroll.value = targetElement;
|
||||||
|
|
||||||
if (infiniteScroll.value === window) {
|
if (targetElement) {
|
||||||
window.removeEventListener("scroll", throttledScrollHandler);
|
targetElement.removeEventListener("scroll", handleScroll);
|
||||||
window.removeEventListener("touchend", handleTouchEnd);
|
targetElement.removeEventListener("touchend", handleTouchEnd);
|
||||||
} else {
|
|
||||||
(infiniteScroll.value as HTMLElement).removeEventListener(
|
|
||||||
"scroll",
|
|
||||||
throttledScrollHandler
|
|
||||||
);
|
|
||||||
(infiniteScroll.value as HTMLElement).removeEventListener(
|
|
||||||
"touchend",
|
|
||||||
handleTouchEnd
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -131,7 +131,7 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState(useSearchStore, ["searchSchemaGetter"]),
|
...mapState(useCommonStore, ["searchSchemaGetter"]),
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions(["checkPermissions"]),
|
...mapActions(["checkPermissions"]),
|
||||||
|
|
BIN
public/img/haditha/search-show-header.png
Normal file
BIN
public/img/haditha/search-show-header.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 73 KiB |
|
@ -20,9 +20,15 @@ import type {
|
||||||
Pagination,
|
Pagination,
|
||||||
} from "~/types/commonTypes";
|
} from "~/types/commonTypes";
|
||||||
|
|
||||||
import type { researchTerms } from "~/types/researchTypes";
|
import type { researchTerms, searchActiveTab } from "~/types/researchTypes";
|
||||||
import type { ActiveEntityViewSchema, ActiveTab } from "~/types/entityType";
|
import type { ActiveEntityViewSchema, ActiveTab } from "~/types/entityType";
|
||||||
import type { Domain, helpActiveSchema, helpSchema } from "~/types/searchTypes";
|
import type {
|
||||||
|
Domain,
|
||||||
|
helpActiveSchema,
|
||||||
|
helpSchema,
|
||||||
|
searchSchema,
|
||||||
|
searchSynonymTitle,
|
||||||
|
} from "~/types/searchTypes";
|
||||||
|
|
||||||
export const useCommonStore = defineStore("commonStore", {
|
export const useCommonStore = defineStore("commonStore", {
|
||||||
persist: {
|
persist: {
|
||||||
|
@ -85,6 +91,11 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
appVersion: "" as string,
|
appVersion: "" as string,
|
||||||
isShowHilight: true as boolean,
|
isShowHilight: true as boolean,
|
||||||
sidebarMenu: {},
|
sidebarMenu: {},
|
||||||
|
|
||||||
|
// search
|
||||||
|
searchSynonymTitle: undefined as searchSynonymTitle | undefined,
|
||||||
|
searchActiveTab: undefined as searchActiveTab | undefined,
|
||||||
|
searchSchema: undefined as searchSchema | undefined,
|
||||||
}),
|
}),
|
||||||
getters: {
|
getters: {
|
||||||
// admin
|
// admin
|
||||||
|
@ -95,10 +106,18 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
return state.helpActiveSchema;
|
return state.helpActiveSchema;
|
||||||
},
|
},
|
||||||
// from search
|
// from search
|
||||||
|
searchSynonymTitleGetter(state) {
|
||||||
|
return state.searchSynonymTitle;
|
||||||
|
},
|
||||||
|
searchActiveTabGetter(state) {
|
||||||
|
return state.searchActiveTab;
|
||||||
|
},
|
||||||
|
searchSchemaGetter(state) {
|
||||||
|
return state.searchSchema;
|
||||||
|
},
|
||||||
domainActiveGetter(state) {
|
domainActiveGetter(state) {
|
||||||
return state.domainActive;
|
return state.domainActive;
|
||||||
},
|
},
|
||||||
|
|
||||||
diffTypeGetter(diffType) {
|
diffTypeGetter(diffType) {
|
||||||
return diffType;
|
return diffType;
|
||||||
},
|
},
|
||||||
|
@ -108,7 +127,6 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
activeEntityViewSchemaGetter(state) {
|
activeEntityViewSchemaGetter(state) {
|
||||||
return state.activeEntityViewSchema;
|
return state.activeEntityViewSchema;
|
||||||
},
|
},
|
||||||
|
|
||||||
researchTermsGetter(state) {
|
researchTermsGetter(state) {
|
||||||
return state.researchTerms;
|
return state.researchTerms;
|
||||||
},
|
},
|
||||||
|
@ -159,6 +177,17 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
this.helpActiveSchema = helpActiveSchema;
|
this.helpActiveSchema = helpActiveSchema;
|
||||||
},
|
},
|
||||||
// from search
|
// from search
|
||||||
|
searchSynonymTitleSetter(searchSynonymTitle = undefined) {
|
||||||
|
this.searchSynonymTitle = searchSynonymTitle;
|
||||||
|
},
|
||||||
|
|
||||||
|
searchActiveTabSetter(searchActiveTab: searchActiveTab) {
|
||||||
|
this.searchActiveTab = searchActiveTab;
|
||||||
|
},
|
||||||
|
searchSchemaSetter(searchSchema = undefined) {
|
||||||
|
this.searchSchema = searchSchema;
|
||||||
|
},
|
||||||
|
|
||||||
domainActiveSetter(domain = undefined) {
|
domainActiveSetter(domain = undefined) {
|
||||||
this.domainActive = domain;
|
this.domainActive = domain;
|
||||||
},
|
},
|
||||||
|
@ -185,7 +214,6 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
this.collapsed = isCollapsed;
|
this.collapsed = isCollapsed;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
SET_SECTIONS(jahatSection: JahatSection) {
|
SET_SECTIONS(jahatSection: JahatSection) {
|
||||||
this.jahatSection = jahatSection;
|
this.jahatSection = jahatSection;
|
||||||
},
|
},
|
||||||
|
@ -255,7 +283,6 @@ export const useCommonStore = defineStore("commonStore", {
|
||||||
this.$reset();
|
this.$reset();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
async getState() {
|
async getState() {
|
||||||
const settingsApi = (await import("~/apis/adminApi")).default;
|
const settingsApi = (await import("~/apis/adminApi")).default;
|
||||||
const url = settingsApi.user.get;
|
const url = settingsApi.user.get;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user