229 lines
9.3 KiB
PHP
229 lines
9.3 KiB
PHP
<x-app-layout id="calendar">
|
|
|
|
<x-slot name="aside">
|
|
<h1>
|
|
{{ __('common.calendar') }}
|
|
</h1>
|
|
<div class="content aside-inset">
|
|
<form id="calendar-toggles"
|
|
class="drawers"
|
|
action="{{ route('calendar.index') }}"
|
|
method="get">
|
|
<details open>
|
|
<summary>
|
|
<span>{{ __('calendar.mine') }}</span>
|
|
<a href="{{ route('calendar.settings.create') }}"
|
|
hx-get="{{ route('calendar.settings.create') }}"
|
|
hx-target="#modal"
|
|
hx-push-url="false"
|
|
hx-swap="innerHTML"
|
|
class="button button--icon button--sm">+</a>
|
|
</summary>
|
|
<ul class="content">
|
|
@foreach ($calendars->where('is_remote', false) as $cal)
|
|
<li class="calendar-toggle">
|
|
<x-input.checkbox-label
|
|
label="{{ $cal['name'] }}"
|
|
name="c[]"
|
|
value="{{ $cal['slug'] }}"
|
|
:checked="$cal['visible']"
|
|
checkclass="calendar-toggle"
|
|
style="--checkbox-color: {{ $cal['color'] }}"
|
|
/>
|
|
<a href="{{ route('calendar.settings.calendars.show', $cal['slug']) }}"
|
|
aria-label="Manage calendar"
|
|
class="edit-link">Edit</a>
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
|
|
{{-- fallback submit button for no-JS environments --}}
|
|
<noscript>
|
|
<button type="submit">{{ __('Apply') }}</button>
|
|
</noscript>
|
|
</details>
|
|
<details open>
|
|
<summary>
|
|
<span>{{ __('Other Calendars') }}</span>
|
|
<a href="{{ route('calendar.settings.subscribe') }}"
|
|
class="button button--icon button--sm">+</a>
|
|
</summary>
|
|
<ul class="content">
|
|
@foreach ($calendars->where('is_remote', true) as $cal)
|
|
<li class="calendar-toggle">
|
|
<x-input.checkbox-label
|
|
label="{{ $cal['name'] }}"
|
|
name="c[]"
|
|
value="{{ $cal['slug'] }}"
|
|
:checked="$cal['visible']"
|
|
checkclass="calendar-toggle"
|
|
style="--checkbox-color: {{ $cal['color'] }}"
|
|
/>
|
|
<a href="{{ route('calendar.settings.calendars.show', $cal['slug']) }}"
|
|
aria-label="Manage calendar"
|
|
class="edit-link">Edit</a>
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
</details>
|
|
</form>
|
|
</div>
|
|
<x-calendar.mini
|
|
:mini="$mini"
|
|
:nav="$mini_nav"
|
|
:view="$view"
|
|
:density="$density"
|
|
:headers="$mini_headers"
|
|
:business_hours="$business_hours"
|
|
class="aside-inset"
|
|
/>
|
|
</x-slot>
|
|
|
|
<x-slot name="header">
|
|
<h2>
|
|
<strong>{{ $header['strong'] }}</strong>
|
|
@if(!empty($header['span']))
|
|
<span>{{ $header['span'] }}</span>
|
|
@endif
|
|
</h2>
|
|
<menu>
|
|
<li>
|
|
<a class="button button--icon" href="{{ route('calendar.settings') }}">
|
|
<x-icon-settings />
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<form id="calendar-nav"
|
|
action="{{ route('calendar.index') }}"
|
|
method="get"
|
|
hx-get="{{ route('calendar.index') }}"
|
|
hx-target="#calendar"
|
|
hx-select="#calendar"
|
|
hx-swap="outerHTML"
|
|
hx-push-url="true"
|
|
hx-include="#calendar-toggles">
|
|
|
|
{{-- persist values from other forms --}}
|
|
<input type="hidden" name="view" value="{{ $view }}">
|
|
<input type="hidden" name="density" value="{{ $density['step'] }}">
|
|
<input type="hidden" name="business_hours" value="{{ (int) ($business_hours['enabled'] ?? 0) }}">
|
|
|
|
<nav class="button-group button-group--primary">
|
|
<x-button.group-button
|
|
type="submit"
|
|
name="date"
|
|
value="{{ $nav['prev'] }}"
|
|
aria-label="Go back 1 month">
|
|
<x-icon-chevron-left />
|
|
</x-button.group-button>
|
|
<x-button.group-button
|
|
type="submit"
|
|
name="date"
|
|
value="{{ $nav['today'] }}"
|
|
aria-label="Go to today">
|
|
Today
|
|
</x-button.group-button>
|
|
<x-button.group-button
|
|
type="submit"
|
|
name="date"
|
|
value="{{ $nav['next'] }}"
|
|
aria-label="Go forward 1 month">
|
|
<x-icon-chevron-right />
|
|
</x-button.group-button>
|
|
</nav>
|
|
<noscript>
|
|
{{-- not needed, buttons already submit the form --}}
|
|
</noscript>
|
|
</form>
|
|
</li>
|
|
<li>
|
|
<form id="calendar-view"
|
|
class="button-group button-group--primary"
|
|
method="get"
|
|
action="{{ route('calendar.index') }}"
|
|
hx-get="{{ route('calendar.index') }}"
|
|
hx-target="#calendar"
|
|
hx-select="#calendar"
|
|
hx-swap="outerHTML"
|
|
hx-push-url="true"
|
|
hx-include="#calendar-toggles">
|
|
|
|
{{-- persist data from density form --}}
|
|
<input type="hidden" name="density" value="{{ $density['step'] }}">
|
|
<input type="hidden" name="business_hours" value="{{ (int) ($business_hours['enabled'] ?? 0) }}">
|
|
<x-button.group-input value="day" :active="$view === 'day'">Day</x-button.group-input>
|
|
<x-button.group-input value="week" :active="$view === 'week'">Week</x-button.group-input>
|
|
<x-button.group-input value="month" :active="$view === 'month'">Month</x-button.group-input>
|
|
<x-button.group-input value="four" :active="$view === 'four'">3-Up</x-button.group-input>
|
|
<noscript><button type="submit" class="button">Apply</button></noscript>
|
|
</form>
|
|
<li>
|
|
<a class="button button--primary" href="{{ route('calendar.create') }}">
|
|
<x-icon-plus-circle /> Create
|
|
</a>
|
|
</li>
|
|
</menu>
|
|
</x-slot>
|
|
|
|
<x-slot name="article">
|
|
@switch($view)
|
|
@case('week')
|
|
<x-calendar.week
|
|
class="week time"
|
|
:grid="$grid"
|
|
:calendars="$calendars"
|
|
:events="$events"
|
|
:slots="$slots"
|
|
:timeformat="$time_format"
|
|
:hgroup="$hgroup"
|
|
:active="$active"
|
|
:density="$density"
|
|
:weekstart="$week_start"
|
|
:business_hours="$business_hours"
|
|
:now="$now"
|
|
/>
|
|
@break
|
|
@case('day')
|
|
<x-calendar.day
|
|
class="day time"
|
|
:grid="$grid"
|
|
:calendars="$calendars"
|
|
:events="$events"
|
|
:slots="$slots"
|
|
:timeformat="$time_format"
|
|
:hgroup="$hgroup"
|
|
:active="$active"
|
|
:density="$density"
|
|
:business_hours="$business_hours"
|
|
:now="$now"
|
|
/>
|
|
@break
|
|
@case('four')
|
|
<x-calendar.four
|
|
class="four time"
|
|
:grid="$grid"
|
|
:calendars="$calendars"
|
|
:events="$events"
|
|
:slots="$slots"
|
|
:timeformat="$time_format"
|
|
:hgroup="$hgroup"
|
|
:active="$active"
|
|
:density="$density"
|
|
:business_hours="$business_hours"
|
|
:now="$now"
|
|
/>
|
|
@break
|
|
@default
|
|
<x-calendar.month
|
|
class="month"
|
|
:grid="$grid"
|
|
:calendars="$calendars"
|
|
:events="$events"
|
|
:hgroup="$hgroup"
|
|
:active="$active"
|
|
/>
|
|
@endswitch
|
|
</x-slot>
|
|
|
|
</x-app-layout>
|