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

@section('content')
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<main class="content">
    <div class="p-0">
        <h1 class="h3 mb-3">Visualizando a Tramitação do Protocolo Nº {{$protocolo->referencia}}</h1>
        <div class="row">
            <div class="col-12">
                <div class="card">

                    <div class="card-header">
                        <h5 class="card-title mb-0">Visualize onde está seu Protocolo</h5>
                        <a href="{{ route('tramitacoes.index', $tenant_id) }}" class="btn btn-outline-primary btn-sm w-100">Ver
                            todas</a>
                    </div>
                    <div class="card-content">
                        <div class="py-2" id="tramitacao">
                            <div class="card">
                                <div class="card-header">
                                    <div class="row">
                                        <strong class="align-middle">
                                            Tramitado em {{ date('d/m/Y', strtotime($tramitacao->created_at)) }}
                                            ({{ $tramitacao->created_at->diffForHumans() }})
                                        </strong>
                                    </div>
                                </div>
                                <div class="card-body">
                                    <ul class="list-group list-group-flush">
                                        <li class="list-group-item">
                                            <div class="bg-light p-2 border-start border-4 border-info mb-4">
                                                <div class="row">
                                                    <div class="col">
                                                        <label class="form-label">
                                                            <i class="fa fa-arrow-right"></i> Tramitado para o
                                                            funcionário:
                                                        </label>
                                                        <h3>{{ $tramitacao->userDestino->name }}</h3>
                                                    </div>
                                                    <div class="col">
                                                        <label class="form-label">
                                                            <i class="fa fa-arrow-right"></i> Do setor:
                                                        </label>
                                                        <h3>{{ $tramitacao->setorDestino->descricao }}</h3>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li class="list-group-item">
                                            <div class="row">
                                                <div class="col">
                                                    <label class="form-label">Funcionário de Origem:</label>
                                                    <h4>{{ $tramitacao->userOrigem->name }}</h4>
                                                </div>
                                                <div class="col">
                                                    <label class="form-label">Setor de Origem:</label>
                                                    <h4>{{ $tramitacao->setorOrigem->descricao }}</h4>
                                                </div>
                                            </div>
                                        </li>
                                        <li class="list-group-item">
                                            <div class="row">
                                                <div class="col">
                                                    @if ($tramitacao->recebido == 'S')
                                                    <h3 class="bg-light p-2 border-start border-4 border-success mb-4">Recebido em
                                                            {{ date('d/m/Y', strtotime($tramitacao->recebido_em)) }}</h3>
                                                    @else
                                                    <h3 class="bg-light p-2 border-start border-4 border-danger mb-4">Não Recebido</h3>                                                    
                                                    @endif
                                                </div>
                                                <div class="col">
                                                    @if ($tramitacao->tramitado == 'S')
                                                    <h3 class="bg-light p-2 border-start border-4 border-success mb-4">Tramitado em
                                                            {{ date('d/m/Y', strtotime($tramitacao->tramitado_em)) }}</h3>
                                                    @else
                                                    <h3 class="bg-light p-2 border-start border-4 border-warning mb-4">Não Tramitado</h3>                                                    
                                                    @endif
                                                </div>
                                            </div>
                                        </li>
                                        @if (!empty($tramitacao->mensagem))
                                        <li class="list-group-item">
                                            <div class="bg-light text-dark p-2 rounded">
                                                <p class="mb-0"><strong>Mensagem:</strong>
                                                    {{ $tramitacao->mensagem }}
                                                </p>
                                            </div>
                                        </li>
                                        @endif
                                        @if (!empty($tramitacao->mensagemRecebido))
                                        <li class="list-group-item">
                                            <div class="bg-light text-dark p-2 rounded">
                                                <p class="mb-0"><strong>Mensagem de recebimento:</strong>
                                                    {{ $tramitacao->mensagemRecebido }}
                                                </p>
                                            </div>
                                        </li>
                                        @endif
                                    </ul>
                                    <div class="card-body" id="protocolo">
                                        <form>
                                            <div class="row g-3">
                                                <div class="col-md-6">
                                                    <h3 class="bg-light p-2 border-start border-4 border-primary mb-4">
                                                        Protocolo Nº {{ $protocolo->referencia }}</h3>
                                                </div>
                                                <div class="col-md-3">
                                                    <label class="form-label">Data</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ $protocolo->created_at->format('d/m/Y') }}" readonly>
                                                </div>
                                                <div class="col-md-3">
                                                    <label class="form-label">Hora</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ $protocolo->created_at->format('H:i') }}" readonly>
                                                </div>
                                            </div>
                                            <div class="row g-3 mt-2">
                                                <div class="col-md-6">
                                                    <label class="form-label">Funcionário Responsável pelo
                                                        Protocolo</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ $protocolo->user->name }}" readonly tabindex="-1">
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label">Setor de Origem</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ $protocolo->user->setor->descricao }}" readonly
                                                        tabindex="-1">
                                                </div>
                                            </div>
                                            <div class="row g-3 mt-2">
                                                <div class="col-md-6">
                                                    <label class="form-label">N° do Processo/Referência</label>
                                                    <input type="text"
                                                        class="form-control{{ $errors->has('referencia') ? ' is-invalid' : '' }}"
                                                        value="{{ old('referencia') ?? $protocolo->referencia }}"
                                                        readonly>
                                                    @if ($errors->has('referencia'))
                                                    <div class="invalid-feedback">
                                                        {{ $errors->first('referencia') }}
                                                    </div>
                                                    @endif
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label">Tipo do Protocolo</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ $protocolo->protocoloTipo->descricao }}" readonly>
                                                </div>
                                            </div>
                                            <div class="mb-3 mt-3">
                                                <label class="form-label">Conteúdo/Descrição</label>
                                                <textarea class="form-control" rows="5" readonly>{{ $protocolo->conteudo }}</textarea>
                                            </div>
                                            @if ($protocolo->concluido === 'n')
                                            <div class="mb-3">
                                                <label class="form-label">Situação</label>
                                                <input type="text" class="form-control fw-bold"
                                                    value="{{ $protocolo->protocoloSituacao->descricao }}"
                                                    readonly>
                                            </div>
                                            @else
                                            <div class="row g-3 mt-2">
                                                <div class="col-sm-6">
                                                    <label class="form-label">Situação</label>
                                                    <input type="text" class="form-control fw-bold"
                                                        value="{{ $protocolo->protocoloSituacao->descricao }}"
                                                        readonly>
                                                </div>
                                                <div class="col-sm-3">
                                                    <label class="form-label">Data (conclusão)</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ date('d/m/Y', strtotime($protocolo->concluido_em)) }}"
                                                        readonly>
                                                </div>
                                                <div class="col-sm-3">
                                                    <label class="form-label">Hora (conclusão)</label>
                                                    <input type="text" class="form-control"
                                                        value="{{ date('H:i', strtotime($protocolo->concluido_em)) }}"
                                                        readonly>
                                                </div>
                                            </div>
                                            <div class="mt-3 mb-3">
                                                <label class="form-label">Notas de conclusão</label>
                                                <textarea class="form-control" rows="3" readonly>{{ $protocolo->concluido_mensagem }}</textarea>
                                            </div>
                                            @endif
                                        </form>
                                        <div class="container">
                                            <h5 class="bg-light p-2 border-start border-4 border-primary mb-4">Anexos</h5>
                                            <div class="mt-2">
                                                @if (!$anexos->isEmpty())
                                                <div class="table-responsive">
                                                    <table class="table table-striped align-middle">
                                                        <thead>
                                                            <tr>
                                                                <th scope="col">Data</th>
                                                                <th scope="col">Hora</th>
                                                                <th scope="col">Arquivo</th>
                                                                <th scope="col">Enviado por</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            @foreach ($anexos as $anexo)
                                                            <tr>
                                                                <td>{{ $anexo->created_at->format('d/m/Y') }}
                                                                </td>
                                                                <td>{{ $anexo->created_at->format('H:i') }}
                                                                </td>
                                                                <td><a
                                                                        href="{{ route('anexos.download', [$tenant_id, $anexo->codigoAnexoPublico]) }}">{{ $anexo->arquivoNome }}</a>
                                                                </td>
                                                                <td>{{ $anexo->user->name }}</td>
                                                            </tr>
                                                            @endforeach
                                                        </tbody>
                                                    </table>
                                                </div>
                                                @else
                                                <p class="text-muted">Nenhum anexo encontrado</p>
                                                @endif
                                            </div>

                                        </div>
                                        <div class="container">
                                            <<h5 class="bg-light p-2 border-start border-4 border-primary mb-4">Tramitações</h5>
                                            
                                            @if (!$protocolo->tramitacaos->isEmpty())
                                            <div class="card-body">
                                                <div class="table-responsive">
                                                    <table class="table table-striped align-middle">
                                                        <thead class="table-light">
                                                            <tr>
                                                                <th>Data</th>
                                                                <th>Hora</th>
                                                                <th>Tempo</th>
                                                                <th class="text-end">N° Prot.</th>
                                                                <th>Funcionário de Origem</th>
                                                                <th>Setor de Origem</th>
                                                                <th>Tramitado Para</th>
                                                                <th>No Setor</th>
                                                                <th>Recebido</th>
                                                                <th>Ações</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            @foreach ($protocolo->tramitacaos->sortByDesc('id') as $tramitacao_temp)
                                                            <tr>
                                                                <td>{{ $tramitacao_temp->created_at->format('d/m/Y') }}
                                                                </td>
                                                                <td>{{ $tramitacao_temp->created_at->format('H:i') }}
                                                                </td>
                                                                <td>{{ $tramitacao_temp->created_at->diffForHumans() }}
                                                                </td>
                                                                <td class="text-end">
                                                                    <strong>{{ $tramitacao_temp->protocolo->referencia }}</strong>
                                                                </td>
                                                                <td>
                                                                    @if (Auth::user()->id == $tramitacao_temp->userOrigem->id)
                                                                    <strong
                                                                        class="text-warning">{{ $tramitacao_temp->userOrigem->name }}</strong>
                                                                    @else
                                                                    {{ $tramitacao_temp->userOrigem->name }}
                                                                    @endif
                                                                </td>
                                                                <td>{{ $tramitacao_temp->setorOrigem->descricao }}
                                                                </td>
                                                                <td>
                                                                    @if (Auth::user()->id == $tramitacao_temp->userDestino->id)
                                                                    <strong class="text-warning"><i
                                                                            class="fas fa-hand-point-right me-1"></i>{{ $tramitacao_temp->userDestino->name }}</strong>
                                                                    @else
                                                                    <i
                                                                        class="fas fa-hand-point-right me-1"></i>{{ $tramitacao_temp->userDestino->name }}
                                                                    @endif
                                                                </td>
                                                                <td>{{ $tramitacao_temp->setorDestino->descricao }}
                                                                </td>
                                                                <td>
                                                                    @if ($tramitacao_temp->recebido == 'S')
                                                                    <span class="badge bg-success">
                                                                        <i
                                                                            class="fas fa-thumbs-up me-1"></i>{{ date('d/m/Y', strtotime($tramitacao_temp->recebido_em)) }}
                                                                    </span>
                                                                    @else
                                                                    <span class="badge bg-danger">
                                                                        <i
                                                                            class="fas fa-thumbs-down me-1"></i>Não
                                                                        Recebido
                                                                    </span>
                                                                    @endif
                                                                </td>
                                                                <td>
                                                                    <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#modalTramitacao" data-tramitacao-id="{{ $tramitacao->id }}">
                                                                        <i class="fa-regular fa-eye"></i>
                                                                    </button>
                                                                </td>
                                                            </tr>
                                                            @endforeach
                                                        </tbody>
                                                    </table>
                                                </div>
                                                <div class="text-center py-2">
                                                    <p class="mb-0 text-danger">Esse protocolo foi tramitado
                                                        <strong class="text-danger">{{ $protocolo->tramitacaos->count() }}</strong>
                                                        vez(es)
                                                    </p>
                                                </div>
                                            </div>
                                            @else
                                            <div class="text-center py-4">
                                                <p class="mb-0">Esse protocolo não foi tramitado</p>
                                            </div>
                                        </div>
                                        @endif
                                        <div class="card-body">
                                            <h5 class="bg-light p-2 border-start border-4 border-primary mb-4">Funcionários com Acesso a este Protocolo</h5>
                                            <div class="table-responsive mt-3">
                                                <table class="table table-striped align-middle">
                                                    <thead class="table-light">
                                                        <tr>
                                                            <th>Funcionário</th>
                                                            <th>Setor</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($protocolo->users->sortBy('name') as $user)
                                                        <tr>
                                                            <td><i
                                                                    class="fas fa-user me-1 text-secondary"></i>{{ $user->name }}
                                                            </td>
                                                            <td><i
                                                                    class="fas fa-building me-1 text-muted"></i>{{ $user->setor->descricao }}
                                                            </td>
                                                        </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                        @if (!$protocolo->tramitacaos->isEmpty())
                                        <div class="modal fade" id="modalTramitacao" tabindex="-1"
                                            aria-labelledby="JanelaProfissional" aria-hidden="true">
                                            <div class="modal-dialog modal-dialog-centered modal-lg">
                                                <div class="modal-content border-0 shadow-lg">
                                                    <div class="modal-header bg-info text-white">
                                                        <h5 class="modal-title text-white">
                                                            <i class="fa fa-eye me-1"></i> Detalhes da Tramitação
                                                        </h5>
                                                        <button type="button" class="btn-close btn-close-white"
                                                            data-bs-dismiss="modal" aria-label="Fechar"></button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="text-center mb-3">
                                                            <span id="quando_text"
                                                                class="fw-bold fs-5 text-muted"></span>
                                                        </div>
                                                        <div class="bg-light border-start border-4 border-info p-3 rounded mb-3">
                                                            <div class="row">
                                                                <div class="col-md-6">
                                                                    <label class="form-label">
                                                                        <i class="fa fa-user text-info"></i>
                                                                        Tramitado para o funcionário:
                                                                    </label>
                                                                    <h6 id="tramitado_para_text"
                                                                        class="fw-semibold text-dark"></h6>
                                                                </div>
                                                                <div class="col-md-6">
                                                                    <label class="form-label">
                                                                        <i class="fa fa-building text-info"></i> Do
                                                                        setor:
                                                                    </label>
                                                                    <h6 id="no_setor_text"
                                                                        class="fw-semibold text-dark"></h6>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="row mb-3">
                                                            <div class="col-md-6">
                                                                <label class="form-label">
                                                                    <i class="fa fa-user-cog text-secondary"></i>
                                                                    Funcionário de Origem:</label>
                                                                <h6 id="funcionario_origem_text"
                                                                    class="fw-semibold text-dark"></h6>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label class="form-label">
                                                                    <i class="fa fa-sitemap text-secondary"></i>
                                                                    Setor de Origem:</label>
                                                                <h6 id="setor_origem_text"
                                                                    class="fw-semibold text-dark"></h6>
                                                            </div>
                                                        </div>
                                                        <div
                                                            class="bg-success text-white text-center rounded p-3 mb-3">
                                                            <h5 id="recebida_text" class="mb-0 fw-bold"></h5>
                                                        </div>
                                                        <div class="mb-3">
                                                            <label class="form-label">
                                                                <i class="fa fa-envelope text-primary"></i>
                                                                Mensagem Enviada:</label>
                                                            <div class="bg-light border rounded p-3"
                                                                id="menagem_text"></div>
                                                        </div>
                                                        <div class="mb-3">
                                                            <label class="form-label">
                                                                <i class="fa fa-reply text-primary"></i> Mensagem
                                                                de Recebimento:</label>
                                                            <div class="bg-light border rounded p-3"
                                                                id="menagem_recebimento_text"></div>
                                                        </div>
                                                    </div>
                                                    <div class="modal-footer bg-light">
                                                        <button type="button"
                                                            class="btn btn-outline-secondary w-100"
                                                            data-bs-dismiss="modal">
                                                            <i class="fa fa-times-circle"></i> Fechar
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex justify-content-end mb-4">
                            <a href="{{ route('tramitacoes.index', $tenant_id) }}"
                                class="btn btn-primary me-2 w-100">
                                <i class="fa fa-arrow-left"></i> Voltar
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
@endif

<script>
    $(document).ready(function() {
        // Removido o trecho do popover, pois Bootstrap 5 usa JavaScript puro para isso

        $('#modalTramitacao').on('show.bs.modal', function(e) {
            var tramitacaoid = $(e.relatedTarget).data('tramitacao-id');

            $.ajax({
                dataType: "json",
                url: "{{ route('tramitacoes.json', ['tenant_id' => $tenant_id, 'id' => ':id']) }}".replace(':id', tramitacaoid),
                type: "GET",
                success: function(json) {
                    $("#quando_text").text(json['quando']);
                    $("#tramitado_para_text").text(json['funcionario_destino']);
                    $("#no_setor_text").text(json['setor_destino']);
                    $("#funcionario_origem_text").text(json['funcionario_origem']);
                    $("#setor_origem_text").text(json['setor_origem']);
                    $("#recebida_text").text(json['recebido']);
                    $("#menagem_text").text(json['mensagem']);
                    $("#menagem_recebimento_text").text(json['mensagemRecebido']);
                },
                error: function(xhr) {
                    console.error("Erro ao buscar a tramitação:", xhr.responseText);
                }
            });
        });
    });
</script>
@endsection