This commit is contained in:
F4ilji
2025-04-30 11:37:34 +05:00
parent ab0eb1d3ab
commit 1df3ad490c
7 changed files with 46 additions and 34 deletions
@@ -28,7 +28,7 @@
</button>
</div>
<div class="p-4 overflow-y-auto">
<div class="grid grid-cols-2 sm:grid-cols-3 gap-3 px-10 py-5">
<div class="grid grid-cols-2 sm:grid-cols-4 gap-3 md:px-10 md:py-5">
<div v-for="(image, index) in images" class="group block relative overflow-hidden rounded-lg aspect-square">
<img
loading="lazy"
@@ -36,7 +36,7 @@
</div>
</div>
<div class="overflow-y-auto flex-1">
<ResultList class="h-full" :result="result" :loading="loading" :selected-category="selectedCategory" />
<ResultList ref="resultListRef" class="h-full" :result="result" :loading="loading" :selected-category="selectedCategory" />
</div>
<nav v-if="paginate && result.length !== 0" class="bg-white border border-gray-100 flex items-center gap-x-1 fixed bottom-4 w-[200px] justify-center left-0 right-0 mx-auto py-2 rounded-xl " aria-label="Pagination">
<button @click="prev(paginate.prev_page)" :disabled="!paginate.prev_page || loading === true" type="button" class="min-h-[38px] min-w-[38px] py-2 px-2.5 inline-flex justify-center items-center gap-x-2 text-sm rounded-lg text-gray-800 hover:bg-gray-100 focus:outline-none disabled:opacity-50 disabled:pointer-events-none" aria-label="Previous">
@@ -84,7 +84,17 @@ export default {
Link,
},
methods: {
ruCategories() {
scrollToTop() {
this.$nextTick(() => {
const resultList = this.$refs.resultListRef;
if (resultList && resultList.$refs.content) {
const contentElement = resultList.$refs.content;
console.log('Scroll element:', contentElement);
contentElement.scrollTop = 0;
}
});
},
ruCategories() {
return ruCategories
},
categorySort: function(category) {
@@ -135,6 +145,7 @@ export default {
this.updateResults(response);
} finally {
this.toggleLoadingState(false);
this.scrollToTop();
}
},
@@ -150,6 +161,7 @@ export default {
this.updateResults(response);
} finally {
this.toggleLoadingState(false);
this.scrollToTop();
}
},
@@ -1,36 +1,16 @@
<template>
<div v-if="item.tag === 'EducationalGroup'" data-hs-overlay="#hs-basic-modal"
class="my-1 flex gap-3 px-2 py-2 items-center rounded-lg">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
class="w-5 h-5 flex-shrink-0">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5m-9-6h.008v.008H12v-.008ZM12 15h.008v.008H12V15Zm0 2.25h.008v.008H12v-.008ZM9.75 15h.008v.008H9.75V15Zm0 2.25h.008v.008H9.75v-.008ZM7.5 15h.008v.008H7.5V15Zm0 2.25h.008v.008H7.5v-.008Zm6.75-4.5h.008v.008h-.008v-.008Zm0 2.25h.008v.008h-.008V15Zm0 2.25h.008v.008h-.008v-.008Zm2.25-4.5h.008v.008H16.5v-.008Zm0 2.25h.008v.008H16.5V15Z"/>
</svg>
<span class="text-sm">{{ item.data.title }}</span>
</div>
<div class="border-b w-full">
<div v-if="item.tag === 'EducationalGroup'" class="rounded-lg hover:bg-[#F2F2F2] my-1 px-4 w-full flex items-center">
<BasicIcon name="post_search" class="w-5 h-5 flex-shrink-0 text-gray-500" />
<Link v-if="item.tag === 'EducationalGroup'" :href="route('client.schedule.index', { search: item.data.title })" class="rounded-lg hover:bg-[#F2F2F2] my-1 px-4 w-full flex items-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
class="w-5 h-5 flex-shrink-0 text-gray-500">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5m-9-6h.008v.008H12v-.008ZM12 15h.008v.008H12V15Zm0 2.25h.008v.008H12v-.008ZM9.75 15h.008v.008H9.75V15Zm0 2.25h.008v.008H9.75v-.008ZM7.5 15h.008v.008H7.5V15Zm0 2.25h.008v.008H7.5v-.008Zm6.75-4.5h.008v.008h-.008v-.008Zm0 2.25h.008v.008h-.008V15Zm0 2.25h.008v.008h-.008v-.008Zm2.25-4.5h.008v.008H16.5v-.008Zm0 2.25h.008v.008H16.5V15Z"/>
</svg>
<div class="px-4 space-y-1 py-2">
<p class="text-sm">{{ item.data.title }}</p>
<p class="text-xs text-gray-500">{{ item.data.created_post }}</p>
<template v-for="schedule in item.data.schedules">
<div class="mb-2">
<div class="flex gap-3 px-2 items-center hover:bg-[#F2F2F2] rounded-lg">
<Link href="/"
class="ml-[8px] flex h-12 w-full items-center gap-2 overflow-hidden border-l border-gray-200 px-4 pl-[22px] text-sm text-gray-900 md:h-10">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-5 h-5 flex-shrink-0">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12H12m-8.25 5.25h16.5"/>
</svg>
<p class="truncate">{{ schedule.title }}</p>
</Link>
</div>
</div>
</template>
</div>
</div>
</Link>
</div>
@@ -39,9 +19,11 @@
<script>
import {Link} from "@inertiajs/vue3";
import BasicIcon from "@/componentss/ui/icons/BasicIcon.vue";
import {helpers} from "@/mixins/Helpers.js";
export default {
name: "ResultEducationalGroupItem",
mixins: [helpers],
name: "ResultEducationalGroupItem",
components: {BasicIcon, Link},
data() {
return {
@@ -6,7 +6,7 @@
<p class="text-sm">{{ item.data.title }}</p>
<p class="text-xs text-gray-500">{{ item.data.created_post }}</p>
<div v-if="item.matches.length !== 0" class="">
<p class="truncate text-[13px] text-gray-500">{{ item.matches[0] }}</p>
<p class="text-[13px] text-gray-500 text-ellipsis">{{ item.matches[0] }}</p>
</div>
</div>
</a>
@@ -1,8 +1,8 @@
<template>
<PreSearchLinkList v-if="result === null" class="px-2 font-light" />
<div v-else-if="result.length !== 0"
<div ref="content" v-else-if="result.length !== 0"
:class="{'filter pointer-events-none': loading === true}"
class="px-2 font-light duration-300">
class="px-2 font-light duration-300 overflow-y-auto">
<template v-for="(elements, tag) in result">
<component
class="rounded-none"