@extends('layouts.admin.theme')

@section('title', env('APP_NAME') . ' :: Arte Sacra - Análise de Histórico')

@section('content')

    <div class="card shadow-sm">
        
        @php $headLine = "<i class='fa-solid fa-church'></i> Arte Sacra - Análise de Histórico"; @endphp

        @include('components.buttons._headLineButtonsBackAdd', [
            "headLine" => __($headLine),
            "routeBack" => "admin.cultura.arteSacra.index",
            "routeBackParams" => [],
            "fontawesomeBack" => '<i class="fa-solid fa-rectangle-list"></i>',
            "nameBack" => __("Lista de Peças"),
            "routeAdd" => "admin.cultura.arteSacra.create",
            "routeAddParams" => [],
            "nameAdd" => __("Nova peça"),
            "permission" => "GERENCIADOR_DO_CADASTRO_DE_ARTE_SACRA",
        ])
        
        <div class="alert alert-info rounded-top-0">
            <small>
                <strong>Arte:</strong> {{ $acervo->nome_peca }} <br>
                <strong>Código:</strong> {{ $acervo->codigo_acervo }}
            </small>
        </div>

        <div class="card-body">
            @include('errors.messageFlash')

            <div class="card-subtitle mt-2 text-body-secondary">
                <button onclick="window.location.href='{{ route('admin.cultura.arteSacra.index') }}'"
                    class="btn btn-secondary d-inline text-white m-2">
                    <i class="fa-solid fa-reply"></i> Voltar
                </button>
                <button id="btn-incluir" class="btn btn-primary d-inline text-white m-2">Incluir Nova</button>
            </div>

            <div class="mt-3" id="form-avaliacao" style="display: none;">
                <form action="{{ route('admin.cultura.arteSacra.historico.store') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <input type="hidden" name="codigo_acervo" value="{{ old('codigo_acervo', $acervo->codigo_acervo) }}">
                    <input type="hidden" name="acervo_id" value="{{ $acervo->id }}">

                    <div class="row g-4 mb-4">
                        <div class="col-md-6">
                            <div class="card h-100 border-0 shadow-sm">
                                <div class="card-header bg-primary">
                                    <h6 class="mb-0 fw-bold text-white">
                                        <i class="fas fa-info-circle me-2"></i>Informações Principais
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <div class="mb-3">
                                        <label class="form-label fw-semibold d-flex align-items-center gap-2 mb-1">
                                            <i class="fas fa-barcode me-1 text-muted"></i>Novo Código de Acervo:
                                            <span class="text-muted small">(Preencher somente se necessário)</span>
                                            <button type="button" class="btn btn-sm btn-outline-secondary p-1 px-2"
                                                onclick="toggleNovoAcervo()" title="Adicionar código"
                                                style="font-size: 0.75rem;">
                                                <i class="fa-solid fa-plus" style="font-size: 0.75rem;"></i>
                                            </button>
                                        </label>
                                        <div id="novoAcervoWrapper"
                                         style="{{ old('novo_acervo') || $errors->has('novo_acervo') ? '' : 'display: none;' }}">
                                            <input type="text" name="novo_acervo" id="codigo_acervo"
                                               class="form-control border-primary border-1 @error('novo_acervo') is-invalid @enderror"
                                               value="{{ old('novo_acervo') }}">
                                            @error('novo_acervo')
                                                <div class="invalid-feedback">{{ $message }}</div>
                                            @enderror
                                        </div>
                                    </div>

                                    <div class="mb-3">
                                        <label for="restauracoes" class="form-label fw-semibold">
                                            <i class="fas fa-tools me-1 text-muted"></i>Restaurações:
                                        </label>
                                        <textarea name="restauracoes" class="form-control border-primary border-1 @error('restauracoes') is-invalid @enderror"
                                            rows="3" style="min-height: 80px;">{{ old('restauracoes') }}</textarea>
                                        @error('restauracoes')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="historicos_exposicoes" class="form-label fw-semibold">
                                            <i class="fas fa-history me-1 text-muted"></i>Históricos de
                                        Exposições:
                                        </label>
                                        <textarea name="historicos_exposicoes"
                                              class="form-control border-primary border-1 @error('historicos_exposicoes') is-invalid @enderror" rows="3"
                                            style="min-height: 80px;">{{ old('historicos_exposicoes') }}</textarea>
                                        @error('historicos_exposicoes')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="historicos_movimentacoes" class="form-label fw-semibold">
                                            <i class="fas fa-history me-1 text-muted"></i>Históricos de
                                        Movimentações:
                                        </label>
                                        <textarea name="historicos_movimentacoes"
                                              class="form-control border-primary border-1 @error('historicos_movimentacoes') is-invalid @enderror" rows="3"
                                            style="min-height: 80px;">{{ old('historicos_movimentacoes') }}</textarea>
                                        @error('historicos_movimentacoes')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="referencias_bibliograficas" class="form-label fw-semibold">
                                            <i class="fas fa-book me-1 text-muted"></i>Referências Bibliográficas:
                                        </label>
                                        <textarea name="referencias_bibliograficas"
                                              class="form-control border-primary border-1 @error('referencias_bibliograficas') is-invalid @enderror"
                                            rows="3" style="min-height: 80px;">{{ old('referencias_bibliograficas') }}</textarea>
                                        @error('referencias_bibliograficas')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="observacoes" class="form-label fw-semibold">
                                            <i class="fas fa-eye me-1 text-muted"></i>Observações:
                                        </label>
                                        <textarea name="observacoes" class="form-control border-primary border-1 @error('observacoes') is-invalid @enderror"
                                            rows="3" style="min-height: 80px;">{{ old('observacoes') }}</textarea>
                                        @error('observacoes')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="card h-100 border-0 shadow-sm d-flex flex-column">
                                <div class="card-header bg-primary">
                                    <h6 class="mb-0 fw-bold text-white">
                                        <i class="fas fa-user-check me-2"></i>Responsáveis e Datas
                                    </h6>
                                </div>
                                <div class="card-body flex-grow-1">
                                    <div class="mb-3">
                                        <label for="data_realizacao" class="form-label fw-semibold">
                                            <i class="far fa-calendar-alt me-1 text-muted"></i>Data da Avaliação:
                                        </label>
                                        <input type="date"
                                           class="form-control border-primary border-1 @error('data_realizacao') is-invalid @enderror"
                                           name="data_realizacao" value="{{ old('data_realizacao') }}" required>
                                        @error('data_realizacao')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="responsavel" class="form-label fw-semibold">
                                            <i class="fas fa-user-tie me-1 text-muted"></i>Responsável:
                                        </label>
                                        <input type="text"
                                           class="form-control border-primary border-1 @error('responsavel') is-invalid @enderror"
                                           name="responsavel" value="{{ old('responsavel') }}" required>
                                        @error('responsavel')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="data_revisao" class="form-label fw-semibold">
                                            <i class="far fa-calendar-check me-1 text-muted"></i>Data da Revisão:
                                        </label>
                                        <input type="date"
                                           class="form-control border-primary border-1 @error('data_revisao') is-invalid @enderror"
                                           name="data_revisao" value="{{ old('data_revisao') }}">
                                        @error('data_revisao')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>

                                    <div class="mb-3">
                                        <label for="revisor" class="form-label fw-semibold">
                                            <i class="fas fa-user-check me-1 text-muted"></i>Revisor:
                                        </label>
                                        <input type="text"
                                           class="form-control border-primary border-1 @error('revisor') is-invalid @enderror"
                                           name="revisor" value="{{ old('revisor') }}">
                                        @error('revisor')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>

                                <div class="card-footer bg-white border-0 d-flex justify-content-end px-3 pb-3">
                                    <button type="button" id="btn-cancelar" class="btn btn-secondary me-2">
                                        <i class="fas fa-times me-1"></i>Cancelar
                                    </button>
                                    <button type="submit" class="btn btn-primary">
                                        <i class="fas fa-save me-1"></i>Salvar
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>

            <div class="modal fade" id="modalEditar" tabindex="-1" aria-labelledby="modalEditarLabel"
             aria-hidden="true">
                <div class="modal-dialog modal-xl">
                    <form id="formEditar" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')
                        <div class="modal-content border-0 shadow-lg">
                            <div class="modal-header bg-primary text-white">
                                <h5 class="modal-title" id="modalEditarLabel">
                                    <i class="fas fa-edit me-2"></i>Editar Histórico
                                </h5>
                                <button type="button" class="btn-close btn-close-white" onclick="fecharModalEditar()"
                                aria-label="Fechar"></button>
                            </div>

                            <div class="modal-body p-4">
                                <input type="hidden" id="editar_id" name="id">

                                <div class="row g-4 mb-4">
                                    <div class="col-md-6">
                                        <div class="card h-100 border-0 shadow-sm">
                                            <div class="card-header bg-light">
                                                <h6 class="mb-0 fw-bold text-primary">
                                                    <i class="fas fa-info-circle me-2"></i>Informações Principais
                                                </h6>
                                            </div>
                                            <div class="card-body">
                                                <div class="row">
                                                    <div class="mb-3">
                                                        <label
                                                        class="form-label fw-semibold d-flex align-items-center gap-2 mb-1"
                                                        for="editar_novo_acervo">
                                                            <i class="fas fa-barcode me-1 text-muted"></i>Novo Código de
                                                        Acervo:
                                                            <span class="text-muted small">(Preencher somente se
                                                            necessário)</span>
                                                            <button type="button"
                                                                class="btn btn-sm btn-outline-secondary p-1 px-2"
                                                                onclick="document.getElementById('editarNovoAcervoWrapper').style.display = 'block'; this.style.display='none';"
                                                                title="Adicionar código" style="font-size: 0.75rem;">
                                                                <i class="fa-solid fa-plus"
                                                                style="font-size: 0.75rem;"></i>
                                                            </button>
                                                        </label>

                                                        <div id="editarNovoAcervoWrapper" style="display: none;">
                                                            <input type="text" name="novo_acervo" id="codigo_acervo"
                                                               class="form-control border-primary border-1">
                                                        </div>
                                                    </div>
                                                    <div class="mb-3">
                                                        <label for="editar_restauracoes" class="form-label fw-semibold">
                                                            <i class="fas fa-tools me-1 text-muted"></i>Restaurações:
                                                        </label>
                                                        <textarea name="restauracoes" id="editar_restauracoes" class="form-control border-primary border-1" rows="3"
                                                        style="min-height: 80px;"></textarea>
                                                    </div>
                                                    <div class="mb-3">
                                                        <label for="editar_exposicoes" class="form-label fw-semibold">
                                                            <i class="fas fa-history me-1 text-muted"></i>Históricos de
                                                        Exposições:
                                                        </label>
                                                        <textarea name="historicos_exposicoes" id="editar_exposicoes" class="form-control border-primary border-1" rows="3"
                                                        style="min-height: 80px;"></textarea>
                                                    </div>
                                                    <div class="mb-3">
                                                        <label for="editar_movimentacoes" class="form-label fw-semibold">
                                                            <i class="fas fa-history me-1 text-muted"></i>Históricos de
                                                        Movimentações:
                                                        </label>
                                                        <textarea name="historicos_movimentacoes" id="editar_movimentacoes" class="form-control border-primary border-1"
                                                        rows="3" style="min-height: 80px;"></textarea>
                                                    </div>
                                                    <div class="mb-3">
                                                        <label for="editar_referencias" class="form-label fw-semibold">
                                                            <i class="fas fa-book me-1 text-muted"></i>Referências
                                                        Bibliográficas:
                                                        </label>
                                                        <textarea name="referencias_bibliograficas" id="editar_referencias" class="form-control border-primary border-1"
                                                        rows="3" style="min-height: 80px;"></textarea>
                                                    </div>

                                                    <div class="mb-3">
                                                        <label for="editar_observacoes" class="form-label fw-semibold">
                                                            <i class="fas fa-eye me-1 text-muted"></i>Observações:
                                                        </label>
                                                        <textarea name="observacoes" id="editar_observacoes" class="form-control border-primary border-1" rows="3"
                                                        style="min-height: 80px;"></textarea>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-6">
                                        <div class="card h-100 border-0 shadow-sm d-flex flex-column">
                                            <div class="card-header bg-light">
                                                <h6 class="mb-0 fw-bold text-primary">
                                                    <i class="fas fa-user-check me-2"></i>Responsáveis e Datas
                                                </h6>
                                            </div>
                                            <div class="card-body flex-grow-1">
                                                <div class="mb-3">
                                                    <label for="editar_data_realizacao" class="form-label fw-semibold">
                                                        <i class="far fa-calendar-alt me-1 text-muted"></i>Data da
                                                    Avaliação:
                                                    </label>
                                                    <input type="date" name="data_realizacao"
                                                       id="editar_data_realizacao"
                                                       class="form-control border-primary border-1" required>
                                                </div>

                                                <div class="mb-3">
                                                    <label for="editar_responsavel" class="form-label fw-semibold">
                                                        <i class="fas fa-user-tie me-1 text-muted"></i>Responsável:
                                                    </label>
                                                    <input type="text" name="responsavel" id="editar_responsavel"
                                                       class="form-control border-primary border-1" required>
                                                </div>

                                                <div class="mb-3">
                                                    <label for="editar_data_revisao" class="form-label fw-semibold">
                                                        <i class="far fa-calendar-check me-1 text-muted"></i>Data da
                                                    Revisão:
                                                    </label>
                                                    <input type="date" name="data_revisao" id="editar_data_revisao"
                                                       class="form-control border-primary border-1">
                                                </div>

                                                <div class="mb-3">
                                                    <label for="editar_revisor" class="form-label fw-semibold">
                                                        <i class="fas fa-user-check me-1 text-muted"></i>Revisor:
                                                    </label>
                                                    <input type="text" name="revisor" id="editar_revisor"
                                                       class="form-control border-primary border-1">
                                                </div>
                                            </div>

                                            <div
                                            class="card-footer bg-white border-0 d-flex justify-content-end px-3 pb-3">
                                                <button type="button" class="btn btn-secondary me-2"
                                                    onclick="fecharModalEditar()">
                                                    <i class="fas fa-times me-1"></i>Cancelar
                                                </button>
                                                <button type="submit" class="btn btn-primary">
                                                    <i class="fas fa-save me-1"></i>Salvar Alterações
                                                </button>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <div class="table-responsive mt-4">
                <table class="table table-bordered table-hover table-striped align-middle text-center">
                    <thead class="table-light">
                        <tr>
                            <th>Novo Acervo</th>
                            <th>Restaurações</th>
                            <th>Históricos de Exposições</th>
                            <th>Históricos de Movimentações</th>
                            <th>Referências</th>
                            <th>Observações</th>
                            <th>Data Realização</th>
                            <th>Responsável</th>
                            <th>Data Revisão</th>
                            <th>Revisor</th>
                            <th>Ações</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($historicos as $historico)
                            <tr>
                                <td>{{ $historico->novo_acervo ?? 'Não informado' }}</td>
                                <td>{{ $historico->restauracoes }}</td>
                                <td>{{ $historico->historicos_exposicoes }}</td>
                                <td>{{ $historico->historicos_movimentacoes }}</td>
                                <td>{{ $historico->referencias_bibliograficas }}</td>
                                <td>{{ $historico->observacoes }}</td>
                                <td>{{ date("d/m/Y", strtotime($historico->data_realizacao)) }}</td>
                                <td>{{ $historico->responsavel }}</td>
                                <td>{{ date("d/m/Y", strtotime($historico->data_revisao)) }}</td>
                                <td>{{ $historico->revisor }}</td>
                                <td>
                                    <div class="btn-group" role="group">
                                        <button class="btn btn-sm btn-warning btn-editar" data-id="{{ $historico->id }}"
                                        data-url="{{ route('admin.cultura.arteSacra.historico.update', $historico->id) }}"
                                        data-novo_acervo="{{ $historico->novo_acervo }}"
                                        data-restauracoes="{{ $historico->restauracoes }}"
                                        data-exposicoes="{{ $historico->historicos_exposicoes }}"
                                        data-movimentacoes="{{ $historico->historicos_movimentacoes }}"
                                        data-referencias="{{ $historico->referencias_bibliograficas }}"
                                        data-observacoes="{{ $historico->observacoes }}"
                                        data-data_realizacao="{{ $historico->data_realizacao }}"
                                        data-responsavel="{{ $historico->responsavel }}"
                                        data-data_revisao="{{ $historico->data_revisao }}"
                                        data-revisor="{{ $historico->revisor }}">
                                            <i class="fa fa-edit"></i>
                                        </button>
                                        <form action="{{ route('admin.cultura.arteSacra.historico.destroy', $historico->id) }}"
                                      method="POST" class="d-inline"
                                      onsubmit="return confirm('Tem certeza que deseja excluir este histórico?');">
                                            @csrf
                                            @method('DELETE')
                                            <button class="btn btn-sm btn-danger"><i class="fa fa-trash"></i></button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="12" class="text-center">Nenhum histórico cadastrado.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    @endsection