@extends('layouts.simple.master')

@section('css')

<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
@endsection

@section('main_content')
@include('operations.comercial.ofertas.navigation_explotacion')

<div class="container-fluid mt-3">
    <div class="row">
        <div class="col-12">
            <h2 class="mb-3">Explotación de Ofertas</h2>
        </div>
    </div>

    <!-- Filtros -->
    <div class="row">
        <div class="col-12">
            <div class="card mb-4">
                <div class="card-body">
                    <form method="GET" action="{{ route('operations.comercial.explotacion.index') }}" id="filterForm">
                        <div class="row align-items-center g-2">
                            <!-- Sector -->
                            <div class="col-md-2">
                                <label for="sector" class="form-label">Sector</label>
                                <select name="sector" id="sector" class="form-control form-control-sm" onchange="document.getElementById('filterForm').submit()">
                                    <option value="">Todos</option>
                                    @foreach($sectores as $value)
                                    <option value="{{ $value }}" {{ request('sector') == $value ? 'selected' : '' }}>{{ $value }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <!-- Tipo de Licitación -->
                            <div class="col-md-2">
                                <label for="tipo_licitacion" class="form-label">Tipo Licitación</label>
                                <select name="tipo_licitacion" id="tipo_licitacion" class="form-control form-control-sm" onchange="document.getElementById('filterForm').submit()">
                                    <option value="">Todos</option>
                                    @foreach($tiposLicitacion as $value)
                                    <option value="{{ $value }}" {{ request('tipo_licitacion') == $value ? 'selected' : '' }}>{{ $value }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <!-- Fecha Desde -->
                            <div class="col-md-2">
                                <label for="fecha_desde" class="form-label">Desde</label>
                                <input type="date" name="fecha_desde" id="fecha_desde" class="form-control form-control-sm"
                                       value="{{ request('fecha_desde', '2000-01-01') }}" onchange="document.getElementById('filterForm').submit()">
                            </div>

                            <!-- Fecha Hasta -->
                            <div class="col-md-2">
                                <label for="fecha_hasta" class="form-label">Hasta</label>
                                <input type="date" name="fecha_hasta" id="fecha_hasta" class="form-control form-control-sm"
                                       value="{{ request('fecha_hasta', now()->endOfYear()->toDateString()) }}" onchange="document.getElementById('filterForm').submit()">
                            </div>

                            <!-- Estado -->
                            <div class="col-md-2">
                                <label for="estado" class="form-label">Estado</label>
                                <select name="estado" id="estado" class="form-control form-control-sm" onchange="document.getElementById('filterForm').submit()">
                                    <option value="">Todos</option>
                                    @foreach(collect(['Ganado', 'Pendiente', 'Perdido', 'Renuncia', 'Pendiente de adjudicacion'])->sort() as $value)
                                    <option value="{{ $value }}" {{ request('estado') == $value ? 'selected' : '' }}>{{ $value }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <!-- Buscar -->
                            <div class="col-md-2">
                                <label for="search" class="form-label">Buscar</label>
                                <div class="input-group">
                                    <input type="text" name="search" id="search" class="form-control form-control-sm" placeholder="Cliente u Objeto" value="{{ request('search') }}">
                                    <button type="submit" class="btn btn-primary btn-sm">
                                        <i class="bi bi-search"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Widgets -->

    <div class="row">
        @foreach ($kpiData as $kpi)
            <div class="col-md-2"> <!-- Ajusta el ancho según sea necesario -->
                @include('operations.widgets.kpi', ['kpi' => $kpi])
            </div>
        @endforeach
    </div>

    <div class="row">
        <div class="col-md-6">
            @include('operations.widgets.ofertas_por_estado', ['data' => $widget1Data])
        </div>
        <div class="col-md-6">
            @include('operations.widgets.importes_lic_por_estado', ['data' => $widget2Data])
        </div>
    </div>

    <div class="row">
      <div class="col-md-12">
            @include('operations.widgets.importes_estimados', ['data' => $widget3Data['data'], 'years' => $widget3Data['years'], 'estados' => $widget3Data['estados']])
      </div>
    </div>
@endsection