@extends('layouts.app')

@section('title', 'Adicionar Artista')

@push('styles-custom')
    <link href="{{ asset('vendors/select2/css/select2.css') }}" rel="stylesheet" />
    <!-- jQuery Mask Plugin -->
    <style>
        .form-control.is-invalid {
            border-color: #e74c3c;
        }
        .invalid-feedback {
            display: block;
        }
    </style>
@endpush

@section('content')
<div class="content pt-3">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb mb-3">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item"><a href="{{ route('artistas.index') }}">Artistas</a></li>
            <li class="breadcrumb-item active" aria-current="page">Adicionar Artista</li>
        </ol>
    </nav>

    @include('artistas.partials.form', [
        'action' => route('artistas.store'),
        'method' => null,
        'title' => 'Adicionar Artista',
        'subtitle' => 'Preencha os dados para cadastrar um novo artista.',
        'artista' => null,
        'empresas' => $empresas,
    ])
</div>
@endsection

@push('scripts-custom')
    <script src="{{ asset('vendors/select2/js/select2.min.js') }}"></script>
    <script>
        $(document).ready(function() {
            // Máscara para telefone
            $('#telefone').mask('(00) 00000-0000');
            
            // Validação do formulário
            $('#artistaForm').on('submit', function(e) {
                e.preventDefault();
                
                const form = this;
                const formData = new FormData(form);
                
                // Remover classes de erro anteriores
                $('.form-control').removeClass('is-invalid');
                $('.invalid-feedback').hide();
                
                $.ajax({
                    url: $(form).attr('action'),
                    type: 'POST',
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        if (response.success) {
                            window.location.href = '{{ route("artistas.index") }}';
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422) {
                            const errors = xhr.responseJSON.errors;
                            Object.keys(errors).forEach(function(key) {
                                const input = $(`#${key}`);
                                input.addClass('is-invalid');
                                input.next('.invalid-feedback').text(errors[key][0]).show();
                            });
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: 'Erro!',
                                text: 'Ocorreu um erro ao salvar o artista.'
                            });
                        }
                    }
                });
            });
        });
    </script>
@endpush