Fixed new assets not clickeable

This commit is contained in:
2025-10-26 21:00:46 +01:00
parent 76a42ebd8c
commit 640e53cafe

View File

@@ -347,7 +347,10 @@
</td> </td>
`; `;
newRow.classList.add('asset-row');
newRow.classList.add('table-success'); newRow.classList.add('table-success');
newRow.setAttribute("data-asset-id", result.assetId);
registerRowDetailviewClick(newRow);
setTimeout(() => { setTimeout(() => {
newRow.classList.toggle('table-success'); newRow.classList.toggle('table-success');
}, 500); }, 500);
@@ -639,133 +642,134 @@ document.addEventListener('DOMContentLoaded', () => {
<script> <script>
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const rows = document.querySelectorAll('.asset-row'); const rows = document.querySelectorAll('.asset-row');
rows.forEach(row => registerRowDetailviewClick(row));
});
function registerRowDetailviewClick(row) {
const viewModal = document.getElementById('viewAssetModal'); const viewModal = document.getElementById('viewAssetModal');
const viewContent = document.getElementById('viewAssetContent'); const viewContent = document.getElementById('viewAssetContent');
row.addEventListener('click', async (e) => {
// Avoid clicks on buttons inside the row
if (e.target.closest('button')) return;
rows.forEach(row => { const assetId = row.getAttribute('data-asset-id');
row.addEventListener('click', async (e) => { viewContent.innerHTML = '<p class="text-center text-muted">@T["Loading..."]</p>';
// Avoid clicks on buttons inside the row
if (e.target.closest('button')) return;
const assetId = row.getAttribute('data-asset-id'); const modal = new bootstrap.Modal(viewModal);
viewContent.innerHTML = '<p class="text-center text-muted">@T["Loading..."]</p>'; modal.show();
const modal = new bootstrap.Modal(viewModal); try {
modal.show(); const response = await fetch(`/Assets/Get?cn=${assetId}`);
const json = await response.json();
const asset = json.assetsModel;
try { if (!asset) {
const response = await fetch(`/Assets/Get?cn=${assetId}`); viewContent.innerHTML = `<p class="text-danger text-center">@T["Asset not found."]</p>`;
const json = await response.json(); return;
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">
<h6 class="fw-bold">@T["Barcode"]</h6>
<div class="col-md-6">
<svg id="ean13" class="form-control" name="Barcode" />
</div>
<div class="col-md-6">
<button id="downloadBtn" class="form-control my-2 btn btn-primary">@T["Download Barcode"]</button>
<button id="printBtn" class="form-control my-2 btn btn-primary">@T["Add Barcode to print batch"]</button>
</div>
</div>
<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>
</div>
<hr class="my-3" />
<div class="row g-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>
</div>
${asset.Description?.Attributes ? `
<hr class="my-3" />
<div class="row g-3">
<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('')}
</div>` : ''}
${asset.Description?.Purchase ? `
<hr class="my-3" />
<div class="row g-3">
<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>` : ''}
</div>`;
viewContent.innerHTML = html;
JsBarcode("#ean13", idToEAN13(asset.Cn), {
format: "EAN13",
lineColor: "#000",
width: 2,
height: 80,
displayValue: true
});
document.getElementById("downloadBtn").addEventListener("click", () => {
downloadBarcode("ean13", idToEAN13(asset.Cn));
});
document.getElementById("printBtn").addEventListener("click", () => {
addAssetIdToBatch(asset.Cn);
showToast("@T["Successfully added barcode to print batch"]", "success");
bootstrap.Modal.getInstance('#viewAssetModal').hide();
});
} catch (err) {
console.error(err);
viewContent.innerHTML = `<p class="text-danger text-center">@T["Error loading asset details"]</p>`;
} }
});
const html = `
<div class="row g-3">
<h6 class="fw-bold">@T["Barcode"]</h6>
<div class="col-md-6">
<svg id="ean13" class="form-control" name="Barcode" />
</div>
<div class="col-md-6">
<button id="downloadBtn" class="form-control my-2 btn btn-primary">@T["Download Barcode"]</button>
<button id="printBtn" class="form-control my-2 btn btn-primary">@T["Add Barcode to print batch"]</button>
</div>
</div>
<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>
</div>
<hr class="my-3" />
<div class="row g-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>
</div>
${asset.Description?.Attributes ? `
<hr class="my-3" />
<div class="row g-3">
<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('')}
</div>` : ''}
${asset.Description?.Purchase ? `
<hr class="my-3" />
<div class="row g-3">
<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>` : ''}
</div>`;
viewContent.innerHTML = html;
JsBarcode("#ean13", idToEAN13(asset.Cn), {
format: "EAN13",
lineColor: "#000",
width: 2,
height: 80,
displayValue: true
});
document.getElementById("downloadBtn").addEventListener("click", () => {
downloadBarcode("ean13", idToEAN13(asset.Cn));
});
document.getElementById("printBtn").addEventListener("click", () => {
addAssetIdToBatch(asset.Cn);
showToast("@T["Successfully added barcode to print batch"]", "success");
bootstrap.Modal.getInstance('#viewAssetModal').hide();
});
} catch (err) {
console.error(err);
viewContent.innerHTML = `<p class="text-danger text-center">@T["Error loading asset details"]</p>`;
}
}); });
}); }
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const createModal = document.getElementById('createAssetModal'); const createModal = document.getElementById('createAssetModal');