@extends('layout.backend')
@section('content')
@if(session()->has('alert-error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    {!! session()->get('alert-error') !!}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif

@if($errors->any())
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <div class="mb-2"><strong><i class="fas fa-exclamation-triangle mr-1"></i> ATENÇÃO:</strong></div>
    <ul class="mb-0 pl-3">
        @foreach ($errors->all() as $error)
        <li>{!! $error !!}</li>
        @endforeach
    </ul>
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif

<div class="card shadow mb-4">
    <div class="card-header py-3 d-flex align-items-center">
        <i class="fas fa-cloud-upload-alt text-primary mr-2 fa-lg"></i>
        <h6 class="m-0 font-weight-bold text-primary">Enviar documento</h6>
    </div>
    <div class="card-body">
        {!! Form::open(['url' => route('documents.upload'), 'autocomplete' => 'off', 'files' => true]) !!}
        @method('POST')
        <div class="row">
            <div class="col-sm-12 col-md-5 mb-3">
                <label class="small font-weight-bold text-muted mb-1">Pasta</label>
                {!! Form::select('roles', $roles, $data['roles'] ?? null, ['class' => 'form-control form-control-sm']) !!}
            </div>
            <div class="col-sm-12 col-md-5 mb-3">
                <label class="small font-weight-bold text-muted mb-1">Descrição do arquivo</label>
                {!! Form::text('name', $data['name'] ?? '', ['id' => 'name', 'class' => 'form-control form-control-sm', 'placeholder' => 'Ex: Manual de procedimentos']) !!}
            </div>
            <div class="col-sm-12 col-md-2 mb-3">
                <label class="small font-weight-bold text-muted mb-1">Sigla <span class="text-danger">*</span></label>
                {!! Form::text('slug', $data['slug'] ?? '', ['id' => 'slug', 'class' => 'form-control form-control-sm', 'placeholder' => 'Ex: MP', 'maxlength' => 20, 'required']) !!}
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 col-md-8 mb-3">
                <label class="small font-weight-bold text-muted mb-1">Arquivo</label>
                <div class="custom-file">
                    <input id="file" type="file" class="custom-file-input @error('file') is-invalid @enderror" name="file">
                    <label class="custom-file-label" for="file">Escolher arquivo…</label>
                    @error('file')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                    @enderror
                </div>
                <small class="text-muted">Máx. 20 MB</small>
            </div>
        </div>
        <div class="row mt-2">
            <div class="col-sm-12 col-md-5">
                <div class="form-check">
                    <input class="form-check-input" type="checkbox" name="shareable" value="1" id="shareable">
                    <label class="form-check-label font-weight-bold text-muted small" for="shareable">
                        Compartilhável em apresentações
                    </label>
                    <small class="d-block text-muted">Quando marcado, este documento aparece como opção ao finalizar uma visita.</small>
                </div>
            </div>
        </div>
        <div class="row mt-3">
            <div class="col-12">
                <button type="submit" class="btn btn-primary">
                    <i class="fas fa-upload mr-1"></i> Enviar documento
                </button>
                <a href="{{ route('documents.index') }}" class="btn btn-outline-secondary ml-2">Cancelar</a>
            </div>
        </div>
        {!! Form::close() !!}
    </div>
</div>

@push('scripts')
<script>
document.getElementById('file')?.addEventListener('change', function(e) {
    var label = this.nextElementSibling;
    if (label) label.textContent = this.files[0]?.name || 'Escolher arquivo…';
});

var slugManuallyEdited = false;
document.getElementById('slug')?.addEventListener('input', function() {
    slugManuallyEdited = true;
});
document.getElementById('name')?.addEventListener('input', function() {
    if (slugManuallyEdited) return;
    var name = this.value;
    var match = name.match(/hlc[-_]?(\d+)/i);
    if (match) {
        document.getElementById('slug').value = 'HLC-' + match[1];
    } else {
        var words = name.split(/[\s\-_\/]+/);
        var slug = '';
        words.forEach(function(w) {
            var clean = w.replace(/[^a-zA-Z0-9À-ÿ]/g, '');
            if (clean.length > 0) slug += clean.charAt(0).toUpperCase();
        });
        document.getElementById('slug').value = slug.substring(0, 20);
    }
});
</script>
@endpush
@endsection