HAM/Berufsschule_HAM
1
0
Fork 1
mirror of https://github.com/LD-Reborn/Berufsschule_HAM.git synced 2025-12-20 06:51:55 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Added detail view to /Home/Assets

Browse Source
This commit is contained in:
LD-Reborn
2025-10-12 23:08:22 +02:00
parent 580ccdc971
commit fb45b3beb8
2 changed files with 147 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/Resources/Views.Home.Assets.de.resx
View File

@@ -139,4 +139,13 @@
<data name="Error updating asset" xml:space="preserve">
<value>Fehler beim Anpassen des Assets</value>
</data>
<data name="Asset Details" xml:space="preserve">
<value>Asset Details</value>
</data>
<data name="Loading..." xml:space="preserve">
<value>Laden...</value>
</data>
<data name="Close" xml:space="preserve">
<value>Schließen</value>
</data>
</root>

139
src/Views/Home/Assets.cshtml
View File

@@ -40,7 +40,7 @@
@{
foreach (AssetsTableViewModel assetsTableViewModel in Model.AssetsTableViewModels)
{
<tr>
<tr class="asset-row" data-asset-id="@assetsTableViewModel.AssetCn">
<td>@assetsTableViewModel.UserUID</td>
<td>@assetsTableViewModel.AssetCn</td>
<td>@assetsTableViewModel.AssetName</td>
@@ -640,4 +640,141 @@ document.addEventListener('DOMContentLoaded', () => {
}
});
});
</script>
<!-- Detail view -->
<div class="modal fade" id="viewAssetModal" tabindex="-1" aria-labelledby="viewAssetModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-info text-white">
<h5 class="modal-title" id="viewAssetModalLabel">@T["Asset Details"]</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="viewAssetContent">
<p class="text-center text-muted">@T["Loading..."]</p>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">@T["Close"]</button>
</div>
</div>
</div>
</div>
<style>
.asset-row > td:not(:last-child) {
cursor: pointer;
}
.asset-row > td {
transition: 0.1s ease;
}
.asset-row:hover > td {
background-color: #17a2b8;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', () => {
const rows = document.querySelectorAll('.asset-row');
const viewModal = document.getElementById('viewAssetModal');
const viewContent = document.getElementById('viewAssetContent');
rows.forEach(row => {
row.addEventListener('click', async (e) => {
// Avoid clicks on buttons inside the row
if (e.target.closest('button')) return;
const assetId = row.getAttribute('data-asset-id');
viewContent.innerHTML = '<p class="text-center text-muted">@T["Loading..."]</p>';
const modal = new bootstrap.Modal(viewModal);
modal.show();
try {
const response = await fetch(`/Assets/Get?cn=${assetId}`);
const json = await response.json();
const asset = json.assetsModel;
if (!asset) {
viewContent.innerHTML = `<p class="text-danger text-center">@T["Asset not found."]</p>`;
return;
}
const html = `
<div class="row g-3">
<div class="col-md-6">
<label class="form-label">@T["Name"]</label>
<input type="text" class="form-control" name="Name" value="${asset.Name || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Location"]</label>
<input type="text" class="form-control" name="Location" value="${asset.Location || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Owner"]</label>
<input type="text" class="form-control" name="Owner" value="${asset.Owner || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Serial Number"]</label>
<input type="text" class="form-control" name="SerialNumber" value="${asset.SerialNumber || ''}" disabled />
</div>
<hr class="my-3" />
<h6 class="fw-bold">@T["Description"]</h6>
<div class="col-md-6">
<label class="form-label">@T["Type"]</label>
<input type="text" class="form-control" name="Description.Type" value="${asset.Description?.Type || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Make"]</label>
<input type="text" class="form-control" name="Description.Make" value="${asset.Description?.Make || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Model"]</label>
<input type="text" class="form-control" name="Description.Model" value="${asset.Description?.Model || ''}" disabled />
</div>
${asset.Description?.Attributes ? `
<h6 class="fw-bold">@T["Attributes"]</h6>
${Object.entries(asset.Description.Attributes)
.map(([k,v]) => `
<div class="d-flex gap-2 align-items-center attribute-row">
<input type="text" class="form-control w-50" placeholder="@T["Attribute name"]" data-attr-name disabled value="${k}" />:
<input type="text" class="form-control" placeholder="@T["Attribute value"]" data-attr-value disabled value="${v}" />
</div>`)
.join('')}
` : ''}
${asset.Description?.Purchase ? `
<h6 class="fw-bold">@T["Purchase Information"]</h6>
<div class="col-md-6">
<label class="form-label">@T["Purchase Date"]</label>
<input type="date" class="form-control" name="Description.Purchase.PurchaseDate" value="${asset.Description.Purchase.PurchaseDate || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Purchase Value"]</label>
<input type="text" class="form-control" name="Description.Purchase.PurchaseValue" value="${asset.Description.Purchase.PurchaseValue || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Purchased At"]</label>
<input type="text" class="form-control" name="Description.Purchase.PurchaseAt" value="${asset.Description.Purchase.PurchaseAt || ''}" disabled />
</div>
<div class="col-md-6">
<label class="form-label">@T["Purchased By"]</label>
<input type="text" class="form-control" name="Description.Purchase.PurchaseBy" value="${asset.Description.Purchase.PurchaseBy || ''}" disabled />
</div>` : ''}
</div>`;
viewContent.innerHTML = html;
} catch (err) {
console.error(err);
viewContent.innerHTML = `<p class="text-danger text-center">@T["Error loading asset details"]</p>`;
}
});
});
});
</script>