@extends('layouts.portal.principal')

@section('css_custom')
  <link href="{{ asset('js/plugins/bootstrap-fileinput/css/fileinput.min.css') }}" rel="stylesheet">
@endsection

@section('scripts_content')
  <script src="{{ asset('theme/lib/datatables/jquery.dataTables.js') }}"></script>
  <script src="{{ asset('theme/lib/datatables-responsive/dataTables.responsive.js') }}"></script>
  <script src="{{ asset('js/plugins/bootstrap-fileinput/js/fileinput.min.js') }}"></script>
  <script src="{{ asset('js/plugins/bootstrap-fileinput/js/locales/es.js') }}"></script>
  <script src="{{ asset('js/portal/indicators/control/control.import.js') }}"></script>
@endsection

@section('content')
  <div class="br-mainpanel">
    @include('includes/mensaje')
    @include('includes/form-error')
    <div class="br-pageheader pd-y-15 pd-l-20">
      <nav class="breadcrumb pd-0 mg-0 tx-12">
        <a class="breadcrumb-item" href="{{url('Indicator/indicators')}}">Ciclo notificaciones</a>
        <span class="breadcrumb-item active">Importar control notificaciones</span>
      </nav>
    </div><!-- br-pageheader -->

    <div class="br-pagebody" style="padding: 0 10px;">

      <div class="br-section-wrapper p-5">

        <div class="form-layout form-layout-2">
          <div class="row no-gutters">
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-control-label">Año:</label>
                <input class="form-control" type="text" name="firstname" value="{{ $notify->year }}">
                <input type="hidden" name="notify_cicle_id" id="notify_cicle_id" value="{{ $notify->id }}">
              </div>
            </div><!-- col-4 -->
            <div class="col-md-4 mg-t--1 mg-md-t-0">
              <div class="form-group mg-md-l--1">
                <label class="form-control-label">Ciclo:</label>
                <input class="form-control" type="text" name="lastname" value="{{ $notify->cicle }}">
              </div>
            </div><!-- col-4 -->
            <div class="col-md-8">
              <div class="form-group bd-t-0-force">
                <label class="form-control-label">Descripción:</label>
                <textarea name="" id="" class="form-control" cols="30" rows="3">{{ $notify->description }}</textarea>
              </div>
            </div><!-- col-8 -->
          </div><!-- row -->
        </div>
          <div class="row mt-4 mb-4 loadfile">
            <div class="col-sm-6">
              <form method="POST">
                @csrf
                <div class="file-loading ml-4 mb-4">
                  <input id="file-es" placeholder="Cargue la matriz" name="file" type="file" multiple>
                </div>
              </form>
            </div>
          </div>
          <div class="row mt-4 mb-4 controls" style="display:none;">
            <div class="col-sm-3">
              <button style="width: 100%;" id="cancel-notify" type="button" class="btn btn-sm btn-danger mr-2" data-loading-text="<i class='fa fa-spinner fa-spin '></i> Processing Order"><span class="icon wd-40"><i class="fa fa-ban"></i></span>&nbsp;&nbsp;CANCELAR</button>
            </div>
            <div class="col-sm-3">
              <button style="width: 100%;" id="save-notify" type="button" class="btn btn-sm btn-success" data-loading-text="<i class='fa fa-spinner fa-spin '></i> Processing Order"><span class="icon wd-40"><i class="fa fa-send"></i></span>&nbsp;&nbsp;PROCESAR</button>
            </div>
          </div>
          <table id='controls' class="table display responsive nowrap no-footer dtr-inline" role="grid" aria-describedby="datatable1_info">
            <thead>
              <tr role="row">
                <th>Código</th>
                <th>Nombre informe</th>
                <th>Periocidad</th>
                <th>Correo responsable</th>
                <th>Correos copía</th>
                <th>Resultado</th>
              </tr>
            </thead>
            <tbody>
            </tbody>
          </table><!-- table-wrapper -->
      </div><!-- br-section-wrapper -->
    </div><!-- br-pagebody -->
    <footer class="br-footer">
      <div class="footer-left">
        <div class="mg-b-2"></div>
        <div></div>
      </div>
      <div class="footer-right d-flex align-items-center">
        <span class="tx-uppercase mg-r-10">Share:</span>
      </div>
    </footer>
  </div>

  <div class="modal" tabindex="-1" role="dialog" id='modal-detalle'>
    <div class="modal-dialog modal-lg" role="document">
      <div class="modal-content" style="width: 800px;"">
        <div class="modal-body">
          <div class="row no-gutters">
            <div class="col-lg-12">
              <div class="pd-40">
                <h4 class=" mg-b-20"><span class="text-primary">[</span>&nbsp;<span id="report_name" class="text-primary"></span>&nbsp;<span class="text-primary">]</span></h4>
                <table class="mb-4">
                  <tr>
                    <td><span class="text-dark font-weight-bold">Unidad: </span></td>
                    <td><span id="responsible_unit"></span></td>
                  </tr>
                  <tr>
                    <td><span class="text-dark font-weight-bold">Responsable:</span></td>
                    <td><span id="responsible_name"></span></td>
                  </tr>
                  <tr>
                    <td><span class="text-dark font-weight-bold">Periocidad: </span></td>
                    <td><span id="periodicity"></span></td>
                  </tr>
                  <tr>
                    <td valign="top"><span class="text-dark font-weight-bold">Normatividad: </span></td>
                    <td><span id="normativity"></span></td>
                  </tr>
                </table>
                <h6 class="text-danger" id="modal_error"></h6>
                <div class="bd rounded table-responsive">
                  <table class="table table-bordered mg-b-0" id='tbl-programing'>
                    <thead>
                      <tr>
                        <th>#</th>
                        <th class="text-center">Primera notificación</th>
                        <th class="text-center">Segunda notificación</th>
                        <th class="text-center">Fecha presentación</th>
                        <th class="text-center">Estado</th>
                        <th class="text-center">&nbsp;</th>
                      </tr>
                    </thead>
                    <tbody>
                    </tbody>
                  </table>
                </div>
              </div>
              </div><!-- col-6 -->
            </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Cerrar</button>
        </div>
      </div>
    </div>
  </div>

@endsection