@extends('app')
@section('content')
<title>Create AMC</title>
<style type="text/css">
	.control-label {
		text-align: left !important;
	}

	.imagePreview {
		width: 50px;
		height: 50px;
		background-position: center center;
		background-size: cover;
		-webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);
		display: inline-block;
	}
</style>
<div class="content-wrapper">
	<div class="container">
		<div class="row">
			<div class="col-md-12">
				<h1 class="page-head-line">ADD AMC</h1>
			</div>
		</div>
		<div class="row">
			<div class="col-md-12">
				<div class="panel panel-default">
					<div class="panel-body">
						@if($errors->any())
						<div class="alert alert-danger">
							@foreach($errors->all() as $error)

							<p>{{ $error=="Please Select Vendor."?'Please Select Client':$error }}</p>
							@endforeach
						</div>
						@endif
						<form class="form-horizontal" role="form" id="submit" method="POST" action="/amcs">
							<input type="hidden" name="_token" value="{{ csrf_token() }}" />
							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Select Client <span style="color:#FF0000"> *</span>
									</label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<!--<input type="text" class="form-control" name="contact_name" value="{{  old('contact_name') }}" style="text-transform:capitalize">-->
										<select class="form-control" name="vendor_id" id="vendor_id">
											<option value="">Please Select Client</option>
											@foreach($vendors as $vendor)
																						@endforeach
										</select>
									</div>
								</div>
							</div>

							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Select Product<span style="color:#FF0000"> *</span></label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<select class="form-control" name="product_id" id="product_id">
											<option value="">Please Select</option>
											@foreach($products as $product)
											<option value="{{ $product->id }}">{{ $product->product_name }} / {{ $product->product_code }}</option>
											@endforeach
										</select>
									</div>
								</div>
							</div>



							   @if(!empty($settings['location']) && $settings['location'] == 1)
							<div class="col-md-6">
								<div class="form-group row" id="locationDropdowndiv">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">
										Select Location
									</label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<select class="form-control" name="vendor_location"
											id="locationDropdown">
											<option value="">Please Select Location</option>
										</select>
									</div>
								</div>
							</div>

							
							<script>
								$(document).ready(function() {
									$('select[name="vendor_id"]').on('change', function() {
										var vendorId = $(this).val();
										const $locationWrapper = $('#locationDropdowndiv');

										if (vendorId) {
											$.ajax({
												url: "{{ url('/admin/vendor/locations') }}/" + vendorId,
												type: "GET",
												dataType: "json",
												success: function(data) {
													$('#locationDropdown').empty().append(
														'<option value="">Please Select Location</option>');
													$.each(data.locations, function(key, value) {
														$('#locationDropdown').append(
															'<option value="' + value.id + '">' + value
															.address_line1 + ', ' + value.city + '</option>'
														);
													});
													if(data.vendor_address_status == 0)
													{
														$locationWrapper.css('display', 'none');
													}else{
														$locationWrapper.css('display', 'block');
													}
												}
											});
										} else {
											$('#locationDropdown').empty().append(
												'<option value="">Please Select Location</option>');
										}
									});
								});
							</script>

							@endif

										<div class="col-md-6">
    <div class="form-group">
        <label class="control-label col-md-4 col-sm-3 col-xs-12">AMC Price</label>
        <div class="col-md-8 col-sm-6 col-xs-12">
            <input type="number" step="0.01" min="0" class="form-control" name="amc_price" value="{{ old('amc_price') }}">
        </div>
    </div>
</div>
							<div class="col-md-6" style="clear:both;">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Terms & Conditions </label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<textarea class="form-control" id="terms" name="terms" rows="2" style="text-transform:capitalize">{{ old('terms') }}</textarea>

									</div>
								</div>
							</div>

							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Type <span style="color:#FF0000"> *</span></label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<label class="radio-inline"><input type="radio" name="atype" value="Comprehensive" id="comprehensive" checked>Comprehensive</label>
										<label class="radio-inline"><input type="radio" name="atype" id="non_comp" value="Non-Comprehensive">Non-Comprehensive</label>
									</div>
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Service Time Frame <span style="color:#FF0000"> *</span></label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<div class="input-group date">
											<select name="service_timeframe" id="service_timeframe" class="form-control">
												<option value="">Select Time Frame</option>
												<option value="15 Days">15 Days</option>
												<option value="Monthly">Monthly</option>
												<option value="Quaterly">Quaterly</option>
												<option value="Yearly">Yearly</option>
											</select>
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">Start Date <span style="color:#FF0000"> *</span></label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<div class="input-group date">
											<input type="text" name="start_date" id="joining_date" data-format="DD-MM-YYYY" class="form-control" readonly value="{{  old('start_date') }}">
											<span class="input-group-btn">
												<button type="button" class="btn btn-default click"><i class="fa fa-calendar"></i></button>
											</span>
										</div>
									</div>
								</div>
							</div>
							<div class="col-md-6">
								<div class="form-group">
									<label class="control-label col-md-4 col-sm-3 col-xs-12">End Date <span style="color:#FF0000"> *</span></label>
									<div class="col-md-8 col-sm-6 col-xs-12">
										<div class="input-group date">
											<input type="text" name="end_date" id="joining_date" data-format="DD-MM-YYYY" class="form-control" readonly value="{{  old('end_date') }}">
											<span class="input-group-btn">
												<button type="button" class="btn btn-default click"><i class="fa fa-calendar"></i></button>
											</span>
										</div>
									</div>
								</div>
							</div>

							<div class="col-md-12">
								<div class="form-group">
									<div class="col-md-8 col-sm-6 col-xs-12 col-md-offset-5">
										<button type="submit" class="btn btn-success" id="save_reading" onclick="formsubmit()">Submit</button>
										<a href="/amcs/indexnew" class="btn btn-primary">Cancel</a>
									</div>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
	function formsubmit() {
		$("#submit").submit();
		document.getElementById("save_reading").disabled = true;

	}
</script>

<!--
<script> 
    $(document).ready(function () {
		$('#joining_date').datetimepicker({
			 
			//changeYear: true,
			defaultDate: new Date(),
			pickTime: false
		});
		$('#end_date').datetimepicker({
			defaultDate: new Date(),
			pickTime: false
		});
	});
</script>
-->
<script>
	$(document).ready(function() {
		$('#joining_date').datepicker({
			changeYear: true
		});
	});
</script>
@endsection