<?php

use yii\helpers\Html;
use yii\widgets\ActiveForm;
$status = ['Active' => 'Active', 'Inactive' => 'Inactive', 'Deleted' => 'Deleted'];
/* @var $this yii\web\View */
/* @var $model frontend\models\Vehicle */
/* @var $form yii\widgets\ActiveForm */
$this->registerJsFile('/js/moment.js');
?>
<script>
	function saveField(id, field, value) {
	$.ajax({
		type: "POST",
		url: "/NGauge/vehicle/savefield",
		data: {id: id, field: field, value: value},
		})
	.done(function(result) {
		console.log(result);
		result = JSON.parse(result);
			$('#message').html(result.message);
			$('#flashmessage').delay(500).fadeIn('normal', function() {
				$(this).delay(2500).fadeOut();
			});
	    $.pjax.reload({container: '#serviceintervals', async:false});
	});
}
function addInterval() {
	
	id = "<?= $model->id ? $model->id : Yii::$app->session->get('shtempid') ?>"
	$.ajax({
		type: "POST",
		url: "/NGauge/vehicle/addrow",
		data: {id: id},
		})
	.done(function(result) {
		result = JSON.parse(result);
			$('#message').html(result.message);
			$('#flashmessage').delay(500).fadeIn('normal', function() {
				$(this).delay(2500).fadeOut();
			});
	    $.pjax.reload({container: '#serviceintervals', async:false});
	});
}
function removeRow() {
	
	id = "<?= $model->id ? $model->id : Yii::$app->session->get('shtempid') ?>"
	$.ajax({
		type: "POST",
		url: "/NGauge/vehicle/deleterow",
		data: {id: id},
		})
	.done(function(result) {
		result = JSON.parse(result);
			$('#message').html(result.message);
			$('#flashmessage').delay(500).fadeIn('normal', function() {
				$(this).delay(2500).fadeOut();
			});
	    $.pjax.reload({container: '#serviceintervals', async:false});
	});
}

</script>
<div class="vehicle-form col-sm-12">

    <?php $form = ActiveForm::begin(); ?>

<div class="row">	
	<div class="col-sm-2">Make</div>
	<div class="col-sm-4"><?= $form->field($model, 'make')->textInput()->label(false) ?></div>
	<div class="col-sm-2">Model</div>
	<div class="col-sm-4"><?= $form->field($model, 'model')->textInput()->label(false) ?></div>
</div>
<div class="row">	
	<div class="col-sm-2">Name</div>
	<div class="col-sm-4"><?= $form->field($model, 'name')->textInput()->label(false) ?></div>
	<div class="col-sm-2">Reg</div>
	<div class="col-sm-4"><?= $form->field($model, 'reg')->textInput()->label(false) ?></div>
</div>
<div class="row">	
	<div class="col-sm-12">Description</div>
	<div class="col-sm-12"><?= $form->field($model, 'description')->textArea(['rows' => 4])->label(false) ?></div>
</div>
<div class="row">	
	<div class="col-sm-2">Date of First Drive</div>
	<div class="col-sm-4"><?= $form->field($model, 'firstd')->widget(\kartik\date\DatePicker::class, ['pluginOptions' => ['showMeridian' =>true, 'convertFormat' => true, 'format' => 'dd/mm/yyyy']])->label(false) ?></div>
	<div class="col-sm-2">Current Mileage</div>
	<div class="col-sm-4"><?= $form->field($model, 'mileage')->textInput()->label(false) ?></div>
</div>
<div class="row">	
	<div class="col-sm-2">Category</div>
	<div class="col-sm-4"><?= $form->field($model, 'category')->textInput()->label(false) ?></div>
</div>
<div class="row">	
	<div class="col-sm-2">Vehicle Unloaded Weight</div>
	<div class="col-sm-4"><?= $form->field($model, 'weight')->textInput()->label(false) ?></div>
	<div class="col-sm-2">Vehicle Loaded Weight</div>
	<div class="col-sm-4"><?= $form->field($model, 'loadedweight')->textInput()->label(false) ?></div>
</div>
<div class="row">
<div class="col-sm-2">Fuel Tank Size (L)</div>
	<div class="col-sm-4"><?= $form->field($model, 'fueltanksize')->textInput()->label(false) ?></div>
</div>
<div class="row">
	<div class="col-sm-2">Status</div>
	<div class="col-sm-4"><?= $form->field($model, 'status')->dropdownList($status, ['prompt' => 'Please Select...'])->label(false) ?></div>
