Item Cardápio Gerenciamento Projeto Multi Tenancy com laravel e Multi Database na Code Experts em https://codeexperts.com.br

item-modal.blade.php

<!-- This example requires Tailwind CSS v2.0+ -->
<div class="fixed z-10 inset-0 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true" x-cloak x-show="open" @modal-close.window="open = false">
    <div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"  x-show="open"

         x-transition:enter="transition ease-out duration-300"
         x-transition:enter-start="opacity-0"
         x-transition:enter-end="opacity-100"
         x-transition:leave="transition ease-in duration-200"
         x-transition:leave-start="opacity-100"
         x-transition:leave-end="opacity-0"
    >
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" aria-hidden="true"></div>

        <!-- This element is to trick the browser into centering the modal contents. -->
        <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>

        <div @click.outside="Livewire.emit('modalClosed'); open = false;"

             x-show="open"

             x-transition:enter="transition ease-out duration-300"
             x-transition:enter-start="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
             x-transition:enter-end="opacity-100 translate-y-0 sm:scale-100"
             x-transition:leave="transition ease-in duration-200"
             x-transition:leave-start="opacity-100 translate-y-0 sm:scale-100"
             x-transition:leave-end="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"

             class="relative inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
                <div class="w-full">
                    <div class="w-full px-2 py-4 border border-green-600 bg-green-200 text-green-800 rounded mb-10 hidden modalMessage">
                    </div>
                </div>
                <div class="sm:flex sm:items-start">
                    <div class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-600 sm:mx-0 sm:h-10 sm:w-10">
                        <!-- Heroicon name: outline/exclamation -->
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-white">
                            <path stroke-linecap="round" stroke-linejoin="round" d="M8.25 6.75h12M8.25 12h12m-12 5.25h12M3.75 6.75h.007v.008H3.75V6.75zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zM3.75 12h.007v.008H3.75V12zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm-.375 5.25h.007v.008H3.75v-.008zm.375 0a.375.375 0 11-.75 0 .375.375 0 01.75 0z" />
                        </svg>
                    </div>
                    <div class="w-96 mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
                        <strong>Cadastre ou Atualize Seu Item de Cardápio</strong>

                        <livewire:tenants.restaurant-menu.item />
                    </div>
                </div>
            </div>
            <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
            </div>
        </div>
    </div>
</div>

item.blade.php

<div class="mt-10">
    <x-slot name="header">Cardápio</x-slot>
    @if(session()->has('success'))
        <div class="w-full px-2 py-4 border border-green-900 bg-green-400 text-green-900 rounded mb-10">
            {{session('success')}}
        </div>
    @endif

    <form>
        <div class="w-full mb-8">
            <label>Nome Item</label>
            <input type="text" class="w-full rounded mt-2 @error('menu.item') border-red-700 @enderror"  wire:model="menu.item">

            @error('menu.item')
            <strong class="block mt-4 text-red-700 font-bold">{{$message}}</strong>
            @enderror
        </div>

        <div class="w-full mb-8">
            <label>Descrição</label>
            <input type="text" class="w-full rounded mt-2 @error('menu.description') border-red-700 @enderror" wire:model="menu.description">

            @error('menu.description')
            <strong class="block mt-4 text-red-700 font-bold">{{$message}}</strong>
            @enderror
        </div>

        <div class="w-full mb-8">
            <label>Preço</label>
            <input type="text" class="w-full rounded mt-2 @error('menu.price') border-red-700 @enderror" wire:model="menu.price">

            @error('menu.price')
             <strong class="block mt-4 text-red-700 font-bold">{{$message}}</strong>
            @enderror
        </div>

        <div class="w-full mb-8">
            <div class="w-1/2">
                <label>Foto Item</label>
                <input type="file" class="w-full rounded mt-2 @error('menu.photo') border-red-700 @enderror" wire:model="menu.photo">

                @error('menu.photo')
                <strong class="block mt-4 text-red-700 font-bold">{{$message}}</strong>
                @enderror
            </div>
        </div>

        <button
            wire:click.prevent="saveItem"
            class="px-4 py-2 text-white font-bold text-xl rounded bg-blue-700 border border-blue-900 hover:bg-blue-500
                   transition duration-300 ease-in-out">
            Salvar Item
        </button>
    </form>
</div>

Item.php

<?php

namespace App\Http\Livewire\Tenants\RestaurantMenu;

use App\Models\Tenant\Restaurant;
use App\Models\Tenant\Menu;
use Livewire\Component;
use Livewire\WithFileUploads;

class Item extends Component
{
    use WithFileUploads;

    public $menu;

    protected $listeners = ['editMenuItem', 'modalClosed'];

    protected $rules = [
        'menu.item' => 'required|max:255',
        'menu.description' => 'nullable|string|max:255',
        'menu.price' => 'required',
        'menu.photo' => 'nullable|image',
    ];

    public function mount()
    {
        $this->menu = new Menu();
    }

    public function saveItem()
    {
        $this->validate();
        $this->menu->restaurant_id = Restaurant::first()->id;
        $this->menu->save();

        $this->emit('menuItemUpdated');
        $this->dispatchBrowserEvent('modal-close');

        $this->reset('menu');

        session()->flash('success', 'Item salvo/atualizado com sucesso!');
    }

    public function editMenuItem($item)
    {
        $this->resetValidation();
        $this->menu = Menu::find($item);
    }

    public function modalClosed()
    {
        $this->resetValidation();
        $this->reset('menu');
    }

    public function render()
    {
        return view('livewire.tenants.restaurant-menu.item');
    }
}