{% extends "MasterMotoTaller/MenuTemplateMT.html.twig" %}

{% block javascripts %}

<link href="https://unpkg.com/filepond@^4/dist/filepond.css" rel="stylesheet" />
<script src="https://unpkg.com/filepond@^4/dist/filepond.js"></script>

    {{ parent() }}

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

    <!-- Bootstrap JS, Popper.js, and Font Awesome -->
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.0.7/dist/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.6.0/js/bootstrap.min.js"></script>
    <script src="https://kit.fontawesome.com/your-fontawesome-kit.js" crossorigin="anonymous"></script>

    <script src="{{ asset('Dinamic/Assets/Vendor/uppy/uppy.min.js') }}"></script>
    <script src="{{ asset('Dinamic/Assets/JS/Plugins/uppy.js') }}"></script>
    <script src="{{ asset('Plugins/PartesSemanales/Assets/JS/oi_camera.js') }}"></script>
    <script src="{{ asset('Dinamic/Assets/JS/partes.js') }}"></script>
    <script src="https://cdn.ckeditor.com/ckeditor5/18.0.0/classic/ckeditor.js"></script>

    <script>
        async function enviarFormularioIncidencia(){
            const btn = document.querySelector('#enviarFormularioIncidencia button');
            if (btn) {
                btn.disabled = true;
            }
            var titulo = document.getElementById("IncTitulo").value;
            var descripcion = document.getElementById("incidenciaDescripcion").value;
            var idorden = document.getElementById("idorden").value;
            var idproyecto = document.getElementById("idproyecto").value;
            var iddiaInput = document.getElementById("iddia");

            var formData = new FormData();
            formData.append("descripcion", descripcion);
            formData.append("titulo", titulo);
            formData.append("idorden", idorden);
            formData.append("idproyecto", idproyecto);
            if (iddiaInput) {
                formData.append("iddia", iddiaInput.value);
            }

            for (var i = 0; i < saveImages.length; i++) {
                formData.append('files[]', saveImages[i].archivo);
            }

            if (formData){
                await $.ajax({
                    type: "POST",
                    url: "{{ fsc.url() }}?code={{ fsc.orden.id }}&action=guardarIncidencia",
                    data: formData,
                    contentType: false,
                    processData: false
                });
            }
            if (btn) {
                btn.disabled = false;
            }
            location.reload(true);
        }

        function eliminarChecklist(id){
            var formData = new FormData();
            formData.append("action", "eliminarChecklistDia");
            formData.append("id", id);
            if(formData){
                $.ajax({
                    type: "POST",
                    url: "{{ fsc.url() }}?code={{ fsc.orden.id }}&action=eliminarChecklistDia",
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function(respuesta) {
                        location.reload(true);
                    },
                    error: function() {
                    }
                });
            }
        }
    </script>
{% endblock %}

{% block body %}
    {{ parent() }}
    {% set proyecto = fsc.orden.getProyecto() %}
    <input id="idproyecto" type="hidden" name="idproyecto" value="{{ proyecto.idproyecto }}"/>
    <div class="row g-3 pt-3">
        <div class="col-md-{{ settings('partessemanales', 'planos') ? '6' : '12' }} col-12">
            {% include 'partessemanales/proyecto.html.twig' %}
        </div>
        {% if settings('partessemanales', 'planos') %}
        <div class="col-md-6 col-12">
            {% include 'partessemanales/planos.html.twig' %}
        </div>
        {% endif %}
    </div>

    <div class="row g-3 pt-3">
        {% if fsc.user.level > 90 %}
        <div class="col-md-6 col-12">
            {% include 'partessemanales/albaran_resumen.html.twig' %}
        </div>
        {% endif %}
        <div class="col-md-6 col-12">
            <div class="card h-100">
                <div class="card-header">
                    <h4 class="text-secondary">
                        <i class="fas fa-arrow-circle-down" aria-hidden="true"></i> Días de la semana
                    </h4>
                </div>
                <div class="card-body p-0">
                    <ul class="list-group">
                        {% for dia in fsc.dias %}
                        {% set nombreDia = ['', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes'][dia.dia]|default('Día ' ~ dia.dia) %}
                        {% set fechaDia = fsc.orden.fechainicio|date_modify('+' ~ (dia.dia - 1) ~ ' day')|date('j') %}
<li class="list-group-item list-group-item-action d-flex align-items-center"
    data-bs-toggle="offcanvas" data-bs-target="#offcanvasDia{{ dia.id }}" aria-controls="offcanvasDia{{ dia.id }}">

    <span class="me-auto link-primary" style="width: 120px;">{{ nombreDia }} {{ fechaDia }}</span>
    <span class="text-start" style="width: 100px;">{{ dia.nick }}</span>
    <span class="ms-auto"><i class="fas fa-edit"></i></span>
</li>
                        {% include 'partessemanales/modal/dia.twig' with {dia: dia} %}
                        {% endfor %}
                    </ul>
                </div>
            </div>
        </div>
    </div>

    {% if settings('partessemanales', 'material_pendiente') %}
    <div class="row g-3 pt-3">
        <div class="col-12">
            <div class="card h-100">
                <div class="card-header">
                    <h4 class="text-secondary">
                        <i class="fas fa-box" aria-hidden="true"></i> Material pendiente
                    </h4>
                </div>
                <div class="card-body">
                    {% for dia in fsc.dias %}
                        {% set nombreDia = ['', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes'][dia.dia]|default('Día ' ~ dia.dia) %}
                        {% set fechaDia = fsc.orden.fechainicio|date_modify('+' ~ (dia.dia - 1) ~ ' day')|date('j') %}
                        {% for material in dia.getMateriales() %}
                            <div class="row border-bottom py-1">
                                <div class="col-3">{{ nombreDia }} {{ fechaDia }}</div>
                                <div class="col-2">{{ material.nick }}</div>
                                <div class="col">{{ material.descripcion }} (x{{ material.cantidad }})</div>
                            </div>
                        {% endfor %}
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
    {% endif %}


    {% if settings('partessemanales', 'incidencias') %}
    <div class="row g-3 pt-3">
        <div class="col-12">
            {% include 'partessemanales/incidencias.html.twig' %}
        </div>
    </div>
    {% include 'partessemanales/modal/incidenia.twig' %}
    {% endif %}
    <div id="modalContainer99999999"></div>
    <script>
        imprimirModalCamara(99999999)
    </script>
{% endblock %}

{% block css %}
    {{ parent() }}
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.6.0/css/bootstrap.min.css">
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
    <!-- 1. Add CSS to `<head>` -->
    <link href="https://releases.transloadit.com/uppy/v3.21.0/uppy.min.css" rel="stylesheet">
    <script src="{{ asset('Dinamic/Assets/Vendor/uppy/uppy.min.css') }}"></script>
    <style>
        .super_center{
                margin-bottom: 0; flex-grow: 1; text-align: left;white-space: nowrap;margin-top:1px;
        }
        /* Ensure the bottom navbar is always above list items */
        .navbar.fixed-bottom {
                z-index: 1050;
        }
    </style>
{% endblock %}