</div>

  	<div class="card card-default">
		<div class="card-header">Tyre Pressures</div>
	  	<div class="card-body">
			<div class="row">
				<div class="col-sm-offset-2 col-sm-4 data-label text-center">Loaded</div>
				<div class="col-sm-4 data-label text-center">Unloaded</div>
			</div>
			<div class="row">
				<div class="col-sm-2 data-label">Nearside Front</div>
				<div class="col-sm-4"><?= $form->field($model, 'nearsidefl')->textInput()->label(false) ?></div>
				<div class="col-sm-4"><?= $form->field($model, 'nearsidefu')->textInput()->label(false) ?></div>
			</div>
			<div class="row">
				<div class="col-sm-2 data-label">Nearside Rear</div>
				<div class="col-sm-4"><?= $form->field($model, 'nearsiderl')->textInput()->label(false) ?></div>
				<div class="col-sm-4"><?= $form->field($model, 'nearsideru')->textInput()->label(false) ?></div>
			</div>
			<div class="row">
				<div class="col-sm-2 data-label">Offside Front</div>
				<div class="col-sm-4"><?= $form->field($model, 'offsidefl')->textInput()->label(false) ?></div>
				<div class="col-sm-4"><?= $form->field($model, 'offsidefu')->textInput()->label(false) ?></div>
			</div>
			<div class="row">
				<div class="col-sm-2 data-label">Offside Rear</div>
				<div class="col-sm-4"><?= $form->field($model, 'offsiderl')->textInput()->label(false) ?></div>
				<div class="col-sm-4"><?= $form->field($model, 'offsidefu')->textInput()->label(false) ?></div>
			</div>
			<div class="row">
				<div class="col-sm-2 data-label">Spare</div>
				<div class="col-sm-4"><?= $form->field($model, 'spare')->textInput()->label(false) ?></div>
			</div>
		</div>
	</div>

 	
  <div class="card card-default">
  	<div class="card-header">Serivce Intervals <?= HTML::Button('<i class="fa fa-plus"></i>', ['onclick' => 'addInterval()', 'class' => 'btn btn-sm btn-info pull-right']); ?></div>
  	<div class="card-body">
	<?php 
		yii\widgets\Pjax::begin(['id' => 'serviceintervals']); 
			if ($model->serviceintervals) { ?>
	  	<?php foreach ($model->serviceintervals as $key => $service) { ?>
			<div class="row">
	  			<div class="col-sm-2 data-label">Description</div>
	  			<div class="col-sm-4"><?= $form->field($service, 'description')->textInput(['onBlur' => "saveField('$service->id', 'description', $(this).val())"])->label(false) ?></div>
	  		</div>
	  		<div class="row">
	  			<div class="col-sm-2 data-label">Mileage</div>
	  			<div class="col-sm-4"><?= $form->field($service, 'mileage')->textInput(['onBlur' => "saveField('$service->id', 'mileage', $(this).val())"])->label(false) ?></div>
	  			<div class="col-sm-2 data-label">Reminder Mileage</div>
	  			<div class="col-sm-4"><?= $form->field($service, 'remindermileage')->textInput(['onBlur' => "saveField('$service->id', 'remindermileage', $(this).val())"])->label(false) ?></div>
	  		</div>
	  		<div class="row">
	  			<div class="col-sm-2 data-label">Date</div>
	  			<div class="col-sm-4"><?= $form->field($service, 'date')->widget(\kartik\date\DatePicker::class, ['pluginOptions' => ['showMeridian' =>true, 'convertFormat' => true, 'format' => 'dd/mm/yyyy'], 'pluginEvents' => ["changeDate" => "function(e) {saveField('$service->id', 'date',  moment(e.date).format('D/MM/Y'));}"], 'options' => ['id' => "date1$service->id" ]])->label(false) ?></div>
	  			<div class="col-sm-2 data-label">Reminder Date</div>
	  		</div>
	  			<div class="col-sm-4"><?= $form->field($service, 'reminderdate')->widget(\kartik\date\DatePicker::class, ['pluginOptions' => ['showMeridian' =>true, 'convertFormat' => true, 'format' => 'dd/mm/yyyy'], 'pluginEvents' => ["changeDate" => "function(e) {saveField('$service->id', 'reminderdate',  moment(e.date).format('D/MM/Y'));}"], 'options' => ['id' => "date2$service->id" ]])->label(false) ?></div>
		<?php } ?>  
	<?php } ?>  
	<?php	yii\widgets\Pjax::end();  ?>

  	</div>
  </div>
  <?php if (Yii::$app->controller->action->id == 'update') {?>
  <?= $this->render('//uploads/dbupload', ['relatedto' => 'Vehicle', 'relatedid' => $model->id]); ?>
  <?php  } ?>

    <div class="form-group">
        <?= Html::submitButton('Save', ['class' => 'btn btn-primary']) ?>
    </div>

    <?php ActiveForm::end(); ?>

</div>
<script>
$("[id*=date1]").on('blur', function(index, item) {
	id = $(this).data('\DatePickerSource').substr(5,37);
	field = 'date';
	value =	$(this).val();
	console.log(id);
	console.log($(this).data('\DatePickerSource'));
	$.ajax({
		type: "POST",
		url: "/NGauge/vehicle/savefield",
		data: {id: id, field: field, value: value},
		})
	.done(function(result) {
		console.log(result);
		result = JSON.parse(result);
			$('#message').html(result.message);
			$('#flashmessage').delay(500).fadeIn('normal', function() {
				$(this).delay(2500).fadeOut();
			});
	    $.pjax.reload({container: '#serviceintervals', async:false});
	});
	
})	
$("[id*=date2]").on('blur', function(index, item) {
	id = $(this).data('\DatePickerSource').substr(5,37);
	field = 'reminderdate';
	value =	$(this).val();
	console.log(id);
	console.log($(this).data('\DatePickerSource'));
	$.ajax({
		type: "POST",
		url: "/NGauge/vehicle/savefield",
		data: {id: id, field: field, value: value},
		})
	.done(function(result) {
		console.log(result);
		result = JSON.parse(result);
			$('#message').html(result.message);
			$('#flashmessage').delay(500).fadeIn('normal', function() {
				$(this).delay(2500).fadeOut();
			});
	    $.pjax.reload({container: '#serviceintervals', async:false});
	});
	
})	
</script>