@extends('layouts.app')

@section('content')
    <div class="container-fluid">
     <div class="row-fluid">
        <!-- BEGIN PAGE TITLE & BREADCRUMB-->
        <h3 class="page-title">
            Create New Transporter
        </h3>
        <ul class="breadcrumb">
            <li>
                <i class="icon-home"></i>
                <a href="#">Dashboard</a> 
                <i class="icon-angle-right"></i>
            </li>
            <li><a href="#">HR</a><i class="icon-angle-right"></i></li>
            <li><a href="#">Transporter</a></li>
            
        </ul>
        <!-- END PAGE TITLE & BREADCRUMB-->
        </div>
        <div class="row-fluid">
            <div class="span12">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <a href="{{ url('/admin/transporter') }}" title="Back"><button class="btn green btn-xs"><i class="m-icon-swapleft m-icon-white" aria-hidden="true"></i> Back</button></a>
                        <br />
                        <br />

                        {!! Form::open(['url' => '/admin/transporter/create','id'=>'myform','class' => 'form-vertical', 'files' => true]) !!}

                        @include ('admin.transporter.form')

                        {!! Form::close() !!}

                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('#myform').validate( {
            highlight: function(element) {
                jQuery(element).closest('.control-group').addClass('error');
                jQuery(element).closest('.control-group').addClass('error');
            },
            unhighlight: function(element) {
                jQuery(element).closest('.control-group').removeClass('error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            focusInvalid: false, // do not focus the last invalid input
            ignore: "", // validate all fields including form hidden input
            rules: {
              'name': {
                 required: true,
              },
              'type': {
                 required: true,
              },
              'twenty_light_rate': {
                required: true,
                number : true,
              },
              'twenty_heavy_rate': {
                 required: true,
                 number : true,
              },
              'forty_rate': {
                 required: true,
                 number : true,
              },
              'bb_rate': {
                 required: true,
                 number : true,
              },
              'validity_from': {
                 required: true,
              },
              'validity_to': {
                 required: true,
              },
              'corridor_id': {
                 required: true,
              },
           },
           errorPlacement: function (error, element) {
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
           },
           messages: {
              'name' : {
                  required: "The name field is required",
              },
              'type' : {
                 required: "The type field is required",
              },   
               'twenty_light_rate': {
                 required: "The 20 inch light rate field is required",
                 number : "Only numbers are allowed",
              },
              'twenty_heavy_rate': {
                 required: "The 20 inch heavy rate field is required",
                 number : "Only numbers are allowed",
              },
              'forty_rate': {
                 required: "The 40 inch rate field is required",
                 number : "Only numbers are allowed",
              },
              'bb_rate': {
                 required: "The break bulk rate field is required",
                 number : "Only numbers are allowed",
              },
              'validity_from': {
                 required: "The validity from field is required",
              },
              'validity_to': {
                 required: "The validity to field is required",
              },
              'corridor_id': {
                 required: "The corridor filed is required",
              },     
            }
       });
    });

    </script>
      <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#validity_from" ).datepicker({ dateFormat: 'yy-mm-dd' });
  } );

  $( function() {
    $( "#validity_to" ).datepicker({ dateFormat: 'yy-mm-dd' });
  } );
  </script>
@endsection