Pull and merge from shadi and baghi

work on search pagination
work on library pagination.
2025-04-20 16:01:16 +03:30 · 2025-04-20 15:57:04 +03:30 · 2025-04-20 07:46:08 +03:30 · 2025-04-20 07:21:15 +03:30 · 2025-04-19 14:37:01 +03:30 · 2025-04-19 11:24:38 +03:30
13 changed files with 1267 additions and 482 deletions
--- a/components/haditha/AutoComplation.vue
+++ b/components/haditha/AutoComplation.vue
@ -3,7 +3,6 @@ import type { InputMenuItem } from "@nuxt/ui";
 import hadithaApi from "../../apis/hadithaApi";
 import { useStorage } from "@vueuse/core";
 import * as z from "zod";
-import routeGlobal from "~/middleware/route.global";
 // import type { FormSubmitEvent } from "@nuxt/ui";

 export type Synonym = {
@ -974,6 +973,6 @@ onMounted(() => {
  }
 }

-@media scrren and (min-width: 720px) and (max-width: 991.99px) {
-}
+/* @media scrren and (min-width: 720px) and (max-width: 991.99px) {
+} */
 </style>
--- a/components/haditha/CardList.vue
+++ b/components/haditha/CardList.vue
@ -33,6 +33,7 @@ const goToLibraryShow = (item) => {
  <UCard
    v-if="props.list?.length"
    v-for="(item, index) in props.list"
+     class="mx-auto"
    :key="index"
    variant="solid"
    :ui="{
@ -114,5 +115,16 @@ const goToLibraryShow = (item) => {
    text-align: right;
    color: #444444;
  }
+  @media screen and (max-width: 719.99px) {
+    .library-list {
+      height: calc(100dvh - 13em);
+    }
+
+    .page-header {
+      margin-top: 4em;
+      margin-right: 2em;
+      margin-bottom: 1em;
+    }
+  }
 }
 </style>
--- a/components/haditha/NavigationMenu.vue
+++ b/components/haditha/NavigationMenu.vue
@ -343,7 +343,7 @@ onMounted(() => {
  }
 }

-@media screen and (max-width: 719.99px) {
+@media screen and (max-width: 991.99px) {
  .fixed {
    .my-navbar {
      height: 4.8em; // 76px;
--- a/components/haditha/search-page/SearchList.vue
+++ b/components/haditha/search-page/SearchList.vue
@ -75,16 +75,10 @@ const removeFromFavorites = async (item = {}, index = 0) => {
 </script>

 <template>
-  <div class="search-list-contianer">
-    <div class="total">
-      <span>{{ total }}</span>
-      نتیجه
-    </div>
-
    <div class="search-list firefox-scrollbar">
      <div
-        v-if="props.list.length"
-        class="search-list-item"
+      v-if="props?.list?.length"
+      class="search-list-item"
        v-for="(item, index) in props.list"
        :key="index"
      >
@ -142,7 +136,7 @@ const removeFromFavorites = async (item = {}, index = 0) => {
      </no-data>
    </div>

-    <!-- <UModal
+  <!-- <UModal
      v-model:open="isModalOpen"
      :dismissible="false"
      :ui="{
@ -164,38 +158,36 @@ const removeFromFavorites = async (item = {}, index = 0) => {
      </template>
      <<template #footer></template> 
    </UModal> -->
-  </div>
 </template>

 <style scoped>
-.search-list-contianer {
-  max-width: 41em; /*656px*/
-  width: 100%;
-  margin: 0 1em;
-
-  .total {
-    padding: 0.5em 1.8em;
-
+.search-list-item {
+  .from-person {
    font-family: IRANSansX;
-    font-weight: 400;
-    font-size: 0.68rem; /*11px*/
-    line-height: 1rem;
+    font-weight: 300;
+    font-size: 0.75rem; /*12px*/
+    line-height: 1.125rem; /*18px*/
    letter-spacing: 0%;
    text-align: right;
-    color: #b4c2cf;
+    color: #00a762; /* #4be8ae 7.38%  */
+    margin-bottom: 0.5em;
+
+    &:hover,
+    &:focus,
+    &:active {
+      cursor: pointer;
+      background-color: #fafafa;
+    }
  }
-  .search-list {
-    padding: 1em 1.3em;
-    height: calc(100dvh - 16em);
-    overflow-y: auto;
-
-    &.hadithaFavorites {
-      height: calc(100dvh - 8em);
-    }
-
-    &:not(:last-child) {
-      border-bottom: 0.3px solid #d9d9d9;
-    }
+  .arabic-text {
+    font-family: Takrim;
+    font-weight: 400;
+    font-size: 1.125rem; /*18px*/
+    line-height: 2rem; /*23px*/
+    letter-spacing: 0%;
+    text-align: right;
+    color: var(--ui-color-two);
+    margin-bottom: 0.5em;

    .search-list-item {
      .from-person {
@ -270,18 +262,47 @@ const removeFromFavorites = async (item = {}, index = 0) => {
      }
    }
  }
-  .no-data-text {
+  .persian-text {
+    font-family: Takrim;
+    font-weight: 400;
+    font-size: 1rem; /*16px*/
+    line-height: 1.375rem; /*22px*/
+    letter-spacing: 0%;
+    text-align: right;
+    color: #626b84;
+    margin-bottom: 0.5em;
+  }
+  .reference {
+    height: 24px;
+    gap: 4px;
+    padding-top: 0.25em; /*4px*/
+    padding-right: 0.5em; /*8px*/
+    padding-bottom: 0.25em; /*4px*/
+    padding-left: 0.5em; /*8px*/
+    border-radius: 6px; /*18px*/
+    border-width: 0.5px;
+    border: 0.5px solid #d9d9d9;
+
    font-family: IRANSansX;
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.5rem; /*24px*/
    letter-spacing: 0%;
-    text-align: center;
+    text-align: right;
+    color: #8a92a8;
+
+    &:hover,
+    &:focus,
+    &:active {
+      cursor: pointer;
+      background-color: #fafafa;
+    }
  }
 }
 </style>
-
+<!-- 
 <style>
+
 .text__orange {
  color: orange;
 }
--- a/pages/haditha/library/[id]/[slug]/index.vue
+++ b/pages/haditha/library/[id]/[slug]/index.vue
@ -15,6 +15,9 @@ const router = useRouter();
 import hadithaApi from "@haditha/apis/hadithaApi";
 import type { HadithResponseModel, Hits } from "@haditha/types/hadithType";
 import type { Hit } from "~/systems/hadith_ui/types/hadithType";
+import headLinks from "@haditha/json/haditha/headLinks";
+import headMetas from "@haditha/json/haditha/headMetas";
+
 // #endregion imports

 // #region meta
@ -28,94 +31,12 @@ useHead({
  title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | ${route.params.slug}`,
  meta: [
    { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
-    {
-      name: "msapplication-TileImage",
-      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
-    },
-    { name: "theme-color", content: "#ffffff" },
+    ...headMetas,
  ],
  bodyAttrs: {
    class: import.meta.env.VITE_HADITH_SYSTEM,
  },
-  link: [
-    {
-      rel: "icon",
-      type: "image/x-icon",
-      href: "/img/haditha/fav-icons/favicon.ico",
-    },
-    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
-    // rel: icon
-    {
-      rel: "icon",
-      type: "image/png",
-      sizes: "16x16",
-      href: "/img/haditha/fav-icons/favicon-16x16.png",
-    },
-    {
-      rel: "icon",
-      type: "image/png",
-      sizes: "32x32",
-      href: "/img/haditha/fav-icons/favicon-32x32.png",
-    },
-    {
-      rel: "icon",
-      type: "image/png",
-      sizes: "96x96",
-      href: "/img/haditha/fav-icons/favicon-96x96.png",
-    },
-    {
-      rel: "icon",
-      sizes: "192x192",
-      type: "image/png",
-      href: "/img/haditha/fav-icons/android-icon-192x192.png",
-    },
-    // rel: apple
-    {
-      rel: "apple-touch-icon",
-      sizes: "57x57",
-      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "60x60",
-      href: "/img/haditha/fav-icons/android-icon-60x60.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "72x72",
-      href: "/img/haditha/fav-icons/android-icon-72x72.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "76x76",
-      href: "/img/haditha/fav-icons/android-icon-76x76.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "114x114",
-      href: "/img/haditha/fav-icons/android-icon-114x114.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "120x120",
-      href: "/img/haditha/fav-icons/android-icon-120x120.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "144x144",
-      href: "/img/haditha/fav-icons/android-icon-144x144.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "152x152",
-      href: "/img/haditha/fav-icons/android-icon-152x152.png",
-    },
-    {
-      rel: "apple-touch-icon",
-      sizes: "180x180",
-      href: "/img/haditha/fav-icons/android-icon-180x180.png",
-    },
-  ],
+  link: headLinks,
 });
 // #endregion imports
 // #region props
@ -155,6 +76,7 @@ const props = defineProps({
 const isModalOpen = ref(false);
 const loading = ref(false);
 const httpService = useNuxtApp()["$http"];
+const page_num = ref(1);

 const state = reactive({
  selectedItem: [] as Hit[],
@ -214,27 +136,13 @@ const state = reactive({

 const pageIsLessThanOne = computed(() => {
  console.info("pageIsLessThanOne");
-  let isDisabled = true;
-  if (state.selectedItem.length)
-    return state.selectedItem[0]._source.address.page_num <= 1;
-  return isDisabled;
+  return page_num.value <= 1;
 });
 const pageIsBiggerThanTotal = computed(() => {
  console.info("pageIsBiggerThanTotal");
-
-  let isDisabled = true;
-  if (
-    state.selectedItem.length &&
-    state.selectedItem[0]._source.address.page_num
-  )
-    return (
-      state.selectedItem?.[0]._source.address.page_num + 1 >=
-      +route.query.page_count
-    );
-
-  return isDisabled;
+  const page_count = +route.query.page_count;
+  return page_num.value + 1 >= page_count;
 });
-const page_num = ref(1);
 // #endregion refs and reactives

 // #region methods
@ -242,12 +150,16 @@ const fetchData = async () => {
  if (loading.value) return;
  loading.value = true;

+  let page_first = +route.query.page_first;
+  const volId = route.params.id;
+
  let url = repoUrl() + hadithaApi.library.show;
  url = url.replace("@appname", "monir");
-  url = url.replace("@page_start", route.query.page_first);
-  url = url.replace("@page_end", +route.query.page_first + 1);
-  url = url.replace("@vol_id", route.params.id.toString());
+  url = url.replace("@page_start", 0);
+  url = url.replace("@page_end", 1);
+  url = url.replace("@vol_id", volId);

+  console.info("urlurlurlurl", url);
  // fetch search list from backend(ssr)
  const { data, status, error, refresh, clear } =
    await useHadithaSearchComposable<HadithResponseModel>(url, {
@ -292,45 +204,41 @@ const handlePagination = (
  if (loading.value) return;
  loading.value = true;

-  if (state.selectedItem?.length) {
-    const isPageBiggerThanOne =
-      state.selectedItem[0]._source.address.page_num + prevNextIndicator > 0;
-    const isPageLessThanTotal =
-      state.selectedItem[0]._source.address.page_num + prevNextIndicator <
-      +route.query.page_count;
+  const volId = route.params.id;
+  const page_count = +route.query.page_count;
+  const page_first = +route.query.page_first;
+  const isPageBiggerThanOne = +page_num.value + prevNextIndicator > 0;
+  const isPageLessThanTotal = +page_num.value + prevNextIndicator < page_count;

-    if (!(isPageBiggerThanOne && isPageLessThanTotal)) return;
-  }
+  if (!(isPageBiggerThanOne && isPageLessThanTotal)) return;

  let url = repoUrl() + hadithaApi.library.prevNextHadith;
  url = url.replace("@index_key", "dhparag");
-  url = url.replace("@vol_id", state.selectedItem?.[0]._source.address.vol_id);
-  url = url.replace(
-    "@page_num",
-    (pageNumber ?? state.selectedItem?.[0]._source.address.page_num).toString()
-  );
+  url = url.replace("@vol_id", volId);
+  url = url.replace("@page_num", (pageNumber ?? page_num.value).toString());
  url = url.replace("@step", prevNextIndicator.toString());

+  page_num.value += prevNextIndicator;
+
  httpService
    .getRequest(url)
    .then((res: HadithResponseModel) => {
      state.selectedItem = res.hits.hits;
-      page_num.value = res.hits.hits[0]._source.address.page_num ?? 1;
    })
    .finally(() => (loading.value = false));
 };
 const handlePageChange = () => {
-  handlePagination(1, page_num.value);
+  handlePagination(1, +page_num.value);
 };

 const getDataTree = () => {
-  let id = route.params.id;
+  const volId = route.params.id;

  let url = repoUrl() + hadithaApi.search.getDataTree;
  url = url.replace("@appname", "monir");
  url = url.replace("@offset", 0);
  url = url.replace("@limit", 10000);
-  url = url.replace("@vol_id", id);
+  url = url.replace("@vol_id", volId);
  url = url.replace("@q", "none");

  httpService.getRequest(url).then((res) => {
@ -350,6 +258,9 @@ const prepareTreeData = (data) => {

 getDataTree();

+onMounted(() => {
+  page_num.value = +route.query.page_first;
+});
 // #endregion methods

 // components declaration
@ -684,7 +595,7 @@ const UTree = defineAsyncComponent(
          display: flex;
          justify-content: center;
          align-items: center;
-          width: 3em /*36px*/;
+          width: 4em /*36px*/;
          height: 3em /*36px*/;
          gap: 4px;
          border-radius: 12px;
--- a/pages/haditha/library/index.vue
+++ b/pages/haditha/library/index.vue
@ -24,14 +24,13 @@ useHead({
 // #region refs
 const el = useTemplateRef<HTMLElement>("el");
 const httpService = useNuxtApp()["$http"];
-const route = useRoute();
-const page = ref(Number(route.query.page) || 1);
+const total = ref(0);
+const currentPage = useState("currentPage", () => 0);
 // #endregion refs

 // #region reactive
 const state = reactive({
  pagination: {
-    offset: 0,
    limit: 10,
    page: 1,
    pages: 1,
@ -43,15 +42,20 @@ const state = reactive({
 const getLibraryList = async (dataType = "bookmark") => {
  let url = repoUrl() + hadithaApi.library.list;
  url = url.replace("@field_collapsed", "normal");
-  url = url.replace("@offset", state.pagination.offset);
+  url = url.replace("@offset", currentPage.value);
  url = url.replace("@limit", state.pagination.limit);
  url = url.replace("@q", "none");

-  return await httpService.postRequest(url);
+  return await httpService.postRequest(url).then((res) => {
+    total.value = res.hits.total.value ?? 0;
+    currentPage.value += state.pagination.limit;
+
+    return res;
+  });
 };

 // Server-side initial load
-const { data: initialItems } = await useAsyncData(
+const { data: loadedItems } = await useAsyncData(
  "libraryList",
  () => getLibraryList(),
  {
@ -59,16 +63,12 @@ const { data: initialItems } = await useAsyncData(
    getCachedData: (key) => {
      return useNuxtApp().payload.data[key] || useNuxtApp().static.data[key];
    },
-    watch: [page],
  }
 );

 // Client-side state
-const loadedItems = ref([]);
 const loading = ref(false);
 const hasMore = ref(true);
-const loader = ref(null);
-const totalPages = ref(10); // Set based on your API response

 // Client-side infinite scroll
 useInfiniteScroll(
@ -84,7 +84,6 @@ useInfiniteScroll(

        if (hits.length) {
          loadedItems.value.push(...hits);
-          state.pagination.offset += state.pagination.limit;
        } else {
          hasMore.value = false;
        }
@ -120,7 +119,10 @@ const CardList = defineAsyncComponent(
          <img fit="auto" quality="80" src="/img/haditha/haditha-title.svg" />
        </div>

-        <div ref="el" class="library-list grid grid-cols-5 gap-x-28 gap-y-12">
+        <div
+          ref="el"
+          class="library-list grid grid-cols-2 gap-x-15 gap-y-12 md:grid-cols-3 md:gap-x-28 md:gap-y-12 lg:grid-cols-5 lg:gap-x-28 lg:gap-y-12 mx-6"
+        >
          <!-- Client-side loaded content -->
          <card-list
            v-if="loadedItems.length"
@ -128,14 +130,6 @@ const CardList = defineAsyncComponent(
            no-data-icon="/img/haditha/no-data.png"
            :list="loadedItems"
          ></card-list>
-
-          <!-- Server-rendered initial content -->
-          <card-list
-            v-else
-            no-data-text="هنوز چیزی ذخیره نکرده‌اید!"
-            no-data-icon="/img/haditha/no-data.png"
-            :list="initialItems"
-          ></card-list>
        </div>
      </div>
    </div>
@ -148,6 +142,7 @@ const CardList = defineAsyncComponent(
  background: #f7fffd;

  .library-list-contianer {
+    height: 100%;
    margin-top: 10em;
    max-width: 1200px;
    width: 100%;
@ -185,4 +180,19 @@ const CardList = defineAsyncComponent(
    }
  }
 }
+
+@media screen and (max-width: 991.99px) {
+  .search-box-container {
+    padding-top: 0em;
+  }
+  .library-list {
+    height: calc(100dvh - 13em);
+  }
+
+  .page-header {
+    margin-top: 4em;
+    margin-right: 2em;
+    margin-bottom: 1em;
+  }
+}
 </style>
--- a/pages/haditha/public-pages/about-us.vue
+++ b/pages/haditha/public-pages/about-us.vue
@ -30,7 +30,9 @@ const NavigationMenu = defineAsyncComponent(() =>
      <UContainer class="page-inner-container sm:px-6 lg:px-4">
        <navigation-menu></navigation-menu>

-        <div class="page-header pt-38 pb-4 flex justify-between items-center">
+        <div
+          class="page-header pt-10 md:pt-10 lg:pt-38 pb-4 flex justify-between items-center"
+        >
          <div class="flex items-center">
            <h1 class="m-0 title">درباره</h1>
            <img
@ -42,36 +44,36 @@ const NavigationMenu = defineAsyncComponent(() =>
          </div>
        </div>

-        <div class="page-content p-6">
+        <div class="page-content p-5">
          <p>
            حدیثا، یک موتور جستجوی پیشرفته و تخصصی در حوزه احادیث اسلامی است که
            با هدف دسترسی آسان و سریع به منابع معتبر حدیثی طراحی شده است. این
            پلتفرم، بستری است برای پژوهشگران، علاقه‌مندان به معارف اسلامی، و
            تمامی افرادی که به دنبال دسترسی به گنجینه ارزشمند احادیث نبوی و
            اهل‌بیت (علیهم‌السلام) هستند.
-  </p>
+          </p>

-  <p>
+          <p>
            ما در حدیثا تلاش می‌کنیم تا با بهره‌گیری از فناوری‌های نوین و منابع
            اصیل اسلامی، بهترین تجربه جستجو را به کاربران ارائه دهیم. تمامی
            محتوای این موتور جستجو از کتب معتبر حدیثی و منابع شناخته‌شده استخراج
            شده و با دقت علمی بالا سامان‌دهی شده است.
-  </p>
+          </p>

-  <p>اهداف ما شامل موارد زیر است:</p>
+          <p>اهداف ما شامل موارد زیر است:</p>

-  <ul class="list-disc list-inside">
-    <li>ارائه محتوای معتبر و دسته‌بندی‌شده از احادیث اسلامی.</li>
-    <li>تسهیل دسترسی به معارف اسلامی برای پژوهشگران و عموم مردم.</li>
-    <li>کمک به ترویج فرهنگ و اخلاق اسلامی از طریق انتشار احادیث.</li>
-  </ul>
+          <ul class="list-disc list-inside">
+            <li>ارائه محتوای معتبر و دسته‌بندی‌شده از احادیث اسلامی.</li>
+            <li>تسهیل دسترسی به معارف اسلامی برای پژوهشگران و عموم مردم.</li>
+            <li>کمک به ترویج فرهنگ و اخلاق اسلامی از طریق انتشار احادیث.</li>
+          </ul>

-  <p>
+          <p>
            ما به حریم خصوصی کاربران خود احترام می‌گذاریم و متعهد به ارائه
            خدماتی با کیفیت و دقیق هستیم. حدیثا پلی است میان شما و کلام گهربار
            اهل‌بیت و پیامبر اسلام (صلی‌الله‌علیه‌و‌آله).
-  </p>
-  <p>به خانواده حدیثا بپیوندید و در مسیر دانش و معرفت گام بردارید.</p>
+          </p>
+          <p>به خانواده حدیثا بپیوندید و در مسیر دانش و معرفت گام بردارید.</p>
        </div>
      </UContainer>
    </div>
@ -97,17 +99,24 @@ const NavigationMenu = defineAsyncComponent(() =>
    }

    .page-content {
+      height: calc(100dvh - 13em);
+      overflow: auto;
      color: var(--ui-color-two);

-p {
-  font-family: IRANSansX;
-  font-weight: 300;
-  font-size: 14px;
-  line-height: 21px;
-  letter-spacing: 0%;
-  text-align: right;
-}
+      p {
+        font-family: IRANSansX;
+        font-weight: 300;
+        font-size: 14px;
+        line-height: 21px;
+        letter-spacing: 0%;
+        text-align: right;
+      }
    }
  }
 }
+@media screen and (max-width: 719.99px) {
+  .page-content{
+    height: calc(100dvh - 12em);
+  }
+}
 </style>
--- a/pages/haditha/public-pages/contactus.vue
+++ b/pages/haditha/public-pages/contactus.vue
@ -32,7 +32,9 @@ const NavigationMenu = defineAsyncComponent(() =>

        <navigation-menu></navigation-menu>

-        <div class="page-header pt-38 pb-4 flex justify-between items-center">
+        <div
+          class="page-header  pt-10 md:pt-10 lg:pt-38  pb-4 flex justify-between items-center"
+        >
          <div class="flex items-center">
            <h1 class="m-0 title">تماس با ما</h1>
          </div>
@ -89,8 +91,10 @@ const NavigationMenu = defineAsyncComponent(() =>
    left: 0;
    background-image: url("../../../assets/haditha/images/modal-top-bgi.png");
    backdrop-filter: blur(54px);
-    width: 447px;
-    height: 447px;
+    width: 100%;
+    max-width: 447px;
+    height: 100%;
+    max-height: 447px;
    top: 0;
    left: 0;

@ -105,8 +109,11 @@ const NavigationMenu = defineAsyncComponent(() =>
    bottom: 0;
    background-image: url("../../../assets/haditha/images/modal-bttom-right-bgi.png");
    backdrop-filter: blur(54px);
-    width: 438px;
-    height: 238px;
+    width: 100%;
+
+    max-width: 438px;
+    height: 100%;
+    max-height: 238px;
    mix-blend-mode: Multiply;
    background-repeat: no-repeat;
    background-size: cover;
@ -120,8 +127,11 @@ const NavigationMenu = defineAsyncComponent(() =>
    bottom: 0;
    left: 0;

-    width: 458px;
-    height: 239px;
+    width: 100%;
+    max-width: 458px;
+    height: 100%;
+
+    max-height: 239px;
    mix-blend-mode: Multiply;
    background-image: url("../../../assets/haditha/images/modal-bottom-left-bgi.png");
    background-repeat: no-repeat;
--- a/pages/haditha/public-pages/rules.vue
+++ b/pages/haditha/public-pages/rules.vue
@ -30,7 +30,9 @@ const NavigationMenu = defineAsyncComponent(() =>
      <UContainer class="page-inner-container sm:px-6 lg:px-4">
        <navigation-menu></navigation-menu>

-        <div class="page-header pt-38 pb-4 flex justify-between items-center">
+        <div
+          class="page-header pt-10 md:pt-10 lg:pt-38 pb-4 flex justify-between items-center"
+        >
          <div class="flex items-center">
            <h1 class="m-0 title">قوانین و مقررات</h1>
            <img
@ -42,7 +44,7 @@ const NavigationMenu = defineAsyncComponent(() =>
          </div>
        </div>

-        <div class="page-content p-6">
+        <div class="page-content p-5">
          <ul class="list-decimal list-inside">
            <li>
              احترام به حقوق معنوی: تمامی محتواهای ارائه‌شده در این سایت متعلق
@ -110,8 +112,9 @@ const NavigationMenu = defineAsyncComponent(() =>
    }

    .page-content {
+      height: calc(100dvh - 13em);
+      overflow: auto;
      color: var(--ui-color-two);
-
      ul li {
        font-family: IRANSansX;
        font-weight: 300;
@ -123,4 +126,9 @@ const NavigationMenu = defineAsyncComponent(() =>
    }
  }
 }
+@media screen and (max-width: 719.99px) {
+  .page-content{
+    height: calc(100dvh - 12em);
+  }
+}
 </style>
--- a/pages/haditha/search/[id]/[slug]/index.vue
+++ b/pages/haditha/search/[id]/[slug]/index.vue
@ -513,7 +513,11 @@ const handlePagination = (prevNextIndicator: string) => {

 <!-- because of the buttons, using without scoped. -->
 <style>
+.page-inner-container{
+  height: 100%;
+}
 .search-show-page {
+ 
  .body-header {
    .modal-title {
      padding: 0 0.5em 1.5em;
@ -591,8 +595,8 @@ const handlePagination = (prevNextIndicator: string) => {
      }
    }
    .content {
-      /* height: calc(100dvh - 29em); */
-      /* overflow-y: auto; */
+      height: calc(100dvh - 15em);
+      overflow-y: auto;

      .search-item {
        padding: 1em 0 1em 0.1em;
@ -837,4 +841,14 @@ const handlePagination = (prevNextIndicator: string) => {
    }
  }
 }
+@media screen and (max-width: 719.99px) {
+  .search-show-page {
+    .body-content {
+      .content {
+        height: calc(100dvh - 15em);
+      overflow-y: auto;
+      }
+    }
+  }
+}
 </style>
--- a/pages/haditha/search/index.vue
+++ b/pages/haditha/search/index.vue
--- a/stores/hadithaStore.ts
+++ b/stores/hadithaStore.ts
@ -1,228 +1,18 @@
-import type {
-  activeSearchChartSchema,
-  activeSearchListSchema,
-  Domain,
-  helpActiveSchema,
-  helpSchema,
-  searchActiveTab,
-  searchChartActiveTab,
-  searchListActiveTab,
-  searchSchema,
-  searchSynonymForm,
-  searchSynonymTitle,
-  selectionFilterItems,
-} from "~/types/searchTypes";
-
-import type {
-  isReturnFromItemshowPage,
-  list,
-  listComponentName,
-  listId,
-  projects,
-  selectedItem,
-  selectedProject,
-} from "~/types/listTypes";
-
 export const useHadithaStore = defineStore("hadithaStore", {
  persist: {
    storage: piniaPluginPersistedstate.localStorage(),
-  },  state: () => ({
-    selectedProject: undefined as selectedProject | undefined,
-    isReturnFromItemshowPage: false as isReturnFromItemshowPage,
-    list: undefined as list | undefined,
-    listId: undefined as listId | undefined,
-    listComponentName: "ItemList" as listComponentName | undefined,
-    projects: [] as projects[],
-    // pieData: [],
-    selectedItem: undefined as selectedItem | undefined,
-
-
-    domainActive: undefined as Domain | undefined,
-    // activeTab: undefined,
-
-    searchActiveTab: undefined as searchActiveTab | undefined,
-    searchSchema: undefined as searchSchema | undefined,
-    helpSchema: undefined as helpSchema | undefined,
-    searchActiveSchema: undefined as searchActiveTab | undefined,
-    helpActiveSchema: undefined as helpActiveSchema | undefined,
-
-    searchListActiveTab: undefined as searchListActiveTab | undefined,
-    searchListSchema: undefined as searchListActiveTab[] | undefined,
-    activeSearchListSchema: undefined as activeSearchListSchema | undefined,
-
-    searchChartActiveTab: undefined as searchChartActiveTab | undefined,
-    searchChartSchema: undefined as searchChartActiveTab[] | undefined,
-    activeSearchChartSchema: undefined as activeSearchChartSchema | undefined,
-
-    searchSynonymTitle: undefined as searchSynonymTitle | undefined,
-    searchSynonymForm: undefined as searchSynonymForm | undefined,
-
-    selectionFilterItems: [] as selectionFilterItems,
+  },
+  state: () => ({
+    searchPhrase: "" as string,
  }),
  getters: {
-    projectsGetter(state) {
-      return state.projects;
-    },
-    selectedProjectGetter(state) {
-      return state.selectedProject;
-    },
-    listIdGetter(state) {
-      return state.listId;
-    },
-    listComponentNameGetter(state) {
-      return state.listComponentName;
-    },
-    selectedItemGetter(state) {
-      return state.selectedItem;
-    },
-    isReturnFromItemshowPageGetter(state) {
-      return state.isReturnFromItemshowPage;
-    },
-    listGetter(state) {
-      return state.list;
-    },
-
-    searchSynonymTitleGetter(state) {
-      return state.searchSynonymTitle;
-    },
-    searchSynonymFormGetter(state) {
-      return state.searchSynonymForm;
-    },
-
-    domainActiveGetter(state) {
-      return state.domainActive;
-    },
-    // activeTabGetter(state) {
-    //   return state.activeTab;
-    // },
-
-    // search page
-    searchActiveTabGetter(state) {
-      return state.searchActiveTab;
-    },
-    searchSchemaGetter(state) {
-      return state.searchSchema;
-    },
-    helpSchemaGetter(state) {
-      return state.helpSchema;
-    },
-    helpActiveSchemaGetter(state) {
-      return state.helpActiveSchema;
-    },
-    searchActiveSchemaGetter(state) {
-      return state.searchActiveSchema;
-    },
-
-    // search list
-    searchListActiveTabGetter(state) {
-      return state.searchListActiveTab;
-    },
-    searchListSchemaGetter(state) {
-      return state.searchListSchema;
-    },
-    searchListActiveSchemaGetter(state) {
-      return state.activeSearchListSchema;
-    },
-
-    // search chart
-    searchChartActiveTabGetter(state) {
-      return state.searchChartActiveTab;
-    },
-    searchChartSchemaGetter(state) {
-      return state.searchChartSchema;
-    },
-    searchChartActiveSchemaGetter(state) {
-      return state.activeSearchChartSchema;
-    },
-    selectionFilterItemsGetter(state) {
-      return state.selectionFilterItems;
+    searchPhraseGetter(state) {
+      return state.searchPhrase;
    },
  },
  actions: {
-    SET_SELECTED_PROJECT(selectedProject = undefined) {
-      this.selectedProject = selectedProject;
-    },
-    SET_LIST_ID(listId = undefined) {
-      this.listId = listId;
-    },
-    SET_LIST_COMPONENT_NAME(
-      payload = { selectedItem: undefined, listComponentName: undefined }
-    ) {
-      this.selectedItem = payload.selectedItem;
-      this.listComponentName = payload.listComponentName;
-    },
-    SET_SELECTED_ITEM(selectedItem = undefined) {
-      this.selectedItem = selectedItem;
-    },
-    SET_IS_RETURN_FROM_ITEM_SHOW_PAGE(isReturnFromItemshowPage = false) {
-      this.isReturnFromItemshowPage = isReturnFromItemshowPage;
-    },
-    SET_LIST(list = undefined) {
-      this.list = list;
-    },
-    
-    searchSynonymFormSetter(searchSynonymForm = undefined) {
-      this.searchSynonymForm = searchSynonymForm;
-    },
-    searchSynonymTitleSetter(searchSynonymTitle = undefined) {
-      this.searchSynonymTitle = searchSynonymTitle;
-    },
-
-    domainActiveSetter(domain = undefined) {
-      this.domainActive = domain;
-    },
-    // activeTabSetter(activeTab = undefined) {
-    //   this.activeTab = activeTab;
-    // },
-
-    // search page
-    searchActiveTabSetter(searchActiveTab: searchActiveTab = undefined) {
-      this.searchActiveTab = searchActiveTab;
-    },
-    searchSchemaSetter(searchSchema = undefined) {
-      this.searchSchema = searchSchema;
-    },
-    helpSchemaSetter(helpSchema = undefined) {
-      this.helpSchema = helpSchema;
-    },
-    helpActiveSchemaSetter(helpActiveSchema = undefined) {
-      this.helpActiveSchema = helpActiveSchema;
-    },
-    searchActiveSchemaSetter(searchActiveSchema = undefined) {
-      this.searchActiveSchema = searchActiveSchema;
-    },
-
-    // search list
-    searchListActiveTabSetter(searchListActiveTab = undefined) {
-      this.searchListActiveTab = searchListActiveTab;
-    },
-    searchListSchemaSetter(searchListSchema = undefined) {
-      this.searchListSchema = searchListSchema;
-    },
-    searchListActiveSchemaSetter(activeSearchListSchema = undefined) {
-      this.activeSearchListSchema = activeSearchListSchema;
-    },
-
-    // search chart
-    searchChartActiveTabSetter(searchChartActiveTab = undefined) {
-      this.searchChartActiveTab = searchChartActiveTab;
-    },
-    searchChartSchemaSetter(searchChartSchema = undefined) {
-      this.searchChartSchema = searchChartSchema;
-    },
-    searchChartActiveSchemaSetter(activeSearchChartSchema = undefined) {
-      this.activeSearchChartSchema = activeSearchChartSchema;
-    },
-    selectionFilterItemsSetter(selectionFilterItems = []) {
-      this.selectionFilterItems = <selectionFilterItems>selectionFilterItems;
+    searchPhraseSetter(newVal = "") {
+      this.searchPhrase = newVal;
    },
  },
 });
-// export default {
-//   namespaced:true,
-
-//   state,
-//   actions,
-//   mutations,
-//   getters
-// };
--- a/types/hadithType.ts
+++ b/types/hadithType.ts
@ -358,4 +358,16 @@ export interface Root {
  _score: any
  _source: Source
  sort: number[]
-}
+}
+
+export type Synonym = {
+  title: string;
+  enable: boolean;
+  enableForm: boolean;
+  subTitles: [
+    {
+      title: string;
+      active: boolean;
+    }
+  ];
+};
Author	SHA1	Message	Date
mustafa-rezae	2cff09d0a0	Pull and merge from shadi and baghi	2025-04-20 16:01:16 +03:30
mustafa-rezae	8fd63ea172	work on search pagination work on library pagination.	2025-04-20 15:57:04 +03:30
Mehdi104797	c78e6cb64c	.	2025-04-20 07:46:08 +03:30
Mehdi104797	77578094d9	.	2025-04-20 07:21:15 +03:30
Mehdi104797	e218b11750	.	2025-04-19 14:37:01 +03:30
Mehdi104797	578b4c3d64	تغییرات	2025-04-19 11:24:38 +03:30
Mehdi104797	74542bbb12	ریسپانسیو	2025-04-19 10:06:07 +03:30
Mehdi104797	c4495245b2	...	2025-04-19 08:26:41 +03:30
Mehdi104797	b95d9c5d51	تغییرات	2025-04-17 13:49:03 +03:30
Mehdi104797	e537798081	تغییرات	2025-04-16 14:35:05 +03:30
Mehdi104797	cf862e1a2f	CardList	2025-04-16 13:01:02 +03:30