request & Qr
This commit is contained in:
parent
8cf3fd9b14
commit
41d1c8e1af
@ -49,12 +49,45 @@
|
||||
</div>
|
||||
|
||||
<div v-if="sortBy === 'item'">
|
||||
<div v-for="(movements, itemId) in groupedByItem" :key="itemId" class="row card">
|
||||
<div v-for="(group, itemId) in groupedByItem" :key="itemId" class="row card">
|
||||
<div class="card-header">
|
||||
<h2>Item ID: {{ itemId }}</h2>
|
||||
<h2>Item Name: {{ group.productName }}</h2>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table table-bordered table-hover table-striped no-wrap item-table" :id="'itemTable_' + itemId" style="width:100%;border-style: solid; border-width: 1px"></table>
|
||||
<div v-for="movement in group.movements" :key="movement.id" class="movement-row">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<strong>{{ movement.toOther === 'On Delivery' ? 'Receive' : 'Return' }}:</strong>
|
||||
| <strong>Send Date:</strong> {{ movement.sendDate }}
|
||||
| <strong>Receive Date:</strong> {{ movement.receiveDate || 'Not arrive' }}
|
||||
| <strong>Status:</strong> {{ movement.latestStatus || movement.toOther }}
|
||||
| <button class="btn btn-info btn-sm" v-on:click="toggleDetails(movement.id)">More Details</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="movement.showDetails" class="details-row mt-2">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-4 text-center">
|
||||
<i class="fas fa-warehouse fa-2x"></i>
|
||||
<p>Information: {{ movement.toOther }}</p>
|
||||
<p>User: {{ movement.toUser }}</p>
|
||||
<p>Station: {{ movement.toStationName }}</p>
|
||||
<p>Store: {{ movement.toStoreName }}</p>
|
||||
</div>
|
||||
<div class="col-md-4 text-center">
|
||||
<i class="fas fa-arrow-right fa-2x"></i>
|
||||
</div>
|
||||
<div class="col-md-4 text-center">
|
||||
<i class="fas fa-user fa-2x"></i>
|
||||
<p>Information: {{ movement.toOther }}</p>
|
||||
<p>User: {{ movement.lastUser }}</p>
|
||||
<p>Station: {{ movement.lastStationName }}</p>
|
||||
<p>Store: {{ movement.lastStoreName }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -82,9 +115,12 @@
|
||||
groupedByItem() {
|
||||
return this.itemMovements.reduce((acc, movement) => {
|
||||
if (!acc[movement.itemId]) {
|
||||
acc[movement.itemId] = [];
|
||||
acc[movement.itemId] = {
|
||||
productName: movement.productName,
|
||||
movements: []
|
||||
};
|
||||
}
|
||||
acc[movement.itemId].push(movement);
|
||||
acc[movement.itemId].movements.push({...movement, showDetails: false});
|
||||
return acc;
|
||||
}, {});
|
||||
},
|
||||
@ -95,7 +131,7 @@
|
||||
methods: {
|
||||
async fetchItemMovement() {
|
||||
try {
|
||||
const response = await fetch('/InvMainAPI/ItemMovementUser', {
|
||||
const response = await fetch('/InvMainAPI/ItemMovementUser', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
@ -105,7 +141,13 @@
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch item movement');
|
||||
}
|
||||
this.itemMovements = await response.json();
|
||||
const data = await response.json();
|
||||
|
||||
// Ensure showDetails is reactive
|
||||
this.itemMovements = data.map(movement => ({
|
||||
...movement,
|
||||
showDetails: false
|
||||
}));
|
||||
|
||||
if (this.itemMovementNotCompleteDatatable) {
|
||||
this.itemMovementNotCompleteDatatable.clear().destroy();
|
||||
@ -124,9 +166,6 @@
|
||||
renderTables() {
|
||||
if (this.sortBy === 'all') {
|
||||
this.initAllTables();
|
||||
} else {
|
||||
console.log(this.sortBy);
|
||||
this.initItemTables();
|
||||
}
|
||||
},
|
||||
|
||||
@ -194,41 +233,11 @@
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
initItemTables() {
|
||||
if (this.itemMovementNotCompleteDatatable) {
|
||||
this.itemMovementNotCompleteDatatable.clear().destroy();
|
||||
toggleDetails(id) {
|
||||
const movement = this.itemMovements.find(m => m.id === id);
|
||||
if (movement) {
|
||||
movement.showDetails = !movement.showDetails;
|
||||
}
|
||||
if (this.itemMovementCompleteDatatable) {
|
||||
this.itemMovementCompleteDatatable.clear().destroy();
|
||||
}
|
||||
Object.values(this.itemDatatables).forEach(table => table.destroy());
|
||||
this.itemDatatables = {};
|
||||
|
||||
Object.entries(this.groupedByItem).forEach(([itemId, movements]) => {
|
||||
const tableId = `#itemTable_${itemId}`;
|
||||
|
||||
this.itemDatatables[itemId] = $(tableId).DataTable({
|
||||
data: movements,
|
||||
columns: this.getColumns(),
|
||||
responsive: true,
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
getColumns() {
|
||||
return [
|
||||
{ title: "Unique Id", data: "id" },
|
||||
{ title: "From User", data: "toUserName" },
|
||||
{ title: "Last User", data: "lastUserName" },
|
||||
{ title: "From Station", data: "toStationName" },
|
||||
{ title: "From Store", data: "toStoreName" },
|
||||
{ title: "Action", data: "action" },
|
||||
{ title: "Start Status", data: "toOther" },
|
||||
{ title: "Quantity", data: "quantity" },
|
||||
{ title: "Send Date", data: "sendDate" },
|
||||
{ title: "Note", data: "consignmentNote" },
|
||||
{ title: "Remark", data: "remark" },
|
||||
];
|
||||
},
|
||||
|
||||
resetForm() {
|
||||
@ -236,22 +245,7 @@
|
||||
},
|
||||
|
||||
handleSorting() {
|
||||
// Destroy existing DataTables before switching views
|
||||
if (this.itemMovementNotCompleteDatatable) {
|
||||
this.itemMovementNotCompleteDatatable.clear().destroy();
|
||||
this.itemMovementNotCompleteDatatable = null;
|
||||
}
|
||||
if (this.itemMovementCompleteDatatable) {
|
||||
this.itemMovementCompleteDatatable.clear().destroy();
|
||||
this.itemMovementCompleteDatatable = null;
|
||||
}
|
||||
Object.values(this.itemDatatables).forEach(table => table.destroy());
|
||||
this.itemDatatables = {};
|
||||
|
||||
// Delay rendering to ensure Vue updates the DOM
|
||||
this.$nextTick(() => {
|
||||
this.renderTables();
|
||||
});
|
||||
this.$nextTick(() => this.fetchItemMovement());
|
||||
},
|
||||
|
||||
|
||||
|
||||
@ -576,7 +576,6 @@
|
||||
|
||||
async receiveReturnAPI() {
|
||||
this.receiveReturn = 1;
|
||||
console.log("update");
|
||||
this.updateItemMovement();
|
||||
},
|
||||
|
||||
|
||||
@ -668,6 +668,8 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
|
||||
}
|
||||
|
||||
var itemMovementUser = await _centralDbContext.ItemMovements
|
||||
.Include(i => i.Item)
|
||||
.ThenInclude(i => i.Product)
|
||||
.Include(i => i.FromStore)
|
||||
.Include(i => i.FromStation)
|
||||
.Include(i => i.FromUser)
|
||||
@ -684,6 +686,7 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
|
||||
i.ToStation,
|
||||
i.ToStore,
|
||||
i.ToUser,
|
||||
ProductName = i.Item?.Product?.ProductName,
|
||||
LastUserName = i.FromUser?.FullName,
|
||||
LastStoreName = i.FromStore?.StoreName,
|
||||
LastStationName = i.FromStation?.StationName,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user