971 lines
68 KiB
PHP
971 lines
68 KiB
PHP
@push('style_css')
|
|
<style>
|
|
.max-w-5xl {
|
|
max-width: 1600px !important;
|
|
}
|
|
|
|
.pagination {
|
|
display: flex;
|
|
list-style: none;
|
|
padding: 0;
|
|
direction: ltr;
|
|
}
|
|
|
|
.pagination li {}
|
|
|
|
.pagination li a,
|
|
.pagination li span {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
/*background-color: #e9e9e9;*/
|
|
color: #000;
|
|
text-decoration: none;
|
|
border-radius: 50%;
|
|
width: 2rem;
|
|
height: 2rem;
|
|
padding-top: 3px;
|
|
transition: background-color 0.3s ease-in-out;
|
|
}
|
|
|
|
.pagination li span:hover,
|
|
.pagination li a:hover {
|
|
background-color: #e9e9e9;
|
|
}
|
|
|
|
.pagination li.active span {
|
|
background-color: #0875E1;
|
|
color: #ffffff;
|
|
}
|
|
|
|
@media screen and (max-width: 1200) {
|
|
.customxl\:grid-cols-3 {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
|
|
}
|
|
}
|
|
|
|
|
|
.text-sm.font-medium.text-center.border-b.border-\[\#e2e3eb\] ul li a.active {
|
|
border-bottom: 4px solid #0075e7;
|
|
color: #0075e7;
|
|
}
|
|
|
|
.header--above-sheet {
|
|
z-index: 10 !important;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
@section('title')
|
|
دسته بندی مطالب {{ $title }} - سرمایه گذاری اهرم
|
|
@endsection
|
|
|
|
<div>
|
|
<div x-data="{
|
|
isOpen: false,
|
|
observer: null,
|
|
isDragging: false,
|
|
startY: 0,
|
|
currentY: 0,
|
|
translateY: 1000, // start off-screen (adjust later)
|
|
selectedUrl: null,
|
|
selectedCatId: null,
|
|
fetchedSubCat:[],
|
|
fetchedParentCat: [],
|
|
selected_parent: null,
|
|
selected_sub_cat: {{ (isset($selectedSecondLevelCategory?->id)) ? $selectedSecondLevelCategory->id : 0 }},
|
|
selected_sub_sub_cat: {{ (isset($selectedThirdLevelCategory?->id)) ? $selectedThirdLevelCategory->id : 0 }},
|
|
selected_sub_parent: null,
|
|
fetchedSubSubCat: [],
|
|
allCats: null,
|
|
init() {
|
|
this.$wire.loadCategoriesAndChilds().then(data => {
|
|
this.allCats = data?.original
|
|
})
|
|
},
|
|
open() {
|
|
this.isOpen = true;
|
|
@if(isset($selectedTopLevelCategoryId))
|
|
this.handlePCatClick({{$selectedTopLevelCategoryId}}, true)
|
|
@endif
|
|
@if(isset($selectedThirdLevelCategory))
|
|
setTimeout(() => {
|
|
this.handleSCatClick({{ $selectedSecondLevelCategory->id }}, true)
|
|
}, 500)
|
|
@endif
|
|
this.$nextTick(() => {
|
|
const header = document.querySelector('#main_header');
|
|
if (header) {
|
|
header.style.zIndex = '10';
|
|
|
|
// Start observing the header's style changes
|
|
this.observer = new MutationObserver(mutations => {
|
|
mutations.forEach(mutation => {
|
|
if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
|
|
const currentZ = header.style.zIndex;
|
|
if (this.isOpen && currentZ !== '10') {
|
|
header.style.zIndex = '10'; // force back
|
|
console.log('Resetting z-index to 10 because it was changed.');
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
this.observer.observe(header, { attributes: true, attributeFilter: ['style'] });
|
|
}
|
|
});
|
|
this.translateY = 500; // start below view (adjust to your sheet height)
|
|
setTimeout(() => {
|
|
this.translateY = 0;
|
|
}, 10);
|
|
document.body.style.overflow = 'hidden';
|
|
{{-- window.dispatchEvent(new CustomEvent('sheet-opened'));--}}
|
|
},
|
|
close() {
|
|
this.translateY = 700; // animate down
|
|
setTimeout(() => {
|
|
this.isOpen = false;
|
|
this.translateY = 1000;
|
|
}, 200);
|
|
setTimeout(() => {
|
|
// Stop observing
|
|
if (this.observer) {
|
|
this.observer.disconnect();
|
|
this.observer = null;
|
|
}
|
|
const header = document.querySelector('#main_header');
|
|
if (header) {
|
|
header.style.zIndex = '3000'; // restore or reset if needed
|
|
}
|
|
}, 400)
|
|
document.body.style.overflow = ''
|
|
{{-- window.dispatchEvent(new CustomEvent('sheet-closed'));--}}
|
|
},
|
|
startDrag(event) {
|
|
this.isDragging = true;
|
|
this.startY = event.touches ? event.touches[0].clientY : event.clientY;
|
|
this.currentY = this.startY;
|
|
},
|
|
handlePCatClick(catId, ignore = false) {
|
|
if(!ignore) {
|
|
this.resetSubCat();
|
|
this.resetSubSubCat()
|
|
}
|
|
if (this.allCats) {
|
|
// Find the selected parent category by ID
|
|
const selectedCat = this.allCats.find(cat => cat.id === catId);
|
|
console.log(selectedCat?.children_recursive)
|
|
this.selected_parent = selectedCat ?? null
|
|
|
|
if (selectedCat && selectedCat?.children_recursive) {
|
|
// Access subcategories (children)
|
|
this.fetchedSubCat = selectedCat?.children_recursive;
|
|
|
|
console.log('Subcategories:', this.fetchedSubCat);
|
|
} else {
|
|
this.fetchedSubCat = []; // No subcategories found
|
|
}
|
|
}
|
|
{{-- fetch(`{{url('api/category')}}${`/` + catId + `?is_news=` + is_news}`)--}}
|
|
{{-- .then(response => response.json())--}}
|
|
{{-- .then(data => {--}}
|
|
{{-- this.fetchedParentCat = data?.prents ?? [];--}}
|
|
{{-- this.fetchedSubCat = data?.sub_category ?? [];--}}
|
|
{{-- this.selected_parent = data?.selected_parent ?? null--}}
|
|
{{-- console.log(data)--}}
|
|
{{-- })--}}
|
|
{{-- .catch(error => {--}}
|
|
{{-- console.error('Error:', error);--}}
|
|
{{-- });--}}
|
|
},
|
|
handleSCatClick(catId, ignore = false) {
|
|
if(!ignore) {
|
|
this.resetSubSubCat()
|
|
}
|
|
if (this.fetchedSubCat) {
|
|
// Find the selected parent category by ID
|
|
const selectedCat = this.fetchedSubCat.find(cat => cat.id === catId);
|
|
console.log(selectedCat?.children_recursive)
|
|
this.selected_sub_parent = selectedCat ?? null
|
|
|
|
if (selectedCat && selectedCat?.children_recursive) {
|
|
// Access subcategories (children)
|
|
this.fetchedSubSubCat = selectedCat?.children_recursive;
|
|
|
|
console.log('SubSubcategories:', this.fetchedSubSubCat);
|
|
} else {
|
|
this.fetchedSubSubCat = []; // No subcategories found
|
|
}
|
|
}
|
|
{{-- fetch(`{{url('api/sub-category')}}${`/` + catId + `?is_news=` + is_news}`)--}}
|
|
{{-- .then(response => response.json())--}}
|
|
{{-- .then(data => {--}}
|
|
{{-- this.fetchedSubSubCat = data?.sub_sub_category ?? [];--}}
|
|
{{-- this.selected_sub_parent = data?.sub_selected_parent ?? null--}}
|
|
{{-- console.log(data)--}}
|
|
{{-- })--}}
|
|
{{-- .catch(error => {--}}
|
|
{{-- console.error('Error:', error);--}}
|
|
{{-- });--}}
|
|
},
|
|
resetSubCat() {
|
|
this.fetchedParentCat = [];
|
|
this.fetchedSubCat = [];
|
|
this.selected_parent = null;
|
|
this.selected_sub_cat = 0;
|
|
this.selected_sub_sub_cat = 0;
|
|
},
|
|
resetSubSubCat() {
|
|
this.fetchedSubSubCat = [];
|
|
this.selected_sub_parent = null;
|
|
this.selected_sub_sub_cat = 0;
|
|
},
|
|
drag(event) {
|
|
if (!this.isDragging) return;
|
|
this.currentY = event.touches ? event.touches[0].clientY : event.clientY;
|
|
let delta = this.currentY - this.startY;
|
|
if (delta > 0) {
|
|
this.translateY = delta;
|
|
} else {
|
|
this.translateY = 0;
|
|
}
|
|
},
|
|
endDrag() {
|
|
this.isDragging = false;
|
|
if (this.translateY > 100) {
|
|
this.close();
|
|
} else {
|
|
this.translateY = 0;
|
|
}
|
|
},
|
|
watch: {
|
|
selectedUrl(value) {
|
|
@this.set('selectedUrl', value);
|
|
}
|
|
},
|
|
}" @keydown.escape.window="close()"
|
|
class="visible relative z-10 mx-auto flex max-w-5xl flex-col items-center px-4 py-8 lg:flex-col lg:justify-between">
|
|
<div class="text-[#16205b] my-3 w-full font-bold text-[16px] lg:text-[18px] text-start items-center flex gap-2">
|
|
<div class="text-[#16205b] my-3 w-full font-bold text-[16px] lg:text-[18px] text-start items-center flex gap-2">
|
|
<div class="text-transparent bg-[#084642] w-[8px] h-[23px] rounded-[2px]"></div>
|
|
<span class="text-[#16205b]">
|
|
@if ($blogOrNotBlog == 'blog')
|
|
مطالب {{ $title }}
|
|
@else
|
|
{{ $title }}
|
|
@endif
|
|
</span>
|
|
</div>
|
|
<button
|
|
@click="open()"
|
|
wire:loading.attr="disabled"
|
|
wire:target="loadCategoriesAndChilds,goToCategory"
|
|
x-cloak
|
|
class="bg-gray-100 items-center justify-center py-2 px-2 rounded-full z-20 flex lg:hidden"
|
|
type="button">
|
|
<svg wire:loading.remove
|
|
wire:target="goToCategory,loadCategoriesAndChilds,generateSlugAndNavigate" fill="#000000" height="18px" width="18px" class="dark-fill-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
|
<path d="M0 73.7C0 50.7 18.7 32 41.7 32H470.3c23 0 41.7 18.7 41.7 41.7c0 9.6-3.3 18.9-9.4 26.3L336 304.5V447.7c0 17.8-14.5 32.3-32.3 32.3c-7.3 0-14.4-2.5-20.1-7l-92.5-73.4c-9.6-7.6-15.1-19.1-15.1-31.3V304.5L9.4 100C3.3 92.6 0 83.3 0 73.7zM55 80L218.6 280.8c3.5 4.3 5.4 9.6 5.4 15.2v68.4l64 50.8V296c0-5.5 1.9-10.9 5.4-15.2L457 80H55z"></path>
|
|
</svg>
|
|
<svg wire:loading wire:target="goToCategory,loadCategoriesAndChilds,generateSlugAndNavigate" class=" animate-spin text-black w-[18px] h-[18px] stroke-black" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
|
|
<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
|
<path fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Backdrop -->
|
|
<div
|
|
x-show="isOpen"
|
|
@click="close()"
|
|
x-transition.opacity
|
|
class="fixed inset-0 bg-black bg-opacity-50 z-40"
|
|
style="display: none;"></div>
|
|
|
|
<!-- Bottom Sheet -->
|
|
<div
|
|
x-show="isOpen"
|
|
x-cloak
|
|
style="will-change: transform;"
|
|
:style="`transform: translateY(${translateY}px); transition: transform 300ms ease`"
|
|
class="fixed bottom-0 left-0 right-0 bg-white rounded-t-xl shadow-xl pt-4 z-50">
|
|
<div
|
|
@touchstart="startDrag($event)"
|
|
@touchmove.prevent="drag($event)"
|
|
@touchend="endDrag()"
|
|
@mousedown="startDrag($event)"
|
|
@mousemove.prevent="drag($event)"
|
|
@mouseup="endDrag()"
|
|
@mouseleave="isDragging && endDrag()"
|
|
class="w-12 h-1.5 bg-gray-300 rounded mx-auto mb-4 cursor-grab"
|
|
:class="{ 'cursor-grabbing': isDragging }"></div>
|
|
<!-- Sheet Content -->
|
|
<div class="h-fit max-h-[70vh] overflow-y-auto no-scrollbar rounded-2xl space-y-1 mt-3 relative">
|
|
|
|
{{-- <div wire:loading wire:target="goToCategory" class="fixed inset-0 bg-black bg-opacity-50 z-50">--}}
|
|
{{-- <svg class="mr-3 -ml-1 size-5 animate-spin text-white absolute top-[45%] right-[45%]" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>--}}
|
|
{{-- </div>--}}
|
|
<div x-data="{
|
|
selectedId: @js($selectedTopLevelCategoryId ?? ($is_news ? (is_array($category) ? $category['id'] : $category->id) : 0)),
|
|
scrollToSelected() {
|
|
this.$nextTick(() => {
|
|
const el = this.$refs['category-' + this.selectedId];
|
|
if (el) {
|
|
el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
|
|
}
|
|
});
|
|
}
|
|
}"
|
|
x-init="scrollToSelected()">
|
|
<ul
|
|
{{-- class="flex items-center py-3 -mb-px bg-gray-100 rounded-2xl relative">--}}
|
|
class="flex items-center py-3 -mb-px rounded-2xl relative">
|
|
<div class="w-full relative">
|
|
{{-- <li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full px-3 sticky top-0 bg-gray-100 pb-3 shadow-sm">--}}
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full sticky bg-white top-0 px-3 pb-3">
|
|
<span>دستهبندیها</span>
|
|
</li>
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div
|
|
{{-- wire:navigate--}}
|
|
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input
|
|
{{-- wire:click="goToCategory(`{{ $is_news ? 'news' : 'all' }}`, `{{ $is_news ? route('NewsCategory.index').'/' : route('CategoryBlog.index', ['slug' => 'all']).'/' }}`)" --}}
|
|
{{-- @click="selectedId = {{ ($is_news && url()->current() == route('NewsCategory.index') || $selectedUrl == route('NewsCategory.index') || $selectedUrl == route('NewsCategory.index') . '/page/' . $page) ? $category->id : 0 }};selectedUrl=`{{ $is_news ? route('NewsCategory.index').'/' : route('CategoryBlog.index', ['slug' => 'all']).'/' }}`" --}}
|
|
@click="handlePCatClick({{ $is_news ? $selectedTopLevelCategoryId : 0 }});selectedId={{ $is_news ? $selectedTopLevelCategoryId : 0 }};selectedCatId = {{ $is_news ? $selectedTopLevelCategoryId : 0}};"
|
|
:checked="selectedId == {{ $is_news ? $selectedTopLevelCategoryId : 0}}"
|
|
name="mpc"
|
|
id="mpc-0"
|
|
type="radio" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => 'all']) || url()->current() == route('CategoryBlog.index', ['slug' => 'all']) . '/page/' . $page) checked @endif>
|
|
<label for="mpc-0" class=" w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</div>
|
|
</li>
|
|
@foreach ($parentCategories->sortByDesc('priority') as $parent)
|
|
<li x-ref="category-{{ $parent->id }}" class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div
|
|
{{-- wire:navigate--}}
|
|
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input
|
|
{{-- wire:click="goToCategory(`{{ $parent->slug }}`, `{{ $is_news ? route('NewsCategory.show', ['slug' => $parent->slug]).'/' : route('CategoryBlog.index', ['slug' => $parent->slug]).'/' }}`)"--}}
|
|
{{-- @click="selectedId = {{ $parent->id }};selectedUrl=`{{ $is_news ? route('NewsCategory.show', ['slug' => $parent->slug]).'/' : route('CategoryBlog.index', ['slug' => $parent->slug]).'/' }}`"--}}
|
|
{{-- @click="handlePCatClick({{ $parent->id }}, {{ $is_news ? 1 : 0 }});selectedCatId={{$parent->id}};"--}}
|
|
@click="handlePCatClick({{ $parent->id }});selectedCatId = {{$parent->id}}"
|
|
:checked="selectedId == {{ $parent->id }}" name="mpc" id="mpc-{{ $parent->id }}" type="radio" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) . '/page/' . $page || $parent->id == $selectedTopLevelCategoryId) checked @endif>
|
|
<label for="mpc-{{ $parent->id }}" class=" w-full cursor-pointer px-3 py-3 @if(!$loop->last) border-b @endif">
|
|
{{ $parent->title }}
|
|
</label>
|
|
</div>
|
|
</li>
|
|
@endforeach
|
|
</div>
|
|
</ul>
|
|
</div>
|
|
|
|
<ul x-show="fetchedSubCat.length > 0" class="flex items-center py-3 -mb-px rounded-2xl">
|
|
<div class="w-full relative">
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full sticky bg-white top-0 px-3 pb-3">
|
|
<span>دستهبندی <span x-text="selected_parent?.title"></span></span>
|
|
</li>
|
|
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer" aria-current="page">
|
|
<input
|
|
type="radio"
|
|
name="mcc"
|
|
id="mcc-0"
|
|
class="rounded-[4px] cursor-pointer border-2"
|
|
:checked="selected_sub_cat == 0"
|
|
{{-- @click="handlePCatClick(selected_parent?.id, {{ $is_news ? 1 : 0 }});selected_sub_cat=0;selectedCatId=selected_parent?.id;"--}}
|
|
@click="selected_sub_cat = 0;selectedCatId = selected_parent?.id;">
|
|
<label for="mcc-0" class="w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</div>
|
|
</li>
|
|
|
|
<template x-for="(item, index) in fetchedSubCat" :key="item.id">
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
:name="'mcc'"
|
|
:id="`mcc-${item.id}`"
|
|
class="rounded-[4px] cursor-pointer border-2"
|
|
:checked="selected_sub_cat == item.id"
|
|
@click="selected_sub_cat = item.id;handleSCatClick(item.id);selectedCatId = item?.id">
|
|
<label
|
|
:for="`mcc-${item.id}`"
|
|
:class="index !== fetchedSubCat.length - 1 ? 'border-b' : ''"
|
|
class="w-full cursor-pointer px-3 py-3"
|
|
x-text="item.title"></label>
|
|
</div>
|
|
</li>
|
|
</template>
|
|
</div>
|
|
</ul>
|
|
|
|
<ul x-show="fetchedSubSubCat.length > 0" class="flex items-center py-3 -mb-px rounded-2xl">
|
|
<div class="w-full relative">
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full sticky bg-white top-0 px-3 pb-3">
|
|
<span>دستهبندی <span x-text="selected_sub_parent?.title"></span></span>
|
|
</li>
|
|
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer" aria-current="page">
|
|
<input
|
|
type="radio"
|
|
name="mss"
|
|
id="mss-0"
|
|
class="rounded-[4px] cursor-pointer border-2"
|
|
:checked="selected_sub_sub_cat === 0"
|
|
@click="selected_sub_sub_cat = 0;selectedCatId = selected_sub_parent?.id">
|
|
<label for="mss-0" class="w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</div>
|
|
</li>
|
|
|
|
<template x-for="(item, index) in fetchedSubSubCat" :key="item.id">
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<div class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer">
|
|
<input
|
|
type="radio"
|
|
:name="'mss'"
|
|
:id="`mss-${item.id}`"
|
|
class="rounded-[4px] cursor-pointer border-2"
|
|
:checked="selected_sub_sub_cat === item.id"
|
|
@click="selected_sub_sub_cat = item.id;selectedCatId = item?.id">
|
|
<label
|
|
:for="`mss-${item.id}`"
|
|
:class="index !== fetchedSubSubCat.length - 1 ? 'border-b' : ''"
|
|
class="w-full cursor-pointer px-3 py-3"
|
|
x-text="item.title"></label>
|
|
</div>
|
|
</li>
|
|
</template>
|
|
</div>
|
|
</ul>
|
|
|
|
<div class="sticky bottom-0 bg-white border-t p-4 flex items-center justify-between gap-2">
|
|
<div @navigate-to.window="Livewire.navigate($event.detail)" class="w-full" x-data="{ isNews: {{ $is_news ? 1 : 0 }} }">
|
|
{{-- <button--}}
|
|
{{-- class="w-full bg-blue-600 text-white py-2 rounded-md"--}}
|
|
{{-- wire:navigate--}}
|
|
{{-- wire:click="goToCategory(selectedCatId, isNews)"--}}
|
|
{{-- @click="close()"--}}
|
|
{{-- :disabled="selectedCatId < 0"--}}
|
|
{{-- @click="if (selectedCatId >= 0) { $wire.goToCategory(selectedCatId, isNews); close(); }"--}}
|
|
{{-- >--}}
|
|
{{-- ثبت--}}
|
|
{{-- </button>--}}
|
|
<button
|
|
class="w-full bg-blue-600 text-white py-2 rounded-md"
|
|
wire:click="generateSlugAndNavigate(selectedCatId, {{ $is_news ? 'true' : 'false' }})"
|
|
@click="close()"
|
|
:disabled="selectedCatId < 0">
|
|
ثبت
|
|
</button>
|
|
</div>
|
|
<button
|
|
class="w-full border border-red-600 text-red-600 py-2 rounded-md"
|
|
@click="close()">
|
|
بستن
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="w-full mb-6">
|
|
<div class="text-sm font-medium text-center border-b border-[#e2e3eb] py-3">
|
|
<ul class="flex items-center gap-2 overflow-scroll md:overflow-hidden no-scrollbar md:flex-wrap -mb-px">
|
|
@if (!$is_news )
|
|
<!-- mag -->
|
|
<li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">
|
|
<a href="{{ route('CategoryBlog.index', ['slug' => 'all']).'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('CategoryBlog.index', ['slug' => 'all']) || url()->current() == route('CategoryBlog.index', ['slug' => 'all']) . '/page/' . $page) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">همه دستهها</a>
|
|
</li>
|
|
|
|
{{-- @if ($category['id'] == 0)--}}
|
|
{{-- <!-- main mag show-->--}}
|
|
@foreach ($parentCategories->sortByDesc('priority') as $parent)
|
|
<li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">
|
|
@if(isset($topParent->id))
|
|
<a href="{{ route('CategoryBlog.index', ['slug' => $parent->slug]).'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) . '/page/' . $page || $topParent->id == $parent->id) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">{{ $parent->title }}</a>
|
|
@else
|
|
<a href="{{ route('CategoryBlog.index', ['slug' => $parent->slug]).'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) . '/page/' . $page ) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">{{ $parent->title }}</a>
|
|
@endif
|
|
</li>
|
|
@endforeach
|
|
{{-- @else--}}
|
|
{{-- --}}
|
|
{{-- @endif--}}
|
|
@else
|
|
<!-- news -->
|
|
|
|
{{-- @if ($category['slug'] == 'news')--}}
|
|
<!-- nain news-->
|
|
<li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">
|
|
<a href="{{ route('NewsCategory.index').'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.index') || url()->current() == route('NewsCategory.index') . '/page/' . $page || $selectedTopLevelCategoryId == 15 ) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">همه اخبار</a>
|
|
</li>
|
|
@foreach ($parentCategories->sortByDesc('priority') as $parent)
|
|
<li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">
|
|
@if(isset($category))
|
|
<a href="{{ route('NewsCategory.show', ['slug' => $parent->slug]).'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) . '/page/' . $page || (is_array($category) ? $category['id'] : $category->id) == $parent->id) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">{{ $parent->title }}</a>
|
|
@else
|
|
<a href="{{ route('NewsCategory.show', ['slug' => $parent->slug]).'/' }}"
|
|
wire:navigate
|
|
class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) . '/page/' . $page) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"
|
|
aria-current="page">{{ $parent->title }}</a>
|
|
@endif
|
|
</li>
|
|
@endforeach
|
|
{{-- @else--}}
|
|
{{-- <!-- sub news show-->--}}
|
|
{{-- @php--}}
|
|
{{-- $parentCategory = null;--}}
|
|
{{-- if ($this->category->parent_id) {--}}
|
|
{{-- $parentCategory = App\Models\Category::find($this->category->parent_id);--}}
|
|
{{-- } elseif ($this->category->parent_below) {--}}
|
|
{{-- $parentCategory = App\Models\Category::find($this->category->parent_below);--}}
|
|
{{-- }--}}
|
|
{{-- @endphp--}}
|
|
{{-- @if ($parentCategory)--}}
|
|
{{-- <li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">--}}
|
|
{{-- <a href="{{ route('NewsCategory.index', ['slug' => $parentCategory->slug]).'/' }}"--}}
|
|
{{-- wire:navigate--}}
|
|
{{-- class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.index' ) || url()->current() == route('NewsCategory.index', ['slug' => $parentCategory->slug]) . '/page/' . $page) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"--}}
|
|
{{-- aria-current="page">{{ $parentCategory->title }}</a>--}}
|
|
{{-- </li>--}}
|
|
{{-- @endif--}}
|
|
|
|
{{-- <li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">--}}
|
|
{{-- <a href="{{ route('NewsCategory.show', ['slug' => $category->slug]).'/' }}"--}}
|
|
{{-- wire:navigate--}}
|
|
{{-- class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.show', ['slug' => $category->slug]) || url()->current() == route('NewsCategory.index', ['slug' => $category->slug]) . '/page/' . $page) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"--}}
|
|
{{-- aria-current="page">{{ $category->title }}</a>--}}
|
|
{{-- </li>--}}
|
|
|
|
{{-- @foreach ($categoriesNotBlog->sortByDesc('priority') as $item)--}}
|
|
{{-- <li class="text-sm rounded-md transition-colors duration-200 text-nowrap py-1">--}}
|
|
{{-- <a href="{{ route('NewsCategory.show', ['slug' => $item['slug']]) .'/' }}"--}}
|
|
{{-- wire:navigate--}}
|
|
{{-- class="px-3 py-1 text-sm rounded-md transition-colors duration-200 text-nowrap @if (url()->current() == route('NewsCategory.index', ['slug' => $item['slug']]) || url()->current() == route('NewsCategory.index', ['slug' => $item['slug']]) . '/page/' . $page) bg-blue-100 text-blue-600 @else bg-gray-100 hover:bg-gray-200 @endif"--}}
|
|
{{-- aria-current="page">{{ $item['title'] }}</a>--}}
|
|
{{-- </li>--}}
|
|
{{-- @endforeach--}}
|
|
{{-- @endif--}}
|
|
@endif
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
@if ($blogs && $blogs->count() > 0)
|
|
<div
|
|
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-9 justify-between gap-5 my-4 lg:my-8 w-full relative">
|
|
<div class="col-span-2 h-fit max-h-[83vh] rounded-2xl sticky top-[100px] space-y-1 hidden lg:block">
|
|
<div x-data="{
|
|
selectedId: @js($selectedTopLevelCategoryId ?? ($is_news ? (is_array($category) ? $category['id'] : $category->id) : 0)),
|
|
scrollToSelected() {
|
|
this.$nextTick(() => {
|
|
const el = this.$refs['category-' + this.selectedId];
|
|
if (el) {
|
|
el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
|
|
}
|
|
});
|
|
}
|
|
}"
|
|
x-init="scrollToSelected()">
|
|
<ul
|
|
class="flex items-center py-3 -mb-px bg-gray-100 rounded-2xl relative">
|
|
<div class="max-h-[25vh] scroll-smooth overflow-y-auto md:flex-wrap w-full relative" style="scrollbar-color: gray #F3F4F6 !important;">
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full px-3 sticky top-0 bg-gray-100 pb-3 shadow-sm">
|
|
<span>دستهبندیها</span>
|
|
</li>
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.index').'/' : route('CategoryBlog.index', ['slug' => 'all']).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = {{ ($is_news && url()->current() == route('NewsCategory.index') || url()->current() == route('NewsCategory.index') . '/page/' . $page) ? $category->id : 0 }}"
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input :checked="selectedId == {{ ($is_news && url()->current() == route('NewsCategory.index') || url()->current() == route('NewsCategory.index') . '/page/' . $page) ? $category->id : 0 }}" name="pc-0" id="pc-0" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => 'all']) || url()->current() == route('CategoryBlog.index', ['slug' => 'all']) . '/page/' . $page) checked @endif>
|
|
<label for="pc-0" class=" w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@foreach ($parentCategories->sortByDesc('priority') as $parent)
|
|
<li x-ref="category-{{ $parent->id }}" class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.show', ['slug' => $parent->slug]).'/' : route('CategoryBlog.index', ['slug' => $parent->slug]).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = {{ $parent->id }}"
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input :checked="selectedId === {{ $parent->id }}" name="pc-{{ $parent->id }}" id="pc-{{ $parent->id }}" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $parent->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $parent->slug]) . '/page/' . $page || $parent->id == $selectedTopLevelCategoryId) checked @endif>
|
|
<label for="pc-{{ $parent->id }}" class=" w-full cursor-pointer px-3 py-3 @if(!$loop->last) border-b @endif">
|
|
{{ $parent->title }}
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@endforeach
|
|
</div>
|
|
</ul>
|
|
</div>
|
|
|
|
@if($childCategories->isNotEmpty())
|
|
<div x-data="{
|
|
selectedId: @js($selectedSecondLevelCategory->id ?? 0),
|
|
scrollToSelected() {
|
|
this.$nextTick(() => {
|
|
const el = this.$refs['psub_category_' + this.selectedId];
|
|
if (el) {
|
|
el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
|
|
}
|
|
});
|
|
}
|
|
}"
|
|
x-init="scrollToSelected()">
|
|
<ul class="flex items-center py-3 -mb-px bg-gray-100 rounded-2xl">
|
|
<div class="max-h-[30vh] scroll-smooth overflow-y-auto md:flex-wrap w-full" style="scrollbar-color: gray #F3F4F6 !important;">
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full px-3 sticky top-0 bg-gray-100 pb-3 shadow-sm">
|
|
<span>دستهبندی {{ $topParent->title }}</span>
|
|
</li>
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.show', ['slug' => $topParent->slug]).'/' : route('CategoryBlog.index', ['slug' => $topParent->slug]).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = 0"
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input :checked="selectedId == 0" name="cc-0" id="cc-0" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $topParent->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $topParent->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $topParent->slug]) . '/page/' . $page) checked @endif>
|
|
<label for="cc-0" class=" w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@foreach ($childCategories->sortByDesc('priority') as $child)
|
|
<li x-ref="psub_category_{{ $child->id }}" class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.show', ['slug' => $child->slug]).'/' : route('CategoryBlog.index', ['slug' => $child->slug]).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = {{ $child->id }}"
|
|
{{-- onclick="document.getElementById('pc-{{ $child->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
@if(isset($selectedSecondLevelCategory->id))
|
|
<input :checked="selectedId === {{ $child->id }}" name="cc-{{ $child->id }}" id="cc-{{ $child->id }}" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $child->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $child->slug]) . '/page/' . $page || $selectedSecondLevelCategory->id == $child->id) checked @endif>
|
|
@else
|
|
<input :checked="selectedId === {{ $child->id }}" name="cc-{{ $child->id }}" id="cc-{{ $child->id }}" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $child->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $child->slug]) . '/page/' . $page) checked @endif>
|
|
@endif
|
|
<label for="cc-{{ $child->id }}" class=" w-full cursor-pointer px-3 py-3 @if(!$loop->last) border-b @endif">
|
|
{{ $child->title }}
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@endforeach
|
|
</div>
|
|
</ul>
|
|
</div>
|
|
@endif
|
|
@if($subChildCategories->isNotEmpty())
|
|
<div x-data="{
|
|
selectedId: @js($category->id),
|
|
scrollToSelected() {
|
|
this.$nextTick(() => {
|
|
const el = this.$refs['sub_category_' + this.selectedId];
|
|
if (el) {
|
|
el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
|
|
}
|
|
});
|
|
}
|
|
}"
|
|
x-init="scrollToSelected()">
|
|
<ul class="flex items-center py-3 -mb-px bg-gray-100 rounded-2xl">
|
|
<div class="max-h-[20vh] scroll-smooth overflow-y-auto md:flex-wrap w-full relative" style="scrollbar-color: gray #F3F4F6 !important;">
|
|
<li class="text-sm font-semibold rounded-md transition-colors duration-200 text-nowrap w-full px-3 sticky top-0 bg-gray-100 pb-3 shadow-sm">
|
|
<span>دستهبندی {{ $selectedSecondLevelCategory->title }}</span>
|
|
</li>
|
|
<li class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.show', ['slug' => $selectedSecondLevelCategory->slug]).'/' : route('CategoryBlog.index', ['slug' => $selectedSecondLevelCategory->slug]).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = {{ $selectedSecondLevelCategory->id }}"
|
|
{{-- onclick="document.getElementById('pc-{{ $parent->id }}').checked=true;"--}}
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
<input :checked="selectedId == {{ $selectedSecondLevelCategory->id }}" name="sc-0" id="sc-0" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $selectedSecondLevelCategory->slug]) || url()->current() == route('NewsCategory.show', ['slug' => $selectedSecondLevelCategory->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $selectedSecondLevelCategory->slug]) . '/page/' . $page) checked @endif>
|
|
<label for="sc-0" class=" w-full cursor-pointer px-3 py-3 border-b">
|
|
همه
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@foreach ($subChildCategories->sortByDesc('priority') as $subChild)
|
|
<li x-ref="sub_category_{{ $subChild->id }}" class="text-sm rounded-md font-semibold transition-colors duration-200 text-nowrap w-full flex items-center px-3">
|
|
<a href="{{ $is_news ? route('NewsCategory.index', ['slug' => $subChild->slug]) : route('CategoryBlog.index', ['slug' => $subChild->slug]).'/' }}"
|
|
wire:navigate
|
|
@click.prevent="selectedId = {{ $subChild->id }}"
|
|
class="flex items-center text-sm rounded-md transition-colors duration-200 text-nowrap w-full h-full cursor-pointer"
|
|
aria-current="page">
|
|
{{-- @if(isset($selectedSecondLevelCategory->id))--}}
|
|
<input :checked="selectedId === {{ $subChild->id }}" name="sc-{{ $subChild->id }}" id="sc-{{ $subChild->id }}" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $subChild->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $subChild->slug]) . '/page/' . $page) checked @endif>
|
|
{{-- @else--}}
|
|
{{-- <input name="sc-{{ $subChild->id }}" id="sc-{{ $subChild->id }}" type="checkbox" class="rounded-[4px] cursor-pointer border-2" @if (url()->current() == route('CategoryBlog.index', ['slug' => $subChild->slug]) || url()->current() == route('CategoryBlog.index', ['slug' => $subChild->slug]) . '/page/' . $page) checked @endif>--}}
|
|
{{-- @endif--}}
|
|
|
|
<label for="sc-{{ $subChild->id }}" class=" w-full cursor-pointer px-3 py-3 @if(!$loop->last) border-b @endif">
|
|
{{ $subChild->title }}
|
|
</label>
|
|
</a>
|
|
</li>
|
|
@endforeach
|
|
</div>
|
|
</ul>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="col-span-7 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 h-fit gap-5">
|
|
@foreach ($blogs as $index => $blog)
|
|
<div
|
|
class="w-full justify-between md:justify-normal flex items-center px-2 py-2 md:py-0 md:px-0 flex-row-reverse md:flex-col gap-2 border-b md:border md:rounded-xl md:bg-slate-100 md:shadow">
|
|
<a href="{{ route('detail', ['slug' => $blog->slug]) .'/'}}" wire:navigate
|
|
class="relative w-[80px] md:w-full">
|
|
<img class="w-[80px] md:w-full md:h-[260px] h-[80px] rounded-xl md:rounded-b-none"
|
|
src="{{ env('APP_URL_IMAGE').'images/'.$blog->image }}" alt="">
|
|
</a>
|
|
<div
|
|
class="flex w-[74%] justify-start md:justify-normal flex-col md:w-full gap-2 h-full md:p-4">
|
|
<a href="{{ route('detail', ['slug' => $blog->slug]).'/' }}" wire:navigate
|
|
class="text-[#005eb9] text-[14px] md:text-[16px] font-bold">
|
|
{!! $blog->subject !!}
|
|
</a>
|
|
<div class="md:block hidden text-[#16205b]">
|
|
@php
|
|
$preview = Str::limit($blog->preview, 80, '...');
|
|
@endphp
|
|
{!! $preview !!}
|
|
</div>
|
|
<div class="flex items-center gap-1 text-white md:mt-auto">
|
|
<div class="hidden md:flex md:flex-col justify-center">
|
|
<img class="bg-cover bg-center rounded-full size-8"
|
|
src="{{ env('APP_URL_IMAGE').'images/static/'.$blog->user->picture }}" alt="">
|
|
</div>
|
|
<div class="flex items-center justify-between w-full flex-wrap">
|
|
<div class="flex items-center gap-1">
|
|
<div class="text-xs text-gray-600 flex flex-col justify-center hidden md:block">
|
|
{{ $blog->user->full_name }}
|
|
</div>
|
|
<span style="font-variation-settings: 'wght' 500;"
|
|
class="text-xs text-[#A0A4BC] hidden md:flex flex-col justify-center">|</span>
|
|
<div class="text-xs text-gray-600 flex flex-col justify-center">
|
|
{{ jalaliDate($blog->published_at, '%d %B، %Y') }}
|
|
</div>
|
|
</div>
|
|
<div class="text-xs text-gray-600 flex items-center gap-1">
|
|
<svg class="w-3 h-3 stroke-[20px] fill-gray-600" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
|
<path d="M430.972,511.871h-10.999c-7.142-2.466-13.451-6.138-18.729-11.711-6.527-6.891-13.598-13.272-20.021-20.253-3.006-3.267-5.237-3.134-8.84-1.088-28.127,15.97-58.257,25.77-90.473,29.319-47.013,5.179-91.431-3.412-133.616-24.417-4.587-2.284-9.583-7.067-13.578-6.325-4.372,.812-7.779,6.72-11.649,10.361-9.586,9.019-17.429,20.289-31.052,24.113h-10.999c-8.202-2.712-15.535-6.634-20.261-14.296-7.688-12.465-5.856-27.038,5.095-38.358,6.698-6.924,13.639-13.613,20.464-20.399C-10.549,340.462-.476,184.709,95.021,96.924c89.903-82.643,229.862-83.648,320.705-.831,45.2,41.207,71.314,92.614,76.822,153.495,6.584,72.768-16.736,135.633-67.656,189.955,1.708,1.156,3.598,2.055,4.997,3.447,6.49,6.46,13.324,12.659,19.129,19.699,8.158,9.893,9.058,21.088,3.402,32.701-4.413,9.062-12.424,13.427-21.449,16.48ZM80.649,256.827c6.65,0,13.342-.58,19.865,.215,3.998,.487,8.445,2.281,11.433,4.915,4.574,4.03,5.346,9.864,3.002,15.643-2.322,5.725-6.668,9.209-12.927,9.446-7.09,.269-14.198,.062-21.344,.062,6.497,90.251,84.175,156.516,160.193,159.907,0-6.988-.24-13.969,.069-20.926,.296-6.655,3.997-11.126,10.273-13.342,5.863-2.07,12.72-.593,16.136,4.561,2.156,3.253,3.324,7.549,3.709,11.497,.6,6.157,.159,12.416,.159,18.676,93.711-8.127,156.121-86.508,159.881-160.355-6.981,0-13.949,.24-20.892-.064-7.73-.338-13.564-6.15-14.21-13.544-.784-8.975,5.554-16.312,14.685-16.616,6.889-.229,13.791-.045,20.734-.045-7.275-89.982-82.342-155.346-160.307-160.017,0,6.973,.225,13.926-.057,20.859-.353,8.684-7.279,14.722-15.937,14.332-7.841-.353-13.932-6.397-14.226-14.576-.247-6.889-.051-13.795-.051-20.737-84.691,6.171-154.306,76.702-160.19,160.109Z" />
|
|
<path d="M317.727,21.635c35.238-27.229,91.729-31.059,133.974,2.822,41.268,33.097,50.437,87.812,32.775,127.807-37.143-67.069-92.524-110.581-166.749-130.629Z" />
|
|
<path d="M194.322,21.62C120.136,41.616,64.83,85.023,27.787,151.768c-14.977-29.145-13.64-83.098,24.228-119.983C94.052-9.162,155.466-8.002,194.322,21.62Z" />
|
|
<path d="M318.68,294.953c-8.33,0-16.662,.116-24.988-.063-2.918-.063-4.789,.78-6.712,3.106-11.939,14.448-32.667,18.701-48.849,10.269-17.717-9.231-25.978-27.547-21.312-46.475,.529-2.148-.168-5.249-1.459-7.096-15.363-21.964-30.993-43.741-46.453-65.638-8.537-12.091-6.535-26.283,4.579-33.894,9.341-6.397,21.933-5.138,29.529,3.365,3.643,4.078,6.677,8.712,9.862,13.184,13.136,18.442,26.28,36.879,39.275,55.421,2.076,2.962,4.251,4.494,8.032,4.748,10.643,.717,19.487,5.564,26.308,13.63,2.329,2.754,4.59,3.613,8.017,3.581,16.491-.157,32.988-.267,49.476-.008,16.712,.263,27.444,15.387,22.095,30.665-3.146,8.987-11.38,14.945-21.414,15.146-8.659,.174-17.325,.036-25.987,.036v.022Z" />
|
|
</svg>
|
|
<span class="text-nowrap text-xs text-gray-600 mt-[2px]">{{ convertEnglishToPersianNumber($blog->reed_time) }} دقیقه</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
@if ($blogs->hasPages())
|
|
<nav class="mt-6">
|
|
<ul class="pagination flex gap-4">
|
|
|
|
{{-- First + Prev (only show if not on first page) --}}
|
|
@if (!$blogs->onFirstPage())
|
|
<li>
|
|
<a class="pb-[4px]"
|
|
href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategory.index')
|
|
: route('NewsCategory.show', ['slug' => $slug]))
|
|
: route('CategoryBlog.index', ['slug' => $slug]).'/' }}"
|
|
wire:navigate rel="first">
|
|
<svg style="width: 12px; height: 12px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 233.91 226.965">
|
|
<path d="M139.099,113.926c7.785-7.807,14.811-14.878,21.865-21.921,20.745-20.71,41.523-41.387,62.244-62.121,7.631-7.635,7.275-18.796-.662-24.879-5.824-4.463-14.02-4.42-19.781,.152-1.071,.85-2.04,1.834-3.01,2.803-30.792,30.774-61.581,61.55-92.362,92.334-8.813,8.814-8.798,17.48,.051,26.329,30.87,30.872,61.777,61.706,92.6,92.625,5.006,5.022,10.648,7.376,17.58,5.229,10.645-3.298,14.599-16.097,7.775-24.894-1.065-1.373-2.333-2.596-3.568-3.828-26.395-26.351-52.796-52.697-79.216-79.023-.96-.956-2.126-1.706-3.517-2.806Z" />
|
|
<path d="M43.716,113.46c7.308-7.331,14.332-14.404,21.387-21.447,20.573-20.538,41.144-41.078,61.751-61.582,4.559-4.537,6.232-9.891,4.569-16.05-1.631-6.039-5.739-9.877-11.817-11.285-5.789-1.341-10.825,.331-15.034,4.542-11.729,11.737-23.476,23.456-35.212,35.187-19.236,19.228-38.475,38.454-57.701,57.693-8.661,8.666-8.718,17.444-.124,26.044,30.958,30.975,62.066,61.802,92.832,92.966,9.589,9.713,24.356,6.018,27.766-5.415,1.972-6.612,.065-12.214-4.786-17.025-12.492-12.387-24.921-24.836-37.373-37.262-14.661-14.629-29.321-29.258-43.976-43.892-.696-.695-1.336-1.444-2.282-2.474Z" />
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
@if(($blogs->currentPage() - 1) === 1)
|
|
<li>
|
|
<a class="pb-[4px]"
|
|
href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategory.index')
|
|
: route('NewsCategory.show', ['slug' => $slug]))
|
|
: route('CategoryBlog.index', ['slug' => $slug]).'/' }}"
|
|
wire:navigate rel="prev">
|
|
<svg style="width: 12px; height: 12px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 233.91 226.965">
|
|
<path d="M91.264,113.926c7.785-7.807,14.811-14.878,21.865-21.921,20.745-20.71,41.523-41.387,62.244-62.121,7.631-7.635,7.275-18.796-.662-24.879-5.824-4.463-14.02-4.42-19.781,.152-1.071,.85-2.04,1.834-3.01,2.803-30.792,30.774-61.581,61.55-92.362,92.334-8.813,8.814-8.798,17.48,.051,26.329,30.87,30.872,61.777,61.706,92.6,92.625,5.006,5.022,10.648,7.376,17.58,5.229,10.645-3.298,14.599-16.097,7.775-24.894-1.065-1.373-2.333-2.596-3.568-3.828-26.395-26.351-52.796-52.697-79.216-79.023-.96-.956-2.126-1.706-3.517-2.806Z" />
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
@else
|
|
<li>
|
|
<a class="pb-[4px]"
|
|
href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategorySimple', ['page' => $blogs->currentPage() - 1])
|
|
: route('NewsCategory.show.page', ['slug' => $slug, 'page' => $blogs->currentPage() - 1]))
|
|
: route('CategoryBlogSimple', ['slug' => $slug, 'page' => $blogs->currentPage() - 1]).'/' }}"
|
|
wire:navigate rel="prev">
|
|
<svg style="width: 12px; height: 12px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 233.91 226.965">
|
|
<path d="M91.264,113.926c7.785-7.807,14.811-14.878,21.865-21.921,20.745-20.71,41.523-41.387,62.244-62.121,7.631-7.635,7.275-18.796-.662-24.879-5.824-4.463-14.02-4.42-19.781,.152-1.071,.85-2.04,1.834-3.01,2.803-30.792,30.774-61.581,61.55-92.362,92.334-8.813,8.814-8.798,17.48,.051,26.329,30.87,30.872,61.777,61.706,92.6,92.625,5.006,5.022,10.648,7.376,17.58,5.229,10.645-3.298,14.599-16.097,7.775-24.894-1.065-1.373-2.333-2.596-3.568-3.828-26.395-26.351-52.796-52.697-79.216-79.023-.96-.956-2.126-1.706-3.517-2.806Z" />
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
@endif
|
|
@endif
|
|
{{-- Page Numbers: show only 2 before and 2 after current --}}
|
|
@for ($page = max(1, $blogs->currentPage() - 2); $page <= min($blogs->lastPage(), $blogs->currentPage() + 2); $page++)
|
|
@if ($page == $blogs->currentPage())
|
|
<li class="active"><span>{{ $page }}</span></li>
|
|
@else
|
|
@if($page == 1)
|
|
<li>
|
|
<a href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategory.index')
|
|
: route('NewsCategory.show', ['slug' => $slug]))
|
|
: route('CategoryBlog.index', ['slug' => $slug]).'/' }}"
|
|
wire:navigate>{{ $page }}</a>
|
|
</li>
|
|
@else
|
|
<li>
|
|
<a href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategorySimple', ['page' => $page])
|
|
: route('NewsCategory.show.page', ['slug' => $slug, 'page' => $page]))
|
|
: route('CategoryBlogSimple', ['slug' => $slug, 'page' => $page]).'/' }}"
|
|
wire:navigate>{{ $page }}</a>
|
|
</li>
|
|
@endif
|
|
@endif
|
|
@endfor
|
|
|
|
{{-- Next + Last (only show if not on last page) --}}
|
|
@if ($blogs->hasMorePages())
|
|
<li>
|
|
<a class="pb-[4px]"
|
|
href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategorySimple', ['page' => $blogs->currentPage() + 1])
|
|
: route('NewsCategory.show.page', ['slug' => $slug, 'page' => $blogs->currentPage() + 1]))
|
|
: route('CategoryBlogSimple', ['slug' => $slug, 'page' => $blogs->currentPage() + 1]).'/' }}"
|
|
wire:navigate rel="next">
|
|
<svg style="width: 12px; height: 12px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 233.91 226.965">
|
|
<path d="M142.646,112.233c-7.785-7.807-14.811-14.878-21.865-21.921-20.745-20.71-41.523-41.387-62.244-62.121-7.631-7.635-7.275-18.796,.662-24.879,5.824-4.463,14.02-4.42,19.781,.152,1.071,.85,2.04,1.834,3.01,2.803,30.792,30.774,61.581,61.55,92.362,92.334,8.813,8.814,8.798,17.48-.051,26.329-30.87,30.872-61.777,61.706-92.6,92.625-5.006,5.022-10.648,7.376-17.58,5.229-10.645-3.298-14.599-16.097-7.775-24.894,1.065-1.373,2.333-2.596,3.568-3.828,26.395-26.351,52.796-52.697,79.216-79.023,.96-.956,2.126-1.706,3.517-2.806Z" />
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="pb-[4px]"
|
|
href="{{ $is_news
|
|
? ($category['id'] == 0
|
|
? route('NewsCategorySimple', ['page' => $blogs->lastPage()])
|
|
: route('NewsCategory.show.page', ['slug' => $slug, 'page' => $blogs->lastPage()]))
|
|
: route('CategoryBlogSimple', ['slug' => $slug, 'page' => $blogs->lastPage()]).'/' }}"
|
|
wire:navigate rel="last">
|
|
<svg style="width: 12px; height: 12px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 233.91 226.965">
|
|
<path d="M94.81,113.926c-7.785-7.807-14.811-14.878-21.865-21.921C52.199,71.296,31.422,50.618,10.7,29.885c-7.631-7.635-7.275-18.796,.662-24.879,5.824-4.463,14.02-4.42,19.781,.152,1.071,.85,2.04,1.834,3.01,2.803,30.792,30.774,61.581,61.55,92.362,92.334,8.813,8.814,8.798,17.48-.051,26.329-30.87,30.872-61.777,61.706-92.6,92.625-5.006,5.022-10.648,7.376-17.58,5.229-10.645-3.298-14.599-16.097-7.775-24.894,1.065-1.373,2.333-2.596,3.568-3.828,26.395-26.351,52.796-52.697,79.216-79.023,.96-.956,2.126-1.706,3.517-2.806Z" />
|
|
<path d="M190.194,113.46c-7.308-7.331-14.332-14.404-21.387-21.447-20.573-20.538-41.144-41.078-61.751-61.582-4.559-4.537-6.232-9.891-4.569-16.05,1.631-6.039,5.739-9.877,11.817-11.285,5.789-1.341,10.825,.331,15.034,4.542,11.729,11.737,23.476,23.456,35.212,35.187,19.236,19.228,38.475,38.454,57.701,57.693,8.661,8.666,8.718,17.444,.124,26.044-30.958,30.975-62.066,61.802-92.832,92.966-9.589,9.713-24.356,6.018-27.766-5.415-1.972-6.612-.065-12.214,4.786-17.025,12.492-12.387,24.921-24.836,37.373-37.262,14.661-14.629,29.321-29.258,43.976-43.892,.696-.695,1.336-1.444,2.282-2.474Z" />
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
@endif
|
|
|
|
</ul>
|
|
</nav>
|
|
@endif
|
|
|
|
@section('metaSEO')
|
|
<meta name="description"
|
|
content="مطالب مربوط به {{ $title }} را می توانید از این دسته بندی مشاهده کنید" />
|
|
@if ($blogs->currentPage() > 1)
|
|
@if ($blogs->currentPage() == 2)
|
|
<link rel="prev"
|
|
href="{{ $is_news ? route('NewsCategory.index', ['slug' => $slug]) : route('CategoryBlog.index', ['slug' => $slug]) .'/'}}" />
|
|
@else
|
|
<link rel="prev"
|
|
href="{{ $is_news ? route('NewsCategorySimple', ['slug' => $slug, 'page' => $blogs->currentPage() - 1]) : route('CategoryBlogSimple', ['slug' => $slug, 'page' => $blogs->currentPage() - 1]) .'/'}} " />
|
|
@endif
|
|
@endif
|
|
<link rel="canonical"
|
|
href="{{ $is_news ? route('NewsCategory.index', ['slug' => $slug]).'/' : route('CategoryBlog.index', ['slug' => $slug]).'/' }}" />
|
|
<link rel="next"
|
|
href="{{ $blogs->currentPage() < $blogs->lastPage() ? ($is_news ? route('NewsCategorySimple', ['slug' => $slug, 'page' => $blogs->currentPage() + 1]) : route('CategoryBlogSimple', ['slug' => $slug, 'page' => $blogs->currentPage() + 1])) : '' }}/" />
|
|
<meta property="og:locale" content="fa_IR" />
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:title" content="دسته بندی مطالب {{ $title }} - سرمایه گذاری اهرم" />
|
|
<meta property="og:description"
|
|
content="مطالب مربوط به {{ $title }} را می توانید از این دسته بندی مشاهده کنید" />
|
|
<meta property="og:url" content="{{ url()->current() }}/" />
|
|
<meta property="og:site_name" content="مجله خبری سرمایه گذاری اهرم" />
|
|
@if (!$is_news && $slug == 'all')
|
|
<meta name='robots'
|
|
content='noindex, nofollow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' />
|
|
@endif
|
|
@endsection
|
|
@else
|
|
<div class="text-center text-gray-500">
|
|
هیچ مطلبی یافت نشد.
|
|
</div>
|
|
@section('metaSEO')
|
|
<meta name="description"
|
|
content="مطالب مربوط به {{ $title }} را می توانید از این دسته بندی مشاهده کنید" />
|
|
<meta property="og:locale" content="fa_IR" />
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:title" content="دسته بندی مطالب {{ $title }} - سرمایه گذاری اهرم" />
|
|
<meta property="og:description"
|
|
content="مطالب مربوط به {{ $title }} را می توانید از این دسته بندی مشاهده کنید" />
|
|
<meta property="og:url" content="{{ url()->current() }}/" />
|
|
<meta property="og:site_name" content="مجله خبری سرمایه گذاری اهرم" />
|
|
@if (!$is_news && $slug == 'all')
|
|
<meta name='robots'
|
|
content='noindex, nofollow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' />
|
|
@endif
|
|
@endsection
|
|
@endif
|
|
</div>
|
|
</div>
|
|
@script
|
|
<script>
|
|
document.addEventListener('livewire:update', () => {
|
|
const alpineComponent = document.querySelector('[x-data]');
|
|
if (alpineComponent && alpineComponent.__x) {
|
|
alpineComponent.__x.$data.loadCats();
|
|
}
|
|
});
|
|
</script>
|
|
@endscript |