fix bugs, added accordion type in tabs
This commit is contained in:
@@ -5,7 +5,6 @@ namespace App\Containers\Education\UI\API\Controllers;
|
|||||||
use App\Http\Controllers\Controller;
|
use App\Http\Controllers\Controller;
|
||||||
use App\Jobs\CreateDirectionStudy;
|
use App\Jobs\CreateDirectionStudy;
|
||||||
use App\Jobs\CreateEducationalProgram;
|
use App\Jobs\CreateEducationalProgram;
|
||||||
use App\Services\Vicon\EducationalProgram\EducationalProgramService;
|
|
||||||
|
|
||||||
class UpdateEduDataApiController extends Controller
|
class UpdateEduDataApiController extends Controller
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -9,7 +9,9 @@ use Filament\Forms\Components\Builder;
|
|||||||
use Filament\Forms\Components\FileUpload;
|
use Filament\Forms\Components\FileUpload;
|
||||||
use Filament\Forms\Components\Hidden;
|
use Filament\Forms\Components\Hidden;
|
||||||
use Filament\Forms\Components\Repeater;
|
use Filament\Forms\Components\Repeater;
|
||||||
|
use Filament\Forms\Components\Section;
|
||||||
use Filament\Forms\Components\TextInput;
|
use Filament\Forms\Components\TextInput;
|
||||||
|
use Filament\Forms\Components\Toggle;
|
||||||
use Illuminate\Support\Carbon;
|
use Illuminate\Support\Carbon;
|
||||||
use Illuminate\Support\Str;
|
use Illuminate\Support\Str;
|
||||||
use Livewire\Features\SupportFileUploads\TemporaryUploadedFile;
|
use Livewire\Features\SupportFileUploads\TemporaryUploadedFile;
|
||||||
@@ -20,6 +22,9 @@ class TabBlock implements BlockSchema
|
|||||||
public static function schema(): array
|
public static function schema(): array
|
||||||
{
|
{
|
||||||
return [
|
return [
|
||||||
|
Section::make()->schema([
|
||||||
|
Toggle::make('settings.is_accordion')->label('Выводить вкладки в виде аккордиона')->default(false),
|
||||||
|
]),
|
||||||
Repeater::make('tab')
|
Repeater::make('tab')
|
||||||
->label('Вкладки')
|
->label('Вкладки')
|
||||||
->helperText('Добавьте вкладки с контентом')
|
->helperText('Добавьте вкладки с контентом')
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ namespace App\Jobs;
|
|||||||
|
|
||||||
use App\Containers\Education\Models\DirectionStudy;
|
use App\Containers\Education\Models\DirectionStudy;
|
||||||
use App\Services\Vicon\DirectionStudy\DirectionStudyService;
|
use App\Services\Vicon\DirectionStudy\DirectionStudyService;
|
||||||
|
use App\Ship\Enums\Education\LevelEducational;
|
||||||
use Illuminate\Bus\Queueable;
|
use Illuminate\Bus\Queueable;
|
||||||
use Illuminate\Contracts\Queue\ShouldQueue;
|
use Illuminate\Contracts\Queue\ShouldQueue;
|
||||||
use Illuminate\Foundation\Bus\Dispatchable;
|
use Illuminate\Foundation\Bus\Dispatchable;
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ namespace App\Jobs;
|
|||||||
use App\Containers\Education\Models\DirectionStudy;
|
use App\Containers\Education\Models\DirectionStudy;
|
||||||
use App\Containers\Education\Models\EducationalProgram;
|
use App\Containers\Education\Models\EducationalProgram;
|
||||||
use App\Services\Vicon\EducationalProgram\EducationalProgramService;
|
use App\Services\Vicon\EducationalProgram\EducationalProgramService;
|
||||||
|
use App\Ship\Enums\Education\LevelEducational;
|
||||||
use Illuminate\Bus\Queueable;
|
use Illuminate\Bus\Queueable;
|
||||||
use Illuminate\Contracts\Queue\ShouldQueue;
|
use Illuminate\Contracts\Queue\ShouldQueue;
|
||||||
use Illuminate\Foundation\Bus\Dispatchable;
|
use Illuminate\Foundation\Bus\Dispatchable;
|
||||||
|
|||||||
@@ -7,10 +7,14 @@ import DivisionListBreadcrumbs from "@/componentss/features/divisions/components
|
|||||||
import BasicFooter from "@/footers/BasicFooter.vue";
|
import BasicFooter from "@/footers/BasicFooter.vue";
|
||||||
import BreadcrumbsItem from "@/componentss/shared/Breadcrumbs/BreadcrumbsItem.vue";
|
import BreadcrumbsItem from "@/componentss/shared/Breadcrumbs/BreadcrumbsItem.vue";
|
||||||
import BaseBreadcrumbs from "@/componentss/shared/Breadcrumbs/BaseBreadcrumbs.vue";
|
import BaseBreadcrumbs from "@/componentss/shared/Breadcrumbs/BaseBreadcrumbs.vue";
|
||||||
|
import BasicPageWrapper from "@/componentss/ui/wrappers/BasicPageWrapper.vue";
|
||||||
|
import FacultyListTitle from "@/componentss/features/faculties/components/FacultyListTitle.vue";
|
||||||
|
import BasicPageContainer from "@/componentss/ui/templates/BasicPageContainer.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Index",
|
name: "Index",
|
||||||
components: {
|
components: {
|
||||||
|
BasicPageContainer, FacultyListTitle, BasicPageWrapper,
|
||||||
BaseBreadcrumbs, BreadcrumbsItem,
|
BaseBreadcrumbs, BreadcrumbsItem,
|
||||||
BasicFooter,
|
BasicFooter,
|
||||||
DivisionListTitle,
|
DivisionListTitle,
|
||||||
@@ -44,60 +48,40 @@ export default {
|
|||||||
|
|
||||||
<MainPageNavBar :sections="$page.props.navigation" />
|
<MainPageNavBar :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">
|
<DivisionListTitle
|
||||||
<div class="px-4 pt-6 lg:pt-10 pb-12 sm:px-6 lg:px-8 mx-auto">
|
bottom-text="Список структурных и административных отделов НТГСПИ"
|
||||||
<div>
|
header="Подразделения института" />
|
||||||
<!-- Avatar Media -->
|
<BaseBreadcrumbs :breadcrumbs="breadcrumbs">
|
||||||
<!-- End Avatar Media -->
|
<BreadcrumbsItem title="Подразделения института" :url="route('client.division.index')" />
|
||||||
<!-- Content -->
|
</BaseBreadcrumbs>
|
||||||
<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">
|
|
||||||
|
|
||||||
<DivisionListTitle
|
<!-- Grid -->
|
||||||
bottom-text="Список структурных и административных отделов НТГСПИ"
|
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6">
|
||||||
header="Подразделения института" />
|
<template v-for="division in divisions.data">
|
||||||
|
<Link :href="route('client.division.show', division.slug)" class="group flex 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 w-full">
|
||||||
|
<div class="flex justify-between items-center gap-x-3">
|
||||||
|
<div class="grow">
|
||||||
|
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
|
||||||
|
{{ division.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>
|
||||||
|
</Link>
|
||||||
|
</template>
|
||||||
|
|
||||||
<BaseBreadcrumbs :breadcrumbs="breadcrumbs">
|
</div>
|
||||||
<BreadcrumbsItem title="Подразделения института" :url="route('client.division.index')" />
|
</BasicPageContainer>
|
||||||
</BaseBreadcrumbs>
|
<BasicFooter />
|
||||||
|
</BasicPageWrapper>
|
||||||
|
|
||||||
<!-- Grid -->
|
|
||||||
<div class="grid sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-3 gap-3 sm:gap-6">
|
|
||||||
<template v-for="division in divisions.data">
|
|
||||||
<Link :href="route('client.division.show', division.slug)" class="group flex 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 w-full">
|
|
||||||
<div class="flex justify-between items-center gap-x-3">
|
|
||||||
<div class="grow">
|
|
||||||
<h3 class="group-hover:text-primary-hover font-semibold text-gray-800">
|
|
||||||
{{ division.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>
|
|
||||||
</Link>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
</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>
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
<div class="flex border rounded-lg px-4 py-2 items-center justify-between duration-300 hover:bg-gray-100">
|
<div class="flex border rounded-lg px-4 py-2 items-center justify-between duration-300 hover:bg-gray-100">
|
||||||
<div class="flex items-center justify-between">
|
<div class="flex items-center justify-between">
|
||||||
<div class="min-w-[30px] min-h-[30px] bg-[#303030] flex justify-center items-center rounded-md mr-2">
|
<div class="min-w-[30px] min-h-[30px] bg-[#303030] flex justify-center items-center rounded-md mr-2">
|
||||||
<BasicIcon :name="file.expansion" class="w-5 h-5 flex-shrink-0" />
|
<BasicIcon :name="file.expansion" class="w-5 h-5 text-white flex-shrink-0" />
|
||||||
</div>
|
</div>
|
||||||
<div>{{ textLimit(file.title, 70) }}</div>
|
<div>{{ textLimit(file.title, 70) }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,7 +1,27 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div v-if="block.data.settings?.is_accordion">
|
||||||
<div class="">
|
<div class="hs-accordion-group">
|
||||||
<nav class="-mb-0.5 flex justify-center gap-2 flex-wrap" aria-label="Tabs" role="tablist" aria-orientation="horizontal">
|
<div v-for="(tab, index) in block.data.tab" class="hs-accordion hs-accordion-active:border-gray-200 bg-white border border-transparent rounded-xl dark:hs-accordion-active:border-neutral-700 dark:bg-neutral-800 dark:border-transparent" id="hs-active-bordered-heading-one">
|
||||||
|
<button class="hs-accordion-toggle hs-accordion-active:text-blue-600 inline-flex justify-between 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 dark:hs-accordion-active:text-blue-500 dark:text-neutral-200 dark:hover:text-neutral-400 dark:focus:outline-hidden dark:focus:text-neutral-400" aria-expanded="false" aria-controls="hs-basic-active-bordered-collapse-one">
|
||||||
|
{{ tab.title }}
|
||||||
|
<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-active-bordered-collapse-one" class="hs-accordion-content hidden w-full overflow-hidden transition-[height] duration-300" role="region" aria-labelledby="hs-active-bordered-heading-one">
|
||||||
|
<div class="pb-4 px-5 text-gray-800">
|
||||||
|
<PageTabBuilder :blocks="tab.content" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<div class="-mb-0.5 flex justify-center gap-2 flex-wrap" aria-label="Tabs" role="tablist" aria-orientation="horizontal">
|
||||||
<button
|
<button
|
||||||
v-for="(tab, index) in block.data.tab" type="button"
|
v-for="(tab, index) in block.data.tab" 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"
|
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"
|
||||||
@@ -13,10 +33,8 @@
|
|||||||
:aria-controls="generateSlug(tab.title)" role="tab">
|
:aria-controls="generateSlug(tab.title)" role="tab">
|
||||||
{{ tab.title }}
|
{{ tab.title }}
|
||||||
</button>
|
</button>
|
||||||
</nav>
|
</div>
|
||||||
</div>
|
<div class="mt-3">
|
||||||
|
|
||||||
<div class="mt-3">
|
|
||||||
<template v-for="(tab, index) in block.data.tab">
|
<template v-for="(tab, index) in block.data.tab">
|
||||||
|
|
||||||
<div :id="generateSlug(tab.title)" :class="(activeTab === index) ? '' : 'hidden'"
|
<div :id="generateSlug(tab.title)" :class="(activeTab === index) ? '' : 'hidden'"
|
||||||
@@ -25,6 +43,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
Reference in New Issue
Block a user