@extends('layouts.metronic')

@section('title', 'Configurações da Empresa')

@section('content')
<x-breadcrumb title="Configurações da Empresa">
    <a href="{{ url()->previous() }}" class="btn m-btn--pill m-btn--air btn-focus">
        <span>
            <i class="la la-arrow-left"></i>
            <span>Voltar</span>
        </span>
    </a>
</x-breadcrumb>

<div class="m-content">
    <div class="m-portlet">
        <div class="m-portlet__head">
            <div class="m-portlet__head-caption">
                <div class="m-portlet__head-title">
                    <span class="m-portlet__head-icon">
                        <i class="la la-building"></i>
                    </span>
                    <h3 class="m-portlet__head-text">Informações da Empresa</h3>
                </div>
            </div>
        </div>

        <form class="m-form" id="company-form" method="POST" action="{{ route('company.update') }}" enctype="multipart/form-data">
            @csrf
            @method('PUT')
            <input type="hidden" name="form_type" value="company">

            <div class="m-portlet__body">
                <p class="text-muted mb-4">
                    Atualize os dados principais da sua empresa. Essas informações são usadas em contratos,
                    notificações e cabeçalhos de e-mail gerados pelo sistema.
                </p>

                <div class="row">
                    <div class="col-lg-6">
                        <h5 class="mb-4">Dados da empresa</h5>

                        <div class="form-group m-form__group">
                            <label for="company_name">Nome da empresa</label>
                            <input type="text" class="form-control m-input" id="company_name" name="company_name" value="{{ $companySetting->company_name }}" placeholder="Digite o nome da empresa" required>
                            <span class="m-form__help">Nome completo ou razão social</span>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_document">CNPJ</label>
                            <input type="text" class="form-control m-input" id="company_document" name="company_document" value="{{ $companySetting->company_document }}" placeholder="00.000.000/0000-00" required>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_email">E-mail</label>
                            <input type="email" class="form-control m-input" id="company_email" name="company_email" value="{{ $companySetting->company_email }}" placeholder="contato@empresa.com.br" required>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_phone">Telefone</label>
                            <input type="text" class="form-control m-input" id="company_phone" name="company_phone" value="{{ $companySetting->company_phone }}" placeholder="(11) 00000-0000" required>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_website">Website</label>
                            <input type="url" class="form-control m-input" id="company_website" name="company_website" value="{{ $companySetting->company_website }}" placeholder="www.empresa.com.br">
                            <span class="m-form__help">http:// será adicionado automaticamente se não informado</span>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_description">Descrição</label>
                            <textarea class="form-control m-input" id="company_description" name="company_description" rows="3" placeholder="Breve descrição da empresa...">{{ $companySetting->company_description }}</textarea>
                        </div>

                        <div class="form-group m-form__group mb-0">
                            <label for="company_logo">Logo da empresa</label>
                            <input type="file" class="form-control-file" id="company_logo" name="company_logo" accept="image/*">
                            <span class="m-form__help">JPG, PNG ou GIF — máx. 2MB</span>
                            <div id="company-logo-preview-container" class="mt-2" style="display: {{ $companySetting->company_logo ? 'block' : 'none' }};">
                                <img id="company-logo-preview" src="{{ $companySetting->company_logo ? route('company.logo', ['path' => $companySetting->company_logo]) : '' }}" alt="Logo atual" style="max-height: 100px; max-width: 100%; border: 1px solid #e3e6f0; padding: 8px; border-radius: 6px; background: #fff;">
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-6">
                        <h5 class="mb-4">Endereço</h5>

                        <div class="alert alert-light border mb-4">
                            Informe o CEP para preenchimento automático de rua, bairro, cidade e estado.
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_zip">CEP</label>
                            <input type="text" class="form-control m-input" id="company_zip" name="company_zip" value="{{ $companySetting->company_zip }}" placeholder="00000-000" required>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_address">Endereço</label>
                            <input type="text" class="form-control m-input" id="company_address" name="company_address" value="{{ $companySetting->company_address }}" placeholder="Rua, Avenida..." required>
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group m-form__group">
                                    <label for="company_number">Número</label>
                                    <input type="text" class="form-control m-input" id="company_number" name="company_number" value="{{ $companySetting->company_number }}" placeholder="123" required>
                                </div>
                            </div>
                            <div class="col-md-8">
                                <div class="form-group m-form__group">
                                    <label for="company_complement">Complemento</label>
                                    <input type="text" class="form-control m-input" id="company_complement" name="company_complement" value="{{ $companySetting->company_complement }}" placeholder="Apto, Sala...">
                                </div>
                            </div>
                        </div>

                        <div class="form-group m-form__group">
                            <label for="company_district">Bairro</label>
                            <input type="text" class="form-control m-input" id="company_district" name="company_district" value="{{ $companySetting->company_district }}" placeholder="Centro" required>
                        </div>

                        <div class="row">
                            <div class="col-md-8">
                                <div class="form-group m-form__group">
                                    <label for="company_city">Cidade</label>
                                    <input type="text" class="form-control m-input" id="company_city" name="company_city" value="{{ $companySetting->company_city }}" placeholder="São Paulo" required>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group m-form__group">
                                    <label for="company_state">Estado</label>
                                    <select class="form-control m-input" id="company_state" name="company_state" required>
                                        @foreach(['AC','AL','AP','AM','BA','CE','DF','ES','GO','MA','MT','MS','MG','PA','PB','PR','PE','PI','RJ','RN','RS','RO','RR','SC','SP','SE','TO'] as $uf)
                                            <option value="{{ $uf }}" {{ $companySetting->company_state == $uf ? 'selected' : '' }}>{{ $uf }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="m-portlet__foot m-portlet__foot--fit">
                <div class="m-form__actions">
                    <button type="submit" class="btn btn-primary">
                        <span id="company-save-icon"><i class="la la-check"></i></span>
                        <span id="company-save-text"> Salvar informações</span>
                    </button>
                    <a href="{{ url()->previous() }}" class="btn btn-secondary">
                        <i class="la la-times"></i> Cancelar
                    </a>
                </div>
            </div>
        </form>
    </div>
</div>

@push('scripts')
<script>
$(document).ready(function() {
    function applyInputMasks() {
        $('input[name="company_document"]').mask('00.000.000/0000-00');
        $('input[name="company_phone"]').mask('(00) 00000-0000');
        $('input[name="company_zip"]').mask('00000-000');
    }

    applyInputMasks();

    $('input[name="company_website"]').on('blur', function() {
        var website = $(this).val().trim();
        if (website && !website.match(/^https?:\/\//)) {
            $(this).val('http://' + website);
        }
    });

    $('input[name="company_zip"]').blur(function() {
        var cep = $(this).val().replace(/\D/g, '');
        if (cep.length === 8) {
            $.getJSON('https://viacep.com.br/ws/' + cep + '/json/?callback=?', function(data) {
                if (!data.erro) {
                    $('input[name="company_address"]').val(data.logradouro);
                    $('input[name="company_district"]').val(data.bairro);
                    $('input[name="company_city"]').val(data.localidade);
                    $('select[name="company_state"]').val(data.uf);
                }
            });
        }
    });

    $('#company-form').on('submit', function(e) {
        e.preventDefault();

        let formData = new FormData(this);
        var submitButton = $(this).find('button[type="submit"]');
        submitButton.prop('disabled', true);
        $('#company-save-icon').html('<i class="la la-spinner la-spin"></i>');
        $('#company-save-text').text(' Salvando...');

        $.ajax({
            url: $(this).attr('action'),
            method: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function(response) {
                swal({
                    title: 'Sucesso!',
                    text: 'Informações da empresa atualizadas com sucesso!',
                    icon: 'success',
                    confirmButtonText: 'OK'
                });

                if (response.logo_url) {
                    $('#company-logo-preview').attr('src', response.logo_url + '?t=' + new Date().getTime());
                    $('#company-logo-preview-container').show();
                }
            },
            error: function(xhr) {
                let message = 'Erro ao salvar informações da empresa.';
                if (xhr.responseJSON && xhr.responseJSON.message) {
                    message = xhr.responseJSON.message;
                }

                Swal.fire({
                    title: 'Erro!',
                    text: message,
                    icon: 'error',
                    confirmButtonText: 'OK'
                });
            },
            complete: function() {
                submitButton.prop('disabled', false);
                $('#company-save-icon').html('<i class="la la-check"></i>');
                $('#company-save-text').text(' Salvar informações');
            }
        });
    });

    $('#company_logo').on('change', function() {
        var file = this.files[0];
        if (!file || !file.type.match('image.*')) {
            return;
        }

        var reader = new FileReader();
        reader.onload = function(e) {
            $('#company-logo-preview').attr('src', e.target.result);
            $('#company-logo-preview-container').show();
        };
        reader.readAsDataURL(file);
    });
});
</script>
@endpush

@endsection