forked from eatvio/eatvio-infra
494 lines
28 KiB
PHP
494 lines
28 KiB
PHP
<section class="diet" id="main">
|
||
<div class="diet__container">
|
||
<div class="diet__header">
|
||
<button class="diet__back icon-arrow-short-left">
|
||
<span>Мои планы</span>
|
||
</button>
|
||
<h1 class="diet__title">
|
||
Мои планы
|
||
</h1>
|
||
</div>
|
||
|
||
<div class="diet__form">
|
||
<div class="diet__form-row">
|
||
<div class="label">
|
||
Название
|
||
</div>
|
||
<input wire:model="name" type="text" name="name" class="input" value="{{ $name }}"
|
||
placeholder="Введите название плана">
|
||
</div>
|
||
|
||
<div class="diet__form-row">
|
||
<div class="diet__form-columns ">
|
||
<div class="diet__form-column">
|
||
<div class="label">
|
||
Изображение
|
||
</div>
|
||
<label class="file">
|
||
<input wire:model="image" type="file" name="file" class="file__input hidden"
|
||
hidden="">
|
||
@error('image')
|
||
<span class="error">{{ $message }}</span>
|
||
@enderror
|
||
|
||
@if (is_null($image))
|
||
<span class="file__content">
|
||
<span class="file__formats">
|
||
<img src="/img/formats-2.svg" alt="formats">
|
||
</span>
|
||
<span class="file__title">
|
||
Нажмите для выбора или перетащите изображание
|
||
</span>
|
||
</span>
|
||
@else
|
||
{{-- @php dd($image) @endphp --}}
|
||
<span class="file__content">
|
||
<span class="file__formats">
|
||
<img src="{{ is_string($image) ? Storage::url($image) : $image->temporaryUrl() }}" alt="formats">
|
||
</span>
|
||
</span>
|
||
@endif
|
||
</label>
|
||
</div>
|
||
|
||
<div class="diet__form-column">
|
||
<div class="diet__form-row">
|
||
<div class="label">
|
||
Длительность плана питания
|
||
</div>
|
||
<div class="dropdown">
|
||
<button @class(['dropdown__button', 'active' => $isVisibleDuration]) wire:click="showListDuration" wire:model="duration"
|
||
type="button">
|
||
{{ $duration }} дней
|
||
</button>
|
||
|
||
<ul @class(['dropdown__list', 'visible' => $isVisibleDuration])>
|
||
<li wire:click="toggleDuration('7')" @class(['dropdown__list-item', 'active' => $duration === '7']) data-value="7">7
|
||
дней</li>
|
||
<li wire:click="toggleDuration('8')" @class(['dropdown__list-item', 'active' => $duration === '8']) data-value="8">8
|
||
дней</li>
|
||
<li wire:click="toggleDuration('100')" @class(['dropdown__list-item', 'active' => $duration === '100'])
|
||
data-value="100 ">100 дней</li>
|
||
</ul>
|
||
<input type="text" name="action" class="dropdown__input hidden" hidden
|
||
value="">
|
||
</div>
|
||
</div>
|
||
<div class="diet__form-row">
|
||
<div class="diet__form-checkboxes">
|
||
<label class="checkbox-btn">
|
||
<input wire:model="type.slim" type="checkbox" name="slim"
|
||
class="checkbox-btn__input hidden" hidden>
|
||
<span class="checkbox-btn__content">
|
||
<svg width="40" height="60">
|
||
<use xlink:href="#SlimBig"></use>
|
||
</svg>
|
||
Slim
|
||
</span>
|
||
</label>
|
||
<label class="checkbox-btn">
|
||
<input wire:model="type.fit" type="checkbox" name="fit"
|
||
class="checkbox-btn__input hidden" hidden>
|
||
<span class="checkbox-btn__content">
|
||
<svg width="40" height="60">
|
||
<use xlink:href="#FitBig"></use>
|
||
</svg>
|
||
Fit
|
||
</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="diet__form-column">
|
||
<div class="diet__form-row">
|
||
<div class="label">
|
||
Статус
|
||
</div>
|
||
<div class="dropdown">
|
||
<button @class(['dropdown__button', 'active' => $isVisibleState]) wire:click="showListState" type="button">
|
||
{{ $state === 'active' ? 'Активна' : 'Неактивна' }}
|
||
</button>
|
||
<ul @class(['dropdown__list', 'visible' => $isVisibleState])>
|
||
<li wire:click="toggleState('active')" @class(['dropdown__list-item', 'active' => $state === 'active'])>
|
||
Активна</li>
|
||
<li wire:click="toggleState('unactive')" @class(['dropdown__list-item', 'active' => $state === 'unactive'])>Неактивна
|
||
</li>
|
||
</ul>
|
||
<input type="text" name="status" class="dropdown__input hidden" hidden
|
||
value="unactive">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="diet__form-row">
|
||
<div class="diet__form-checkboxes">
|
||
<label class="checkbox-btn">
|
||
<input wire:model="type.wellness" type="checkbox" name="wellness"
|
||
class="checkbox-btn__input hidden" hidden>
|
||
<span class="checkbox-btn__content">
|
||
<svg width="40" height="60">
|
||
<use xlink:href="#WellnessBig"></use>
|
||
</svg>
|
||
Wellness
|
||
</span>
|
||
</label>
|
||
<label class="checkbox-btn">
|
||
<input wire:model="type.behavior" type="checkbox" name="behavior"
|
||
class="checkbox-btn__input hidden" hidden>
|
||
<span class="checkbox-btn__content">
|
||
<svg width="40" height="60">
|
||
<use xlink:href="#BehaviorBig"></use>
|
||
</svg>
|
||
Behavior
|
||
</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div wire:ignore class="diet__form-row">
|
||
<div class="label">
|
||
Описание
|
||
</div>
|
||
<!-- <label for="details" class="mb-3">Описание </label> -->
|
||
<div class="wysiwyg">
|
||
<div class="wysiwyg__caption">
|
||
<textarea class="w-full" x-data="{}" x-init="ClassicEditor.create($refs.myIdentifierHere, {
|
||
toolbar: {
|
||
items: [
|
||
'heading', '|',
|
||
'bold', 'italic', '|',
|
||
'bulletedList', 'numberedList', '|',
|
||
'outdent', 'indent', '|',
|
||
'blockQuote', 'undo', 'redo'
|
||
],
|
||
shouldNotGroupWhenFull: true
|
||
}
|
||
})
|
||
.then(function(editor) {
|
||
editor.model.document.on('change:data', () => {
|
||
$dispatch('input', editor.getData())
|
||
})
|
||
})
|
||
.catch(error => {
|
||
console.error(error);
|
||
});" wire:key="myIdentifierHere"
|
||
x-ref="myIdentifierHere" wire:model="details"></textarea>
|
||
<!-- x-ref="myIdentifierHere" wire:model="details"></textarea> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="diet__services">
|
||
<div class="diet__services-caption">
|
||
<div class="diet__services-title title">
|
||
ОКАЗАНИЕ УСЛУГ
|
||
</div>
|
||
<div class="diary__stats-tablist" role="tablist" aria-labelledby="label">
|
||
<button wire:click="$set('packets_count', 1)"
|
||
class="l-btn {{ $packets_count === 1 ? 'active' : '' }}" role="tab" type="button"
|
||
id="tab-1" aria-selected="{{ $packets_count === 1 ? 'true' : 'false' }}"
|
||
aria-controls="tabpanel-1">1 пакет</button>
|
||
<button wire:click="$set('packets_count', 3)"
|
||
class="l-btn {{ $packets_count === 3 ? 'active' : '' }}" role="tab" type="button"
|
||
id="tab-2" aria-selected="{{ $packets_count === 3 ? 'true' : 'false' }}"
|
||
aria-controls="tabpanel-2" tabindex="-1">3 пакета</button>
|
||
</div>
|
||
</div>
|
||
|
||
@if ($packets_count === 1)
|
||
<div class="diet__services-body">
|
||
<div class="tabpanel" role="tabpanel" id="tabpanel-1" tabindex="0" aria-labelledby="tab-1">
|
||
<div class="diet__services-form">
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Краткое описание
|
||
</div>
|
||
<input wire:model="packet1_options_input.short" type="text" name="desc"
|
||
class="input" placeholder="Введите краткое описание">
|
||
</div>
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Цена
|
||
|
||
<span>
|
||
1 вариант
|
||
</span>
|
||
</div>
|
||
<input wire:model="packet1_options_input.price" type="num" name="price"
|
||
class="input" placeholder="Введите цену варианта">
|
||
</div>
|
||
</div>
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Описание услуги:
|
||
</div>
|
||
<textarea wire:model="packet1_options_input.description" name="service" placeholder="Описание услуги"
|
||
class="textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Содержание услуги
|
||
</div>
|
||
@isset($packet1_options['items'])
|
||
<ul>
|
||
@foreach ($packet1_options['items'] as $item)
|
||
<li>
|
||
<td>{{ $item }}</td>
|
||
</li>
|
||
@endforeach
|
||
</ul>
|
||
@endisset
|
||
|
||
<div class="diet__form-row">
|
||
<input wire:model="input_items_1" type="text" name="name"
|
||
class="input" placeholder="Содержание услуги" required="">
|
||
</div>
|
||
|
||
|
||
<button wire:click="addPacketOption('packet1_options', 'packet1_options_input')"
|
||
type="button" class="l-btn l-btn-primary icon-plus"></button>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
@endif
|
||
|
||
@if ($packets_count === 3)
|
||
<div class="diet__services-body">
|
||
<div class="tabpanel" role="tabpanel" id="tabpanel-1" tabindex="0" aria-labelledby="tab-1">
|
||
<div class="diet__services-form">
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Краткое описание
|
||
</div>
|
||
<input wire:model="packet1_options_input.short" type="text" name="desc"
|
||
class="input" placeholder="Введите краткое описание">
|
||
</div>
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Цена
|
||
|
||
<span>
|
||
1 вариант
|
||
</span>
|
||
</div>
|
||
<input wire:model="packet1_options_input.price" type="num" name="price"
|
||
class="input" placeholder="Введите цену варианта">
|
||
</div>
|
||
</div>
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Описание услуги:
|
||
</div>
|
||
<textarea wire:model="packet1_options_input.description" name="service" placeholder="Описание услуги"
|
||
class="textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Содержание услуги
|
||
</div>
|
||
@isset($packet1_options['items'])
|
||
<ul>
|
||
@foreach ($packet1_options['items'] as $item)
|
||
<li>
|
||
<td>{{ $item }}</td>
|
||
</li>
|
||
@endforeach
|
||
</ul>
|
||
@endisset
|
||
|
||
<div class="diet__form-row">
|
||
<input wire:model="input_items_1" type="text" name="name"
|
||
class="input" placeholder="Содержание услуги" required="">
|
||
</div>
|
||
|
||
|
||
<button wire:click="addPacketOption('packet1_options', 'packet1_options_input')"
|
||
type="button" class="l-btn l-btn-primary icon-plus"></button>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
<div class="diet__services-body">
|
||
<div class="tabpanel" role="tabpanel" id="tabpanel-1" tabindex="0" aria-labelledby="tab-1">
|
||
<div class="diet__services-form">
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Краткое описание
|
||
</div>
|
||
<input wire:model="packet2_options_input.short" type="text" name="desc"
|
||
class="input" placeholder="Введите краткое описание">
|
||
</div>
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Цена
|
||
|
||
<span>
|
||
2 вариант
|
||
</span>
|
||
</div>
|
||
<input wire:model="packet2_options_input.price" type="num" name="price"
|
||
class="input" placeholder="Введите цену варианта">
|
||
</div>
|
||
</div>
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Описание услуги:
|
||
</div>
|
||
<textarea wire:model="packet2_options_input.description" name="service" placeholder="Описание услуги"
|
||
class="textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Содержание услуги
|
||
</div>
|
||
@isset($packet2_options['items'])
|
||
<ul>
|
||
@foreach ($packet2_options['items'] as $item)
|
||
<li>
|
||
<td>{{ $item }}</td>
|
||
</li>
|
||
@endforeach
|
||
</ul>
|
||
@endisset
|
||
|
||
<div class="diet__form-row">
|
||
<input wire:model="input_items_2" type="text" name="name"
|
||
class="input" placeholder="Содержание услуги" required="">
|
||
</div>
|
||
|
||
|
||
<button wire:click="addPacketOption('packet2_options', 'packet2_options_input')"
|
||
type="button" class="l-btn l-btn-primary icon-plus"></button>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
<div class="diet__services-body">
|
||
<div class="tabpanel" role="tabpanel" id="tabpanel-1" tabindex="0" aria-labelledby="tab-1">
|
||
<div class="diet__services-form">
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Краткое описание
|
||
</div>
|
||
<input wire:model="packet3_options_input.short" type="text" name="desc"
|
||
class="input" placeholder="Введите краткое описание">
|
||
</div>
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Цена
|
||
|
||
<span>
|
||
3 вариант
|
||
</span>
|
||
</div>
|
||
<input wire:model="packet3_options_input.price" type="num" name="price"
|
||
class="input" placeholder="Введите цену варианта">
|
||
</div>
|
||
</div>
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Описание услуги:
|
||
</div>
|
||
<textarea wire:model="packet3_options_input.description" name="service" placeholder="Описание услуги"
|
||
class="textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="diet__services-row">
|
||
<div class="diet__services-column">
|
||
<div class="label">
|
||
Содержание услуги
|
||
</div>
|
||
@isset($packet3_options['items'])
|
||
<ul class="mb-3">
|
||
@foreach ($packet3_options['items'] as $item)
|
||
<li>
|
||
<td>{{ $item }}</td>
|
||
</li>
|
||
@endforeach
|
||
</ul>
|
||
@endisset
|
||
|
||
<div class="diet__form-row">
|
||
<input wire:model="input_items_3" type="text" name="name"
|
||
class="input" placeholder="Содержание услуги" required="">
|
||
</div>
|
||
|
||
|
||
<button wire:click="addPacketOption('packet3_options', 'packet3_options_input')"
|
||
type="button" class="l-btn l-btn-primary icon-plus"></button>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
@endif
|
||
|
||
|
||
@if ($errors)
|
||
<div class="">
|
||
<ul>
|
||
@foreach ($errors->all() as $message)
|
||
<li> {{ $message }}</li>
|
||
@endforeach
|
||
</ul>
|
||
</div>
|
||
@endif
|
||
|
||
|
||
<div class="diet__btns">
|
||
<button wire:click="addToDrafts" type="button" class="diet__btn l-btn l-btn-gray">В
|
||
черновик</button>
|
||
<button wire:click="showPreview"type="button" class="diet__btn l-btn l-btn-gray">Превью</button>
|
||
<button wire:click.prevent="publish" type="button"
|
||
class="diet__btn l-btn l-btn-primary">Опубликовать</button>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</section>
|