fix table in ui
This commit is contained in:
parent
e1cf4fc885
commit
00264dd2d2
@ -20,6 +20,7 @@
|
|||||||
<div id="registerItem" class="row">
|
<div id="registerItem" class="row">
|
||||||
<div class="row card">
|
<div class="row card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
|
<h2>Item Movement List</h2>
|
||||||
@* <button id="addItemBtn" class="btn btn-success col-md-3 col-lg-3 m-1 col-12"><i class="fa fa-plus"></i> Add Item</button> *@
|
@* <button id="addItemBtn" class="btn btn-success col-md-3 col-lg-3 m-1 col-12"><i class="fa fa-plus"></i> Add Item</button> *@
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
@ -286,175 +287,82 @@
|
|||||||
this.itemDatatable = $('#itemDatatable').DataTable({
|
this.itemDatatable = $('#itemDatatable').DataTable({
|
||||||
"data": this.items,
|
"data": this.items,
|
||||||
"columns": [
|
"columns": [
|
||||||
{
|
{ title: "Unique Id", data: "id" },
|
||||||
"title": "Unique Id",
|
{ title: "Product Code", data: "uniqueID" },
|
||||||
"data": "id",
|
{ title: "From User", data: "toUserName" },
|
||||||
"createdCell": function (td, cellData, rowData, row, col) {
|
{ title: "Last User", data: "lastUserName" },
|
||||||
// Assign a unique ID to the <td> element
|
{ title: "From Station", data: "toStationName" },
|
||||||
$(td).attr('id', `qr${cellData}`);
|
{ title: "Last Station", data: "lastStationName" },
|
||||||
},
|
{ title: "From Store", data: "toStoreName" },
|
||||||
},
|
{ title: "Last Store", data: "lastStoreName" },
|
||||||
{
|
{ title: "Action", data: "action" },
|
||||||
"title": "Print",
|
{ title: "Start Status", data: "toOther" },
|
||||||
"data": "item.itemId",
|
{ title: "Latest Status", data: "latestStatus" },
|
||||||
"render": function (data, type, full, meta) {
|
{ title: "Qty", data: "quantity" },
|
||||||
var printButton = `<button type="button" class="btn btn-success print-btn" data-id="${data}">Print</button>`;
|
{ title: "Send Date", data: "sendDate" },
|
||||||
return printButton;
|
{ title: "Receive Date", data: "receiveDate" },
|
||||||
},
|
{ title: "Note",
|
||||||
"className": "align-middle",
|
data: "consignmentNote",
|
||||||
},
|
render: function (data, type, full, meta) {
|
||||||
{
|
if (!data) {
|
||||||
"title": "To User",
|
return "No Document";
|
||||||
"data": "item.toUser",
|
}
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Last User",
|
|
||||||
"data": "item.lastUser",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Action",
|
|
||||||
"data": "item.action",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Latest Status",
|
|
||||||
"data": "item.latestStatus",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Quantity",
|
|
||||||
"data": "item.quantity",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "To Station",
|
|
||||||
"data": "item.toStation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "To Store",
|
|
||||||
"data": "item.toStore",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "To Other",
|
|
||||||
"data": "item.toOther",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Remark",
|
|
||||||
"data": "item.remark",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Note",
|
|
||||||
"data": "item.consignmentNote",
|
|
||||||
"render": function (data, type, full, meta) {
|
|
||||||
if (!data) {
|
|
||||||
return "No Document";
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check if the document is an image based on file extension
|
// Check if the document is an image based on file extension
|
||||||
var isImage = /\.(jpeg|jpg|png|gif)$/i.test(data);
|
var isImage = /\.(jpeg|jpg|png|gif)$/i.test(data);
|
||||||
var isPdf = /\.pdf$/i.test(data);
|
var isPdf = /\.pdf$/i.test(data);
|
||||||
|
|
||||||
if (isImage) {
|
if (isImage) {
|
||||||
return `<a href="${data}" target="_blank" data-lightbox="image-1">
|
return `<a href="${data}" target="_blank" data-lightbox="image-1">
|
||||||
<img src="${data}" alt="Image" class="img-thumbnail" style="width: 100px; height: 100px;" />
|
<img src="${data}" alt="Image" class="img-thumbnail" style="width: 100px; height: 100px;" />
|
||||||
</a>`;
|
</a>`;
|
||||||
} else if (isPdf) {
|
}
|
||||||
return `<a href="${data}" target="_blank">
|
else if (isPdf) {
|
||||||
<img src="https://upload.wikimedia.org/wikipedia/commons/8/87/PDF_file_icon.svg"
|
return `<a href="${data}" target="_blank">
|
||||||
alt="PDF Document" class="img-thumbnail"
|
<img src="https://upload.wikimedia.org/wikipedia/commons/8/87/PDF_file_icon.svg"
|
||||||
style="width: 50px; height: 50px;" />
|
alt="PDF Document" class="img-thumbnail"
|
||||||
<br>View PDF
|
style="width: 50px; height: 50px;" />
|
||||||
</a>`;
|
<br>View PDF
|
||||||
} else {
|
</a>`;
|
||||||
return `<a href="${data}" target="_blank">Download File</a>`;
|
} else {
|
||||||
}
|
return `<a href="${data}" target="_blank">Download File</a>`;
|
||||||
|
}
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
{ title: "Remark", data: "remark" },
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Send Date",
|
|
||||||
"data": "item.date",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Last User",
|
|
||||||
"data": "item.lastUser",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Last Store",
|
|
||||||
"data": "item.lastStore",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Last Station",
|
|
||||||
"data": "item.lastStation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Latest Status",
|
|
||||||
"data": "item.latestStatus",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Receive Date",
|
|
||||||
"data": "item.date",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"title": "Completion",
|
"title": "Completion",
|
||||||
"data": "item.movementComplete",
|
"data": "movementComplete",
|
||||||
},
|
},
|
||||||
|
|
||||||
// {
|
|
||||||
// "title": "Warranty Until",
|
|
||||||
// "data": "warranty",
|
|
||||||
// "render": function (data, type, full, meta) {
|
|
||||||
// if (data > 0) { return full.endWDate }
|
|
||||||
// else { return data }
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// "title": "Location",
|
|
||||||
// "data": "currentUser",
|
|
||||||
// "render": function (data, type, full, meta) {
|
|
||||||
// currentUser = data ?? null;
|
|
||||||
// currentStore = full.currentStore ?? 'N/A';
|
|
||||||
// currentStation = full.currentStation ?? 'N/A';
|
|
||||||
// return `User: ${currentUser}<br>
|
|
||||||
// Store: ${currentStore}<br>
|
|
||||||
// Station: ${currentStation}`
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// "title": "Delete",
|
|
||||||
// "data": "itemID",
|
|
||||||
// "render": function (data) {
|
|
||||||
// var deleteButton = `<button type="button" class="btn btn-danger delete-btn" data-id="${data}">Delete</button>`;
|
|
||||||
// return deleteButton;
|
|
||||||
// },
|
|
||||||
// "className": "align-middle",
|
|
||||||
// }
|
|
||||||
],
|
],
|
||||||
responsive: true,
|
responsive: true,
|
||||||
drawCallback: function (settings) {
|
drawCallback: function (settings) {
|
||||||
// Generate QR codes after rows are rendered
|
// Generate QR codes after rows are rendered
|
||||||
const api = this.api();
|
// const api = this.api();
|
||||||
api.rows().every(function () {
|
// api.rows().every(function () {
|
||||||
const data = this.data();
|
// const data = this.data();
|
||||||
const containerId = `qr${data.id}`; //containerid is by increments from API
|
// const containerId = `qr${data.id}`; containerid is by increments from API
|
||||||
const container = $(`#${containerId}`);
|
// const container = $(`#${containerId}`);
|
||||||
|
|
||||||
container.empty();
|
// container.empty();
|
||||||
container.append(`${data.item.itemId}`);
|
// container.append(`${data.item.itemId}`);
|
||||||
|
|
||||||
if (container.length) {
|
// if (container.length) {
|
||||||
|
|
||||||
|
|
||||||
new QRCode(container[0], {
|
// new QRCode(container[0], {
|
||||||
text: data.qrString,
|
// text: data.qrString,
|
||||||
width: 100,
|
// width: 100,
|
||||||
height: 100,
|
// height: 100,
|
||||||
colorDark: "#000000",
|
// colorDark: "#000000",
|
||||||
colorLight: "#ffffff",
|
// colorLight: "#ffffff",
|
||||||
correctLevel: QRCode.CorrectLevel.M,
|
// correctLevel: QRCode.CorrectLevel.M,
|
||||||
});
|
// });
|
||||||
}
|
// }
|
||||||
// container.on('click', function() {
|
// container.on('click', function() {
|
||||||
// window.open(data.qrString, '_blank');
|
// window.open(data.qrString, '_blank');
|
||||||
// });
|
// });
|
||||||
});
|
// });
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@ -231,7 +231,6 @@
|
|||||||
"title": "User ID",
|
"title": "User ID",
|
||||||
"data": "userName",
|
"data": "userName",
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"title": "Product Category",
|
"title": "Product Category",
|
||||||
"data": "productCategory",
|
"data": "productCategory",
|
||||||
@ -348,6 +347,10 @@
|
|||||||
"title": "Product Name",
|
"title": "Product Name",
|
||||||
"data": "productName",
|
"data": "productName",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"title": "User ID",
|
||||||
|
"data": "userName",
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"title": "Product Category",
|
"title": "Product Category",
|
||||||
"data": "productCategory",
|
"data": "productCategory",
|
||||||
|
|||||||
@ -684,6 +684,7 @@ zx <div v-if="itemlateststatus == 'Faulty
|
|||||||
// }
|
// }
|
||||||
// );
|
// );
|
||||||
|
|
||||||
|
|
||||||
navigator.mediaDevices.getUserMedia({ video: true })
|
navigator.mediaDevices.getUserMedia({ video: true })
|
||||||
.then(() => {
|
.then(() => {
|
||||||
this.html5QrCodeScanner = new Html5QrcodeScanner("reader", config, false);
|
this.html5QrCodeScanner = new Html5QrcodeScanner("reader", config, false);
|
||||||
|
|||||||
@ -550,7 +550,18 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
|
|||||||
public async Task<IActionResult> ItemMovementList()
|
public async Task<IActionResult> ItemMovementList()
|
||||||
{
|
{
|
||||||
|
|
||||||
var itemMovementList = await _centralDbContext.ItemMovements.Include(i => i.NextUser).ToListAsync();
|
//var itemMovementList = await _centralDbContext.ItemMovements.Include(i => i.NextUser).Include(i => i.Item).ThenInclude(i => i.Product).ToListAsync();
|
||||||
|
|
||||||
|
var itemMovementList = await _centralDbContext.ItemMovements
|
||||||
|
.Include(i => i.Item)
|
||||||
|
.ThenInclude(i => i.Product)
|
||||||
|
.Include(i => i.FromStore)
|
||||||
|
.Include(i => i.FromStation)
|
||||||
|
.Include(i => i.FromUser)
|
||||||
|
.Include(i => i.NextStore)
|
||||||
|
.Include(i => i.NextStation)
|
||||||
|
.Include(i => i.NextUser)
|
||||||
|
.ToListAsync();
|
||||||
//var itemList = await _centralDbContext.Items.ToListAsync();
|
//var itemList = await _centralDbContext.Items.ToListAsync();
|
||||||
|
|
||||||
int itemrow = 0;
|
int itemrow = 0;
|
||||||
@ -559,13 +570,55 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
|
|||||||
id = itemrow++,
|
id = itemrow++,
|
||||||
item, // Includes all properties of the original item
|
item, // Includes all properties of the original item
|
||||||
QRString = $"{HttpContext.Request.Scheme}://{HttpContext.Request.Host.Value}/I/{item.ItemId}", // Generate QR String
|
QRString = $"{HttpContext.Request.Scheme}://{HttpContext.Request.Host.Value}/I/{item.ItemId}", // Generate QR String
|
||||||
userName = item.NextUser?.FullName
|
ProductName = item.Item?.Product?.ProductName,
|
||||||
|
toUserName = item.NextUser?.FullName,
|
||||||
|
lastUserName = item.FromUser?.FullName
|
||||||
}).ToList();
|
}).ToList();
|
||||||
//Console.WriteLine(Json(itemMovementList));
|
//Console.WriteLine(Json(itemMovementList));
|
||||||
|
|
||||||
|
|
||||||
//return Json(itemMovementList);
|
//return Json(itemMovementList);
|
||||||
return Json(itemMovementListWithQR);
|
//return Json(itemMovementListWithQR);
|
||||||
|
|
||||||
|
return Json(itemMovementList.Select(i => new
|
||||||
|
{
|
||||||
|
i.Id,
|
||||||
|
i.ItemId,
|
||||||
|
i.ToStation,
|
||||||
|
i.ToStore,
|
||||||
|
i.ToUser,
|
||||||
|
UniqueID = i.Item?.UniqueID,
|
||||||
|
ProductName = i.Item?.Product?.ProductName,
|
||||||
|
LastUserName = i.FromUser?.FullName,
|
||||||
|
LastStoreName = i.FromStore?.StoreName,
|
||||||
|
LastStationName = i.FromStation?.StationName,
|
||||||
|
ToUserName = i.NextUser?.FullName,
|
||||||
|
ToStoreName = i.NextStore?.StoreName,
|
||||||
|
ToStationName = i.NextStation?.StationName,
|
||||||
|
i.ToOther,
|
||||||
|
i.sendDate,
|
||||||
|
i.Action,
|
||||||
|
i.Quantity,
|
||||||
|
i.Remark,
|
||||||
|
i.ConsignmentNote,
|
||||||
|
i.Date,
|
||||||
|
i.LastUser,
|
||||||
|
i.LastStore,
|
||||||
|
i.LastStation,
|
||||||
|
i.LatestStatus,
|
||||||
|
i.receiveDate,
|
||||||
|
i.MovementComplete
|
||||||
|
}));
|
||||||
|
|
||||||
|
//return Json(itemMovementList.Select(item => new
|
||||||
|
//{
|
||||||
|
// id = itemrow++,
|
||||||
|
// item,
|
||||||
|
// QRString = $"{HttpContext.Request.Scheme}://{HttpContext.Request.Host.Value}/I/{item.ItemId}", // Generate QR String
|
||||||
|
// ProductName = item.Item?.Product?.ProductName,
|
||||||
|
// toUserName = item.NextUser?.FullName,
|
||||||
|
// lastUserName = item.FromUser?.FullName
|
||||||
|
//}));
|
||||||
}
|
}
|
||||||
|
|
||||||
[HttpPost("AddItemMovement")]
|
[HttpPost("AddItemMovement")]
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user