diff --git a/pages/haditha/search/index.vue b/pages/haditha/search/index.vue
index 7ad5d0c..3163cc4 100644
--- a/pages/haditha/search/index.vue
+++ b/pages/haditha/search/index.vue
@@ -167,19 +167,20 @@ const backgroundImageStyle = computed(() => {
// });
let optimizedImageUrl = "/img/haditha/background.webp";
- if (!showNoData.value) {
+ if (showNoData.value) {
// optimizedImageUrl = img("/img/haditha/sub-header-bgi.webp", {
// quality: 80,
// });
optimizedImageUrl = "/img/haditha/sub-header-bgi.webp";
return {
- backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
+ backgroundImage: `url(${optimizedImageUrl})`,
+ // backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
};
}
return {
- backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
+ backgroundImage: `url(${optimizedImageUrl})`,
};
});
const searchButtonIcon = computed(() => {
@@ -229,7 +230,9 @@ const sendQuery = async (payload = {}) => {
);
// if (route.query.f_aik?.length) url += `&f_aik=${route.query.f_aik}`;
- }
+ } else url = url.replace("@q=none", "q=none");
+
+ console.info(url);
return await httpService.postRequest(url, payload).then((res) => {
total.value = res.hits.total.value ?? 0;
@@ -247,8 +250,11 @@ const sendQuery = async (payload = {}) => {
// Server-side initial load
const { data: loadedItems } = await useAsyncData("search", () => sendQuery(), {
transform: (data) => data.hits.hits,
+ getCachedData: (key) => {
+ return useNuxtApp().payload.data[key] || useNuxtApp().static.data[key];
+ },
});
-showNoData.value = loadedItems.value?.length == 0;
+showNoData.value = Boolean(loadedItems.value?.length);
const onBeforeSendQuery = (from) => {
if (loading.value) return;
@@ -265,12 +271,11 @@ const onBeforeSendQuery = (from) => {
if (searchTerm.value?.length) {
sendQuery().then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
loading.value = false;
});
} else {
searchTerm.value = "";
- loading.value = false;
loadedItems.value = [];
showNoData.value = false;
loading.value = false;
@@ -305,17 +310,19 @@ const onSearchButtonClick = () => {
if (loading.value) return;
loading.value = true;
- sendQuery().then((res) => {
- loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ // showclearButton.value = true;
+ if (searchTerm.value?.length) {
+ searchTerm.value = "";
+ loadedItems.value = [];
+ showNoData.value = false;
loading.value = false;
- });
-};
-const resetForm = () => {
- searchTerm.value = "";
- loadedItems.value = [];
- showNoData.value = false;
- loading.value = false;
+ } else {
+ sendQuery().then((res) => {
+ loadedItems.value = res.hits.hits;
+ showNoData.value = Boolean(loadedItems.value?.length);
+ loading.value = false;
+ });
+ }
};
// وقتی کاربر کلیدی فشار میدهد
@@ -337,7 +344,7 @@ const setType = (type: string) => {
offset.value = 0;
sendQuery().then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
});
};
// const setKey = (type: string) => {
@@ -378,7 +385,7 @@ const onTypeSelectChanged = (value: string) => {
sendQuery().then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
});
};
@@ -432,7 +439,7 @@ const prepareSynonym = () => {
const onUpdateSwitch = () => {
sendQuery(prepareSynonym()).then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
});
};
const onUpdateSubTitle = (subTitle) => {
@@ -440,7 +447,7 @@ const onUpdateSubTitle = (subTitle) => {
sendQuery(prepareSynonym()).then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
});
};
const onAddNewTitle = (subTitles) => {
@@ -452,7 +459,7 @@ const onAddNewTitle = (subTitles) => {
sendQuery(prepareSynonym()).then((res) => {
loadedItems.value = res.hits.hits;
- showNoData.value = loadedItems.value?.length == 0;
+ showNoData.value = Boolean(loadedItems.value?.length);
});
};
// #endregion methods
@@ -476,19 +483,19 @@ const SearchList = defineAsyncComponent(
<div class="background-image h-full" :style="backgroundImageStyle">
<navigation-menu></navigation-menu>
- <div class="logo-container pt-0 xl:pt-18">
+ <div class="logo-container pt-0 xl:pt-19">
<div
class="search-box-container flex justify-center"
- :class="{ 'pb-0': route.name == 'hadithaSearch' }"
+ :class="[route.name == 'hadithaSearch' ? 'py-6' : 'pb-16']"
>
- <div class="haditha-search-root-wrapper search-page">
+ <div class="haditha-search-root-wrapper search-page flex flex-col md:flex-row">
<div
- class="haditha-search-root"
+ class="haditha-search-root grow-1"
:class="{ 'no-backdrop': route.query.f_aik?.length }"
>
<!-- وقتی کاربر در صفحه نمایش بر روی مشابه کلیک میکند و به صفحه جستجو وارد میشود. -->
<!-- v-if="route.query.f_aik?.length" -->
- <div v-if="false" class="prev-search-item flex items-center">
+ <div v-if="route.query.f_aik?.length" class="prev-search-item flex items-center">
<!-- <span class="total">۴۷ مشابه </span> -->
<span class="text me-auto">
{{ route.query.f_aik }}
@@ -535,26 +542,20 @@ const SearchList = defineAsyncComponent(
</div>
<!-- 'similar-mode': route.query.f_aik?.length, -->
<UButton
- v-if="searchTerm.length"
- class="my-trailing-button close-mode"
- @click.prevent="resetForm"
- icon="i-lucide-x"
- >
- <!-- <UIcon name="i-lucide-search" /> -->
- </UButton>
- <UButton
- v-else
class="my-trailing-button"
- icon="i-haditha-search"
+ :class="{
+ 'close-mode': searchTerm.length,
+ }"
+ @click.prevent="onSearchButtonClick"
+ :icon="searchButtonIcon"
>
- <!-- @click.prevent="onSearchButtonClick" -->
<!-- <UIcon name="i-lucide-search" /> -->
</UButton>
<!-- </client-only> -->
</div>
<div
- class="search-filter flex items-center my-3 justify-between"
- v-if="!showNoData"
+ class="search-filter flex items-center justify-between mt-5 md:mt-0 md:mr-16"
+ v-if="showNoData"
>
<div class="flex items-center space-x-2">
<!-- #region معنایی -->
@@ -782,7 +783,7 @@ const SearchList = defineAsyncComponent(
</div>
</div>
<div
- v-if="showNoData"
+ v-if="!showNoData"
class="flex justify-center flex-col items-center mt-10"
>
<img
@@ -799,7 +800,7 @@ const SearchList = defineAsyncComponent(
</div>
<div
- v-show="!showNoData"
+ v-show="showNoData"
class="search-box-container pb-0 bg-white flex justify-center"
>
<div class="search-list-contianer">
@@ -826,6 +827,11 @@ const SearchList = defineAsyncComponent(
<p class="no-data-text">"نتیجهای یافت نشد!</p>
</no-data> -->
</div>
+
+ <!-- <the-content-loading
+ v-show="loading"
+ class="absolute-positioning"
+ ></the-content-loading> -->
</div>
</div>
</div>
@@ -869,14 +875,9 @@ const SearchList = defineAsyncComponent(
}
}
-.search-box-container {
+/* .search-box-container {
padding-top: 0.7em;
- padding-bottom: 4em; /*64px */
-
- &.pb-0 {
- padding-bottom: 0 !important;
- }
-}
+} */
.search-list-contianer {
position: relative;
@@ -913,7 +914,7 @@ const SearchList = defineAsyncComponent(
}
.haditha-search-root-wrapper {
- max-width: 656px;
+ max-width: 1200px;
width: 100%;
margin: 0 1em;
@@ -1072,7 +1073,7 @@ const SearchList = defineAsyncComponent(
.search-filter {
.filter-item {
/* width: 81px; */
- height: 40px;
+ height: 56px;
border-radius: 12px;
border-width: 0.3px;
padding-top: 8px;