@extends('layout.master')
@section('content')
<div class="right_col" role="main">
<div class="">
<div class="clearfix"></div>
<div class="row" style="display: block;">
<div class="col-md-12 col-sm-12">
<div class="x_panel">
<div class="x_title">
<h2>Vehicle <small>Edit</small></h2>
<ul class="nav navbar-right panel_toolbox">
<li>
<a href="{{ route('admin.vehicle.index') }}" class="closeBtn">
<i class="fa fa-arrow-left"></i> Back
</a>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="x_content">
<form class="form-label-left input_mask"
action="{{ route('admin.vehicle.update', $vehicle->id) }}" method="POST"
enctype="multipart/form-data">
@csrf
@method('PUT')
{{-- ================= General Details ================= --}}
<span class="section">General Details</span>
<div class="row">
{{-- Transporter --}}
<div class="col-md-3 col-sm-6 form-group">
<label for="transporter_id">Transporter *</label>
<select name="transporter_id" id="transporter_id" class="form-control" required>
<option value="">Select Transporter</option>
@foreach ($transporters as $transporter)
<option value="{{ $transporter->id }}"
{{ $vehicle->transporter_id == $transporter->id ? 'selected' : '' }}>
{{ $transporter->company_name }}
</option>
@endforeach
</select>
@error('transporter_id')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Vehicle Type --}}
<div class="col-md-3 col-sm-6 form-group">
<label>Vehicle Type *:</label>
<select name="vehicle_type" class="form-control">
<option value="">Select Vehicle Type</option>
@foreach ($vehicleTypes as $type)
<option value="{{ $type->id }}"
{{ $type->id == $vehicle->vehicle_type_id ? 'selected' : '' }}>
{{ $type->name }}
</option>
@endforeach
</select>
@error('vehicle_type')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Manufacturer --}}
<div class="col-md-3 col-sm-6 form-group">
<label>Manufacturer *:</label>
<input type="text" class="form-control" name="make"
value="{{ old('make', $vehicle->make) }}" placeholder="Make">
@error('make')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Model --}}
<div class="col-md-3 col-sm-6 form-group">
<label>Model *:</label>
<input type="text" class="form-control" name="model"
value="{{ old('model', $vehicle->model) }}" placeholder="Model">
@error('model')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Manufacturing Year --}}
<div class="col-md-3 col-sm-6 form-group">
<label>Manufacturing Year *:</label>
<input type="tel" class="form-control" name="manufacturing_year"
value="{{ old('manufacturing_year', $vehicle->year) }}"
placeholder="Manufacturing Year">
@error('manufacturing_year')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Vehicle Image --}}
<div class="col-md-3 col-sm-12 form-group">
<label>Vehicle Images:</label>
<input type="file" class="form-control" name="vehicle_images" accept="image/*">
{{-- @php
$vehicleImages = $vehicle->vehicle_image
? json_decode($vehicle->vehicle_image, true)
: [];
@endphp
@if (!empty($vehicleImages))
<div class="mt-2">
@foreach ($vehicleImages as $img)
<a href="{{ asset('storage/' . $img) }}"
class="btn btn-primary btn-sm mt-2" title="View photo"
target="_blank">
<i class="fa fa-eye"></i>
</a>
@endforeach
</div>
@endif --}}
@error('vehicle_images')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
{{-- Status --}}
<div class="col-md-3 col-sm-6 form-group">
<label>Status *:</label>
<select name="status" class="form-control">
<option value="active" {{ $vehicle->status == 'active' ? 'selected' : '' }}>
Active</option>
<option value="inactive"
{{ $vehicle->status == 'inactive' ? 'selected' : '' }}>Inactive</option>
</select>
@error('status')
<label class="text-danger">{{ $message }}</label>
@enderror
</div>
<div class="col-md-3 col-sm-6 form-group mt-4">
@if ($vehicle->documents->count() > 0)
<div class="form-check">
<input type="checkbox" class="form-check-input verify-vehicle"
id="verifyDriver{{ $vehicle->id }}" data-id="{{ $vehicle->id }}"
{{ $vehicle->is_verified ? 'checked' : '' }}>
<label class="form-check-label" for="verifyDriver{{ $vehicle->id }}">
Verify Vehicle
</label>
</div>
@endif
</div>
</div>
{{-- ================= Vehicle Documents ================= --}}
<span class="section">Vehicle Documents</span>
<div class="row">
@foreach ($vehicle->documents as $i => $doc)
<div class="col-md-3 mb-3" id="doc-card-{{ $doc->id }}">
<div class="card shadow-sm position-relative">
{{-- @if (!$doc->is_verified) --}}
<button type="button"
class="btn btn-danger btn-sm position-absolute m-2 delete-doc"
style="right: 0; top: 0;" data-id="{{ $doc->id }}">
×
</button>
{{-- @endif --}}
<div class="card-body" style="height:150px;">
<h6 class="card-title">
{{ App\Models\Document::documentTypes($doc->doc_type) }}
@if ($doc->is_verified)
<span class="badge badge-success">Verified</span>
@else
<span class="badge badge-warning">Pending</span>
@endif
</h6>
<p class="mb-1"><strong>Number:</strong> {{ $doc->doc_number }}</p>
@if ($doc->expiry_date)
<p class="mb-1"><strong>Expiry:</strong> {{ $doc->expiry_date }}
</p>
@endif
@if ($doc->file_url)
<a href="{{ asset('storage/' . $doc->file_url) }}"
class="btn btn-primary btn-sm m-2 position-absolute"
style="left: 0; bottom: 0;" target="_blank">
<i class="fa fa-eye"></i> View File
</a>
@endif
@if (!$doc->is_verified)
<button type="button"
class="btn btn-success btn-sm position-absolute m-2 verify-doc"
style="right: 0; bottom: 0;" data-id="{{ $doc->id }}">
Verify
</button>
@endif
</div>
</div>
</div>
@endforeach
</div>
{{-- Container for new documents --}}
<div id="documentsContainer"></div>
<div class="row mt-2">
<div class="col-md-12">
<button type="button" id="addDocument" class="btn btn-info">+ Add
Document</button>
</div>
</div>
{{-- Submit --}}
<div class="form-group row mt-3">
<div class="col-md-9 col-sm-9 offset-md-10">
<button class="btn btn-primary" type="reset">Reset</button>
<button type="submit" class="btn btn-success">Update</button>
</div>
</div>
</form>
</div> {{-- x_content --}}
</div>
</div>
</div>
</div>
</div>
@endsection
@push('script')
<script>
let existingDocs = @json($vehicle->documents->pluck('doc_type')->toArray());
let docIndex = {{ $vehicle->documents->count() }};
let allDocTypes = {
'rc': 'Registration Certificate',
'insurance': 'Insurance',
'pollution': 'Pollution',
'permit': 'Permit',
'other': 'Other'
};
function getSelectedDocTypes() {
let selected = [...existingDocs];
$('.doc-type').each(function() {
let val = $(this).val();
if (val) selected.push(val);
});
return selected;
}
$('#addDocument').click(function() {
const idx = docIndex;
let selected = getSelectedDocTypes();
let availableDocTypes = Object.keys(allDocTypes).filter(type => !selected.includes(type));
if (availableDocTypes.length === 0) {
Swal.fire('Info', 'All document types already uploaded!', 'info');
return;
}
let optionsHtml = '<option value="">Select Document Type</option>';
availableDocTypes.forEach(type => {
optionsHtml += `<option value="${type}">${allDocTypes[type]}</option>`;
});
let newRow = `
<div class="row document-row mb-2" data-index="${idx}">
<div class="col-md-3 form-group">
<label>Document Type *</label>
<select name="documents[${idx}][type]" class="form-control doc-type">
${optionsHtml}
</select>
</div>
<div class="col-md-3 form-group">
<label>Document Number *</label>
<input type="text" name="documents[${idx}][number]" class="form-control" placeholder="Document Number">
</div>
<div class="col-md-3 form-group">
<label>Document File *</label>
<input type="file" name="documents[${idx}][file]" class="form-control">
</div>
<div class="col-md-2 form-group expiry-date">
<label>Expiry Date *</label>
<input type="date" name="documents[${idx}][expiry_date]" class="form-control">
</div>
<div class="col-md-1 form-group d-flex align-items-center mt-4">
<button type="button" class="btn btn-danger btn-sm remove-doc">X</button>
</div>
</div>`;
$('#documentsContainer').append(newRow);
docIndex++;
});
$(document).on('click', '.remove-doc', function() {
$(this).closest('.document-row').remove();
});
$(document).on('click', '.verify-doc', function() {
let docId = $(this).data('id');
let button = $(this);
Swal.fire({
title: 'Are you sure?',
text: "Mark this document as verified?",
icon: 'question',
showCancelButton: true,
confirmButtonText: 'Yes, verify it!'
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
url: '/admin/vehicle/document/' + docId + '/verify',
method: 'POST',
data: {
_token: '{{ csrf_token() }}'
},
success: function(res) {
Swal.fire('Verified!', res.message, 'success').then(() => {
location.reload();
});
},
error: function(err) {
Swal.fire('Error', 'Something went wrong', 'error');
}
});
}
});
});
$(document).on('click', '.delete-doc', function() {
let docId = $(this).data('id');
let card = $('#doc-card-' + docId);
Swal.fire({
title: 'Are you sure?',
text: "This document will be permanently deleted!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#d33',
cancelButtonColor: '#6c757d',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'Cancel'
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
url: '/admin/vehicle/document/delete/' + docId,
type: 'DELETE',
data: {
_token: '{{ csrf_token() }}'
},
success: function(response) {
if (response.success) {
card.remove();
Swal.fire(
'Deleted!',
response.message,
'success'
).then(() => {
location.reload();
});
} else {
Swal.fire('Error!', 'Something went wrong.', 'error');
}
},
error: function() {
Swal.fire('Error!', 'Unable to delete document.', 'error');
}
});
}
});
});
$(document).on('change', '.verify-vehicle', function() {
const $checkbox = $(this);
const driverId = $checkbox.data('id');
const isChecked = $checkbox.is(':checked');
const actionText = isChecked ? 'verify' : 'unverify';
Swal.fire({
title: 'Are you sure?',
text: `Do you want to ${actionText} this vehicle?`,
icon: 'question',
showCancelButton: true,
confirmButtonText: `Yes, ${actionText} it!`
}).then((result) => {
if (!result.isConfirmed) {
$checkbox.prop('checked', !isChecked);
return;
}
$.ajax({
url: '/admin/vehicle/' + driverId + '/verify',
method: 'POST',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
data: {
status: isChecked ? 1 : 0
},
success: function(res) {
Swal.fire('Success!', res.message || 'Status updated', 'success');
},
error: function(xhr) {
let msg = 'Something went wrong';
if (xhr && xhr.responseJSON && xhr.responseJSON.message) {
msg = xhr.responseJSON.message;
} else if (xhr && xhr.responseText) {
try {
const json = JSON.parse(xhr.responseText);
if (json.message) msg = json.message;
} catch (e) {}
}
Swal.fire('Error', msg, 'error');
$checkbox.prop('checked', !isChecked);
}
});
});
});
</script>
@endpush