@extends('app')

@section('content')
  <style type="text/css">
    .label {
      padding : .2em .6em .1em;
    }
  </style>
  <div class="row">
    <div class="col-md-12 form-group">
      <h1>
        <a href="{{route('jobs.index')}}" class="btn btn-default" data-toggle="tooltip" title="Voltar">
          <i class="fa fa-arrow-left fa-2x" aria-hidden="true"></i>
        </a>
        <span class="label label-danger"><i class="fa fa-trash-o" aria-hidden="true"></i></span>
        Job {{ $job->id }}:
        <span style="color: #777;">{{$job->nome_job}}</span>
      </h1>
    </div>
  </div>

  {!! Form::open([
      'method'=> 'PUT',
      'route' => ['jobs.update', $job->id],
      'id'=>"Job_form"
  ]) !!}
  {!! Form::hidden('JOB_ETAPA_ATUAL', $job->etapa_atual ) !!}


  <!-- TAB NAVIGATION -->
  <ul class="nav nav-tabs" role="tablist">
    <li class="active">
      <a href="#tab_info" role="tab" data-toggle="tab">
        <i class="fa fa-briefcase"></i> Informações
      </a>
    </li>
    <li>
      <a href="#tab_briefing" role="tab" data-toggle="tab">
        <i class="fa fa-file-text-o"></i> Briefing
      </a>
    </li>
    <li>
      <a href="#tab_cronograma" role="tab" data-toggle="tab">
        <i class="fa fa-calendar"></i> Cronograma
      </a>
    </li>
    <li>
      <a href="#tab_orcamento" role="tab" data-toggle="tab">
        <i class="fa fa-dollar"></i> Orçamento
      </a>
    </li>
    <li>
      <a href="#tab_condpagto" role="tab" data-toggle="tab">
        <i class="fa fa-calendar-check-o"></i> Cond. de Pagamento
      </a>
    </li>
    <li>
      <a href="#tab_aprovDiretoria" role="tab" data-toggle="tab">
        <i class="fa fa-check"></i> Aprov. da Diretoria
      </a>
    </li>
    <li>
      <a href="#tab_PDF" role="tab" data-toggle="tab">
        <i class="fa fa-file-pdf-o"></i> PDF
      </a>
    </li>
    <li>
      <a href="#tab_aprovCliente" role="tab" data-toggle="tab">
        <i class="fa fa-check"></i> Aprov. do Cliente
      </a>
    </li>
    <li class="pull-right" data-toggle="tooltip" data-placement="left" title="Histórico de Alterações deste Job">
      <a href="#tab_logs" role="tab" data-toggle="tab">
        <i class="fa fa-history" aria-hidden="true"></i>
      </a>
    </li>
  </ul>
  <!-- TAB CONTENT -->
  <div class="tab-content RCS_tab-pane">
    <div class="active tab-pane fade in" id="tab_info">
      @include('Comercial.componentes.0_info_static')
    </div>
    <div class="tab-pane fade" id="tab_briefing">
      @include('Comercial.componentes.A_briefing_static')
    </div>
    <div class="tab-pane fade" id="tab_cronograma">
      @include('Comercial.componentes.A_cronograma_yearCalendar_static')
    </div>
    <div class="tab-pane fade" id="tab_orcamento">
      @include('Comercial.componentes.ORCAMENTO.B_orcamento_static')
    </div>
    <div class="tab-pane fade" id="tab_condpagto">
      @include('Comercial.componentes.B_condpagto_static')
    </div>
    <div class="tab-pane fade" id="tab_aprovDiretoria">
      @include('Comercial.componentes.C_aprovacaoDiretoria_static')
    </div>
    <div class="tab-pane fade" id="tab_PDF">
      <div class="row">
        <div class="col-md-12 form-group">
          <h2><i class="fa fa-file-pdf-o" aria-hidden="true"></i> Gerar PDF do Orçamento</h2>
        </div>
      </div>
      <div class="row">
        <div class="col-md-8 col-md-offset-2">
          <div class="alert alert-warning alert-important" role="alert">
            <strong>
              <i class="fa fa-exclamation-triangle"></i>
              Não é possível Gerar PDF!
            </strong>
          </div>
        </div>
      </div>
    </div>
    <div class="tab-pane fade" id="tab_aprovCliente">
      @include('Comercial.componentes.D_aprovacaoCliente_static')
    </div>
    <div class="tab-pane fade in" id="tab_logs">
      @include('Comercial.componentes.logs')
    </div>
  </div>

  <br>
  <br>
  <div class="row">
    <div class="col-sm-12 form-group">
      <button class="btn btn-warning btn-lg btn-block" type="submit" id="BTN_undo"
              data-toggle="tooltip" title="Restaura para a Etapa Inicial.">
        <i class="fa fa-undo fa-lg" aria-hidden="true"></i>&nbsp;&nbsp;RESTAURAR JOB
      </button>
    </div>
  </div>

  {!! Form::hidden('tipo_submit', '', ['id'=>'tipo_submit']) !!}
  {!! Form::close() !!}
  <br><br><br><br>
  <div class="modal fade" id="undo-modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
            <span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title" id="modalLabel">
            <i class="fa fa-undo" aria-hidden="true"></i>
            Restaurar este Job para a Etapa inicial
          </h4>
        </div>
        <div class="modal-body">
          Deseja realmente Restaurar este Job para a Etapa inicial? <br>
        </div>
        <div class="modal-footer">
          <button type="button" id="confimar_undo" class="btn btn-primary">
            <i class="fa fa-check" aria-hidden="true"></i> Sim
          </button>
          <button type="button" class="btn btn-default" data-dismiss="modal">
            <i class="fa fa-ban" aria-hidden="true"></i> N&atilde;o
          </button>
        </div>
      </div>
    </div>
  </div>

@endsection
@section('scripts')
  <script type="application/javascript">
    $( function () {
      $( '#BTN_undo' ).on( 'click', function ( e ) {
        var $form = $( this ).closest( 'form' );
        e.preventDefault();
        $( '#undo-modal' )
          .modal( { backdrop: 'static', keyboard: false } )
          .one( 'click', '#confimar_undo', function () {
            $( '#tipo_submit' ).val( 'back' );
            $form.trigger( 'submit' );
          } );
      } );
    } );
  </script>

  @include('Comercial.componentes.A_cronograma_yearCalendar_static_scripts')
  @include('Comercial.componentes.ORCAMENTO.B_orcamento_static_scripts')

@endsection