@extends('layouts.app')

@section('content')
<div class="container-fluid">
  <div class="row-fluid">
    <!-- BEGIN PAGE TITLE & BREADCRUMB-->
    <h3 class="page-title">Create New Charge : {{ $customer->name }}</h3>
    <ul class="breadcrumb">
      <li><i class="icon-home"></i><a href="#">Dashboard</a><i class="icon-angle-right"></i></li>
      <li><a href="#">Logistic</a><i class="icon-angle-right"></i></li>
      <li><a href="#">Customer</a><i class="icon-angle-right"></i></li>
      <li><a href="#">Charge</a></li>
    </ul>
    <!-- END PAGE TITLE & BREADCRUMB-->
  </div>
  <div class="row-fluid">
    <div class="span12">
      <a href="{{ url('/admin/customer/service/charge/') }}/{{ $id }}/{{ $id2 }}" 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/>
      <div class="panel panel-default">
        <div class="panel-body">

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

        <div class="portlet box green">
          <div class="portlet-title">
            <div class="caption"><i class="icon-globe"></i>Charge Records</div>
            <div class="tools">
              <a href="javascript:;" class="reload"></a>
              <a href="javascript:;" class="remove"></a>
            </div>
          </div>
          <div class="portlet-body">
            <div class="row-fluid">  
              <div class="span3">
                <div class="control-group {{ $errors->has('charge_id') ? 'error' : ''}}">
                  <label class="control-label">{!! Html::decode(Form::label('charge_id', 'Charge <span class="required">*</span>', ['class' => 'col-md-4 control-label'])) !!}</label>
                  <div class="controls">
                    {!! Form::select('charge_id',['' => 'Select Charge'] + $page_data['charge']->toArray() , null, ['class' => 'm-wrap span12']) !!}
                    {!! $errors->first('charge_id', '<p class="help-block">:message</p>') !!}
                  </div>
                </div>
              </div>

              <div class="span3">
               <div class="control-group {{ $errors->has('unit') ? 'error' : ''}}">
                  <label class="control-label">{!! Html::decode(Form::label('unit', 'Unit <span class="required">*</span>', ['class' => 'col-md-4 control-label'])) !!}</label>
                  <div class="controls">
                    {!! Form::select('unit',['' => 'Select Unit', '20 Rate'=>'20 Rate','40 Rate'=>'40 Rate','BB Rate'=>'BB Rate'], null, ['class' => 'm-wrap span12']) !!}
                    {!! $errors->first('unit', '<p class="help-block">:message</p>') !!}
                  </div>
                </div>
              </div>

              <div class="span3">
                <div class="control-group {{ $errors->has('amount') ? 'error' : ''}}">
                  <label class="control-label">{!! Html::decode(Form::label('amount', 'Amount <span class="required">*</span>', ['class' => 'col-md-4 control-label'])) !!}</label>
                  <div class="controls">
                    {!! Form::text('amount', null, ['class' => 'm-wrap span12']) !!}
                    {!! $errors->first('amount', '<p class="help-block">:message</p>') !!}
                  </div>
                </div>
              </div>

              <div class="span3">
                <div class="control-group {{ $errors->has('currency') ? 'error' : ''}}">
                  <label class="control-label">{!! Html::decode(Form::label('currency', 'Currency <span class="required">*</span>', ['class' => 'col-md-4 control-label'])) !!}</label>
                  <div class="controls">
                    {!! Form::select('currency',[""=>"Select Currency","USD"=>"USD","MZM"=>"MZM","ZAR"=>"ZAR"],null, ['class' => 'm-wrap span12']) !!}
                    {!! $errors->first('currency', '<p class="help-block">:message</p>') !!}
                  </div>
                </div>
              </div>
            </div>

            <div class="row-fluid">
               <div class="span3">
                <div class="control-group {{ $errors->has('remark') ? 'error' : ''}}">
                  <label class="control-label">{!! Html::decode(Form::label('remark', 'Remark <span class="required">*</span>', ['class' => 'col-md-4 control-label'])) !!}</label>
                  <div class="controls">
                    {!! Form::text('remark', null, ['class' => 'm-wrap span12']) !!}
                    {!! $errors->first('remark', '<p class="help-block">:message</p>') !!}
                  </div>
                </div>
              </div>
            </div>
           
            <div class="row-fluid">
              <div class="span12">
                <div class="control-group">
                  <div class="controls">
                    <div class="col-md-offset-4 col-md-4">
                      {!! Form::submit(isset($submitButtonText) ? $submitButtonText : 'Create', ['class' => 'btn green']) !!}
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>    
        </div>
        {!! 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: {
      'charge_id': {
        required: true,
      },
      'currency': {
        required: true,
      },
      'unit': {
        required: true,
      },
      'amount': {
        required: true,
        digits : true,
      },
   },
   errorPlacement: function (error, element) {
      if(element.parent('.input-group').length) {
          error.insertAfter(element.parent());
      } else { 
        error.insertAfter(element);
      }
   },
   messages: {
      'currency' : {
        required : "The currency field is required",
      },
      'unit' : {
        required : "The unit field is required",
      },
      'charge_id': {
        required : "The charge field is required",
      },
      'amount': {
        required : "The amount field is required",
      },    
    }
  });
});
</script>
 
@endsection