@extends('painel-admin.menu')
@section('title', 'Dashboard APRESI')
@section('content')
   <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                @if(session('errors'))
                    <div class="alert alert-danger">
                        <ul>
                            @foreach(session('errors')->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
            </div>
        </div>
        <div class="row">
            <div class="col-12 mt-3">
                <div class="d-flex flex-column flex-sm-row justify-content-between align-items-sm-center flex-wrap">
                    <h2 class="mb-3 mb-sm-0">Dashboard</h2>

                    <div class="d-flex flex-column flex-sm-row flex-wrap" style="gap: 5px;">
                        <button type="submit" data-toggle="modal" data-target="#eventModal" class="btn btn-primary">
                            <i class="fas fa-plus"></i> Evento
                        </button>
                        <button type="submit" data-toggle="modal" data-target="#CriarTicket" class="btn btn-primary">
                            <i class="fas fa-plus"></i> Tarefa
                        </button>
                        <a href="{{ route('empresas.create') }}" class="btn btn-primary">
                            <i class="fa fa-plus"></i> Empresa
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @if($eventosSemana->count() > 0)
        <div class="mt-3">
            <ul class="list-group">
                @foreach($eventosSemana as $evento)
                    <li class="list-group-item alert alert-warning d-flex justify-content-between align-items-center" style="padding: 15px; border-left: 5px solid #ffc107;">
                        <div style="flex-grow: 1;">
                            <strong><i class="fas fa-calendar-alt"></i> Agenda:</strong> 
                            <span class="text-dark">
                                {{ $evento->titulo }} -  @if($evento->id_empresa != NULL)                
                                                            @foreach($empresas as $empresa)
                                                                @if($empresa->Codigo == $evento->id_empresa)
                                                                    {{ $empresa->RazaoSocialCliente }} -
                                                                @endif
                                                            @endforeach
                                                        @endif
                                {{ \Carbon\Carbon::parse($evento->data_evento)->format('d/m/Y H:i') }} - 
                                {{ ucwords(str_replace('_', ' ', $evento->tipo_evento)) }}
                            </span>
                        </div>     
                        <a title="Visualizar Dados" class="btn btn-info btn-sm" href="" data-toggle="modal" data-target="#eventoModal{{ $evento->id }}">
                            <i class="fas fa-eye"></i> Ver Descrição
                        </a>                   
                    </li>
                    <!-- Modal evento -->
                    <div class="modal fade" id="eventoModal{{ $evento->id }}" tabindex="-1" role="dialog" aria-labelledby="eventoModalLabel" aria-hidden="true">
                        <div class="modal-dialog modal-dialog-centered" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="eventoModalLabel">{{ $evento->titulo }}</h5>
                                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                    </button>
                                </div>
                                <div class="modal-body">
                                    <div class="row mb-3">
                                        <div class="col-md-12">
                                            <strong>Data e Hora:</strong>
                                            <p>{{ \Carbon\Carbon::parse($evento->data_evento)->format('d/m/Y H:i') }}</p>
                                        </div>
                                    </div>
                                    <div class="row mb-3">
                                        <div class="col-md-12">
                                            <strong>Cliente:</strong>
                                            <p>
                                                @if($evento->id_empresa == NULL)
                                                    Sem Cliente
                                                @else
                                                    @foreach($empresas as $empresa)
                                                        @if($empresa->Codigo == $evento->id_empresa)
                                                            {{ $empresa->RazaoSocialCliente }}
                                                        @endif
                                                    @endforeach
                                                @endif
                                            </p>
                                        </div>
                                    </div>
                                    <div class="row mb-3">
                                        <div class="col-md-12">
                                            <strong>Descrição:</strong>
                                            <p>{{ $evento->descricao }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <a href="{{ route('agenda.edit', $evento->id) }}" class="btn btn-success"><i class="fas fa-edit"></i>Editar</a>
                                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </ul>
        </div>
    @endif
    <br>
    <div class="card">
        <div class="card-header">
            <h3 class="d-flex justify-content-between align-items-center">
                Resumo Geral
                <button id="toggleButtonGeral" class="btn btn-sm btn-secondary" onclick="toggleSection('resumoGeral', 'toggleButtonGeral')">-</button>
            </h3>
        </div>
        <div id="resumoGeral" class="card-body">
            <div class="row mb-3">
                <div class="col-12 col-sm-6 col-md-3 mb-3">
                    <a href="{{ route('empresas.index') }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-primary text-white p-3 rounded shadow">
                            <i class="fa fa-users fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$clientes}}</h2>
                                <small>Empresas</small>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-12 col-sm-6 col-md-3 mb-3">
                    <a href="{{ route('tickets.index') }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-success text-white p-3 rounded shadow">
                            <i class="fa fa-calendar-o fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsabertos}}</h2>
                                <small>Tarefas Abertas</small>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-12 col-sm-6 col-md-3 mb-3">
                    <a href="{{ route('tickets.index', ['status' => 2]) }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-warning text-white p-3 rounded shadow">
                            <i class="fa fa-edit fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsfazendo}}</h2>
                                <small>Tarefas em Processo</small>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-12 col-sm-6 col-md-3 mb-3">
                    <a href="{{ route('tickets.index', ['status' => 1]) }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-danger text-white p-3 rounded shadow">
                            <i class="fa fa-check fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsfinalizados}}</h2>
                                <small>Tarefas Finalizadas</small>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <hr>
    <div class="card">
        <div class="card-header">
            <h3 class="d-flex justify-content-between align-items-center">
                Resumo do Usuário
                <button id="toggleButton" class="btn btn-sm btn-secondary" onclick="toggleSection('resumoUsuario', 'toggleButton')">+</button>
            </h3>
        </div>
        <div id="resumoUsuario" class="card-body">
            <div class="row mb-3">
                <div class="col-12 col-sm-6 col-md-4 mb-3">
                    <a href="{{ route('tickets.index', ['status' => 0, 'tecnico' => $usuario->id]) }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-success text-white p-3 rounded shadow">
                            <i class="fa fa-calendar-o fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsabertosUser}}</h2>
                                <small>Tarefas Abertas</small>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-12 col-sm-6 col-md-4 mb-3">
                    <a href="{{ route('tickets.index', ['status' => 2, 'tecnico' => $usuario->id]) }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-warning text-white p-3 rounded shadow">
                            <i class="fa fa-edit fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsfazendoUser}}</h2>
                                <small>Tarefas em Processo</small>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-12 col-sm-6 col-md-4 mb-3">
                    <a href="{{ route('tickets.index', ['status' => 1, 'tecnico' => $usuario->id]) }}" class="d-block h-100 text-decoration-none">
                        <div class="h-100 d-flex align-items-center bg-danger text-white p-3 rounded shadow">
                            <i class="fa fa-check fa-lg me-3"></i>
                            <div>
                                <h2 class="mb-0">{{$ticketsfinalizadosUser}}</h2>
                                <small>Tarefas Finalizadas</small>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <hr>
    
    @php
        $tarefasEmProcesso = $tarefas->where('status', 2);  
    @endphp
    @if($tarefasEmProcesso->count() > 0)
    <div class="card">
        <div class="card-header">
            <h3 class="d-flex justify-content-between align-items-center">
                Tarefas em processo
                <button id="toggleEmProcesso" class="btn btn-sm btn-secondary" onclick="toggleSection('TarefaEmProcesso', 'toggleEmProcesso')">-</button>
            </h3>
        </div>
        <div id="TarefaEmProcesso" class="card-body">
            <div class="table-responsive mb-3">
                <table class="table table-striped table-bordered" id="tableEmProcesso">
                    <thead>
                        <tr>
                            <th>ID</th>    
                            <th>Título</th>
                            <th>Cliente</th>
                            <th>Solicitante</th>
                            <th>Prioridade</th>
                            <th>Setor / Sistema</th>
                            <th>Data</th>
                            <th>Ações</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($tarefasEmProcesso as $tarefa)
                            @if($tarefa->status == 2)
                                <tr data-id="{{ $tarefa->id }}">
                                    <td data-label="ID">{{$tarefa->id}}</td>
                                    <td title="{{$tarefa->titulo}}" data-label="Título">{{$tarefa->titulo}}</td>
                                    <td data-label="Cliente">
                                        @if($tarefa->id_empresa == NULL)
                                            Sem Cliente
                                        @else
                                            @foreach($empresas as $empresa)
                                                @if($empresa->Codigo == $tarefa->id_empresa)
                                                    {{ $empresa->RazaoSocialCliente }}
                                                @endif
                                            @endforeach
                                        @endif
                                    </td>
                                    <td title="{{$tarefa->solicitante}}" data-label="Solicitante">{{$tarefa->solicitante}}</td>
                                    <td data-label="Prioridade">
                                        {{ ['Sugestão', 'Baixo', 'Médio', 'Alto', 'Urgente'][$tarefa->prioridade - 1] }}
                                    </td>
                                    <td data-label="Setor / Sistema">{{ $tarefa->setor }} / {{ $tarefa->sistema }}</td>
                                    <td data-label="Data">{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}</td>
                                    <td data-label="Ações">
                                        <div class="d-flex justify-content-center"> 
                                            <a title="Editar" href="{{route('tickets.edit', $tarefa)}}"><i class="fas fa-edit text-info mr-1"></i></a>
                                            <a title="Visualizar Dados" href="" data-toggle="modal" data-target="#DadosModal{{ $tarefa->id }}"><i class="fas fa-eye mr-1"></i></a>
                                            <a title="Finalizar" href="" data-toggle="modal" data-target="#FinalizarModalEmProcesso{{ $tarefa->id }}"><i class="fas fa-check text-success mr-1"></i></a>
                                        </div>
                                    </td>
                                </tr>

                                <!-- Modal de dados da tarefa em processo -->
                                <div class="modal fade" id="DadosModal{{ $tarefa->id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-lg" role="document" >
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">Detalhes do Registro</h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">ID:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->id }}" readonly>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="sistema">Sistema:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->sistema }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Título:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->titulo }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="alteracao">Motivo</label>
                                                        <textarea class="form-control" readonly>{{ $tarefa->motivo }}</textarea>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Solicitante:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->solicitante }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">Status:</label>
                                                        <select class="form-control" name="status" disabled>
                                                            <option value="0" {{ $tarefa->status == 0 ? 'selected' : '' }}>Aberto</option>
                                                            <option value="1" {{ $tarefa->status == 2 ? 'selected' : '' }}>Fazendo</option>
                                                            <option value="2" {{ $tarefa->status == 1 ? 'selected' : '' }}>Finalizado</option>
                                                        </select>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="prioridade">Prioridade:</label>
                                                        <select class="form-control" id="prioridade" name="prioridade" disabled>
                                                            <option value="1" {{ $tarefa->prioridade == 1 ? 'selected' : '' }}>Sugestão</option>
                                                            <option value="2" {{ $tarefa->prioridade == 2 ? 'selected' : '' }}>Baixo</option>
                                                            <option value="3" {{ $tarefa->prioridade == 3 ? 'selected' : '' }}>Médio</option>
                                                            <option value="4" {{ $tarefa->prioridade == 4 ? 'selected' : '' }}>Alto</option>
                                                            <option value="5" {{ $tarefa->prioridade == 5 ? 'selected' : '' }}>Urgente</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Solução:</label>
                                                        <textarea class="form-control" name="solucao" readonly>{{ $tarefa->solucao }}</textarea>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                                                                                    <label for="arquivo">Sem documento Vinculado</label>
                                                                                                            </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">Abertura por:</label>
                                                        <select class="form-control" id="abertura" name="abetura" disabled>
                                                            @foreach($responsaveis as $user)
                                                                <option value="{{ $user->id }}" @if($tarefa->user_abertura == $user->id) selected @endif>{{ $user->nome}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="sistema">Responsável:</label>
                                                        <select class="form-control" id="responsavel" name="responsavel" disabled>
                                                            <option value="" disabled>Selecione o responsável</option>
                                                            <option value="0" @if($tarefa->user_responsavel == 0) selected @endif>Sem responsável</option>
                                                            @foreach($responsaveis as $responsavel)
                                                                <option value="{{ $responsavel->id }}" @if($tarefa->user_responsavel == $responsavel->id) selected @endif>{{ $responsavel->nome}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="versao">Data de Abetura:</label>
                                                        <input type="text" class="form-control" value="{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}" readonly>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="data_versao">Data de Fechamento:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->data_fechamento ? \Carbon\Carbon::parse($tarefa->data_fechamento)->format('d/m/Y') : '' }}" readonly>
                                                    </div>
                                                </div>
                                            </div>  
                                            <div class="modal-footer">
                                                <a class="btn btn-info mb-2 mb-sm-0 mr-sm-2" title="Visualizar" href="{{ route('tickets.show', $tarefa->id) }}">
                                                    <i class="fas fa-eye"></i> Mais Detalhes
                                                </a>
                                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            
                            @endif
                        @endforeach 
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <hr>
    @endif
    <div class="card">
        <div class="card-header">
            <h3 class="d-flex justify-content-between align-items-center">
                Tarefas em aberto
                <button id="toggleButtonEmAberto" class="btn btn-sm btn-secondary" onclick="toggleSection('TarefaEmAberto', 'toggleButtonEmAberto')">-</button>
            </h3>
        </div>
        <div id="TarefaEmAberto" class="card-body">
            <div class="table-responsive mb-3">
                <table class="table table-striped table-bordered" id="tableEmAberto">
                    <thead>
                        <tr>
                            <th>ID</th>    
                            <th>Título</th>
                            <th>Cliente</th>
                            <th>Solicitante</th>
                            <th>Prioridade</th>
                            <th>Setor / Sistema</th>
                            <th>Data</th>
                            <th>Ações</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($tarefas as $tarefa)
                            @if($tarefa->status == 0 || $tarefa->status == 1)
                                <tr data-id="{{ $tarefa->id }}">
                                    <td data-label="ID">{{$tarefa->id}}</td>
                                    <td title="{{$tarefa->titulo}}" data-label="Título">{{$tarefa->titulo}}</td>
                                    <td data-label="Cliente">
                                        @if($tarefa->id_empresa == NULL)
                                            Sem Cliente
                                        @else
                                            @foreach($empresas as $empresa)
                                                @if($empresa->Codigo == $tarefa->id_empresa)
                                                    {{ $empresa->RazaoSocialCliente }}
                                                @endif
                                            @endforeach
                                        @endif
                                    </td>
                                    <td title="{{$tarefa->solicitante}}" data-label="Solicitante">{{$tarefa->solicitante}}</td>
                                    <td data-label="Prioridade">
                                        {{ ['Sugestão', 'Baixo', 'Médio', 'Alto', 'Urgente'][$tarefa->prioridade - 1] }}
                                    </td>
                                    <td data-label="Setor / Sistema">{{ $tarefa->setor }} / {{ $tarefa->sistema }}</td>
                                    <td data-label="Data">{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}</td>
                                    <td data-label="Ações">
                                        <div class="d-flex justify-content-center"> 
                                            <a title="Editar" href="{{route('tickets.edit', $tarefa)}}"><i class="fas fa-edit text-info mr-1"></i></a>
                                            <a title="Visualizar Dados" href="" data-toggle="modal" data-target="#DadosModal{{ $tarefa->id }}"><i class="fas fa-eye mr-1"></i></a>
                                            <a title="Finalizar" href="" data-toggle="modal" data-target="#FinalizarModal{{ $tarefa->id }}"><i class="fas fa-check text-success mr-1"></i></a>
                                        </div>
                                    </td>
                                </tr>

                                <!-- Modal tarefas em aberto -->
                                <div class="modal fade" id="DadosModal{{ $tarefa->id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-lg" role="document" >
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">Detalhes do Registro</h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">ID:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->id }}" readonly>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="sistema">Sistema:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->sistema }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Título:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->titulo }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="alteracao">Motivo</label>
                                                        <textarea class="form-control" readonly>{{ $tarefa->motivo }}</textarea>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Solicitante:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->solicitante }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">Status:</label>
                                                        <select class="form-control" name="status" disabled>
                                                            <option value="0" {{ $tarefa->status == 0 ? 'selected' : '' }}>Aberto</option>
                                                            <option value="1" {{ $tarefa->status == 2 ? 'selected' : '' }}>Fazendo</option>
                                                            <option value="2" {{ $tarefa->status == 1 ? 'selected' : '' }}>Finalizado</option>
                                                        </select>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="prioridade">Prioridade:</label>
                                                        <select class="form-control" id="prioridade" name="prioridade" disabled>
                                                            <option value="1" {{ $tarefa->prioridade == 1 ? 'selected' : '' }}>Sugestão</option>
                                                            <option value="2" {{ $tarefa->prioridade == 2 ? 'selected' : '' }}>Baixo</option>
                                                            <option value="3" {{ $tarefa->prioridade == 3 ? 'selected' : '' }}>Médio</option>
                                                            <option value="4" {{ $tarefa->prioridade == 4 ? 'selected' : '' }}>Alto</option>
                                                            <option value="5" {{ $tarefa->prioridade == 5 ? 'selected' : '' }}>Urgente</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                        <label for="sistema">Solução:</label>
                                                        <textarea class="form-control" name="solucao" readonly>{{ $tarefa->solucao }}</textarea>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-12">
                                                                                                                    <label for="arquivo">Sem documento Vinculado</label>
                                                                                                            </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="sistema">Abertura por:</label>
                                                        <select class="form-control" id="abertura" name="abetura" disabled>
                                                            @foreach($responsaveis as $user)
                                                                <option value="{{ $user->id }}" @if($tarefa->user_abertura == $user->id) selected @endif>{{ $user->nome}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="sistema">Responsável:</label>
                                                        <select class="form-control" id="responsavel" name="responsavel" disabled>
                                                            <option value="" disabled>Selecione o responsável</option>
                                                            @foreach($responsaveis as $responsavel)
                                                                <option value="{{ $responsavel->id }}" @if($tarefa->user_responsavel == $responsavel->id) selected @endif>{{ $responsavel->nome}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row mt-2">
                                                    <div class="col-md-6">
                                                        <label for="versao">Data de Abetura:</label>
                                                        <input type="text" class="form-control" value="{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}" readonly>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <label for="data_versao">Data de Fechamento:</label>
                                                        <input type="text" class="form-control" value="{{ $tarefa->data_fechamento ? \Carbon\Carbon::parse($tarefa->data_fechamento)->format('d/m/Y') : '' }}" readonly>
                                                    </div>
                                                </div>
                                            </div>  
                                            <div class="modal-footer">
                                                <a class="btn btn-info mb-2 mb-sm-0 mr-sm-2" title="Visualizar" href="{{ route('tickets.show', $tarefa->id) }}">
                                                    <i class="fas fa-eye"></i> Mais Detalhes
                                                </a>
                                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endif
                        @endforeach 
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Modal de criação de tarefa -->
    <form method="POST" id="formCriarTicket" action="{{route('tickets.store')}}" enctype="multipart/form-data">
    @if(session('error'))
    <div class="alert alert-danger">
        {{ session('error') }}
    </div>
    @endif  
    @method('POST')
    @csrf
    <div class="modal fade" id="CriarTicket" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Criação do Registro</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">
            <div class="row">
            <div class="col-md-6">           
                <label>Data de Abertura</label>
                <input type="date" class="form-control" id="data_aberturaticket" name="data_abertura" value="{{ $dataAtual }}" required oninput="validarAno(this)">
                @if ($errors->has('data_abertura'))
                <p class="text-danger">{{ $errors->first('data_abertura') }}</p>
                @endif
            </div>
            <div class="col-md-6">
                <label>Data de Finalização</label>
                <input type="date" class="form-control" id="data_fechamentoticket" name="data_fechamento" oninput="validarAno(this)" disabled>
                @if ($errors->has('data_fechamento'))
                <p class="text-danger">{{ $errors->first('data_fechamento') }}</p>
                @endif
            </div>
            </div>
            <div class="row mt-2">
            <div class="col-md-6">
                <label>Prioridade</label>
                <select class="form-control" id="prioridadeticket" name="prioridade" value="{{ old('prioridade') }}" required>
                <option value="1" {{ old('prioridade') == '1' ? 'selected' : '' }}>Sugestão</option>
                <option value="2" {{ old('prioridade') == '2' ? 'selected' : '' }}>Baixo</option>
                <option value="3" {{ old('prioridade') == '3' ? 'selected' : '' }}>Médio</option>
                <option value="4" {{ old('prioridade') == '4' ? 'selected' : '' }}>Alto</option>
                <option value="5" {{ old('prioridade') == '5' ? 'selected' : '' }}>Urgente</option>
                </select>
            </div>
            <div class="col-md-6">
                <label>Status</label>
                <select class="form-control" id="statusticket" name="status" value="{{ old('status') }}" required onchange="StatusFinalizado()">
                <option value="0" {{ old('status') == '0' ? 'selected' : '' }}>Aberto</option>
                <option value="2" {{ old('status') == '2' ? 'selected' : '' }}>Fazendo</option>
                <option value="1" {{ old('status') == '1' ? 'selected' : '' }}>Finalizado</option>  
                </select> 
            </div>
            </div>
            <div class="row mt-2">
            <div class="col-md-12">
                <label>Título<span title="Campo Obrigatório" style="color:red">*</span></label>
                <input type="text" class="form-control" id="titulo" name="titulo" value="{{ old('titulo') }}">
                @if ($errors->has('titulo'))
                <p class="text-danger">{{ $errors->first('titulo') }}</p>
                @endif          
            </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-6">    
                    <label>Sitema</label>
                    <select class="form-control" id="sistema" name="sistema" value="{{ old('sistema') }}" required>
                    <option value="Finest" {{ old('sistema') == 'Finest' ? 'selected' : '' }}>Finest</option>
                    <option value="FrenteECF" {{ old('sistema') == 'FrenteECF' ? 'selected' : '' }}>Frente ECF</option>
                    <option value="FrenteNFCE" {{ old('sistema') == 'FrenteNFCE' ? 'selected' : '' }}>Frente NFC-e</option>
                    <option value="Cacamba" {{ old('sistema') == 'Cacamba' ? 'selected' : '' }}>Caçamba</option>
                    <option value="Web" {{ old('sistema') == 'Web' ? 'selected' : '' }}>Web</option>
                    <option value="nenhum" {{ old('sistema') == 'nenhum' ? 'selected' : '' }}>nenhum</option>
                    </select>         
                </div>
                <div class="col-md-6">
                    <label>Setor</label>
                    <select class="form-control" id="setorticket" name="setor" required>
                        <option value="Suporte" {{ old('setor') == 'Suporte' ? 'selected' : '' }}>Suporte</option>
                        <option value="Desenvolvimento" {{ old('setor') == 'Desenvolvimento' ? 'selected' : '' }}>Desenvolvimento</option>
                        <option value="Comercial" {{ old('setor') == 'Comercial' ? 'selected' : '' }}>Comercial</option>
                    </select>
                </div> 
            </div>
            <div class="row mt-2">
                <div class="col-md-6">
                    <label style="display: flex; align-items: center; gap: 8px;">
                        Cliente <span title="Campo Obrigatório" style="color:red">*</span>
                        <a href="#" id="verClienteLink" target="_blank" style="display: none;" title="Ver cadastro da empresa">
                            <i class="fas fa-eye" style="font-size: 1rem;"></i>
                        </a>
                      
                    </label>

                    <select id="cliente" class="custom-select @error('cliente') is-invalid @enderror select2" name="cliente" autocomplete="cliente" autofocus></select>

                    @if ($errors->has('cliente'))
                        <p class="text-danger">{{ $errors->first('cliente') }}</p>
                    @endif
                </div>
                <div class="col-md-6">
                    <label>Solicitante<span title="Campo Obrigatório" style="color:red">*</span></label>
                    <input type="text" class="form-control" id="solicitante" name="solicitante" value="{{ old('solicitante') }}">
                    @if ($errors->has('solicitante'))
                    <p class="text-danger">{{ $errors->first('solicitante') }}</p>
                    @endif
                </div>
            </div>
            <div class="row mt-2">
              <div class="col-md-6">
                <label>Erros</label>
                <select id="erros"
                        class="form-control @error('erros') is-invalid @enderror select2"
                        name="erros[]"
                        multiple>
                    <option disabled hidden>Selecione os erros</option>
                    @foreach ($erros as $erro)
                        <option value="{{ $erro->id }}" {{ in_array($erro->id, old('erros', [])) ? 'selected' : '' }}>
                            {{ $erro->descricao }}
                        </option>
                    @endforeach
                </select>
                @if ($errors->has('erros'))
                    <p class="text-danger">{{ $errors->first('erros') }}</p>
                @endif
              </div>
              <div class="col-md-6">
                <label>
                  Dropdesk Atendimento
                  <i class="fas fa-exclamation-circle ml-2" data-toggle="tooltip" data-placement="top" title="Informe o número do atendimento gerado no Dropdesk. Isso facilita localizar a conversa, caso seja necessário revisar o histórico. (Campo opcional)"></i>
                </label>
                <input type="number" class="form-control" id="dropdesk_atendimento" name="dropdesk_atendimento" value="{{ old('dropdesk_atendimento') }}">
                @if ($errors->has('dropdesk_atendimento'))
                  <p class="text-danger">{{ $errors->first('dropdesk_atendimento') }}</p>
                @endif
              </div>
            </div>
            <div class="row mt-2">
            <div class="col-md-12">
                <label>Motivo<span title="Campo Obrigatório" style="color:red">*</span></label>
                <textarea class="form-control" id="motivo" name="motivo">{{ old('motivo') }}</textarea>
                @if ($errors->has('motivo'))
                <p class="text-danger">{{ $errors->first('motivo') }}</p>
                @endif            
            </div>
            <div class="col-md-12">
                <label>Solução</label>
                <textarea class="form-control" id="solucaoticket" name="solucao">{{ old('solucao') }}</textarea>
                @if ($errors->has('solucao'))
                <p class="text-danger">{{ $errors->first('solucao') }}</p>
                @endif            
            </div>
            </div>
            <div class="row">
            <div class="col-md-12">
                <label for="imagens">Anexo (PNG,JPEG,BMP OU PDF )</label><br>
                <span style="color: red;">Lembra-se de vincular o anexo nomeado caso tenha!</span>
                <div class="drop-zone" id="drop-zone">
                  Arraste os arquivos aqui ou clique para selecionar
                  <input type="file" id="imagem" name="imagem[]" multiple accept=".png,.jpeg,.jpg,.bmp,.pdf">
                </div>
                <div class="file-list" id="file-list"></div>
            </div>
            </div>
            <div class="row mt-2">
            <div class="col-md-6">
                <label>Abertura por</label>
                <select  class="form-control" id="user_abertura" name="user_abertura" value="{{ old('user_abertura') }}" required="required">
                <option value="{{$usuario->id}}">{{$usuario->nome}}</option>
                @foreach($responsaveis as $responsavel)
                    @if($responsavel->id != $usuario->id)
                    <option value="{{ $responsavel->id }}" {{ old('user_abertura') == $responsavel->id ? 'selected' : ''}}>{{ $responsavel->nome }}</option>
                    @endif
                @endforeach
                </select>
            </div>
            <div class="col-md-6">          
                <label>Responsavel<span title="Campo Obrigatório" style="color:red">*</span></label>
                <select  class="form-control" id="user_responsavel" name="user_responsavel" value="{{ old('user_responsavel') }}" require>
                <option value="{{$usuario->id}}">{{$usuario->nome}}</option>
                @foreach($responsaveis as $responsavel)
                    @if($responsavel->id != $usuario->id)
                    <option value="{{ $responsavel->id }}" {{ old('user_responsavel') == $responsavel->id ? 'selected' : ''}} >
                        {{ $responsavel->nome }}
                    </option>
                    @endif
                @endforeach
                </select>
                @if ($errors->has('user_responsavel'))
                <p class="text-danger">{{ $errors->first('user_responsavel') }}</p>
                @endif               
            </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-primary btnCriarTicket">Cadastrar</button>
        </div>
        </div>
    </div>
    </div>
    </form>
    

    
    <!-- Modal Finalizar - Tarefas em Aberto -->
    @foreach($tarefas as $tarefa)
    <form method="POST" id="formEnvioDados{{ $tarefa->id }}" action="{{route('tickets.finalizar', $tarefa->id)}}">    
        @csrf
        @method('PUT')   
        <div class="modal fade" id="FinalizarModal{{ $tarefa->id }}" tabindex="-1" aria-labelledby="FecharModalLabel" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Finalização do Registro</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="row mt-2">
                            <div class="col-md-6">
                                <label for="sistema">ID:</label>
                                <input type="text" class="form-control" value="{{ $tarefa->id }}" readonly>
                            </div>
                            <div class="col-md-6">
                                <label for="sistema">Sistema:</label>
                                <input type="text" class="form-control" value="{{ $tarefa->sistema }}" readonly>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="titulo">Título:</label>
                                <input type="text" class="form-control"value="{{ $tarefa->titulo }}" readonly>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="solicitante">Solicitante:</label>
                                <input type="text" class="form-control" name="solicitante" value="{{ $tarefa->solicitante }}">
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="motivo">Motivo:</label>
                                <textarea class="form-control" name="motivo">{{ $tarefa->motivo }}</textarea>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="status">Status:</label>
                                <select class="form-control" name="status">
                                    <option value="1">Finalizado</option>
                                </select>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="solucao">Solução:</label>
                                <textarea class="form-control" name="solucao">{{ $tarefa->solucao }}</textarea>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-6">
                                <label for="data_abertura">Data de Abetura:</label>
                                <input type="text" class="form-control" value="{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}" readonly>
                            </div>
                            <div class="col-md-6">
                                <label for="data_fechamento">Data de Fechamento:</label>
                                <input type="date" class="form-control" name="data_fechamento" value="{{ $dataAtual }}">
                            </div>
                        </div>
                    </div>  
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        <button type="button" class="btn btn-success btnFinalizar">Finalizar</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    @endforeach

    <!-- Modal Finalizar - tarefas em processo-->
    @foreach($tarefasEmProcesso as $tarefa)
    <form id="formEnvioDadosEmProcesso{{$tarefa->id}}" action="{{ route('tickets.finalizar', $tarefa->id) }}" method="POST">   
    @csrf
    @method('PUT')   
        <div class="modal fade" id="FinalizarModalEmProcesso{{ $tarefa->id }}" tabindex="-1" aria-labelledby="FecharModalLabel" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Finalização do Registro</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="row mt-2">
                            <div class="col-md-6">
                                <label for="sistema">ID:</label>
                                <input type="text" class="form-control" value="{{ $tarefa->id }}" readonly>
                            </div>
                            <div class="col-md-6">
                                <label for="sistema">Sistema:</label>
                                <input type="text" class="form-control" value="{{ $tarefa->sistema }}" readonly>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="titulo">Título:</label>
                                <input type="text" class="form-control" value="{{ $tarefa->titulo }}" readonly>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="solicitante">Solicitante:</label>
                                <input type="text" class="form-control" name="solicitante" value="{{ $tarefa->solicitante }}">
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="motivo">Motivo:</label>
                                <textarea class="form-control" name="motivo">{{ $tarefa->motivo }}</textarea>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="status">Status:</label>
                                <select class="form-control" name="status">
                                    <option value="1">Finalizado</option>
                                </select>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-12">
                                <label for="solucao">Solução:</label>
                                <textarea class="form-control" name="solucao">{{ $tarefa->solucao }}</textarea>
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-md-6">
                                <label for="data_abertura">Data de Abetura:</label>
                                <input type="text" class="form-control" value="{{ \Carbon\Carbon::parse($tarefa->data_abertura)->format('d/m/Y') }}" readonly>
                            </div>
                            <div class="col-md-6">
                                <label for="data_fechamento">Data de Fechamento:</label>
                                <input type="date" class="form-control" name="data_fechamento" value="{{ $dataAtual }}">
                            </div>
                        </div>
                    </div>  
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        <button type="button" class="btn btn-success btnFinalizarEmProcesso" data-id="{{$tarefa->id}}">Finalizar</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    @endforeach

     <!-- Modal de Cadastro de Evento -->
     <div class="modal fade" id="eventModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Cadastrar Evento</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="formEvento" action="{{ route('agenda.store') }}" method="POST">
                    @csrf
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="titulo">Título</label>
                            <input type="text" class="form-control" name="titulo" id="titulo_agenda" required>
                        </div>
                        <div class="form-group">
                            <label for="descricao">Descrição</label>
                            <textarea class="form-control" name="descricao" id="descricao"></textarea>
                        </div>
                        <div class="form-group">
                            <label for="data_evento">Data do Evento</label>
                            <input type="datetime-local" class="form-control" name="data_evento" id="data_evento" required>
                        </div>
                        <div id="cliente-container" class="form-group">
                            <label>Cliente</label>
                            <select id="cliente_agenda" class="custom-select @error('cliente_agenda') is-invalid @enderror select2" name="cliente_agenda" autocomplete="cliente_agenda" autofocus>
                            </select>
                            @if ($errors->has('cliente_agenda'))
                                <p class="text-danger">{{ $errors->first('cliente_agenda') }}</p>
                            @endif
                        </div>
                        <div class="form-group">
                            <label for="tipo_evento">Tipo de Evento</label>
                            <select class="form-control" name="tipo_evento" id="tipo_evento" required>
                                <option value="lembrete">Lembrete</option>
                                <option value="treinamento">Treinamento</option>
                                <option value="treinamento_presencial">Treinamento Presencial</option>
                                <option value="instalacao">Instalação</option>
                            </select>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        <button type="button" class="btn btn-primary btnNovoEvento">Salvar Evento</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <style>
         .select2-container {
            width: 100% !important;
        }

        .select2-selection--single {
            border: 1px solid #ced4da;
            border-radius: 4px;
            padding: 10px;
            height: 40px !important;
            box-sizing: border-box; 
        }

        .select2-selection__arrow {
            height: 38px; 
        }

        .select2-selection__rendered {
            color: #495057; 
            line-height: 40px; 
        }

        .select2-container--default .select2-selection--single .select2-selection__placeholder {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 14px;
            color: #6c757d;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .select2-container--default.select2-container--focus .select2-selection--single {
            border-color: #80bdff; 
        }

        .drop-zone {
            border: 2px dashed #007bff;
            padding: 20px;
            text-align: center;
            cursor: pointer;
            border-radius: 10px;
            transition: background-color 0.2s ease-in-out;
        }

        .drop-zone.dragover {
            background-color: #e9f5ff;
        }

        .drop-zone input {
            display: none;
        }
        
    </style>

    <link href="{{ URL::asset('css/dashboard.css')}}" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/i18n/pt-BR.js"></script>

    @if (session('erro_ticket') && $errors->any())
        <script>
        document.addEventListener('DOMContentLoaded', function () {
            $('#CriarTicket').modal('show');
        });
        </script>
    @endif

    <script> 

        $(document).ready(function () {
            $('#tableEmProcesso').DataTable({
                "paging": false,
                "order": [[0, "desc"]]
            });

            $('#tableEmAberto').DataTable({
                "paging": false,
                "order": [[0, "desc"]]
            });
        });


        var tableScroll = document.querySelector('.table-responsive-sm');

        if (tableScroll) {  
            tableScroll.classList.add('scrollbar-horizontal');
        }

        var currentItemId = 'dashboard-link';

        document.addEventListener("DOMContentLoaded", function() {
            
            document.getElementById("resumoUsuario").style.display = "none";
            document.getElementById("toggleButton").textContent = "+";

            
            document.getElementById("resumoGeral").style.display = "block";
            document.getElementById("toggleButtonGeral").textContent = "-";

            const tarefaSemResponsavel = document.getElementById("TarefaSemResponsavel");
            const toggleSemResponsavel = document.getElementById("toggleSemResponsavel");

            if (tarefaSemResponsavel && toggleSemResponsavel) {
                tarefaSemResponsavel.style.display = "block";
                toggleSemResponsavel.textContent = "-";
            }

            const tarefaEmProcesso = document.getElementById("TarefaEmProcesso");
            const toggleEmProcesso = document.getElementById("toggleEmProcesso");

            if (tarefaEmProcesso && toggleEmProcesso) {
                tarefaEmProcesso.style.display = "block";
                toggleEmProcesso.textContent = "-";
            }
            
            document.getElementById("TarefaEmAberto").style.display = "block";
            document.getElementById("toggleButtonEmAberto").textContent = "-";
       
            let setorSelect = document.getElementById("setorticket");
            let prioridadeSelect = document.getElementById("prioridadeticket");
    
            function atualizarPrioridade() {
                let opcaoSugestao = prioridadeSelect.querySelector('option[value="1"]');
                if (setorSelect.value === "Suporte") {
                    opcaoSugestao.style.display = "none";
                    if (prioridadeSelect.value === "1") {
                        prioridadeSelect.value = "2";
                    }
                } else {
                    opcaoSugestao.style.display = "block";
                }
            }

            setorSelect.addEventListener("change", atualizarPrioridade);
            atualizarPrioridade();
       
            function SolucaoFinalizada() {
                let setor = document.getElementById("setorticket").value;
                let status = document.getElementById("statusticket");
                let solucao = document.getElementById("solucaoticket").value.trim();
                let dataFechamento = document.getElementById("data_fechamentoticket");

                if (setor === "Suporte" && solucao !== "") {
                    status.value = "1"; 
                    let hoje = new Date().toISOString().split("T")[0]; 
                    dataFechamento.value = hoje;
                    dataFechamento.removeAttribute("disabled"); 
                }
            }

            document.getElementById("solucaoticket").addEventListener("input", SolucaoFinalizada);
       
            toggleCliente(); 
            document.getElementById('tipo_evento').addEventListener('change', toggleCliente);
        
            document.querySelectorAll('.btnFinalizar').forEach(function (button) {
                button.addEventListener('click', function (event) {
                    event.preventDefault();

                    const form = button.closest('form');
            

                    Swal.fire({
                        title: 'Confirmação',
                        text: 'Deseja realmente Finalizar essa Tarefa?',
                        icon: 'success',
                        showCancelButton: true,
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: 'Confirmar',
                        cancelButtonText: 'Cancelar'
                    }).then((result) => {
                        if (result.isConfirmed) {
                            form.submit();
                        }
                    });
                });
            });

            document.querySelectorAll('.btnFinalizarEmProcesso').forEach(function (button) {
                button.addEventListener('click', function (event) {
                    event.preventDefault();

                    const form = button.closest('form');
            

                    Swal.fire({
                        title: 'Confirmação',
                        text: 'Deseja realmente Finalizar essa Tarefa?',
                        icon: 'success',
                        showCancelButton: true,
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: 'Confirmar',
                        cancelButtonText: 'Cancelar'
                    }).then((result) => {
                        if (result.isConfirmed) {
                            form.submit();
                        }
                    });
                });
            });
        });

        document.querySelectorAll('.btnCriarTicket').forEach(function(button) {
            button.addEventListener('click', function(event) {
                event.preventDefault();
        
                const formId = 'formCriarTicket';
                const form = document.getElementById(formId);

                Swal.fire({
                    title: 'Confirmação',
                    text: 'Deseja realmente gravar essa Tarefa?',
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Confirmar',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        form.submit();
                    }
                });
            });
        });

        function toggleSection(sectionId, buttonId) {
            const section = document.getElementById(sectionId);
            const button = document.getElementById(buttonId);

            if (section.style.display == "none") {
                section.style.display = "block";
                button.textContent = "-";
            } else {
                section.style.display = "none";
                button.textContent = "+";
            }
        }

        var $j = jQuery.noConflict();

         $j('#erros').select2({
            placeholder: 'Selecione os erros',
            allowClear: true,
            width: '100%',
            closeOnSelect: false
        });

        $j('#erros').on('select2:select', function () {
            $j('.select2-search__field').val('').trigger('input').focus();
        });
        
        $j(document).ready(function () {
            const clienteSelect = $j('#cliente');
            const setorSelect = $j('#setorticket');
            const linkVisualizar = $j('#verClienteLink');
            const oldCliente = "{{ old('cliente') }}";

            function getUrlClientePorSetor() {
                const setor = setorSelect.val();
                return (setor === 'Suporte' || setor === 'Desenvolvimento') 
                    ? '/buscar-cliente-liberado' 
                    : '/buscar-cliente';
            }

            function inicializarSelect2Cliente() {
                const urlBusca = getUrlClientePorSetor();

                clienteSelect.select2({
                    theme: 'default',
                    language: "pt-BR",
                    width: '100%',
                    ajax: {
                        url: urlBusca,
                        dataType: 'json',
                        delay: 250,
                        data: function (params) {
                            return { q: params.term };
                        },
                        processResults: function (data) {
                            return { results: data.results };
                        },
                        cache: true
                    },
                    minimumInputLength: 1,
                    placeholder: 'Digite a razão social ou fantasia para buscar',
                    dropdownParent: $j('#CriarTicket')
                });
            }

            function mostrarIconeCliente(id) {
                const url = '/empresas/' + id + '/edit';

                linkVisualizar
                    .attr('href', url)
                    .attr('target', '_blank')
                    .show()
                    .off('click');
            }

            inicializarSelect2Cliente();

            if (oldCliente) {
                $j.ajax({
                    url: '/buscar-cliente-id',
                    data: { id: oldCliente },
                    dataType: 'json',
                    success: function (data) {
                        if (data) {
                            const option = new Option(data.nome, data.id, true, true);
                            clienteSelect.append(option).trigger('change');
                            mostrarIconeCliente(data.id);
                        }
                    }
                });
            }

            clienteSelect.on('select2:select', function (e) {
                const cliente = e.params.data;
                mostrarIconeCliente(cliente.id);
            });

            setorSelect.on('change', function () {
                clienteSelect.val(null).trigger('change');
                clienteSelect.select2('destroy');
                inicializarSelect2Cliente(); 
            });
        });
            

        $j(document).ready(function() {
            var oldClienteAgenda = "{{ old('cliente_agenda') }}";

            if (oldClienteAgenda) {
                $j.ajax({
                    url: '/buscar-cliente-id',
                    dataType: 'json',
                    data: { id: oldClienteAgenda },
                    success: function(data) {
                        if (data) {
                            var select = new Option(data.nome, data.id, true, true);
                            $j('#cliente_agenda').append(select).trigger('change');
                        }
                    }
                });
            }

            $j('#cliente_agenda').select2({
                theme: 'default',
                language: "pt-BR",
                width: '100%',
                ajax: {
                    url: '/buscar-cliente',
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return { q: params.term };
                    },
                    processResults: function (data) {
                        return { results: data.results };
                    },
                    cache: true
                },
                minimumInputLength: 1,
                placeholder: 'Digite a razão social ou fantasia para buscar',
                dropdownParent: $j('#eventModal')
            });

            $j('#cliente_agenda').on('select2:select', function (e) { 
                var data = e.params.data;
            });
        });

        function toggleCliente() {
            const tipoEvento = document.getElementById('tipo_evento').value;
            const clienteContainer = document.getElementById('cliente-container');

            if (tipoEvento === 'lembrete') {
                clienteContainer.style.display = 'none';
            } else {
                clienteContainer.style.display = 'block';
            }
        }

        function validarAno(input) {
            const data = input.value;
            const partes = data.split('-');
            const ano = partes[0];

            if (ano.length > 4) {
                partes[0] = ano.slice(0, 4);

        
                input.value = partes.join('-');

                Swal.fire({
                    icon: 'error',
                    title: 'Ano inválido!',
                    text: 'O ano não pode ter mais de 4 dígitos.',
                    confirmButtonText: 'OK'
                });
            }
        }

        function StatusFinalizado() {
            let status = document.getElementById("statusticket").value;
            let dataFechamento = document.getElementById("data_fechamentoticket");

            if (status == "1") { 
                let hoje = new Date().toISOString().split("T")[0];
                dataFechamento.value = hoje;
                dataFechamento.removeAttribute("disabled");
            } else {
                dataFechamento.value = "";
                dataFechamento.setAttribute("disabled", "disabled");
            }
        }

        window.onload = StatusFinalizado;

        document.querySelectorAll('.btnNovoEvento').forEach(function(button) {
            button.addEventListener('click', function(event) {
                event.preventDefault();

                const tipoEvento = document.getElementById('tipo_evento').value;
                const titulo = document.getElementById('titulo_agenda').value.trim();
                const descricao = document.getElementById('descricao').value.trim();
                const dataEvento = document.getElementById('data_evento').value;

                if (!titulo || !descricao || !dataEvento) {
                    Swal.fire('Campos obrigatórios', 'Preencha todos os campos: Título, Descrição e Data do Evento.', 'warning');
                    return;
                }

                if (!/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/.test(dataEvento)) {
                    Swal.fire('Data inválida', 'Informe a data e hora do evento corretamente.', 'warning');
                    return;
                }

                if (tipoEvento === 'lembrete') {
                    confirmarCadastro();
                    return;
                }

                const clienteId = document.getElementById('cliente_agenda').value;

                if (!clienteId) {
                    Swal.fire('Atenção', 'Selecione um cliente primeiro.', 'warning');
                    return;
                }

                if (tipoEvento === 'treinamento_presencial') {
                    fetch(`/buscar-cliente-id?id=${clienteId}`)
                        .then(response => response.json())
                        .then(data => {
                            if (data.qtde_visitas == 0 || data.qtde_visitas == null) {
                                Swal.fire(
                                    'Sem visitas disponíveis',
                                    'Este cliente não possui mais visitas disponíveis. Necessário verificar com o Financeiro.',
                                    'warning'
                                );
                                return;
                            }

                            confirmarCadastro();
                        })
                        .catch(error => {
                            console.error('Erro ao buscar cliente:', error);
                            Swal.fire('Erro', 'Não foi possível verificar as visitas do cliente.', 'error');
                        });
                } else {
                    confirmarCadastro();
                }
            });
        });

        function confirmarCadastro() {
            Swal.fire({
                title: 'Confirmação',
                text: 'Deseja realmente cadastrar esse Evento?',
                icon: 'question',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Confirmar',
                cancelButtonText: 'Cancelar'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById('formEvento').submit(); 
                }
            });
        }

        const dropZone = document.getElementById('drop-zone');
        const fileInput = dropZone.querySelector('input');
        const fileList = document.getElementById('file-list');

        dropZone.addEventListener('click', () => fileInput.click());

        dropZone.addEventListener('dragover', e => {
        e.preventDefault();
        dropZone.classList.add('dragover');
        });

        dropZone.addEventListener('dragleave', () => {
        dropZone.classList.remove('dragover');
        });

        dropZone.addEventListener('drop', e => {
        e.preventDefault();
        dropZone.classList.remove('dragover');

        if (e.dataTransfer.files.length) {
            const dt = new DataTransfer();
            Array.from(e.dataTransfer.files).forEach(file => dt.items.add(file));
            fileInput.files = dt.files;

            showSelectedFiles(dt.files);
        }
        });

        fileInput.addEventListener('change', () => {
        showSelectedFiles(fileInput.files);
        });

        function showSelectedFiles(files) {
            fileList.innerHTML = '';
            for (const file of files) {
                const p = document.createElement('p');
                p.textContent = ` ${file.name}`;
                fileList.appendChild(p);
            }
        }

        $(document).ready(function(){
            $('[data-toggle="tooltip"]').tooltip();
        })

    </script>
@endsection