failj/ntspi-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added basic template to position main elements in the page

Browse Source
This commit is contained in:
F4ilji
2025-04-10 15:01:13 +05:00
parent 88e729aa87
commit c27c1c36c1
23 changed files with 1257 additions and 1136 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Filament/Components/Forms/ItemForm/Blocks/HeadingBlock.php
+1 -1
View File
@@ -14,7 +14,7 @@ class HeadingBlock implements BlockSchema
TextInput::make('id') TextInput::make('id')
->hidden() ->hidden()
->integer() ->integer()
->default(rand(2335235, 324634264263426)), ->default('anchor-link-' . base64_encode(rand(2335235, 324634264263426))),
TextInput::make('content') TextInput::make('content')
->label('Текст заголовка') ->label('Текст заголовка')
->placeholder('Введите текст заголовка') ->placeholder('Введите текст заголовка')
resources/js/Navbars/MainPageNavbar.vue
-1
View File
@@ -130,7 +130,6 @@ export default {
computed: { computed: {
...mapGetters(['lastSlider', 'isBviActive']), ...mapGetters(['lastSlider', 'isBviActive']),
currentLogo() { currentLogo() {
console.log(this.isBviActive)
if (this.isBviActive) { if (this.isBviActive) {
return this.logos.default return this.logos.default
} }
resources/js/Pages/Client/AcademicJournals/Index.vue
+51 -48
View File
@@ -5,10 +5,30 @@ import MetaTags from "@/componentss/shared/SEO/MetaTags.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import AcademicJournalsListBreadcrumbs import AcademicJournalsListBreadcrumbs
from "@/componentss/features/academicJournals/components/AcademicJournalsListBreadcrumbs.vue.vue"; from "@/componentss/features/academicJournals/components/AcademicJournalsListBreadcrumbs.vue.vue";
import LevelEduFilter from "@/componentss/features/additionalEducationPrograms/components/LevelEduFilter.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import AdditionalProgramListBreadcrumbs
from "@/componentss/features/additionalEducationPrograms/components/AdditionalProgramListBreadcrumbs.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import AdditionalProgramTitle
from "@/componentss/features/additionalEducationPrograms/components/AdditionalProgramTitle.vue";
import FormEducationalFilter from "@/componentss/shared/filter/filters/FormEducationalFilter.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
FormEducationalFilter,
AdditionalProgramTitle,
BasicListFilter,
AdditionalProgramListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
LevelEduFilter,
AcademicJournalsListBreadcrumbs, AcademicJournalsListBreadcrumbs,
BasicFooter, BasicFooter,
MetaTags, MetaTags,
@@ -43,56 +63,39 @@ export default {
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen">
<main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-5 md:flex md:flex-row">
<div class="px-4 pb-12 sm:px-6 lg:px-8 mx-auto">
<div>
<!-- Avatar Media -->
<!-- End Avatar Media -->
<!-- Content -->
<div class="space-y-5 md:space-y-4">
<div class="space-y-5 md:space-y-4">
<!-- Card Section -->
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<AcademicJournalsListBreadcrumbs />
<div class="max-w-2xl text-center mx-auto mb-10 lg:mb-14"> <BasicPageWrapper>
<h2 class="text-2xl font-bold md:text-4xl md:leading-tight dark:text-white">Научные периодические издания НТГСПИ</h2> <BasicPageContainer>
</div> <div class="max-w-[85rem] px-4 py-5 sm:px-6 md:px-8 md:py-5 mx-auto">
<!-- Grid --> <div class="max-w-2xl text-center mx-auto mb-10 lg:mb-14">
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6"> <h2 class="text-2xl font-bold md:text-4xl md:leading-tight dark:text-white">Научные периодические издания НТГСПИ</h2>
<template v-for="journal in journals.data"> </div>
<Link :href="route('client.academicJournals.show', journal.slug)" class="group flex items-center bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" > <!-- Grid -->
<div class="p-4 md:p-5 w-full"> <AcademicJournalsListBreadcrumbs />
<div class="flex justify-between items-center gap-x-3"> <div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6">
<div class="grow"> <template v-for="journal in journals.data">
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800"> <Link :href="route('client.academicJournals.show', journal.slug)" class="group flex items-center bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" >
{{ journal.title }} <div class="p-4 md:p-5 w-full">
</h3> <div class="flex justify-between items-center gap-x-3">
</div> <div class="grow">
<div> <h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
<svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> {{ journal.title }}
</div> </h3>
</div> </div>
</div> <div>
</Link> <svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</template> </div>
</div>
</div>
</Link>
</template>
</div> </div>
<!-- End Grid --> <!-- End Grid -->
</div> </div>
<!-- End Card Section --> </BasicPageContainer>
</div> <BasicFooter />
</div> </BasicPageWrapper>
<!-- End Content -->
</div>
</div>
</div>
</main>
<BasicFooter/>
</div>
</template> </template>
<style scoped></style> <style scoped></style>
resources/js/Pages/Client/AcademicJournals/Show.vue
+142 -131
View File
@@ -8,10 +8,30 @@ import AcademicJournalsTitle from "@/componentss/features/academicJournals/compo
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue"; import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import AcademicJournalsItemBreadcrumbs import AcademicJournalsItemBreadcrumbs
from "@/componentss/features/academicJournals/components/AcademicJournalsItemBreadcrumbs.vue"; from "@/componentss/features/academicJournals/components/AcademicJournalsItemBreadcrumbs.vue";
import BudgetFilter from "@/componentss/shared/filter/filters/BudgetFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import DirectionFilter from "@/componentss/shared/filter/filters/DirectionFilter.vue";
import ProgramLevelEduFilter from "@/componentss/features/educationalPrograms/components/ProgramLevelEduFilter.vue";
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
import ProgramListBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramListBreadcrumbs.vue";
import FormEducationalFilter from "@/componentss/shared/filter/filters/FormEducationalFilter.vue";
import BackButton from "@/componentss/ui/buttons/BackButton.vue";
export default { export default {
name: "Show", name: "Show",
components: { components: {
BackButton,
FormEducationalFilter,
ProgramListBreadcrumbs,
ProgramTitle,
ProgramLevelEduFilter,
DirectionFilter,
BasicListFilter,
BasicPageWrapper,
BasicPageContainer,
BudgetFilter,
AcademicJournalsItemBreadcrumbs, AcademicJournalsItemBreadcrumbs,
BasicPagination, BasicPagination,
MetaTags, MetaTags,
@@ -62,145 +82,136 @@ export default {
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen">
<main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:py-10">
<div class="w-100">
<div>
<!-- Avatar Media -->
<!-- End Avatar Media -->
<!-- Content -->
<div class="container max-w-6xl px-2 xl:px-5 lg:py-4 mx-auto space-y-5 md:space-y-8"> <BasicPageWrapper>
<AcademicJournalsItemBreadcrumbs :title="journal.data.title" /> <BasicPageContainer>
<AcademicJournalsTitle class="text-center" :header="journal.data.title" /> <div class=" space-y-5 md:space-y-8">
<div> <div class="space-y-3">
<nav class="flex flex-col md:flex-row justify-center gap-x-6" aria-label="Tabs" role="tablist" aria-orientation="horizontal"> <BackButton link="client.academicJournals.index" title="К списку журналов" />
<button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none active" <AcademicJournalsItemBreadcrumbs :title="journal.data.title" />
id="horizontal-alignment-item-1" aria-selected="true" data-hs-tab="#horizontal-alignment-1" aria-controls="horizontal-alignment-1" role="tab"> <AcademicJournalsTitle class="text-center" :header="journal.data.title" />
Основная информация журнала </div>
</button>
<button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
id="horizontal-alignment-item-2" aria-selected="false" data-hs-tab="#horizontal-alignment-2" aria-controls="horizontal-alignment-2" role="tab">
Редакция
</button>
<button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
id="horizontal-alignment-item-3" aria-selected="false" data-hs-tab="#horizontal-alignment-3" aria-controls="horizontal-alignment-3" role="tab">
Информация для авторов
</button>
<button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
id="horizontal-alignment-item-3" aria-selected="false" data-hs-tab="#horizontal-alignment-4" aria-controls="horizontal-alignment-4" role="tab">
Архив
</button>
</nav> <div>
</div> <nav class="flex flex-col md:flex-row justify-center gap-x-6" aria-label="Tabs" role="tablist" aria-orientation="horizontal">
<div class=""> <button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none active"
<div id="horizontal-alignment-1" role="tabpanel" aria-labelledby="horizontal-alignment-item-1"> id="horizontal-alignment-item-1" aria-selected="true" data-hs-tab="#horizontal-alignment-1" aria-controls="horizontal-alignment-1" role="tab">
<Builder :blocks="journal.data.main_info" /> Основная информация журнала
</div> </button>
<div id="horizontal-alignment-2" class="hidden w-full" role="tabpanel" aria-labelledby="horizontal-alignment-item-2"> <button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
<template v-for="block in journal.data.chief_editor" :key="block.id"> id="horizontal-alignment-item-2" aria-selected="false" data-hs-tab="#horizontal-alignment-2" aria-controls="horizontal-alignment-2" role="tab">
<div class="w-full rounded-xl mb-4 p-4 md:p-6 bg-white border border-gray-200 dark:bg-slate-900 dark:border-gray-700"> Редакция
<div class="flex items-center gap-x-4"> </button>
<!-- <img loading="lazy" class="rounded-xl w-[150px]" :src="'/storage/' + worker.details.photo" alt="Image Description">--> <button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
<div class="grow"> id="horizontal-alignment-item-3" aria-selected="false" data-hs-tab="#horizontal-alignment-3" aria-controls="horizontal-alignment-3" role="tab">
<p class="font-medium text-gray-800 hover:text-gray-500 underline"> Информация для авторов
Главный редактор: {{ block.name }} </button>
</p> <button type="button" class="hs-tab-active:bg-gray-100 rounded-md hs-tab-active:text-gray-700 py-1.5 px-3 inline-flex items-center gap-x-2 border-b-2 border-transparent text-sm whitespace-nowrap text-gray-500 focus:outline-none disabled:opacity-50 disabled:pointer-events-none"
<p class="text-xs text-gray-500 mt-2"> id="horizontal-alignment-item-3" aria-selected="false" data-hs-tab="#horizontal-alignment-4" aria-controls="horizontal-alignment-4" role="tab">
Ученая степень: {{ block.academicTitle }} Архив
</p> </button>
<p class="text-xs text-gray-500 mt-2">
Должность: {{ block.position }}
</p>
<p class="text-xs text-gray-500 mt-2">
Учереждение: {{ block.institution }}
</p>
</div>
</div>
<!-- Social Brands --> </nav>
<!-- End Social Brands --> </div>
</div> <div>
<div id="horizontal-alignment-1" role="tabpanel" aria-labelledby="horizontal-alignment-item-1">
<Builder :blocks="journal.data.main_info" />
</div>
<div id="horizontal-alignment-2" class="hidden w-full" role="tabpanel" aria-labelledby="horizontal-alignment-item-2">
<template v-for="block in journal.data.chief_editor" :key="block.id">
<div class="w-full rounded-xl mb-4 p-4 md:p-6 bg-white border border-gray-200 dark:bg-slate-900 dark:border-gray-700">
<div class="flex items-center gap-x-4">
<!-- <img loading="lazy" class="rounded-xl w-[150px]" :src="'/storage/' + worker.details.photo" alt="Image Description">-->
<div class="grow">
<p class="font-medium text-gray-800 hover:text-gray-500 underline">
Главный редактор: {{ block.name }}
</p>
<p class="text-xs text-gray-500 mt-2">
Ученая степень: {{ block.academicTitle }}
</p>
<p class="text-xs text-gray-500 mt-2">
Должность: {{ block.position }}
</p>
<p class="text-xs text-gray-500 mt-2">
Учереждение: {{ block.institution }}
</p>
</div>
</div>
</template> <!-- Social Brands -->
<template v-for="block in journal.data.editors" :key="block.id"> <!-- End Social Brands -->
<div class="w-full rounded-xl mb-4 p-4 md:p-6 bg-white border border-gray-200 dark:bg-slate-900 dark:border-gray-700"> </div>
<div class="flex items-center gap-x-4">
<!-- <img loading="lazy" class="rounded-xl w-[150px]" :src="'/storage/' + worker.details.photo" alt="Image Description">-->
<div class="grow">
<p class="font-medium text-gray-800 hover:text-gray-500">
{{ block.name }}
</p>
<p class="text-xs text-gray-500 mt-2">
Ученая степень: {{ block.academicTitle }}
</p>
<p class="text-xs text-gray-500 mt-2">
Должность: {{ block.position }}
</p>
<p class="text-xs text-gray-500 mt-2">
Учереждение: {{ block.institution }}
</p>
</div>
</div>
<!-- Social Brands --> </template>
<!-- End Social Brands --> <template v-for="block in journal.data.editors" :key="block.id">
</div> <div class="w-full rounded-xl mb-4 p-4 md:p-6 bg-white border border-gray-200 dark:bg-slate-900 dark:border-gray-700">
</template> <div class="flex items-center gap-x-4">
</div> <!-- <img loading="lazy" class="rounded-xl w-[150px]" :src="'/storage/' + worker.details.photo" alt="Image Description">-->
<div id="horizontal-alignment-3" class="hidden" role="tabpanel" aria-labelledby="horizontal-alignment-item-3"> <div class="grow">
<Builder :blocks="journal.data.for_authors" /> <p class="font-medium text-gray-800 hover:text-gray-500">
</div> {{ block.name }}
<div id="horizontal-alignment-4" class="hidden" role="tabpanel" aria-labelledby="horizontal-alignment-item-4"> </p>
<!-- List --> <p class="text-xs text-gray-500 mt-2">
<!-- Card Section --> Ученая степень: {{ block.academicTitle }}
<div class="px-0 py-5 sm:px-6 lg:px-8 lg:py-7 mx-auto"> </p>
<!-- Grid --> <p class="text-xs text-gray-500 mt-2">
<template v-for="journalByYear in journals"> Должность: {{ block.position }}
<h2 class="font-bold text-xl text-center">{{ journalByYear.year_publication }}</h2> </p>
<hr class="mb-4 mt-2"> <p class="text-xs text-gray-500 mt-2">
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-6 mb-4"> Учереждение: {{ block.institution }}
<template v-for="item in journalByYear.journalIssues"> </p>
<a target="_blank" class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" :href="'/storage/' + item.path_file"> </div>
<div class="p-4 md:p-5"> </div>
<div class="flex justify-between items-center gap-x-3">
<div class="grow">
<p class="text-sm text-gray-500">
{{ item.year_publication }}
</p>
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
{{ item.title }}
</h3>
</div>
<div>
<svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</div>
</div>
</div>
</a>
</template>
</div>
</template>
<!-- End Grid -->
</div>
<!-- End Card Section --> <!-- End List -->
</div>
</div> <!-- Social Brands -->
</div> <!-- End Social Brands -->
</div>
</template>
</div>
<div id="horizontal-alignment-3" class="hidden" role="tabpanel" aria-labelledby="horizontal-alignment-item-3">
<Builder :blocks="journal.data.for_authors" />
</div>
<div id="horizontal-alignment-4" class="hidden" role="tabpanel" aria-labelledby="horizontal-alignment-item-4">
<!-- List -->
<!-- Card Section -->
<div class="px-0 py-5 sm:px-6 lg:px-8 lg:py-7 mx-auto">
<!-- Grid -->
<template v-for="journalByYear in journals">
<h2 class="font-bold text-xl text-center">{{ journalByYear.year_publication }}</h2>
<hr class="mb-4 mt-2">
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-3 sm:gap-6 mb-4">
<template v-for="item in journalByYear.journalIssues">
<a target="_blank" class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" :href="'/storage/' + item.path_file">
<div class="p-4 md:p-5">
<div class="flex justify-between items-center gap-x-3">
<div class="grow">
<p class="text-sm text-gray-500">
{{ item.year_publication }}
</p>
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
{{ item.title }}
</h3>
</div>
<div>
<svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</div>
</div>
</div>
</a>
</template>
</div>
</template>
<!-- End Grid -->
</div>
<!-- End Card Section --> <!-- End List -->
</div>
</div>
</div>
</BasicPageContainer>
<!-- End Content --> <BasicFooter />
</div> </BasicPageWrapper>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style> <style>
resources/js/Pages/Client/Additional-educations/Index.vue
+53 -53
View File
@@ -14,10 +14,18 @@ import LevelEduFilter from "@/componentss/features/additionalEducationPrograms/c
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue"; import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue"; import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import FormEducationalFilter from "@/componentss/shared/filter/filters/FormEducationalFilter.vue"; import FormEducationalFilter from "@/componentss/shared/filter/filters/FormEducationalFilter.vue";
import AdditionalProgramItemBreadcrumbs
from "@/componentss/features/additionalEducationPrograms/components/AdditionalProgramItemBreadcrumbs.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BackButton from "@/componentss/ui/buttons/BackButton.vue";
import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
ProgramTitle, Builder, BackButton, BasicPageWrapper, BasicPageContainer, AdditionalProgramItemBreadcrumbs,
BasicListBadge, BasicListBadge,
AdditionalProgramBadge, AdditionalProgramBadge,
FormEducationalFilter, CategoryFilter, FormEducationalFilter, CategoryFilter,
@@ -96,60 +104,52 @@ export default {
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen"> <BasicPageWrapper>
<main class="flex-grow"> <BasicPageContainer>
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:py-10"> <div class="space-y-5 md:space-y-4">
<div class=""> <AdditionalProgramTitle class="text-center" header="Дополнительное образование" />
<div class=""> <div class="space-y-5 md:space-y-4 mx-auto max-w-3xl w-full">
<div class="space-y-5 md:space-y-4"> <div class="my-10 w-full">
<AdditionalProgramTitle class="text-center" header="Дополнительное образование" /> <AdditionalProgramListBreadcrumbs :breadcrumbs="breadcrumbs" />
<div class="space-y-5 md:space-y-4 mx-auto max-w-3xl w-full"> <div class="flex items-center gap-x-2">
<div> <LevelEduFilter :directions="directionAdditionalEducations" :direction_filter="filters.direction_filter" />
<div class=""> <BasicListFilter>
<div class="my-10 w-full"> <FormEducationalFilter :forms="forms_education" :formEdu_filter="filters.form_education_filter" />
<AdditionalProgramListBreadcrumbs :breadcrumbs="breadcrumbs" /> <CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
<div class="flex items-center gap-x-2"> </BasicListFilter>
<LevelEduFilter :directions="directionAdditionalEducations" :direction_filter="filters.direction_filter" /> </div>
<BasicListFilter> </div>
<FormEducationalFilter :forms="forms_education" :formEdu_filter="filters.form_education_filter" /> <div v-if="hasActiveFilters" class="px-1">
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" /> <h3 class="text-sm text-gray-500 mb-4">Найдено программ: {{ additionalEducations.data.length }}</h3>
</BasicListFilter> <div class="flex-wrap flex gap-3 md:items-center">
</div> <BasicListBadge :filters="filters" />
</div> </div>
<div v-if="hasActiveFilters" class="px-1"> </div>
<h3 class="text-sm text-gray-500 mb-4">Найдено программ: {{ additionalEducations.data.length }}</h3> <div class="container py-5 lg:py-4">
<div class="flex-wrap flex gap-3 md:items-center"> <div class="w-full mx-auto flex flex-wrap md:justify-between">
<BasicListBadge :filters="filters" /> <template v-for="educations in transformToColumns(additionalEducations.data)">
</div> <div class="flex flex-col">
</div> </div> <template v-for="education in educations">
<div class="container py-5 lg:py-4"> <div style="height: max-content" class="px-1">
<div class="w-full mx-auto flex flex-wrap lg:justify-between"> <h1 class="text-brand-primary mb-2 mt-2 text-lg font-semibold upper tracking-tight dark:text-white lg:text-md lg:leading-tight">
<template v-for="educations in transformToColumns(additionalEducations.data)"> {{ education.title }}
<div class="flex flex-col"> </h1>
<template v-for="education in educations"> <template v-for="program in education.additionalEducations" :key="program.id">
<div style="height: max-content" class="px-1"> <Link class="block text-primary hover:text-primary-hover duration-200 text-sm underline underline-offset-2 py-1" :href="route('client.additionalEducation.show', program.slug)">{{ program.title }}</Link>
<h1 class="text-brand-primary mb-2 mt-2 text-lg font-semibold upper tracking-tight dark:text-white lg:text-md lg:leading-tight"> </template>
{{ education.title }} </div>
</h1> </template>
<template v-for="program in education.additionalEducations" :key="program.id"> </div>
<Link class="block text-primary hover:text-primary-hover duration-200 text-sm underline underline-offset-2 py-1" :href="route('client.additionalEducation.show', program.slug)">{{ program.title }}</Link> </template>
</template> </div>
</div> </div>
</template> </div>
</div> </div>
</template> </BasicPageContainer>
</div> <BasicFooter />
</div> </BasicPageWrapper>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style scoped></style> <style scoped></style>
resources/js/Pages/Client/Additional-educations/Show.vue
+96 -112
View File
@@ -10,11 +10,15 @@ import BasicFooter from "@/footers/BasicFooter.vue";
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue"; import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
import AdditionalProgramItemBreadcrumbs import AdditionalProgramItemBreadcrumbs
from "@/componentss/features/additionalEducationPrograms/components/AdditionalProgramItemBreadcrumbs.vue"; from "@/componentss/features/additionalEducationPrograms/components/AdditionalProgramItemBreadcrumbs.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import ProgramItemBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramItemBreadcrumbs.vue";
export default { export default {
name: "Show", name: "Show",
components: { components: {
ProgramItemBreadcrumbs, BasicPageWrapper, BasicPageContainer,
AdditionalProgramItemBreadcrumbs, AdditionalProgramItemBreadcrumbs,
BasicFooter, BasicFooter,
Builder, Builder,
@@ -59,136 +63,116 @@ export default {
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen"> <BasicPageWrapper>
<main class="flex-grow"> <BasicPageContainer>
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <div class="space-y-3">
<div class="px-0 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-2xl"> <BackButton link="client.additionalEducation.index" title="Все программы"/>
<div> <AdditionalProgramItemBreadcrumbs :breadcrumbs="breadcrumbs" :additional-education-title="additionalEducation.data.title" />
<div class="space-y-5 md:space-y-4"> <ProgramTitle :header="additionalEducation.data.title" class="text-center" />
<div class="space-y-5 md:space-y-4"> </div>
<div>
<div class="container mx-auto xl:px-5 max-w-screen-lg py-5 lg:py-8">
<div class="space-y-10">
<div class="space-y-3">
<BackButton link="client.additionalEducation.index" title="Все программы"/>
<AdditionalProgramItemBreadcrumbs :breadcrumbs="breadcrumbs" :additional-education-title="additionalEducation.data.title" />
</div>
<ProgramTitle :header="additionalEducation.data.title" class="text-center" />
</div>
<!-- Icon Blocks --> <div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto"> <div class="grid sm:grid-cols-2 lg:grid-cols-3 items-start gap-12">
<div class="grid sm:grid-cols-2 lg:grid-cols-3 items-start gap-12"> <!-- Icon Block -->
<!-- Icon Block --> <div class="text-center">
<div class="text-center"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" />
<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" /> </svg>
</svg> </div>
</div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Направление подготовки</h3> <h3 class="text-lg font-semibold text-gray-800">Направление подготовки</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.directionAdditionalEducation.title }} {{ additionalEducation.data.category }}</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.directionAdditionalEducation.title }} {{ additionalEducation.data.category }}</p>
</div> </div>
</div> </div>
<!-- End Icon Block --> <!-- End Icon Block -->
<!-- Icon Block --> <!-- Icon Block -->
<div class="text-center"> <div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</div> </div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Срок обучения</h3> <h3 class="text-lg font-semibold text-gray-800">Срок обучения</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.learning_time }} часов</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.learning_time }} часов</p>
</div> </div>
</div> </div>
<!-- End Icon Block --> <!-- End Icon Block -->
<div class="text-center"> <div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 0 1-1.043 3.296 3.745 3.745 0 0 1-3.296 1.043A3.745 3.745 0 0 1 12 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 0 1-3.296-1.043 3.745 3.745 0 0 1-1.043-3.296A3.745 3.745 0 0 1 3 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 0 1 1.043-3.296 3.746 3.746 0 0 1 3.296-1.043A3.746 3.746 0 0 1 12 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 0 1 3.296 1.043 3.746 3.746 0 0 1 1.043 3.296A3.745 3.745 0 0 1 21 12Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 0 1-1.043 3.296 3.745 3.745 0 0 1-3.296 1.043A3.745 3.745 0 0 1 12 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 0 1-3.296-1.043 3.745 3.745 0 0 1-1.043-3.296A3.745 3.745 0 0 1 3 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 0 1 1.043-3.296 3.746 3.746 0 0 1 3.296-1.043A3.746 3.746 0 0 1 12 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 0 1 3.296 1.043 3.746 3.746 0 0 1 1.043 3.296A3.745 3.745 0 0 1 21 12Z" />
</svg> </svg>
</div> </div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Присваиваемая квалификация</h3> <h3 class="text-lg font-semibold text-gray-800">Присваиваемая квалификация</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.qualification }}</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.qualification }}</p>
</div> </div>
</div> </div>
<div class="text-center"> <div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25" />
</svg> </svg>
</div> </div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Форма обучения</h3> <h3 class="text-lg font-semibold text-gray-800">Форма обучения</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.form_education }}</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.form_education }}</p>
</div> </div>
</div> </div>
<div class="text-center"> <div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 18.75a60.07 60.07 0 0 1 15.797 2.101c.727.198 1.453-.342 1.453-1.096V18.75M3.75 4.5v.75A.75.75 0 0 1 3 6h-.75m0 0v-.375c0-.621.504-1.125 1.125-1.125H20.25M2.25 6v9m18-10.5v.75c0 .414.336.75.75.75h.75m-1.5-1.5h.375c.621 0 1.125.504 1.125 1.125v9.75c0 .621-.504 1.125-1.125 1.125h-.375m1.5-1.5H21a.75.75 0 0 0-.75.75v.75m0 0H3.75m0 0h-.375a1.125 1.125 0 0 1-1.125-1.125V15m1.5 1.5v-.75A.75.75 0 0 0 3 15h-.75M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm3 0h.008v.008H18V10.5Zm-12 0h.008v.008H6V10.5Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 18.75a60.07 60.07 0 0 1 15.797 2.101c.727.198 1.453-.342 1.453-1.096V18.75M3.75 4.5v.75A.75.75 0 0 1 3 6h-.75m0 0v-.375c0-.621.504-1.125 1.125-1.125H20.25M2.25 6v9m18-10.5v.75c0 .414.336.75.75.75h.75m-1.5-1.5h.375c.621 0 1.125.504 1.125 1.125v9.75c0 .621-.504 1.125-1.125 1.125h-.375m1.5-1.5H21a.75.75 0 0 0-.75.75v.75m0 0H3.75m0 0h-.375a1.125 1.125 0 0 1-1.125-1.125V15m1.5 1.5v-.75A.75.75 0 0 0 3 15h-.75M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm3 0h.008v.008H18V10.5Zm-12 0h.008v.008H6V10.5Z" />
</svg> </svg>
</div> </div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Цена обучения</h3> <h3 class="text-lg font-semibold text-gray-800">Цена обучения</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.price }} &#8381;</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.price }} &#8381;</p>
</div> </div>
</div> </div>
<div class="text-center"> <div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="flex-shrink-0 size-6 text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z" />
</svg> </svg>
</div> </div>
<div class="mt-3"> <div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Целевая аудитория</h3> <h3 class="text-lg font-semibold text-gray-800">Целевая аудитория</h3>
<p class="mt-1 text-gray-600">{{ additionalEducation.data.target_group }}</p> <p class="mt-1 text-gray-600">{{ additionalEducation.data.target_group }}</p>
</div> </div>
</div> </div>
<!-- End Icon Block --> <!-- End Icon Block -->
</div> </div>
</div> </div>
<div v-if="additionalEducation.data.content.length > 0"> <div v-if="additionalEducation.data.content.length > 0">
<h2 class="text-xl font-bold md:text-2xl">О программе</h2> <h2 class="text-xl font-bold md:text-2xl">О программе</h2>
<div class="py-4"> <div class="py-4">
<Builder :blocks="additionalEducation.data.content" /> <Builder :blocks="additionalEducation.data.content" />
</div> </div>
</div> </div>
<!-- End Icon Blocks --> </BasicPageContainer>
<BasicFooter />
</BasicPageWrapper>
</div>
</div>
</div>
</div>
<!-- End Content -->
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
resources/js/Pages/Client/Departments/Show.vue
+131 -110
View File
@@ -4,139 +4,138 @@
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen justify-between"> <BasicPageWrapper>
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<div class="w-full h-[67px] pointer-events-none fixed" id="visor"></div> <NavigateVisor />
<div class="sticky top-[110px] hidden h-[calc(100vh-110px)] max-w-[20%] md:flex md:shrink-0 md:flex-col md:justify-between"> <div class="sticky top-[110px] hidden h-[calc(100vh-110px)] max-w-[20%] md:flex md:shrink-0 md:flex-col md:justify-between">
<nav v-if="departments" <nav v-if="departments"
class="flex h-[calc(100vh-200px)] flex-col overflow-hidden pr-2 pb-4"> class="flex h-[calc(100vh-200px)] flex-col overflow-hidden pr-2 pb-4">
<div class="text-gray-1000 mb-2 text-md font-medium">Кафедры факультета - {{ department.data.faculty.abbreviation }}</div> <div class="text-gray-1000 mb-2 text-md font-medium">Кафедры факультета - {{ department.data.faculty.abbreviation }}</div>
<div class="flex gap-x-1"> <div class="flex gap-x-1">
<ul class="px-0.5 last-of-type:mb-0 mb-8"> <ul class="px-0.5 last-of-type:mb-0 mb-8">
<li v-for="depart in departments.data" :key="department.id" class="my-1.5 flex"> <li v-for="depart in departments.data" :key="department.id" class="my-1.5 flex">
<a :class="{'text-white hover:text-gray-200 font-semibold bg-[#135aae]': this.IS_SAME_ROUTE(route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug })), 'text-gray-600 hover:text-[#2C6288]': !this.IS_SAME_ROUTE(route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug })) }" <a :class="{'text-white hover:text-gray-200 font-semibold bg-[#135aae]': this.IS_SAME_ROUTE(route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug })), 'text-gray-600 hover:text-[#2C6288]': !this.IS_SAME_ROUTE(route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug })) }"
:href="route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug }) + '/'" :href="route('client.department.show', { facultySlug: department.data.faculty.slug, departmentSlug: depart.slug }) + '/'"
class="relative duration-300 flex w-full rounded-md cursor-pointer items-center px-2 py-1 text-left text-sm">{{ class="relative duration-300 flex w-full rounded-md cursor-pointer items-center px-2 py-1 text-left text-sm">{{
depart.title depart.title
}}</a> }}</a>
</li> </li>
</ul> </ul>
</div> </div>
</nav> </nav>
</div> </div>
<nav class="order-last hidden w-56 shrink-0 lg:block"> <nav class="order-last hidden w-56 shrink-0 lg:block">
<div class="sticky top-[110px] h-[calc(100vh-110px)]"> <div class="sticky top-[110px] h-[calc(100vh-110px)]">
<div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div> <div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div>
<ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm"> <ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm">
<li class="anchor-li"> <li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'workers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'workers' }" <a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'workers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'workers' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#workers">Сотрудники кафедры</a> href="#workers">Сотрудники кафедры</a>
</li> </li>
<li class="anchor-li"> <li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'teachers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'teachers' }" <a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'teachers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'teachers' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#teachers">Преподаватели кафедры</a> href="#teachers">Преподаватели кафедры</a>
</li> </li>
<li class="anchor-li"> <li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'external-teachers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'external-teachers' }" <a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'external-teachers', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'external-teachers' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#external-teachers">Внешние совместители</a> href="#external-teachers">Внешние совместители</a>
</li> </li>
<li class="anchor-li"> <li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'programs', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'programs' }" <a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'programs', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'programs' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#programs">Программы</a> href="#programs">Программы</a>
</li> </li>
<li class="anchor-li"> <li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'description', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'description' }" <a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'description', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'description' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#description">Описание</a> href="#description">Описание</a>
</li> </li>
<transition name="fade"> <transition name="fade">
<li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop"> <li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop">
<button class="bg-transperant text-gray-600 cursor-pointer hover:text-gray-900 duration-300 block px-2 leading-[1.6] rounded-md">К началу</button> <button class="bg-transperant text-gray-600 cursor-pointer hover:text-gray-900 duration-300 block px-2 leading-[1.6] rounded-md">К началу</button>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[17px] text-gray-600"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[17px] text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 11.25l-3-3m0 0l-3 3m3-3v7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M15 11.25l-3-3m0 0l-3 3m3-3v7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg> </svg>
</li> </li>
</transition> </transition>
</ul> </ul>
</div> </div>
</nav> </nav>
<article class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style=""> <article class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style="">
<div class="space-y-5 md:space-y-5"> <div class="space-y-5 md:space-y-5">
<div class="flex justify-between items-center mb-6"> <div class="flex justify-between items-center mb-6">
<div class="flex w-full sm:items-center gap-x-5 sm:gap-x-3"> <div class="flex w-full sm:items-center gap-x-5 sm:gap-x-3">
<div class="grow"> <div class="grow">
<div class="grid sm:flex sm:justify-between sm:items-center gap-2"> <div class="grid sm:flex sm:justify-between sm:items-center gap-2">
<DepartmentItemBreadcrumbs :faculty="department.data.faculty" :department-title="department.data.title" /> <DepartmentItemBreadcrumbs :faculty="department.data.faculty" :department-title="department.data.title" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<BasicTitle :header="department.data.title" /> <BasicTitle :header="department.data.title" />
<div id="page-area" class="space-y-5 md:space-y-5"> <div id="page-area" class="space-y-5 md:space-y-5">
<h2 id="workers" class="font-bold text-xl">Сотрудники кафедры</h2> <h2 id="workers" class="font-bold text-xl">Сотрудники кафедры</h2>
<template v-for="worker in department.data.workers"> <template v-for="worker in department.data.workers">
<DepartmentWorkerCard :worker="worker" /> <DepartmentWorkerCard :worker="worker" />
</template> </template>
<h2 id="teachers" class="font-bold text-xl">Преподаватели кафедры</h2> <h2 id="teachers" class="font-bold text-xl">Преподаватели кафедры</h2>
<template v-for="teacher in department.data.teachers"> <template v-for="teacher in department.data.teachers">
<DepartmentTeacherCard :teacher="teacher" /> <DepartmentTeacherCard :teacher="teacher" />
</template> </template>
<h2 id="external-teachers" class="font-bold text-xl">Внешние совместители</h2> <h2 id="external-teachers" class="font-bold text-xl">Внешние совместители</h2>
<h2 id="programs" class="font-bold text-xl">Программы</h2> <h2 id="programs" class="font-bold text-xl">Программы</h2>
<div class="hs-accordion-group"> <div class="hs-accordion-group">
<div v-for="(direction, index) in directions" class="hs-accordion hs-accordion-active:bg-gray-100 rounded-xl px-4 py-6" id="hs-basic-with-title-and-arrow-stretched-heading-three"> <div v-for="(direction, index) in directions" class="hs-accordion hs-accordion-active:bg-gray-100 rounded-xl px-4 py-6" id="hs-basic-with-title-and-arrow-stretched-heading-three">
<button class="hs-accordion-toggle group pb-3 inline-flex items-center justify-between gap-x-3 w-full md:text-lg font-semibold text-start text-gray-800 rounded-lg transition hover:text-gray-500 focus:outline-none" aria-expanded="false" aria-controls="hs-basic-with-title-and-arrow-stretched-collapse-three"> <button class="hs-accordion-toggle group pb-3 inline-flex items-center justify-between gap-x-3 w-full md:text-lg font-semibold text-start text-gray-800 rounded-lg transition hover:text-gray-500 focus:outline-none" aria-expanded="false" aria-controls="hs-basic-with-title-and-arrow-stretched-collapse-three">
{{ index }} {{ index }}
<svg class="hs-accordion-active:hidden block shrink-0 size-5 text-gray-600 group-hover:text-gray-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> <svg class="hs-accordion-active:hidden block shrink-0 size-5 text-gray-600 group-hover:text-gray-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
<svg class="hs-accordion-active:block hidden shrink-0 size-5 text-gray-600 group-hover:text-gray-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m18 15-6-6-6 6"/></svg> <svg class="hs-accordion-active:block hidden shrink-0 size-5 text-gray-600 group-hover:text-gray-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m18 15-6-6-6 6"/></svg>
</button> </button>
<div id="hs-basic-with-title-and-arrow-stretched-collapse-three" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" role="region" aria-labelledby="hs-basic-with-title-and-arrow-stretched-heading-three"> <div id="hs-basic-with-title-and-arrow-stretched-collapse-three" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" role="region" aria-labelledby="hs-basic-with-title-and-arrow-stretched-heading-three">
<ul class="list-disc list-outside space-y-3 ps-5 text-lg text-gray-800 dark:text-neutral-200"> <ul class="list-disc list-outside space-y-3 ps-5 text-lg text-gray-800 dark:text-neutral-200">
<li v-for="program in direction" class="ps-2"> <li v-for="program in direction" class="ps-2">
<Link :href="route('client.program.show', program.id)" class="text-base text-primary decoration-2 hover:underline focus:outline-none focus:underline font-medium dark:text-blue-500">{{ program.name }}</Link> <Link :href="route('client.program.show', program.id)" class="text-base text-primary decoration-2 hover:underline focus:outline-none focus:underline font-medium dark:text-blue-500">{{ program.name }}</Link>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<h2 id="description" class="font-bold text-xl">Описание</h2> <h2 id="description" class="font-bold text-xl">Описание</h2>
<div class="space-y-3 md:space-y-4"> <div class="space-y-3 md:space-y-4">
<Builder :blocks="department.data.content "/> <Builder :blocks="department.data.content "/>
</div> </div>
</div> </div>
</div> </div>
</article> </article>
</div> </div>
<BasicFooter />
</BasicPageWrapper>
<BasicFooter />
</div>
</template> </template>
@@ -154,6 +153,17 @@ import DepartmentWorkerCard from "@/componentss/features/departments/components/
import DepartmentTeacherCard from "@/componentss/features/departments/components/DepartmentTeacherCard.vue"; import DepartmentTeacherCard from "@/componentss/features/departments/components/DepartmentTeacherCard.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import {helpers} from "@/mixins/Helpers.js"; import {helpers} from "@/mixins/Helpers.js";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
import NavigateVisor from "@/componentss/shared/visor/NavigateVisor.vue";
export default { export default {
@@ -182,6 +192,17 @@ export default {
}, },
components: { components: {
NavigateVisor,
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
BasicFooter, BasicFooter,
DepartmentTeacherCard, DepartmentTeacherCard,
DepartmentWorkerCard, DepartmentWorkerCard,
resources/js/Pages/Client/Events/Archive.vue
+56 -49
View File
@@ -14,11 +14,18 @@ import EventArchiveListBreadcrumbs from "@/componentss/features/events/component
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue"; import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue"; import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue"; import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BackButton from "@/componentss/ui/buttons/BackButton.vue";
import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import BasicTitle from "@/componentss/ui/titles/BasicTitle.vue";
import EventItemBreadcrumbs from "@/componentss/features/events/components/EventItemBreadcrumbs.vue";
export default { export default {
name: "Archive", name: "Archive",
components: { components: {
EventItemBreadcrumbs, BasicTitle, Builder, BackButton, BasicPageWrapper, BasicPageContainer,
BasicPagination, BasicPagination,
SortingByFilter, SortingByFilter,
EventListSearch, EventListSearch,
@@ -75,61 +82,61 @@ export default {
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar>
<div class="flex flex-col h-screen">
<main class="flex-grow"> <BasicPageWrapper>
<div class="relative mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <BasicPageContainer breakpoint="md">
<div class="pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-md"> <!-- Добавлен w-full --> <div>
<EventArchiveListBreadcrumbs :breadcrumbs="breadcrumbs" />
<div class="space-y-5 md:space-y-4">
<div class="flex items-center w-full justify-center">
<h1 class="block text-brand-primary text-center mb-3 mt-2 mr-4 text-3xl font-semibold tracking-tight lg:text-[35px] lg:leading-tight">
Архив мероприятий НТГСПИ
</h1>
<BasicListFilter>
<SortingByFilter :sortingBy_filter="filters.sortingBy_filter" />
<IsOnlineFilter :is_online_filter="filters.is_online_filter" />
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
</BasicListFilter>
</div>
<div class="space-y-5 md:space-y-4">
<EventListSearch :search_filter="filters.search_filter" />
</div>
<div> <div>
<EventArchiveListBreadcrumbs :breadcrumbs="breadcrumbs" /> <h3 class="text-sm text-gray-500 mb-4">Найдено мероприятий: {{ events.meta.total }}</h3>
<div class="space-y-5 md:space-y-4"> <div v-if="hasActiveFilters" class="flex-wrap flex gap-3 md:items-center">
<div class="flex items-center w-full justify-center"> <BasicListBadge :filters="filters" />
<h1 class="block text-brand-primary text-center mb-3 mt-2 mr-4 text-3xl font-semibold tracking-tight lg:text-[35px] lg:leading-tight">
Архив мероприятий НТГСПИ
</h1>
<BasicListFilter>
<SortingByFilter :sortingBy_filter="filters.sortingBy_filter" />
<IsOnlineFilter :is_online_filter="filters.is_online_filter" />
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
</BasicListFilter>
</div>
<div class="space-y-5 md:space-y-4">
<EventListSearch :search_filter="filters.search_filter" />
</div>
<div>
<h3 class="text-sm text-gray-500 mb-4">Найдено мероприятий: {{ events.meta.total }}</h3>
<div v-if="hasActiveFilters" class="flex-wrap flex gap-3 md:items-center">
<BasicListBadge :filters="filters" />
</div>
</div>
</div> </div>
<div class="grid gap-y-10 mt-5 w-full"> <!-- Добавлен w-full -->
<template v-for="event in events.data">
<div class="sm:flex rounded-xl w-full"> <!-- Добавлен w-full -->
<div class="grow">
<div class="flex flex-col h-full">
<div class="mb-3">
<p class="inline-flex mr-2 items-center gap-1.5 py-1.5 rounded-md text-[12px] text-gray-600">
{{ event.event_date_start }}
</p>
<a :href="route('client.event.archive', { 'category[]': event.category.slug })" v-if="event.category" class="inline-flex items-center gap-1.5 py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary hover:underline">
{{ event.category.title }}
</a>
</div>
<Link :href="route('client.event.show', event.slug)" class="text-lg sm:text-2xl font-semibold text-gray-800 hover:text-primary-hover">
{{ event.title }}
</Link>
</div>
</div>
</div>
</template>
</div>
<BasicPagination :links="events.links" />
</div> </div>
</div> </div>
<div class="grid gap-y-10 mt-5 w-full"> <!-- Добавлен w-full -->
<template v-for="event in events.data">
<div class="sm:flex rounded-xl w-full"> <!-- Добавлен w-full -->
<div class="grow">
<div class="flex flex-col h-full">
<div class="mb-3">
<p class="inline-flex mr-2 items-center gap-1.5 py-1.5 rounded-md text-[12px] text-gray-600">
{{ event.event_date_start }}
</p>
<a :href="route('client.event.archive', { 'category[]': event.category.slug })" v-if="event.category" class="inline-flex items-center gap-1.5 py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary hover:underline">
{{ event.category.title }}
</a>
</div>
<Link :href="route('client.event.show', event.slug)" class="text-lg sm:text-2xl font-semibold text-gray-800 hover:text-primary-hover">
{{ event.title }}
</Link>
</div>
</div>
</div>
</template>
</div>
<BasicPagination :links="events.links" />
</div> </div>
</main>
</BasicPageContainer>
<BasicFooter /> <BasicFooter />
</div> </BasicPageWrapper>
</template> </template>
<style scoped> <style scoped>
resources/js/Pages/Client/Events/Index.vue
+66 -62
View File
@@ -10,11 +10,18 @@ import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue"; import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue"; import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue"; import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BackButton from "@/componentss/ui/buttons/BackButton.vue";
import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import BasicTitle from "@/componentss/ui/titles/BasicTitle.vue";
import EventItemBreadcrumbs from "@/componentss/features/events/components/EventItemBreadcrumbs.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
EventItemBreadcrumbs, BasicTitle, Builder, BackButton, BasicPageWrapper, BasicPageContainer,
BasicListBadge, BasicListBadge,
CategoryFilter, CategoryFilter,
IsOnlineFilter, IsOnlineFilter,
@@ -66,73 +73,70 @@ export default {
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar>
<div class="flex flex-col h-screen">
<main class="flex-grow">
<div class="relative mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<div class="pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-md">
<div>
<EventListBreadcrumbs :breadcrumbs="breadcrumbs" />
<div class="space-y-5 md:space-y-4">
<div class="flex items-center w-full justify-center">
<h1 class="block text-brand-primary text-center mb-3 mt-2 mr-4 text-3xl font-semibold tracking-tight dark:text-white lg:text-[40px] lg:leading-tight">
Мероприятия НТГСПИ
</h1>
<BasicListFilter>
<IsOnlineFilter :is_online_filter="filters.is_online_filter" />
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
</BasicListFilter>
</div> <BasicPageWrapper>
<BasicPageContainer breakpoint="md">
<div>
<EventListBreadcrumbs :breadcrumbs="breadcrumbs" />
<div class="space-y-5 md:space-y-4">
<div class="flex items-center w-full justify-center">
<h1 class="block text-brand-primary text-center mb-3 mt-2 mr-4 text-3xl font-semibold tracking-tight dark:text-white lg:text-[40px] lg:leading-tight">
Мероприятия НТГСПИ
</h1>
<BasicListFilter>
<IsOnlineFilter :is_online_filter="filters.is_online_filter" />
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
</BasicListFilter>
<div class="my-10 justify-center flex gap-x-3 items-center"> </div>
<h3 class="font-light text-xl">Мероприятия на </h3>
<div class="shadow-sm w-[35px]">
<div class="block w-[35px] h-[8px] bg-red-400 rounded-t"></div>
<div class="block w-[35px] h-[27px] bg-white text-center font-medium">{{ currentDate.day }}</div>
</div>
<h3 class="font-light text-xl">{{ currentDate.month }}</h3>
</div>
<div class="space-y-5 md:space-y-4">
<div>
<EventListSelectDate :current-date="currentDate.fullDate" :dates="eventDates"/>
</div>
</div> <div class="my-10 justify-center flex gap-x-3 items-center">
<div v-if="hasActiveFilters"> <h3 class="font-light text-xl">Мероприятия на </h3>
<h3 class="text-sm text-gray-500 mb-4">Найдено мероприятий: {{ events.data.length }}</h3> <div class="shadow-sm w-[35px]">
<div class="flex-wrap flex gap-3 md:items-center"> <div class="block w-[35px] h-[8px] bg-red-400 rounded-t"></div>
<BasicListBadge :filters="filters" /> <div class="block w-[35px] h-[27px] bg-white text-center font-medium">{{ currentDate.day }}</div>
</div>
<h3 class="font-light text-xl">{{ currentDate.month }}</h3>
</div>
<div class="space-y-5 md:space-y-4">
<div>
<EventListSelectDate :current-date="currentDate.fullDate" :dates="eventDates"/>
</div>
</div>
<div v-if="hasActiveFilters">
<h3 class="text-sm text-gray-500 mb-4">Найдено мероприятий: {{ events.data.length }}</h3>
<div class="flex-wrap flex gap-3 md:items-center">
<BasicListBadge :filters="filters" />
</div>
</div>
</div>
<div class="grid gap-y-10 mt-10">
<template v-for="event in events.data">
<div class="sm:flex rounded-xl">
<div class="grow">
<div class="flex flex-col h-full">
<div class="mb-3">
<p class="inline-flex mr-2 items-center gap-1.5 py-1.5 rounded-md text-[12px] text-gray-600">
{{ event.event_time_start }}
</p>
<a :href="route('client.event.index', { 'category[]': event.category.slug })" v-if="event.category" class="inline-flex items-center gap-1.5 py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary hover:underline">
{{ event.category.title }}
</a>
</div>
<Link :href="route('client.event.show', event.slug)" class="text-lg sm:text-2xl font-semibold text-gray-800 hover:text-primary-hover">
{{ event.title }}
</Link>
</div> </div>
</div> </div>
</div> </div>
<div class="grid gap-y-10 mt-10"> </template>
<template v-for="event in events.data"> </div>
<div class="sm:flex rounded-xl"> </div>
<div class="grow"> </BasicPageContainer>
<div class="flex flex-col h-full"> <BasicFooter />
<div class="mb-3"> </BasicPageWrapper>
<p class="inline-flex mr-2 items-center gap-1.5 py-1.5 rounded-md text-[12px] text-gray-600">
{{ event.event_time_start }}
</p>
<a :href="route('client.event.index', { 'category[]': event.category.slug })" v-if="event.category" class="inline-flex items-center gap-1.5 py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary hover:underline">
{{ event.category.title }}
</a>
</div>
<Link :href="route('client.event.show', event.slug)" class="text-lg sm:text-2xl font-semibold text-gray-800 hover:text-primary-hover">
{{ event.title }}
</Link>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
resources/js/Pages/Client/Events/Show.vue
+46 -47
View File
@@ -7,10 +7,15 @@ import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import MetaTags from "@/componentss/shared/SEO/MetaTags.vue"; import MetaTags from "@/componentss/shared/SEO/MetaTags.vue";
import EventItemBreadcrumbs from "@/componentss/features/events/components/EventItemBreadcrumbs.vue"; import EventItemBreadcrumbs from "@/componentss/features/events/components/EventItemBreadcrumbs.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
import ProgramItemBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramItemBreadcrumbs.vue";
export default { export default {
name: "Show", name: "Show",
components: { components: {
ProgramItemBreadcrumbs, ProgramTitle, BasicPageWrapper, BasicPageContainer,
MetaTags, MetaTags,
BasicFooter, BasicFooter,
Builder, Builder,
@@ -56,57 +61,51 @@ export default {
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar>
<div class="flex flex-col h-screen">
<main class="flex-grow">
<div class="relative mx-auto mt-[67px] max-w-screen-xl py-10 md:flex md:flex-row md:py-10">
<div class="max-w-4xl px-4 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full">
<div>
<div class="space-y-5 md:space-y-10">
<div class="space-y-3">
<EventItemBreadcrumbs :breadcrumbs="breadcrumbs" :event-title="event.data.title" />
<BackButton link="client.event.index" title="Все мероприятия" />
<BasicTitle :header="event.data.title" />
</div>
<div class="flex gap-x-3 text-gray-500 "> <BasicPageWrapper>
<div class="flex items-center gap-3"> <BasicPageContainer>
<div> <div class="space-y-5 md:space-y-10">
<div class="flex items-center flex-wrap gap-2 text-sm"> <div class="space-y-3">
<a :href="route('client.event.index', { 'is_online': 'online' })" <BackButton link="client.event.index" title="Все мероприятия" />
v-if="event.data.is_online === 1" <EventItemBreadcrumbs :breadcrumbs="breadcrumbs" :event-title="event.data.title" />
class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] hover:underline text-primary"> <BasicTitle :header="event.data.title" />
Онлайн </div>
</a>
<a :href="route('client.event.index', { 'category[]': event.data.category.slug })"
v-if="event.data.category"
class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] hover:underline text-primary">
{{ event.data.category.title }}
</a>
<div class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary">
<span>Дата начала: {{ event.data.event_date_start }}, {{ event.data.event_time_start }}</span>
</div>
<div class="md:flex md:items-center md:justify-center w-full md:w-auto">
<span>Адрес: {{ event.data.address }}</span>
</div>
</div>
</div>
</div>
</div>
<div class="gap-y-3 md:gap-y-4"> <div class="flex gap-x-3 text-gray-500 ">
<Builder :blocks="event.data.content"/> <div class="flex items-center gap-3">
</div> <div>
</div> <div class="flex items-center flex-wrap gap-2 text-sm">
<!-- End Content --> <a :href="route('client.event.index', { 'is_online': 'online' })"
</div> v-if="event.data.is_online === 1"
</div> class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] hover:underline text-primary">
Онлайн
</a>
<a :href="route('client.event.index', { 'category[]': event.data.category.slug })"
v-if="event.data.category"
class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] hover:underline text-primary">
{{ event.data.category.title }}
</a>
<div class="inline-flex items-center py-1.5 px-3 rounded-md text-xs font-medium bg-[#E9F2FE] text-primary">
<span>Дата начала: {{ event.data.event_date_start }}, {{ event.data.event_time_start }}</span>
</div>
<div class="md:flex md:items-center md:justify-center w-full md:w-auto">
<span>Адрес: {{ event.data.address }}</span>
</div>
</div>
</div>
</div>
</div>
<div class="gap-y-3 md:gap-y-4">
<Builder :blocks="event.data.content"/>
</div>
</div>
</BasicPageContainer>
<BasicFooter />
</BasicPageWrapper>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style> <style>
resources/js/Pages/Client/Faculties/Index.vue
+53 -51
View File
@@ -6,10 +6,30 @@ import FacultyListBreadcrumbs from "@/componentss/features/faculties/components/
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import BasicTitle from "@/componentss/ui/titles/BasicTitle.vue"; import BasicTitle from "@/componentss/ui/titles/BasicTitle.vue";
import FacultyListTitle from "@/componentss/features/faculties/components/FacultyListTitle.vue"; import FacultyListTitle from "@/componentss/features/faculties/components/FacultyListTitle.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
FacultyListTitle, FacultyListTitle,
BasicTitle, BasicTitle,
BasicFooter, BasicFooter,
@@ -43,60 +63,42 @@ export default {
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen"> <BasicPageWrapper>
<main class="flex-grow"> <BasicPageContainer>
<div class="relative mx-auto mt-[67px] max-w-screen-xl py-10 md:flex md:flex-row md:py-10"> <FacultyListTitle
<div class="px-4 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-xl"> bottom-text="Информация о наших факультетах и кафедрах"
<div> header="Факультеты и кафедры" />
<!-- Avatar Media --> <FacultyListBreadcrumbs />
<!-- End Avatar Media -->
<!-- Content -->
<div class="space-y-5 md:space-y-4">
<div class="space-y-5 md:space-y-4">
<!-- Card Section -->
<div class="max-w-[85rem] px-0 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<FacultyListTitle
bottom-text="Информация о наших факультетах и кафедрах"
header="Факультеты и кафедры" />
<FacultyListBreadcrumbs />
<!-- Grid --> <!-- Grid -->
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6"> <div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6">
<template v-for="faculty in faculties.data"> <template v-for="faculty in faculties.data">
<Link :href="route('client.faculty.show', faculty.slug)" class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" > <Link :href="route('client.faculty.show', faculty.slug)" class="group flex flex-col bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition" >
<div class="p-4 md:p-5"> <div class="p-4 md:p-5">
<div class="flex justify-between items-center gap-x-3"> <div class="flex justify-between items-center gap-x-3">
<div class="grow"> <div class="grow">
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800"> <h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
{{ faculty.shortTitle }} {{ faculty.shortTitle }}
</h3> </h3>
<p class="text-sm text-gray-500"> <p class="text-sm text-gray-500">
{{ faculty.title }} {{ faculty.title }}
</p> </p>
</div> </div>
<div> <div>
<svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> <svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</div> </div>
</div> </div>
</div> </div>
</Link> </Link>
</template> </template>
</div>
</BasicPageContainer>
<BasicFooter />
</BasicPageWrapper>
</div>
<!-- End Grid -->
</div>
<!-- End Card Section -->
</div>
</div>
<!-- End Content -->
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style scoped></style> <style scoped></style>
resources/js/Pages/Client/Faculties/Show.vue
+131 -111
View File
@@ -1,137 +1,135 @@
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen justify-between"> <BasicPageWrapper>
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <div class="relative mx-auto mb-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<div class="relative mx-auto mb-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <NavigateVisor />
<div class="w-full h-[67px] pointer-events-none fixed" id="visor"></div> <div class="sticky top-[110px] hidden h-[calc(100vh-110px)] max-w-[20%] md:flex md:shrink-0 md:flex-col md:justify-between">
<nav v-if="faculties"
class="flex h-[calc(100vh-200px)] flex-col overflow-hidden pr-2 pb-4">
<div class="text-gray-1000 mb-2 text-md font-medium">Факультеты</div>
<div class="flex gap-x-1">
<ul class="px-0.5 last-of-type:mb-0 mb-8">
<li v-for="faculty in faculties.data" :key="faculty.id" class="my-1.5 flex">
<a :class="{'text-white hover:text-gray-200 font-semibold bg-[#135aae]': isSameRoute(route('client.faculty.show', faculty.slug)), 'text-gray-600 hover:text-[#2C6288]': !isSameRoute(route('client.faculty.show', faculty.id)) }"
:href="route('client.faculty.show', faculty.slug) + '/'"
class="relative duration-300 flex w-full rounded-md cursor-pointer items-center px-2 py-1 text-left text-sm">{{
faculty.title
}}</a>
</li>
</ul>
</div>
</nav>
</div>
<nav class="order-last hidden w-56 shrink-0 lg:block">
<div class="sticky top-[110px] h-[calc(100vh-110px)]">
<div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div>
<ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm">
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'persons', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'persons' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#persons">Состав</a>
</li>
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'department', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'department' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#department">Кафедры факультета</a>
</li>
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'description', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'description' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#description">Описание</a>
</li>
<transition name="fade">
<li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop">
<button class="bg-transperant text-gray-600 cursor-pointer hover:text-gray-900 duration-300 block px-2 leading-[1.6] rounded-md">К началу</button>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[17px] text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 11.25l-3-3m0 0l-3 3m3-3v7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</li>
</transition>
</ul>
</div>
</nav>
<article class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style="">
<div class="space-y-5 md:space-y-5">
<div class="flex justify-between items-center mb-6">
<div class="flex w-full sm:items-center gap-x-5 sm:gap-x-3">
<div class="grow">
<div class="grid sm:flex sm:justify-between sm:items-center gap-2">
<FacultyItemBreadcrumbs :faculty-title="faculty.data.title" />
</div>
</div>
</div>
</div>
<div class="space-y-3">
<h1 class="text-2xl mb-10 font-bold md:text-3xl">{{ faculty.data.title }}</h1>
</div>
<div id="page-area" class="space-y-5 md:space-y-5">
<h2 id="persons" class="font-bold text-xl">Состав</h2>
<div class="sticky top-[110px] hidden h-[calc(100vh-110px)] max-w-[20%] md:flex md:shrink-0 md:flex-col md:justify-between"> <template v-for="worker in faculty.data.workers">
<nav v-if="faculties" <FacultyWorkerCard :worker="worker" />
class="flex h-[calc(100vh-200px)] flex-col overflow-hidden pr-2 pb-4"> </template>
<div class="text-gray-1000 mb-2 text-md font-medium">Факультеты</div>
<div class="flex gap-x-1">
<ul class="px-0.5 last-of-type:mb-0 mb-8">
<li v-for="faculty in faculties.data" :key="faculty.id" class="my-1.5 flex">
<a :class="{'text-white hover:text-gray-200 font-semibold bg-[#135aae]': isSameRoute(route('client.faculty.show', faculty.slug)), 'text-gray-600 hover:text-[#2C6288]': !isSameRoute(route('client.faculty.show', faculty.id)) }"
:href="route('client.faculty.show', faculty.slug) + '/'"
class="relative duration-300 flex w-full rounded-md cursor-pointer items-center px-2 py-1 text-left text-sm">{{
faculty.title
}}</a>
</li>
</ul>
</div>
</nav>
</div>
<nav class="order-last hidden w-56 shrink-0 lg:block">
<div class="sticky top-[110px] h-[calc(100vh-110px)]">
<div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div>
<ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm">
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'persons', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'persons' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#persons">Состав</a>
</li>
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'department', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'department' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#department">Кафедры факультета</a>
</li>
<li class="anchor-li">
<a :class="{ 'translate-x-2 text-primary-light' : currentNavSection === 'description', 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'description' }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
href="#description">Описание</a>
</li>
<transition name="fade">
<li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop">
<button class="bg-transperant text-gray-600 cursor-pointer hover:text-gray-900 duration-300 block px-2 leading-[1.6] rounded-md">К началу</button>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[17px] text-gray-600">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 11.25l-3-3m0 0l-3 3m3-3v7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</li>
</transition>
</ul>
</div>
</nav>
<article class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style="">
<div class="space-y-5 md:space-y-5">
<div class="flex justify-between items-center mb-6">
<div class="flex w-full sm:items-center gap-x-5 sm:gap-x-3">
<div class="grow">
<div class="grid sm:flex sm:justify-between sm:items-center gap-2">
<FacultyItemBreadcrumbs :faculty-title="faculty.data.title" />
</div>
</div>
</div>
</div>
<div class="space-y-3">
<h1 class="text-2xl mb-10 font-bold md:text-3xl">{{ faculty.data.title }}</h1>
</div>
<div id="page-area" class="space-y-5 md:space-y-5">
<h2 id="persons" class="font-bold text-xl">Состав</h2>
<template v-for="worker in faculty.data.workers"> <!-- End FAQ -->
<FacultyWorkerCard :worker="worker" />
</template>
<!-- End FAQ -->
<h2 id="department" class="font-bold text-xl">Кафедры факультета</h2> <h2 id="department" class="font-bold text-xl">Кафедры факультета</h2>
<!-- Card Section --> <!-- Card Section -->
<!-- Grid --> <!-- Grid -->
<div class="grid sm:grid-cols-2 md:grid-cols-2 xl:grid-cols-2 gap-3 sm:gap-6"> <div class="grid sm:grid-cols-2 md:grid-cols-2 xl:grid-cols-2 gap-3 sm:gap-6">
<template v-for="department in faculty.data.departments"> <template v-for="department in faculty.data.departments">
<Link :href="route('client.department.show', { facultySlug: faculty.data.slug, departmentSlug: department.slug })" class="flex justify-center items-center bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition"> <Link :href="route('client.department.show', { facultySlug: faculty.data.slug, departmentSlug: department.slug })" class="flex justify-center items-center bg-white border shadow-sm rounded-xl hover:shadow-md focus:outline-none focus:shadow-md transition">
<div class="p-4 md:p-5"> <div class="p-4 md:p-5">
<div class="flex justify-between items-center gap-x-3"> <div class="flex justify-between items-center gap-x-3">
<div class="grow"> <div class="grow">
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800"> <h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
{{ department.title }} {{ department.title }}
</h3> </h3>
</div> </div>
<div> <div>
<svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> <svg class="shrink-0 size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
</div> </div>
</div> </div>
</div> </div>
</Link> </Link>
</template> </template>
</div> </div>
<h2 id="description" class="font-bold text-xl">Описание</h2> <h2 id="description" class="font-bold text-xl">Описание</h2>
<div class="space-y-3 md:space-y-4"> <div class="space-y-3 md:space-y-4">
<Builder :blocks="faculty.data.content "/> <Builder :blocks="faculty.data.content "/>
</div> </div>
</div> </div>
</div> </div>
</article> </article>
</div> </div>
<BasicFooter />
</BasicPageWrapper>
<BasicFooter />
</div>
@@ -150,6 +148,17 @@ import BasicFooter from "@/footers/BasicFooter.vue";
import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue"; import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import MetaTags from "@/componentss/shared/SEO/MetaTags.vue"; import MetaTags from "@/componentss/shared/SEO/MetaTags.vue";
import FacultyItemBreadcrumbs from "@/componentss/features/faculties/components/FacultyItemBreadcrumbs.vue"; import FacultyItemBreadcrumbs from "@/componentss/features/faculties/components/FacultyItemBreadcrumbs.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
import NavigateVisor from "@/componentss/shared/visor/NavigateVisor.vue";
export default { export default {
@@ -174,6 +183,17 @@ export default {
}, },
components: { components: {
NavigateVisor,
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
MetaTags, MetaTags,
Builder, Builder,
BasicFooter, BasicFooter,
resources/js/Pages/Client/Persons/Show.vue
+39 -18
View File
@@ -1,30 +1,31 @@
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen">
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar>
<main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<NavigateLinks :header-navs="headerNavs" />
<section class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style=""> <BasicPageWrapper>
<div class="w-full mx-auto sm:px-6 lg:px-8"> <main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<PersonBreadcrumbs class="mb-4" :person-name="person.data.name" /> <NavigateLinks :header-navs="headerNavs" />
<section class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style="">
<div class="w-full mx-auto sm:px-6 lg:px-8">
<PersonBreadcrumbs class="mb-4" :person-name="person.data.name" />
<InfoSection :person="person" />
</div>
</section>
</div>
</main>
<BasicFooter />
</BasicPageWrapper>
<InfoSection :person="person" />
</div>
</section>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
@@ -41,6 +42,16 @@ import NavigateLinks from "@/componentss/shared/navigate/NavigateLinks.vue";
import PersonBreadcrumbs from "@/componentss/features/persons/components/PersonBreadcrumbs.vue"; import PersonBreadcrumbs from "@/componentss/features/persons/components/PersonBreadcrumbs.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import InfoSection from "@/componentss/features/persons/components/sections/InfoSection.vue"; import InfoSection from "@/componentss/features/persons/components/sections/InfoSection.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
export default { export default {
@@ -63,6 +74,16 @@ export default {
}, },
components: { components: {
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
InfoSection, InfoSection,
BasicFooter, BasicFooter,
NavigateLinks, NavigateLinks,
resources/js/Pages/Client/Posts/Index.vue
+49 -63
View File
@@ -13,9 +13,16 @@ import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue"; import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import TagFilter from "@/componentss/shared/filter/filters/TagFilter.vue"; import TagFilter from "@/componentss/shared/filter/filters/TagFilter.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue"; import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
EventListSearch, IsOnlineFilter, BasicPagination, EventArchiveListBreadcrumbs, BasicPageWrapper, BasicPageContainer,
BasicListBadge, BasicListBadge,
TagFilter, TagFilter,
CategoryFilter, CategoryFilter,
@@ -73,72 +80,51 @@ export default {
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar>
<div class="flex flex-col h-screen">
<main class="flex-grow"> <BasicPageWrapper>
<div class="relative mx-auto mt-[67px] max-w-screen-xl py-10 md:flex md:flex-row md:py-10"> <BasicPageContainer>
<div class="pt-6 px-4 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-lg"> <div class="max-w-2xl text-center mx-auto mb-10 lg:mb-14">
<div class="max-w-2xl text-center mx-auto mb-10 lg:mb-14"> <h2 class="text-2xl font-bold md:text-4xl md:leading-tight dark:text-white">Новости НТГСПИ</h2>
<h2 class="text-2xl font-bold md:text-4xl md:leading-tight dark:text-white">Новости НТГСПИ</h2> <p class="mt-1 text-gray-600 dark:text-neutral-400">Узнайте последние новости любимого вуза</p>
<p class="mt-1 text-gray-600 dark:text-neutral-400">Узнайте последние новости любимого вуза</p> </div>
</div> <PostListBreadcrumbs :breadcrumbs="breadcrumbs" />
<PostListBreadcrumbs :breadcrumbs="breadcrumbs" /> <div>
<div> <HeadItemsWrapper>
<HeadItemsWrapper> <PostListSearch :search_filter="filters.search_filter" />
<PostListSearch :search_filter="filters.search_filter" /> <BasicListFilter>
<BasicListFilter> <SortingByFilter :sortingBy_filter="filters.sortingBy_filter" />
<SortingByFilter :sortingBy_filter="filters.sortingBy_filter" /> <CategoryFilter :categories="categories" :category_filter="filters.category_filter" />
<CategoryFilter :categories="categories" :category_filter="filters.category_filter" /> <TagFilter :tags="tags" :tag_filter="filters.tag_filter" />
<TagFilter :tags="tags" :tag_filter="filters.tag_filter" /> </BasicListFilter>
</BasicListFilter> </HeadItemsWrapper>
</HeadItemsWrapper>
<div> <div>
<h3 class="text-sm text-gray-500 mb-4">Найдено новостей: {{ posts.meta.total }}</h3> <h3 class="text-sm text-gray-500 mb-4">Найдено новостей: {{ posts.meta.total }}</h3>
<div v-if="hasActiveFilters" class="flex-wrap flex gap-3 md:items-center"> <div v-if="hasActiveFilters" class="flex-wrap flex gap-3 md:items-center">
<BasicListBadge :filters="filters" /> <BasicListBadge :filters="filters" />
</div> </div>
</div> </div>
<div class="space-y-5 md:space-y-4"> <div class="space-y-5 md:space-y-4">
<div class="space-y-5 md:space-y-4"> <div class="space-y-5 md:space-y-4">
<div> <div>
<div class="container mx-auto max-w-screen-lg py-5 lg:py-8"> <div class="container mx-auto max-w-screen-lg py-5 lg:py-8">
<div class="grid gap-10 md:grid-cols-2 lg:gap-10 xl:grid-cols-3"> <div class="grid gap-10 md:grid-cols-2 lg:gap-10 xl:grid-cols-3">
<template v-for="post in posts.data" :key="post.id"> <template v-for="post in posts.data" :key="post.id">
<PostListItem :post="post" /> <PostListItem :post="post" />
</template> </template>
</div> </div>
<div class="mt-10 flex items-center justify-center"> <BasicPagination :links="posts.links" />
<nav class="isolate inline-flex -space-x-px rounded-md shadow-sm" aria-label="Pagination"> </div>
<Link as="button" :href="posts.links.prev" :disabled="$props.posts.links.prev === null" </div>
class="relative inline-flex items-center gap-1 rounded-l-md border border-gray-300 bg-white px-3 py-2 pr-4 text-sm font-medium text-gray-500 hover:bg-gray-50 focus:z-20 disabled:pointer-events-none disabled:opacity-40 dark:border-gray-500 dark:bg-gray-800 dark:text-gray-300"> </div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" </div>
stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-3 w-3"> <!-- End Content -->
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5"></path> </div>
</svg> </BasicPageContainer>
<span>Предыдущая</span></Link> <BasicFooter />
<Link as="button" :href="posts.links.next" :disabled="$props.posts.links.next === null" </BasicPageWrapper>
class="relative inline-flex items-center gap-1 rounded-r-md border border-gray-300 bg-white px-3 py-2 pl-4 text-sm font-medium text-gray-500 hover:bg-gray-50 focus:z-20 disabled:pointer-events-none disabled:opacity-40 dark:border-gray-500 dark:bg-gray-800 dark:text-gray-300">
<span>Следующая</span>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" aria-hidden="true" data-slot="icon" class="h-3 w-3">
<path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5"></path>
</svg>
</Link>
</nav>
</div>
</div>
</div>
</div>
</div>
<!-- End Content -->
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style scoped></style> <style scoped></style>
resources/js/Pages/Client/Posts/Show.vue
+52 -41
View File
@@ -11,11 +11,31 @@ import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import MainPageNavBar from "@/Navbars/MainPageNavbar.vue"; import MainPageNavBar from "@/Navbars/MainPageNavbar.vue";
import MetaTags from "@/componentss/shared/SEO/MetaTags.vue"; import MetaTags from "@/componentss/shared/SEO/MetaTags.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
export default { export default {
name: "Show", name: "Show",
components: { components: {
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
MetaTags, MetaTags,
MainPageNavBar, MainPageNavBar,
BasicFooter, BasicFooter,
@@ -64,50 +84,41 @@ export default {
<ScrollTimeline /> <ScrollTimeline />
<MainPageNavBar class="border-b" :sections="$page.props.navigation"></MainPageNavBar> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen"> <BasicPageWrapper>
<main class="flex-grow"> <BasicPageContainer breakpoint="md">
<div class="relative mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <div class="space-y-5 md:space-y-10">
<div class="max-w-3xl lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full"> <div class="space-y-3">
<div> <BackButton link="client.post.index" title="Все новости"/>
<div class="space-y-5 md:space-y-10"> <PostItemBreadcrumbs :breadcrumbs="breadcrumbs" :post-title="post.data.title" />
<div class="space-y-3"> <BasicTitle :header="post.data.title"/>
<PostItemBreadcrumbs :breadcrumbs="breadcrumbs" :post-title="post.data.title" /> </div>
<BackButton link="client.post.index" title="Все новости"/>
<BasicTitle :header="post.data.title"/>
</div>
<div class="flex space-x-3 text-gray-500 "> <div class="flex space-x-3 text-gray-500 ">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="md:flex md:items-center space-y-2 md:space-y-0 md:space-x-4 text-sm"> <div class="md:flex md:items-center space-y-2 md:space-y-0 md:space-x-4 text-sm">
<PostAuthorsList :authors="post.data.authors"/> <PostAuthorsList :authors="post.data.authors"/>
<time class="block text-gray-500">Опубликовано {{ post.data.created_post }} <time class="block text-gray-500">Опубликовано {{ post.data.created_post }}
</time> </time>
<PostTimeRead :time="post.data.reading_time"/> <PostTimeRead :time="post.data.reading_time"/>
</div> </div>
</div> </div>
</div> </div>
<Builder :blocks="blocks"/> <Builder :blocks="blocks"/>
<div> <div>
<PostGallery v-if="post.data.gallery.length > 1" :title="post.data.title" :images="post.data.gallery"/> <PostGallery v-if="post.data.gallery.length > 1" :title="post.data.title" :images="post.data.gallery"/>
</div> </div>
<div> <div>
<a :href="route('client.post.index', { 'tag[]': tag.slug })" v-for="tag in post.data.tags" class="m-1 inline-flex items-center gap-1.5 py-2 px-3 rounded-full text-sm bg-gray-100 text-gray-800 hover:bg-gray-200 focus:outline-none focus:bg-gray-200 dark:bg-neutral-800 dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#"> <a :href="route('client.post.index', { 'tag[]': tag.slug })" v-for="tag in post.data.tags" class="m-1 inline-flex items-center gap-1.5 py-2 px-3 rounded-full text-sm bg-gray-100 text-gray-800 hover:bg-gray-200 focus:outline-none focus:bg-gray-200 dark:bg-neutral-800 dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" href="#">
{{ tag.name }} {{ tag.name }}
</a> </a>
</div> </div>
</div> </div>
</BasicPageContainer>
</div> <BasicFooter />
</div> </BasicPageWrapper>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
<style> <style>
resources/js/Pages/Client/Programs/Index.vue
+51 -53
View File
@@ -10,10 +10,15 @@ import MetaTags from "@/componentss/shared/SEO/MetaTags.vue";
import ProgramListBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramListBreadcrumbs.vue"; import ProgramListBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramListBreadcrumbs.vue";
import BasicFooter from "@/footers/BasicFooter.vue"; import BasicFooter from "@/footers/BasicFooter.vue";
import ProgramLevelEduFilter from "@/componentss/features/educationalPrograms/components/ProgramLevelEduFilter.vue"; import ProgramLevelEduFilter from "@/componentss/features/educationalPrograms/components/ProgramLevelEduFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import AcademicJournalsListBreadcrumbs
from "@/componentss/features/academicJournals/components/AcademicJournalsListBreadcrumbs.vue.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
export default { export default {
name: "Index", name: "Index",
components: { components: {
BasicPageWrapper, AcademicJournalsListBreadcrumbs, BasicPageContainer,
ProgramLevelEduFilter, ProgramLevelEduFilter,
FormEducationalFilter, FormEducationalFilter,
DirectionFilter, DirectionFilter,
@@ -86,60 +91,53 @@ export default {
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<BasicPageWrapper>
<BasicPageContainer>
<div class="space-y-5 md:space-y-4">
<ProgramTitle class="text-center" :header="this.campaignName" />
<div class="space-y-5 md:space-y-4 mx-auto max-w-3xl w-full">
<div>
<div class="">
<div class="my-10 w-full">
<ProgramListBreadcrumbs />
<div class="flex items-center gap-x-2">
<ProgramLevelEduFilter :levels="levelsEducational" :level_filter="filters.level_filter" />
<BasicListFilter>
<BudgetFilter :budget_filter="filters.budget_filter" :budgets="budgetEdu" />
<DirectionFilter :direction_studies="direction_studies" :direction_filter="filters.direction_filter" />
<FormEducationalFilter :formEdu_filter="filters.formEdu_filter" :forms="formsEdu" />
</BasicListFilter>
</div>
</div>
</div>
<div class="container py-5 lg:py-4">
<div class="w-full mx-auto flex flex-wrap lg:justify-between">
<template v-for="naprs in transformToColumns(this.naprs.data)">
<div class="flex flex-col">
<template v-for="napr in naprs">
<div style="height: max-content" class="px-4">
<h1 class="text-brand-primary mb-2 mt-2 text-lg font-semibold upper tracking-tight dark:text-white lg:text-md lg:leading-tight">
{{ napr.name }}
</h1>
<template v-for="program in napr.programs" :key="program.id">
<Link
class="block text-primary hover:text-primary-hover duration-200 text-sm underline underline-offset-2 py-1"
:href="route('client.program.show', program.slug)">{{ program.name }}
</Link>
</template>
</div>
</template>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
</BasicPageContainer>
<BasicFooter />
</BasicPageWrapper>
<div class="flex flex-col h-screen">
<main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:py-10">
<div class="">
<div class="">
<div class="space-y-5 md:space-y-4">
<ProgramTitle class="text-center" :header="this.campaignName" />
<div class="space-y-5 md:space-y-4 mx-auto max-w-3xl w-full">
<div>
<div class="">
<div class="my-10 w-full">
<ProgramListBreadcrumbs />
<div class="flex items-center gap-x-2">
<ProgramLevelEduFilter :levels="levelsEducational" :level_filter="filters.level_filter" />
<BasicListFilter>
<BudgetFilter :budget_filter="filters.budget_filter" :budgets="budgetEdu" />
<DirectionFilter :direction_studies="direction_studies" :direction_filter="filters.direction_filter" />
<FormEducationalFilter :formEdu_filter="filters.formEdu_filter" :forms="formsEdu" />
</BasicListFilter>
</div>
</div>
</div>
<div class="container py-5 lg:py-4">
<div class="w-full mx-auto flex flex-wrap lg:justify-between">
<template v-for="naprs in transformToColumns(this.naprs.data)">
<div class="flex flex-col">
<template v-for="napr in naprs">
<div style="height: max-content" class="px-4">
<h1 class="text-brand-primary mb-2 mt-2 text-lg font-semibold upper tracking-tight dark:text-white lg:text-md lg:leading-tight">
{{ napr.name }}
</h1>
<template v-for="program in napr.programs" :key="program.id">
<Link
class="block text-primary hover:text-primary-hover duration-200 text-sm underline underline-offset-2 py-1"
:href="route('client.program.show', program.slug)">{{ program.name }}
</Link>
</template>
</div>
</template>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
resources/js/Pages/Client/Programs/Show.vue
+135 -154
View File
@@ -11,6 +11,8 @@ import ProgramItemBreadcrumbs from "@/componentss/features/educationalPrograms/c
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue"; import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
import BudgetEducation from "@/Enum/BudgetEducation.js"; import BudgetEducation from "@/Enum/BudgetEducation.js";
import TypeExam from "@/Enum/TypeExam.js"; import TypeExam from "@/Enum/TypeExam.js";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
export default { export default {
@@ -47,6 +49,8 @@ export default {
} }
}, },
components: { components: {
BasicPageContainer,
BasicPageWrapper,
ProgramTitle, ProgramTitle,
BasicTitle, BasicTitle,
MetaTags, MetaTags,
@@ -76,169 +80,146 @@ export default {
<MainPageNavBar class="border-b" :sections="$page.props.navigation" /> <MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="flex flex-col h-screen"> <BasicPageWrapper>
<main class="flex-grow"> <BasicPageContainer>
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10"> <div class="space-y-3">
<div class="px-0 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-2xl"> <BackButton link="client.program.index" title="Все программы" />
<div> <ProgramItemBreadcrumbs :program-title="program.data.name" />
<ProgramTitle class="text-center" :header="program.data.name" />
</div>
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<div class="grid sm:grid-cols-2 lg:grid-cols-3 items-start gap-12">
<!-- Icon Block -->
<div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" />
</svg>
</div>
<div class="space-y-5 md:space-y-4"> <div class="mt-3">
<div class="space-y-5 md:space-y-4"> <h3 class="text-lg font-semibold text-gray-800">Направление подготовки</h3>
<p class="mt-1 text-gray-600">{{ program.data.directionStudy.name }} {{ program.data.directionStudy.code }}</p>
</div>
</div>
<!-- End Icon Block -->
<div> <!-- Icon Block -->
<div class="container mx-auto xl:px-5 max-w-screen-lg py-5 lg:py-8"> <div class="text-center">
<div class="space-y-3"> <div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<BackButton link="client.program.index" title="Все программы" /> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<ProgramItemBreadcrumbs :program-title="program.data.name" /> <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" />
<ProgramTitle class="text-center" :header="program.data.name" /> </svg>
</div>
<div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Срок обучения</h3>
<template v-for="data in program.data.learning_forms">
<p class="mt-1 text-gray-600">{{ data.period_data }} <span class="text-gray-400 text-[12px]">({{ data.form_edu }})</span> </p>
</template>
</div>
</div>
<!-- End Icon Block -->
</div> <!-- Icon Block -->
<div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z" />
</svg>
</div>
<div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Количество мест на прием</h3>
<template v-for="admissionPlan in program.data.admissionPlans">
<template v-for="(contests, form) in groupContestsByFormEducation(admissionPlan.contests)">
<div class="border rounded my-2 py-1">
<span class="text-gray-500 text-[14px]">{{ EducationForm.fromValue(form).label }}</span>
<template v-for="contest in contests">
<p class="mt-1 text-gray-600"> {{ contest.places.count }} мест <span class="text-gray-400 text-[12px]">{{ BudgetForm.fromValue(contest.places.form_budget).label }}</span></p>
</template>
<!-- Icon Blocks --> </div>
<div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto"> </template>
<div class="grid sm:grid-cols-2 lg:grid-cols-3 items-start gap-12"> </template>
<!-- Icon Block --> </div>
<div class="text-center"> </div>
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> <!-- End Icon Block -->
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6"> </div>
<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" /> </div>
</svg> <div>
</div> <div class="hs-accordion-group">
<div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-one">
<div class="mt-3"> <button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-two">
<h3 class="text-lg font-semibold text-gray-800">Направление подготовки</h3> <svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<p class="mt-1 text-gray-600">{{ program.data.directionStudy.name }} {{ program.data.directionStudy.code }}</p> <path d="M5 12h14"></path>
</div> <path d="M12 5v14"></path>
</div> </svg>
<!-- End Icon Block --> <svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path>
<!-- Icon Block --> </svg>
<div class="text-center"> Условия поступления
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto"> </button>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6"> <div id="hs-basic-bordered-collapse-two" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-two">
<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" /> <div class="pb-4 px-5">
</svg> <ol class="list-decimal list-inside">
</div> <template v-for="admissionPlan in program.data.admissionPlans">
<div class="mt-3"> <template v-for="(exams, priority) in groupExamsByPriority(admissionPlan.exams)">
<h3 class="text-lg font-semibold text-gray-800">Срок обучения</h3> <li>
<template v-for="data in program.data.learning_forms"> <template v-for="(exam, index) in exams">
<p class="mt-1 text-gray-600">{{ data.period_data }} <span class="text-gray-400 text-[12px]">({{ data.form_edu }})</span> </p> {{ exam.title }}
</template> <span v-for="ex in exam.types" class="text-gray-400 text-[14px]">
</div>
</div>
<!-- End Icon Block -->
<!-- Icon Block -->
<div class="text-center">
<div class="flex justify-center items-center size-12 bg-gray-50 border border-gray-200 rounded-full mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z" />
</svg>
</div>
<div class="mt-3">
<h3 class="text-lg font-semibold text-gray-800">Количество мест на прием</h3>
<template v-for="admissionPlan in program.data.admissionPlans">
<template v-for="(contests, form) in groupContestsByFormEducation(admissionPlan.contests)">
<div class="border rounded my-2 py-1">
<span class="text-gray-500 text-[14px]">{{ EducationForm.fromValue(form).label }}</span>
<template v-for="contest in contests">
<p class="mt-1 text-gray-600"> {{ contest.places.count }} мест <span class="text-gray-400 text-[12px]">{{ BudgetForm.fromValue(contest.places.form_budget).label }}</span></p>
</template>
</div>
</template>
</template>
</div>
</div>
<!-- End Icon Block -->
</div>
</div>
<div>
<div class="hs-accordion-group">
<div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-one">
<button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-two">
<svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path>
<path d="M12 5v14"></path>
</svg>
<svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path>
</svg>
Условия поступления
</button>
<div id="hs-basic-bordered-collapse-two" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-two">
<div class="pb-4 px-5">
<ol class="list-decimal list-inside">
<template v-for="admissionPlan in program.data.admissionPlans">
<template v-for="(exams, priority) in groupExamsByPriority(admissionPlan.exams)">
<li>
<template v-for="(exam, index) in exams">
{{ exam.title }}
<span v-for="ex in exam.types" class="text-gray-400 text-[14px]">
({{ TypeExam.fromValue(ex.type).label }}, минимальный балл: {{ ex.min_ball }}) ({{ TypeExam.fromValue(ex.type).label }}, минимальный балл: {{ ex.min_ball }})
</span> </span>
<span class="text-gray-400 text-[14px] uppercase" v-if="index !== exams.length - 1"><br> или </span> <span class="text-gray-400 text-[14px] uppercase" v-if="index !== exams.length - 1"><br> или </span>
</template> </template>
</li> </li>
</template> </template>
</template> </template>
</ol> </ol>
</div> </div>
</div> </div>
</div> </div>
<div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-two"> <div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-two">
<button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-two"> <button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-two">
<svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path> <path d="M5 12h14"></path>
<path d="M12 5v14"></path> <path d="M12 5v14"></path>
</svg> </svg>
<svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path> <path d="M5 12h14"></path>
</svg> </svg>
О программе О программе
</button> </button>
<div id="hs-basic-bordered-collapse-two" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-two"> <div id="hs-basic-bordered-collapse-two" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-two">
<div class="pb-4 px-5"> <div class="pb-4 px-5">
<Builder :blocks="program.data.about_program" /> <Builder :blocks="program.data.about_program" />
</div> </div>
</div> </div>
</div> </div>
<div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-three"> <div class="hs-accordion bg-white border -mt-px first:rounded-t-lg last:rounded-b-lg" id="hs-bordered-heading-three">
<button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-three"> <button class="hs-accordion-toggle hs-accordion-active:text-primary inline-flex items-center gap-x-3 w-full font-semibold text-start text-gray-800 py-4 px-5 hover:text-gray-500 disabled:opacity-50 disabled:pointer-events-none" aria-controls="hs-basic-bordered-collapse-three">
<svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="hs-accordion-active:hidden block size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path> <path d="M5 12h14"></path>
<path d="M12 5v14"></path> <path d="M12 5v14"></path>
</svg> </svg>
<svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="hs-accordion-active:block hidden size-3.5" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 12h14"></path> <path d="M5 12h14"></path>
</svg> </svg>
Особенности программы Особенности программы
</button> </button>
<div id="hs-basic-bordered-collapse-three" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-three"> <div id="hs-basic-bordered-collapse-three" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" aria-labelledby="hs-bordered-heading-three">
<div class="pb-4 px-5"> <div class="pb-4 px-5">
<Builder :blocks="program.data.program_features" /> <Builder :blocks="program.data.program_features" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- End Icon Blocks --> </BasicPageContainer>
<BasicFooter />
</BasicPageWrapper>
</div>
</div>
</div>
</div>
<!-- End Content -->
</div>
</div>
</div>
</main>
<BasicFooter />
</div>
</template> </template>
resources/js/Pages/Page.vue
+38 -17
View File
@@ -1,26 +1,27 @@
<template> <template>
<MetaTags :seo="seo" /> <MetaTags :seo="seo" />
<div class="flex flex-col h-screen justify-between">
<MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<MainPageNavBar class="border-b" :sections="$page.props.navigation" />
<div class="relative mx-auto mb-auto mt-[67px] max-w-screen-xl w-full px-4 py-10 md:flex md:flex-row md:py-10"> <BasicPageWrapper>
<PageSubSectionLinks v-if="!settings?.hide_page_sub_section_links" :sub-section-pages="subSectionPages" :current-section="page.data.section"/> <div class="relative mx-auto mb-auto mt-[67px] max-w-screen-xl w-full px-4 py-10 md:flex md:flex-row md:py-10">
<NavigateLinks v-if="!settings?.hide_page_navigate_links" :header-navs="headerNavs"/> <PageSubSectionLinks v-if="!settings?.hide_page_sub_section_links" :sub-section-pages="subSectionPages" :current-section="page.data.section"/>
<div class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style=""> <NavigateLinks v-if="!settings?.hide_page_navigate_links" :header-navs="headerNavs"/>
<div class="space-y-5 md:space-y-5"> <div class="w-full min-w-0 mt-1 max-w-6xl px-1 md:px-6" style="">
<PageBreadcrumbs v-if="!settings?.hide_breadcrumbs" :breadcrumbs="breadcrumbs" :page-title="page.data.title"/> <div class="space-y-5 md:space-y-5">
<BasicTitle :header="page.data.title"/> <PageBreadcrumbs v-if="!settings?.hide_breadcrumbs" :breadcrumbs="breadcrumbs" :page-title="page.data.title"/>
<div id="page-area"> <BasicTitle :header="page.data.title"/>
<Builder :blocks="page.data.content"/> <div id="page-area">
</div> <Builder :blocks="page.data.content"/>
</div> </div>
</div> </div>
</div> </div>
</div>
<BasicFooter />
</BasicPageWrapper>
<BasicFooter />
</div>
</template> </template>
@@ -37,6 +38,16 @@ import BasicTitle from "@/componentss/ui/titles/BasicTitle.vue";
import PageSubSectionLinks from "@/componentss/features/pages/components/PageSubSectionLinks.vue"; import PageSubSectionLinks from "@/componentss/features/pages/components/PageSubSectionLinks.vue";
import PageBreadcrumbs from "@/componentss/features/pages/components/PageBreadcrumbs.vue"; import PageBreadcrumbs from "@/componentss/features/pages/components/PageBreadcrumbs.vue";
import NavigateLinks from "@/componentss/shared/navigate/NavigateLinks.vue"; import NavigateLinks from "@/componentss/shared/navigate/NavigateLinks.vue";
import CategoryFilter from "@/componentss/shared/filter/filters/CategoryFilter.vue";
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
import BasicListBadge from "@/componentss/shared/badge/BasicListBadge.vue";
import EventArchiveListBreadcrumbs from "@/componentss/features/events/components/EventArchiveListBreadcrumbs.vue";
import BasicPagination from "@/componentss/shared/paginate/BasicPagination.vue";
import IsOnlineFilter from "@/componentss/shared/filter/filters/IsOnlineFilter.vue";
import BasicListFilter from "@/componentss/shared/filter/BasicListFilter.vue";
import EventListSearch from "@/componentss/features/events/components/EventListSearch.vue";
import SortingByFilter from "@/componentss/shared/filter/filters/SortingByFilter.vue";
export default { export default {
@@ -70,6 +81,16 @@ export default {
} }
}, },
components: { components: {
SortingByFilter,
EventListSearch,
BasicListFilter,
IsOnlineFilter,
BasicPagination,
EventArchiveListBreadcrumbs,
BasicListBadge,
BasicPageWrapper,
BasicPageContainer,
CategoryFilter,
NavigateLinks, NavigateLinks,
BasicTitle, BasicTitle,
Builder, Builder,
resources/js/componentss/shared/builder/pageBuilder/blocks/HeadingBlock.vue
+1 -1
View File
@@ -1,6 +1,6 @@
<template> <template>
<div > <div >
<h2 :id="generateSlug(block.data.content)" class="font-bold text-xl">{{ block.data.content }}</h2> <h2 :id="'anchor-link-' + generateSlug(block.data.content)" class="font-bold text-xl">{{ block.data.content }}</h2>
</div> </div>
</template> </template>
resources/js/componentss/shared/navigate/NavigateLinks.vue
+5 -13
View File
@@ -1,14 +1,13 @@
<template> <template>
<div class="w-full h-[67px] fixed pointer-events-none bvi-no-styles" id="visor"></div> <NavigateVisor />
<nav class="order-last hidden w-56 shrink-0 lg:block"> <nav class="order-last hidden w-56 shrink-0 lg:block">
<div v-if="headerNavs.length > 0" class="sticky top-[100px] h-[calc(100vh-121px)]"> <div v-if="headerNavs.length > 0" class="sticky top-[100px] h-[calc(100vh-121px)]">
<div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div> <div class="text-gray-1000 mb-2 text-md font-medium">На этой странице</div>
<ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm"> <ul class="max-h-[70vh] space-y-1.5 overflow-hidden py-2 text-sm">
<li class="anchor-li" v-for="pageNav in headerNavs" :key="pageNav.id"> <li class="anchor-li" v-for="pageNav in headerNavs" :key="pageNav.id">
<a :class="{ 'translate-x-2 text-primary' : currentNavSection === generateSlug(pageNav.text), 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== generateSlug(pageNav.text) }" <a :class="{ 'translate-x-2 text-primary' : currentNavSection === 'anchor-link-' + generateSlug(pageNav.text), 'bg-transperant text-gray-600 hover:text-gray-900' : currentNavSection !== 'anchor-link-' + generateSlug(pageNav.text) }"
class="duration-150 block py-1 px-2 leading-[1.6] rounded-md" class="duration-150 block py-1 px-2 leading-[1.6] rounded-md"
:href="'#' + generateSlug(pageNav.text)">{{ pageNav.text }}</a> :href="'#anchor-link-' + generateSlug(pageNav.text)">{{ pageNav.text }}</a>
</li> </li>
<transition name="fade"> <transition name="fade">
<li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop"> <li class="anchor-li flex items-center py-2 border-t" v-if="scrollTop" @click.prevent="scrollToTop">
@@ -28,10 +27,11 @@
<script> <script>
import { Link } from "@inertiajs/vue3"; import { Link } from "@inertiajs/vue3";
import slugify from "slugify"; import slugify from "slugify";
import NavigateVisor from "@/componentss/shared/visor/NavigateVisor.vue";
export default { export default {
name: "NavigateLinks", name: "NavigateLinks",
components: { Link }, components: {NavigateVisor, Link },
data() { data() {
return { return {
currentNavSection: null, currentNavSection: null,
@@ -39,14 +39,6 @@ export default {
}; };
}, },
methods: { methods: {
textLimit(text, symbols) {
if (text.length > symbols) {
let LimitedText;
LimitedText = text.substring(0, symbols);
return LimitedText + "...";
}
return text;
},
generateSlug(text) { generateSlug(text) {
return slugify(text, { return slugify(text, {
lower: true, lower: true,
resources/js/componentss/shared/visor/NavigateVisor.vue
+15
View File
@@ -0,0 +1,15 @@
<script>
export default {
name: "NavigateVisor"
}
</script>
<template>
<div class="w-full h-[67px] pointer-events-none fixed" id="visor" />
</template>
<style scoped>
</style>
resources/js/componentss/ui/templates/BasicPageContainer.vue
+27
View File
@@ -0,0 +1,27 @@
<template>
<main class="flex-grow">
<div class="relative mb-auto mx-auto mt-[67px] max-w-screen-xl px-4 py-10 md:flex md:flex-row md:py-10">
<div class="px-0 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto w-full max-w-screen-2xl">
<div>
<div :class="'max-w-screen-' + breakpoint" class="container mx-auto xl:px-5">
<slot/>
</div>
</div>
</div>
</div>
</main>
</template>
<script>
export default {
name: "BasicPageContainer",
props: {
breakpoint: {
type: String,
default: "lg"
}
}
}
</script>
resources/js/componentss/ui/wrappers/BasicPageWrapper.vue
+19
View File
@@ -0,0 +1,19 @@
<template>
<div class="flex flex-col h-screen">
<slot/>
</div>
</template>
<script>
import {Link} from "@inertiajs/vue3";
import BasicFooter from "@/footers/BasicFooter.vue";
import Builder from "@/componentss/shared/builder/pageBuilder/Builder.vue";
import BackButton from "@/componentss/ui/buttons/BackButton.vue";
import ProgramTitle from "@/componentss/features/educationalPrograms/components/ProgramTitle.vue";
import ProgramItemBreadcrumbs from "@/componentss/features/educationalPrograms/components/ProgramItemBreadcrumbs.vue";
export default {
name: "BasicPageWrapper",
}
</script>