feat: Edição de clientes

Componentes para edição dos clientes.

app/Livewire/Admin/AddClient.php

@@ -24,7 +24,6 @@ public function save(ClientService $clientService)
             $data = $this->form->all();
             $data['name'] = $data['client_name'];
 
-
             if ($this->form->profile_image_path) {
                 $path = $this->form->profile_image_path->store('client_logos', 'public');
                 $data['profile_image_path'] = $path;
@@ -32,15 +31,16 @@ public function save(ClientService $clientService)
 
             $data['root_password'] = Crypt::encryptString($data['root_password']);
 
-            $clientService->addClient($data);
+            $client = $clientService->addClient($data);
 
             $this->dispatch('client-added');
-            $this->dispatch('notify', message: 'Cliente adicionado com sucesso!');
+            $this->dispatch('notify', message: $client->name . ' Cliente adicionado com sucesso!');
         } catch (\Exception $e) {
             $this->dispatch('notify', message: 'Ocorreu um erro inesperado ao salvar.', type: 'error');
         }
     }
 
+
     public function render()
     {
         return view('livewire.admin.add-client');

app/Livewire/Admin/EditClient.php

@@ -0,0 +1,45 @@
+<?php
+
+namespace App\Livewire\Admin;
+
+use App\Livewire\Forms\ClientForm;
+use App\Models\Client;
+use Livewire\Attributes\On;
+use Livewire\Component;
+use Exception;
+
+class EditClient extends Component
+{
+
+    public Client $client;
+    public ClientForm $clientForm;
+
+    #[On('update-client')]
+    public function loadClient($id)
+    {
+        try {
+            $this->client = Client::find($id);
+
+            if ($this->client) {
+                $this->clientForm->addClient($this->client);
+            }
+        } catch (Exception $e) {
+            $this->dispatch('notify', message: 'Ocorreu um erro inesperado ao editar o cliente. ' + $e);
+        }
+    }
+    public function edit($clientId)
+    {
+        $this->clientForm->validate();
+
+        try {
+            $this->clientForm->updateClient($this->client);
+            $this->dispatch('notify', message: $this->client->client_name + ' atualizado com sucesso!');
+        } catch (Exception $e) {
+            $this->dispatch('notify', message: 'Ocorreu um erro inesperado ao tentar confirmar edição do cliente. ' + $e);
+        }
+    }
+    public function render()
+    {
+        return view('livewire.admin.edit-client');
+    }
+}

app/Livewire/Admin/ShowClient.php

@@ -10,6 +10,7 @@ class ShowClient extends Component
 {
 
     #[On('clientDeleted')]
+    #[On('client-added')]
     public function refreshClientList() {}
 
     public function render()

app/Livewire/Forms/ClientForm.php

@@ -2,6 +2,8 @@
 
 namespace App\Livewire\Forms;
 
+use App\Services\ClientService;
+use Exception;
 use Livewire\Attributes\Validate;
 use Livewire\Form;
 use App\Models\Client;
@@ -24,6 +26,7 @@ class ClientForm extends Form
     public $modules = '';
     public $whatsapp_number = '';
     public $whatsapp_activation_date;
+    public ClientService $clientService;
 
     // Método para preencher o formulário (para edição futura)
     public function addClient(Client $client)
@@ -32,10 +35,19 @@ public function addClient(Client $client)
         $data['has_call_center'] = (bool) $client->has_call_center;
         $data['has_voice_gateway'] = (bool) $client->has_voice_gateway;
         $data['has_fop2'] = (bool) $client->has_fop2;
+        $data['client_name'] = $data['name'];
 
         $this->fill($data);
     }
 
+    public function updateClient(Client $client)
+    {
+        if(!$this->clientService->updateClient($client)){
+            throw new Exception('Ocorreu um erro.');
+        }
+
+
+    }
     // 4. ADICIONADO: Método de Regras
     /**
      * Define as regras de validação para o formulário.

app/Services/ClientService.php

@@ -19,4 +19,6 @@ public function addClient(array $client)
 
         return Client::create($client);
     }
+
+    public function updateClient($client) {}
 }

resources/css/app.css

@@ -144,44 +144,20 @@ @layer components {
         @apply transition-colors;
     }
 
-    /* 9. Estilizando as mensagens de erro (x-session-messages) */
-    .messages {
-        @apply flex justify-center mb-4;
-    }
-
     .messages div[role="alert"] {
         /* Assumindo que seu componente renderiza um div */
         @apply bg-red-500/50 text-white p-3 rounded-md border border-red-700 text-sm;
     }
 
-    /* --- FIM DOS ESTILOS DE LOGIN --- */
-
-    /* 9. Estilizando as mensagens de erro (x-session-messages) */
     .messages {
         @apply flex justify-center mb-4;
-
-        /* 1. MUDANÇA: Usando "vidro branco" (como o card) 
-             em vez de "vidro vermelho".
-        */
         @apply bg-white/10 backdrop-blur-md;
-        /* 'md' para um borrão mais forte */
-
-        /* 2. MUDANÇA: Borda sutil de "vidro" */
         @apply border border-white/10;
-
-        /* 3. NOVO: Sombra para "flutuar" */
         @apply shadow-lg rounded-lg;
-
-        /* 4. MUDANÇA: A cor do erro agora está no texto.
-             'text-red-200' (ou 300) tem ótimo contraste 
-             no fundo de ondas.
-        */
         @apply text-red-300 font-semibold p-4 text-sm;
     }
 
-    /* Classes antigas genéricas (podem ser usadas em outros lugares) */
     .container {
-        /* Deixe APENAS as classes de largura, margem e padding */
         @apply w-full mx-auto px-4 sm:px-6 lg:px-8 mt-15 mb-10;
     }
 

resources/views/components/are-you-sure.blade.php

@@ -35,7 +35,7 @@ class="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-
                 </svg>
             </div>
 
-            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left w-full">
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left w-full p-1">
                 <!-- Título (usando a classe do 'create-user') -->
                 <h3 class="modal-title" id="modal-title">
                     Confirmar Exclusão
@@ -59,11 +59,11 @@ class="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-
                   para o 'flex-row-reverse' funcionar.
                 -->
                 <button type="button" @click="$dispatch('confirm-delete', [clientId]); showQuestion = false"
-                    class="btn-submit bg-red-600 hover:bg-red-700 focus:ring-red-500 w-full sm:w-auto">
+                    class="btn-submit bg-red-600 hover:bg-red-700 focus:ring-red-500 w-full sm:w-auto cursor-pointer">
                     Sim, Excluir
                 </button>
 
-                <button type="button" @click="showQuestion = false" class="btn-cancel mt-3 sm:mt-0 w-full sm:w-auto">
+                <button type="button" @click="showQuestion = false" class="btn-cancel mt-3 sm:mt-0 w-full sm:w-auto cursor-pointer">
                     Cancelar
                 </button>
             </div>

resources/views/components/session-messages.blade.php

@@ -1,10 +1,10 @@
 <div>
-    <div class="messages">
 
     {{-- 1. O @if garante que este bloco (incluindo o 'div') só será renderizado se houver um erro. --}}
     @if ($errors->any() || session('error'))
+    <div class="messages" x-show="viewMessage">
         {{-- 2. Adicionamos o 'role="alert"'. O seu CSS (em .messages div[role="alert"]) agora vai aplicar o estilo "vidro vermelho" aqui. --}}
         @if ($errors->any()) {{ $errors->first() }} @endif @if (session('error')) {{ session('error') }} @endif
+    </div>
     @endif
 </div>
-</div>

resources/views/dashboard.blade.php

@@ -8,4 +8,5 @@
 <livewire:admin.delete-client />
 <x-are-you-sure />
 <livewire:admin.show-client />
+<livewire:admin.edit-client />
 @endsection

resources/views/livewire/admin/edit-client.blade.php

@@ -0,0 +1,192 @@
+<div x-data="{ showEditClientModal: false, clientId: null  }" x-cloak @keydown.escape.window="showEditClientModal = false"
+    x-on:update-client.window="showEditClientModal = true, clientId = $event.detail.id" x-on:client-updated.window="showEditClientModal = false"
+    class="relative z-50">
+
+    <div x-show="showEditClientModal" x-transition:enter="ease-out duration-300" x-transition:enter-start="opacity-0"
+        x-transition:enter-end="opacity-25" x-transition:leave="ease-in duration-200"
+        x-transition:leave-start="opacity-0" x-transition:leave-end="opacity-0"
+        class="fixed inset-0 bg-white/50 transition-opacity"></div>
+
+    <div x-show="showEditClientModal" x-transition:enter="transform transition ease-in-out duration-300 sm:duration-500"
+        x-transition:enter-start="translate-x-full" x-transition:enter-end="translate-x-0"
+        x-transition:leave="transform transition ease-in-out duration-300 sm:duration-500"
+        x-transition:leave-start="translate-x-0" x-transition:leave-end="translate-x-full"
+        class="fixed inset-y-0 right-0 flex max-w-full pl-10" @click.away="showEditClientModal = false">
+        <div class="w-screen max-w-3xl">
+
+            <form wire:submit="edit(clientId)" class="flex h-full flex-col overflow-y-scroll bg-white shadow-xl">
+
+                <div class="bg-white px-4 py-6 sm:px-6">
+                    <div class="flex items-center justify-between">
+                        <h2 class="text-lg font-semibold leading-6 text-black" id="slide-over-title">
+                            Edição de cliente
+                        </h2>
+                        <button type="button" @click="showEditClientModal = false"
+                            class="rounded-md text-blue-200 hover:text-white cursor-pointer focus:outline-none focus:ring-2 focus:ring-white">
+                            <span class="sr-only">Fechar painel</span>
+                            <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+                                stroke-width="1.5" stroke="currentColor">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+                            </svg>
+                        </button>
+                    </div>
+                </div>
+
+                <div class="form-wrapper-modal">
+                    <div class="form-grid-container">
+
+                        <div class="form-main-panel-modal">
+
+                            <div class="form-group">
+                                <h2 class="form-section-title">Informações Principais</h2>
+
+                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                                    <div>
+                                        <label for="client_name" class="form-label">Nome Fantasia *</label>
+                                        <input type="text" wire:model="clientForm.client_name" id="client_name"
+                                            class="form-input">
+                                        @error('form.client_name') <span
+                                            class="text-red-500 text-sm">{{ $message }}</span>
+                                        @enderror
+                                    </div>
+                                    <div>
+                                        <label for="legal_name" class="form-label">Razão Social *</label>
+                                        <input type="text" wire:model="clientForm.legal_name" id="legal_name"
+                                            class="form-input">
+                                        @error('form.legal_name') <span
+                                            class="text-red-500 text-sm">{{ $message }}</span> @enderror
+                                    </div>
+                                </div>
+                                <div class="mt-4">
+                                    <label for="cnpj" class="form-label">CNPJ *</label>
+                                    <input type="text" wire:model="clientForm.cnpj" id="cnpj" class="form-input">
+                                    @error('form.cnpj') <span class="text-red-500 text-sm">{{ $message }}</span>
+                                    @enderror
+                                </div>
+                                <div class="mt-4">
+                                    <label for="profile_image_path" class="form-label">Logo do Cliente</label>
+                                    <input type="file" wire:model="clientForm.profile_image_path" id="profile_image_path"
+                                        class="form-file-input">
+
+                                    <div wire:loading wire:target="clientForm.profile_image_path"
+                                        class="text-sm text-blue-600 mt-1">
+                                        Enviando...
+                                    </div>
+                                    @error('form.profile_image_path') <span
+                                        class="text-red-500 text-sm">{{ $message }}</span> @enderror
+                                </div>
+                            </div>
+
+                            <hr class="form-divider">
+
+                            <div class="form-group">
+                                <h2 class="form-section-title">Detalhes do Servidor PBX</h2>
+                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                                    <div>
+                                        <label for="pbx_hosting" class="form-label">Hospedagem PBX</label>
+                                        <input type="text" wire:model="clientForm.pbx_hosting" id="pbx_hosting"
+                                            class="form-input" placeholder="Ex: Vultr, Local, AWS">
+                                    </div>
+                                    <div>
+                                        <label for="activation_date" class="form-label">Data de Ativação</label>
+                                        <input type="date" wire:model="clientForm.activation_date" id="activation_date"
+                                            class="form-input">
+                                    </div>
+                                    <div>
+                                        <label for="carrier" class="form-label">Operadora</label>
+                                        <input type="text" wire:model="clientForm.carrier" id="carrier" class="form-input">
+                                    </div>
+                                    <div>
+                                        <label for="access_type" class="form-label">Tipo de Acesso</label>
+                                        <input type="text" wire:model="clientForm.access_type" id="access_type"
+                                            class.="form-input" placeholder="Ex: SSH, AnyDesk, VPN">
+                                    </div>
+                                    <div>
+                                        <label for="server_ip" class="form-label">IP do Servidor</label>
+                                        <input type="text" wire:model="clientForm.server_ip" id="server_ip"
+                                            class="form-input">
+                                        @error('form.server_ip') <span
+                                            class="text-red-500 text-sm">{{ $message }}</span> @enderror
+                                    </div>
+                                    <div>
+                                        <label for="root_password" class="form-label">Senha (root)</label>
+                                        <input type="password" wire:model="clientForm.root_password" id="root_password"
+                                            class="form-input">
+                                    </div>
+                                </div>
+                            </div>
+
+                            <hr class="form-divider">
+
+                            <div class="form-group">
+                                <h2 class="form-section-title">WhatsApp</h2>
+                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                                    <div>
+                                        <label for="whatsapp_number" class="form-label">Número do WhatsApp</label>
+                                        <input type="text" wire:model="clientForm.whatsapp_number" id="whatsapp_number"
+                                            class="form-input">
+                                    </div>
+                                    <div>
+                                        <label for="whatsapp_activation_date" class="form-label">Data Ativação
+                                            WhatsApp</label>
+                                        <input type="date" wire:model="clientForm.whatsapp_activation_date"
+                                            id="whatsapp_activation_date" class="form-input">
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="form-sidebar-column">
+                            <div class="form-sticky-sidebar-modal">
+                                <div class="form-section-card">
+                                    <h2 class="form-section-title">Módulos & Recursos</h2>
+                                    <div class="form-checkbox-group">
+                                        <label class="form-checkbox-item">
+                                            <input type="checkbox" wire:model="clientForm.has_call_center"
+                                                class="form-checkbox">
+                                            <span>Possui Call Center?</span>
+                                        </label>
+                                        <label class="form-checkbox-item">
+                                            <input type="checkbox" wire:model="clientForm.has_voice_gateway"
+                                                class="form-checkbox">
+                                            <span>Possui Gateway de Voz?</span>
+                                        </label>
+                                        <label class="form-checkbox-item">
+                                            <input type="checkbox" wire:model="clientForm.has_fop2" class="form-checkbox">
+                                            <span>Possui FOP2?</span>
+                                        </label>
+                                    </div>
+                                    <div class="mt-4">
+                                        <label for="modules" class="form-label">Módulos Adicionais (JSON)</label>
+                                        <textarea wire:model="clientForm.modules" id="modules" rows="3" class="form-input"
+                                            placeholder="Ex: {&quot;bi&quot;: true}"></textarea>
+                                        @error('form.modules') <span class="text-red-500 text-sm">{{ $message }}</span>
+                                        @enderror
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex-shrink-0 border-t border-gray-200 px-4 py-4 sm:px-6">
+                    <div class="flex justify-end space-x-3">
+
+                        <button type="button" @click="showEditClientModal = false" class="form-button-secondary">
+                            Cancelar
+                        </button>
+
+                        <button type="submit" class="form-button-primary">
+                            Salvar Edição
+
+                            <div wire:loading wire:target="save"
+                                class="ml-2 h-4 w-4 animate-spin rounded-full border-2 border-white border-t-transparent">
+                            </div>
+                        </button>
+                    </div>
+                </div>
+
+            </form>
+        </div>
+    </div>
+
+
+</div>

resources/views/livewire/admin/show-client.blade.php

@@ -19,7 +19,7 @@ class="w-32 h-32 rounded-full object-cover">
                     <ul x-show="open" class="client-options-list" x-transition>
 
                         <li><a href="#" class="client-option-item">Ver Detalhes</a></li>
-                        <li><a href="#" class="client-option-item">Editar Cliente</a></li>
+                        <li><a href="#" class="client-option-item" x-on:click.prevent="$dispatch('update-client', { id: '{{ $client->id }}' })">Editar Cliente</a></li>
                         <li>
                             <a href="#" class="client-option-item text-red-600"
                                 x-on:click.prevent="$dispatch('sure', { id: '{{ $client->id }}' })">

resources/views/login.blade.php

@@ -1,5 +1,5 @@
 @extends('layouts.app')
-@section('title', 'Login')
+@section('title', 'Nexus - Login')
 @section('content')
 
 <!--