@extends(layoutTenant())

@section('content')
  <div class="row">
    <div class="col-12">
      <div class="page-title-box">
        <h4 class="page-title float-left">Incluir Feriado</h4>
        <div class="clearfix"></div>
      </div>
    </div>
  </div>
  <!-- end row -->
  <div class="row">
    <!-- ============================================================== -->
    <!-- basic form -->
    <!-- ============================================================== -->
    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
      <div class="card">
        <div class="card-body">
          <form action="{{ routeTenant('feriados.store') }}" method="POST" enctype="multipart/form-data" class="form">
            @csrf
            <div class="row">
              <div class="col-md-2">
                <div class="form-group">
                  <label for="data">*Data:</label>
                  <input type="text" name="data" class="form-control" id="calendario" required>
                </div>
              </div>
              @include('app.diario.feriados._form')
              <button type="submit" class="btn btn-primary" style="height:36px;">Incluir Feriado</button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('post-script')
  {!! config('tenant.editor') !!}
  <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" />
  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
  <script>
    $(function() {
      $("#calendario").datepicker({
        dateFormat: 'dd/mm/yy',
        dayNames: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado', 'Domingo'],
        dayNamesMin: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S', 'D'],
        dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
        monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
        monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']
      });
    });
  </script>

  <script src="{{ asset('assets/vendor/inputmask/js/jquery.inputmask.bundle.js') }}"></script>
  <script>
    $(function() {
      "use strict";
      $("#calendario").inputmask("99/99/9999");
      $(".email-inputmask").inputmask({
        mask: "*{1,20}[.*{1,20}][.*{1,20}][.*{1,20}]@*{1,20}[*{2,6}][*{1,2}].*{1,}[.*{2,6}][.*{1,2}]",
        greedy: false,
        onBeforePaste: function(value, opts) {
          return (value = value.toLowerCase()).replace("mailto:", "");
        },
        definitions: {
          "*": {
            validator: "[0-9A-Za-z!#$%&'*+/=?^_`{|}~/-]",
            cardinality: 1,
            casing: "lower"
          }
        }
      });
    });
    document.getElementById("file_upload").onchange = function() {
      document.getElementById("uploadFile").value = this.value;
    };
  </script>
  <script>
    function selecionarCor(cor) {
      document.getElementById("cor").value = cor;
    }
  </script>
@endsection