@extends('layouts.dashboard_layout')

@section('title', 'DataSheet - Editar')

@section('content')
    <div class="container-fluid p-3 table-acta">
        <h1>Descripcion General</h1>
        <hr>
        <div class="px-5">
            <form id="formEditarDataSheetGeneral">
                <input type="hidden" name="id" value="{{ $datasheet->id }}">
                <label for="">Titulo</label>
                <input type="text" class="form-control" value="{{ $datasheet->titulo }}" placeholder="Titulo"
                    name="titulo">
                <label for="">Descripcion</label>
                <div class="summernote">{!! html_entity_decode($datasheet?->descripcion ?? '', ENT_QUOTES, 'UTF-8') !!}</div>
                <div class="text-center mt-3">
                    <button type="submit" class="btnNext">Guardar</button>
                </div>
            </form>
        </div>
        <hr>
        <h1>Fuentes de Datos</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <a type="button" class="btnNext" data-bs-toggle="modal" data-bs-target="#modalCrearDataSheetFuenteDatos">
                    Agregar
                </a>
            </div>
            <div class="mb-3 seccionFuentesDatos"></div>
        </div>
        <hr>
        <h1>Requisitos Tecnicos</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <a type="button" class="btnNext" data-bs-toggle="modal"
                    data-bs-target="#modalCrearDataSheetRequisitosTecnicos">
                    Agregar
                </a>
            </div>
            <div class="mb-3 seccionRequisitosTecnicos"></div>
        </div>
        <hr>
        <h1>Características del Despliegue en Nube</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <button type="button" class="btnNext" data-bs-toggle="modal"
                    data-bs-target="#modalCrearDataSheetDespliegueNube">
                    Agregar
                </button>
                <div class="mb-3 seccionDespliegueNube"></div>
            </div>
        </div>
        <hr>
        <h1>Características Principales</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <button type="button" class="btnNext" data-bs-toggle="modal"
                    data-bs-target="#modalCrearDataSheetCarcateristicasPrincipales">
                    Agregar
                </button>
                <div class="mb-3 seccionCarcateristicasPrincipales"></div>
            </div>
        </div>
        <hr>
        <h1>Especificaciones Técnicos</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <button type="button" class="btnNext" data-bs-toggle="modal"
                    data-bs-target="#modalCrearDataSheetEspecificacionesTecnicos">
                    Agregar
                </button>
                <div class="mb-3 seccionEspecificacionesTecnicos"></div>
            </div>
        </div>
        <hr>
        <h1>Funcionalidades</h1>
        <hr>
        <div class="px-5">
            <div class="text-end mb-3">
                <button type="button" class="btnNext" data-bs-toggle="modal"
                    data-bs-target="#modalCrearDataSheetFuncionalidades">
                    Agregar
                </button>
                <div class="mb-3 seccionFuncionalidades"></div>
            </div>
        </div>
        <hr>
    </div>

    {{-- Modals --}}
    @component('dashboard.datasheet.componerntes-editar.fuentes-datos.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.fuentes-datos.modals')
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.requisitos-tecnicos.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.requisitos-tecnicos.modals')
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.despliegue-nube.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.despliegue-nube.modals')
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.caracteristicas-principal.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.caracteristicas-principal.modals')
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.especificaciones-tecnicas.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.especificaciones-tecnicas.modals')
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.funcionalidades.crear')
        @slot('datasheet', $datasheet)
    @endcomponent
    @component('dashboard.datasheet.componerntes-editar.funcionalidades.modals')
    @endcomponent
@endsection

@section('scripts')
    <script>
        window.id_datasheet = {{ $datasheet->id }};
    </script>
    <script src="{{ mix('js/datasheet/editar.js') }}"></script>
@endsection