@extends('layouts.admin')

@section('content')
<div class="formswrap">
  <section class="forms-basic consearchbasic">
    <form class="form-floating form-validate has-validation-callback" id="contractsearchform" name="contractsearchform">
	{{ csrf_field() }} 
	<div class="row m-b-40">
	  <div class="col-md-6">
		<div class="well white testconsearcheight">
			<fieldset>
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="search_type" id="search_type_client" value="client" data-validation-depending-value="carrier"> 
							Client
						</label>
					</div>
				</div>						
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="search_type" id="search_type_carrier" value="carrier" data-validation-depending-value="carrier"> 
							Carrier</label>
					</div>
				</div>
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="search_type" id="search_type_blanket" value="blanket" data-validation="required" data-validation-error-msg-container="#search_type_error" data-validation-depending-value="carrier"> 
							Blanket
						</label>
					</div>
				</div>
				<span id="search_type_error"></span>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-6">
		<div class="well white testconsearcheight">
			<fieldset>
				<div id="searchclient">
					<legend>Client</legend>
					<input type="hidden" id="client_id" name="client_id" value="" data-validation="required" data-validation-depends-on="client_name" data-validation-error-msg="Please select valid client." data-validation-error-msg-container="#client_error">
					<div class="form-group">
						<label for="search_client_name" class="control-label">Client Name</label>
						<input type="text" class="form-control" name="search_client_name" id="search_client_name" data-validation="required" data-validation-depends-on="search_type" data-validation-depends-on-value="client" value="" autocomplete="off" data-func-cancel="clearClientBox">
					</div>
				</div>
				<div id="searchcarrier">
					<legend>Carrier</legend>
					<input type="hidden" id="carrier_id" name="carrier_id" value="" data-validation="required" data-validation-depends-on="client_name" data-validation-error-msg="Please select valid carrier." data-validation-error-msg-container="#carrier_error">
					<div class="form-group">
						<label for="search_carrier_name" class="control-label">Carrier Name</label>
						<input type="text" class="form-control" name="search_carrier_name" id="search_carrier_name" data-validation="required" data-validation-depends-on="search_type" data-validation-depends-on-value="carrier" value="" autocomplete="off" data-func-cancel="clearcarrierBox">
					</div>
				</div>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-12">
		<div class="well white">
			<fieldset>
				<div class="form-group col-md-6 padding-left">
					<label class="control-label normal">Equipment Type</label>
					<select name="search_equipment" id="search_equipment" class="select2 form-control" data-validation="required" tabindex="-1" aria-hidden="true">
						{!! FormField::dropDownOptions('search_equipment', $equipmentTypes, ((isset($searchData['equipment'])) ? $searchData['equipment'] : null)) !!}
					</select>
				</div>
				<div class="form-group col-md-6 padding-left">
					<label class="control-label normal">Contract Status</label>
					<select name="contract_status" id="contract_status" class="select2 form-control" data-validation="required" tabindex="-1" aria-hidden="true">
						<option value="">Please Select</option>
						<option value="0">Being Entered</option>
						<option value="1">Live Contract</option>
					</select>
				</div>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-4">
		<div class="well white consearcheight">
			<fieldset>
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="load_type" id="load_type_sort" value="full_load" > 
							Full Load
						</label>
					</div>
				</div>						
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="load_type" id="load_type_sort" value="partial" > 
							Partial</label>
					</div>
				</div>
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="load_type" id="load_type_sort" value="ltl"> 
							LTL
						</label>
					</div>
				</div>
				<span id="search_type_error"></span>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-8">
		<div class="well white consearcheight">
			<fieldset>
				<div id="SearchFullLoad">
					<div class="form-group col-md-4 padding-left">
						<label for="freight_description" class="control-label">Freight Description</label>
						<input type="text" class="form-control tl-field" id="freight_description" name="freight_description" value="" >
					</div>
					<div class="form-group col-md-4 padding-left">
						<label for="total_weight" class="control-label">Total Weight</label>
						<input type="text" class="form-control tl-field" id="total_weight" name="total_weight" value="" data-validation="required">
					</div>
					<div class="form-group col-md-4 padding-left">
						<label for="total_weight" class="control-label">Class</label>
						<input type="text" class="form-control" id="class" name="class" value="50" data-validation="required" readonly>
					</div>
				</div>
				<div id="SearchPartial">		
				  <div class="col-md-12 no-padding">
					<div class="table-responsive">
						<table class="table table-full table-full-small non-tl-table">
						  <thead>
							<tr>
							  <th>Description</th>
							  <th>Class</th>
							  <th>Unit</th>
							  <th>Length</th>
							  <th>Width</th>
							  <th>Height</th>
							  <th>Weight</th>
							  <th></th>
							</tr>
						  </thead>
						  <tbody id="partial-items">
							<tr class="partial-row">
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[description][]" value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[class][]"  value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[unit][]"  value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[length][]"  value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[width][]"  value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="partial-items[height][]"  value="">
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field partial-weight" name="partial-items[weight][]"  value="">
							  </td>
							  <td>
								<input class="btn btn-sm btn-danger add-partial-row" type="button" name="+" value="+">
							  </td>
							</tr>
						  </tbody>
						</table>
					  </div>
				  </div>
				</div>
				<div id="SearchLTL">		
				  <div class="col-md-12 no-padding">
					<div class="table-responsive">
						<table class="table table-full table-full-small non-tl-table">
						  <thead>
							<tr>
							  <th>Description</th>
							  <th>Class</th>
							  <th>Unit</th>
							  <th>Length</th>
							  <th>Width</th>
							  <th>Height</th>
							  <th>Weight</th>
							  <th></th>
							</tr>
						  </thead>
						  <tbody id="ltl-items">
							<tr class="ltl-row">
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[description][]" value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[class][]"  value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[unit][]"  value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[length][]"  value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[width][]"  value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field" name="ltl-items[height][]"  value="" >
							  </td>
							  <td>
								<input type="text" class="form-control non-tl-field ltl-weight" name="ltl-items[weight][]"  value="" >
							  </td>
							  <td>
								<input class="btn btn-sm btn-danger add-ltl-row" type="button" name="+" value="+">
							  </td>
							</tr>
						  </tbody>
						</table>
					  </div>
				  </div>
				</div>
			</fieldset>
		</div>
	  </div>
	  <div class="clearfix"></div>
	  <div class="col-md-4">
		<div class="well white">
			<fieldset>
				<div class="form-group col-md-8 padding-left">
					<label class="control-label normal">List of Accessorials</label>
					<select name="accessorial_type" id="accessorial_type" class="select2 form-control"  tabindex="-1" aria-hidden="true">
					<option value="">Please Select</option>
					{!! FormField::dropDownOptions('list_accessory', $accessorialTypes, false, false) !!}
					</select>
					<!-- {!! FormField::select2('accessorial_type', $accessorialTypes, false, false) !!} -->
				</div>
				<div class="form-group col-md-3 padding-left" style="margin-top: 16px;">
					<input type="text" placeholder="Rate" id="accessorial_rate" name="accessorial_rate" class="form-control">
				</div>
				<div class="form-group col-md-1 padding-left">
					<input class="btn btn-sm btn-danger add-accessorial" type="button" name="+" value="+">
				</div>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-8">
		<div class="well white conaccesoryht">
			<fieldset>
				<div class="clearfix"></div>
				<div class="col-md-12 no-padding">
					<div class="table-responsive">
						<table id="accessorials-table" class="table table-full table-full-small">
						  <thead>
							<tr>
							  <th>Accessorial</th>
							  <th>Rate</th>
							  <th></th>
							</tr>
						  </thead>
						  <tbody id="accessorial-items">			  
						  </tbody>
						</table>
					</div>
				</div>
				<input type="hidden" class="form-control order-charge-part" id="accessorial_charge" name="accessorial_charge" value="">
			</fieldset>
		</div>
	  </div>
	  <div class="clearfix"></div>
	  <div class="col-md-6">
		<div class="well white conaddressht">
			<fieldset>
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="search_address" id="search_type_city" value="City" > 
							City
						</label>
					</div>
				</div>						
				<div class="form-group">
					<div class="radio">
					  <label class="filled">
						<input type="radio" name="search_address" id="search_type_city" value="Zip" > 
							Zip Code</label>
					</div>
				</div>
				<span id="search_type_error"></span>
			</fieldset>
		</div>
	  </div>
	  <div class="col-md-6">
		<div class="well white conaddressht">
			<fieldset>
				<div id="searchcity">
					<div class="form-group col-md-11 padding-left">
						<legend>City/State</legend>
					</div>
					<div class="form-group col-md-1 padding-left">
						<input class="btn btn-sm btn-danger add-city" type="button" name="+" value="+" id="AddCityName">
					</div>
					<div class="clearfix"></div>
					<div class="form-group">
						<label for="search_origin_citystate" class="control-label">Origin City / State</label>
						<input type="text" class="form-control" name="search_origin_citystate" id="search_origin_citystate" data-func-cancel="clearOriginCityStateBox" value="">

					</div>
					<div id="city-state-items">
					</div>
					<div class="clearfix"></div>
					<div class="form-group">
						<label for="search_destination_citystate" class="control-label">Destination City / State</label>
						<input type="text" class="form-control" name="search_destination_citystate" id="search_destination_citystate"  value="" data-func-cancel="clearDestinationCityStateBox">
					</div>
				</div>
				<div id="searchzip">
					<div class="form-group col-md-11 padding-left">
						<legend>Zip Code</legend>
					</div>
					<div class="form-group col-md-1 padding-left">
						<input class="btn btn-sm btn-danger add-zipcode" type="button" name="+" value="+">
					</div>
					<div class="clearfix"></div>
					<div class="form-group">
						<label for="origin_zip_code" class="control-label">Origin Zip Code</label>
						<input type="text" class="form-control" name="origin_zip_code" id="origin_zip_code" data-func-cancel="clearOriginZipcodeBox">
					</div>
					<div id="zipcode-items"></div>
					<div class="clearfix"></div>
					<div class="form-group">
						<label for="desti_zip" class="control-label">Destination Zip Code</label>
						<input type="text" class="form-control" name="destination_zip_code" id="destination_zip_code" data-func-cancel="cleardestinationZipcodeBox">
					</div>
				</div>
			</fieldset>
		</div>
	  </div>
	  <div class="newcontbtn">
		<input class="btn btn-sm btn-danger test_contract" type="submit" name="test_contract-search" id="test_contract" value="Test Contract">
		<input class="btn btn-sm btn-danger test_contract" type="submit" name="test-contract-clear" id="test-contract-clear" value="Clear">
	  </div>

	  <div class="card">
		  <div>
			<div class="datatables">
			  <table  class="table table-full table-full-small" cellspacing="0" width="100%" >
				<thead>
				  <tr>
				 	<th>#id</th>
					<th>Contract</th>
					<th>Line Haul</th>
					<th>Fuel Surcharges</th>
					<th>Accessorials</th>
					<th>Total</th>
				  </tr>
				</thead>
				<tbody id="contractTypeSearch" style="display:none;">
				</tbody>
			  </table>
			</div>
		  </div>
	  </div>
	</div>
	</form>
  </section>
</div>
<style>
#searchclient, #searchcarrier, #searchcity, #searchzip,#SearchLTL,#SearchPartial,#SearchFullLoad{
display: none;
}
.testconsearcheight{
min-height:295px;
}
.conaccesoryht{
min-height:108px;
}
.conaddressht{
min-height:175px;
}
</style>
@endsection
@section('scripts')
<script charset="utf-8" src="{{asset('backend/js/services/testContract.js')}}"></script>
@endsection