45 lines
2.4 KiB
Plaintext
45 lines
2.4 KiB
Plaintext
@model List<Vehicle>
|
|
@{
|
|
var recordTags = Model.SelectMany(x => x.Tags).Distinct();
|
|
}
|
|
@if (recordTags.Any())
|
|
{
|
|
<div class='row'>
|
|
<div class="d-flex align-items-center flex-wrap mt-4">
|
|
@foreach (string recordTag in recordTags)
|
|
{
|
|
<span onclick="filterGarage(this)" class="user-select-none ms-2 rounded-pill badge bg-secondary tagfilter" style="cursor:pointer;">@recordTag</span>
|
|
}
|
|
<datalist id="tagList">
|
|
@foreach (string recordTag in recordTags)
|
|
{
|
|
<!option value="@recordTag"></!option>
|
|
}
|
|
</datalist>
|
|
</div>
|
|
</div>
|
|
}
|
|
<div class="row">
|
|
<div class="row gy-3 align-items-stretch vehiclesContainer">
|
|
@foreach (Vehicle vehicle in Model)
|
|
{
|
|
<div class="col-xl-2 col-lg-4 col-md-4 col-sm-4 col-4 user-select-none garage-item" ondragover="dragOver(event)" ondrop="dropBox(event, @vehicle.Id)" draggable="true" ondragstart="dragStart(event, @vehicle.Id)" data-tags='@string.Join(" ", vehicle.Tags)' id="gridVehicle_@vehicle.Id" data-bs-toggle="tooltip" data-bs-html="true" data-bs-placement="bottom" data-bs-trigger="manual" onmouseenter="loadPinnedNotes(@vehicle.Id)" ontouchstart="loadPinnedNotes(@vehicle.Id)" ontouchcancel="hidePinnedNotes(@vehicle.Id)" ontouchend="hidePinnedNotes(@vehicle.Id)" onmouseleave="hidePinnedNotes(@vehicle.Id)">
|
|
<div class="card" onclick="viewVehicle(@vehicle.Id)">
|
|
<img src="@vehicle.ImageLocation" style="height:145px; object-fit:scale-down; pointer-events:none;" />
|
|
<div class="card-body">
|
|
<h5 class="card-title text-truncate garage-item-year" data-unit="@vehicle.Year">@($"{vehicle.Year}")</h5>
|
|
<h5 class="card-title text-truncate">@($"{vehicle.Make}")</h5>
|
|
<h5 class="card-title text-truncate">@($"{vehicle.Model}")</h5>
|
|
<p class="card-text text-truncate">@vehicle.LicensePlate</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
<div class="col-xl-2 col-lg-4 col-md-4 col-sm-4 col-4 garage-item-add">
|
|
<div class="card" onclick="showAddVehicleModal()" style="height:100%;">
|
|
<img src="/defaults/addnew_vehicle.png" style="object-fit:scale-down;height:100%;" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|