@extends('entidade.admin.layouts.layout')

@section('content')
<main class="content">
    <script src="https://cdn.tiny.cloud/1/rcjw03tjfu0hq8dkm2bkb8qcwhd4nyavx70mdvyk6t6a8uzl/tinymce/7/tinymce.min.js"
        referrerpolicy="origin"></script>

    <div class="container-fluid p-0">
        <h1 class="h3 mb-3">Cadastrando Documento</h1>
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <a href="{{ route('documentos.index', $tenant_id ) }}" class="btn btn-outline-primary btn-sm w-100">
                            Ver todos
                        </a>
                    </div>
                    <div class="card-body pt-0">
                        <form method="POST" action="{{ route('documentos.store', $tenant_id) }}">
                            @csrf
                            <div class="form-group">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label">Tipo</label>
                                        <select class="form-control @error('modelo_id') is-invalid @enderror"
                                            name="modelo_id">
                                            <option value="">Selecione</option>
                                            @foreach ($protocolotipos as $tipos)
                                            <option value="{{ $tipos->id }}"
                                                {{ old('modelo_id') == $tipos->id ? 'selected' : '' }}>
                                                {{ $tipos->descricao }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="col-md-3">
                                        <label class="form-label">Número</label>
                                        <input type="number" class="form-control @error('numero') is-invalid @enderror" name="numero" value="{{ old('numero') }}" placeholder="0001/{{ date('Y') }}">
                                    </div>

                                    <div class="col-md-2">
                                        <label class="form-label">Data</label>
                                        <input type="date"
                                            class="form-control @error('data') is-invalid @enderror" name="data"
                                            value="{{ old('data') }}">
                                    </div>

                                    <div class="col-md-4">
                                        <label class="form-label">Assunto</label>
                                        <input type="text"
                                            class="form-control @error('assunto') is-invalid @enderror"
                                            name="assunto" value="{{ old('assunto') }}" placeholder="Assunto">
                                    </div>
                                </div>

                                <div class="mt-3">
                                    <button type="button" class="btn btn-outline-secondary w-100" id="gerar-ia">
                                        Gerar descrição com IA
                                    </button>
                                </div>

                                <div class="mt-4">
                                    <label class="form-label">Descrição</label>
                                    <textarea id="descricao" name="descricao"
                                        class="form-control @error('descricao') is-invalid @enderror" rows="10"
                                        placeholder="Digite seu documento ou clique em 'Gerar descrição com IA'">{{ old('descricao') }}</textarea>
                                </div>

                                <br>
                                <button type="submit" class="btn btn-success w-100">Gravar</button>
                            </div>
                        </form>

                        <script>
                            tinymce.init({
                                selector: '#descricao',
                                language: 'pt_BR',
                                height: 300,
                                plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount',
                                toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link image media table | align lineheight | numlist bullist indent outdent | emoticons charmap | removeformat'
                            });

                            document.getElementById('gerar-ia').addEventListener('click', function() {
                                const modelo = document.querySelector('select[name="modelo_id"]').value;
                                const modeloTexto = document.querySelector('select[name="modelo_id"] option:checked').text;
                                const assunto = document.querySelector('input[name="assunto"]').value;

                                if (!modelo || !assunto) {
                                    alert('Informe o tipo e o assunto para gerar a descrição com IA.');
                                    return;
                                }

                                const prompt = `Crie um documento do tipo "${modeloTexto}" com o assunto "${assunto}". Seja objetivo e profissional.`;

                                fetch("{{ route('documentos.gerarIA', $tenant_id) }}", {
                                        method: 'POST',
                                        headers: {
                                            'Content-Type': 'application/json',
                                            'X-CSRF-TOKEN': "{{ csrf_token() }}"
                                        },
                                        body: JSON.stringify({
                                            prompt: 'gerar',
                                            modelo: modeloTexto,
                                            assunto: assunto
                                        })
                                    })
                                    .then(response => response.json())
                                    .then(data => {
                                        if (data.resultado) {
                                            tinymce.get('descricao').setContent(data.resultado);
                                        } else {
                                            alert(data.erro || 'Erro ao gerar descrição com IA.');
                                        }
                                    });
                            });
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
@endsection