catalyx/PSTW_CentralizeSystem
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
MOHD ARIFF 2024-11-27 15:52:26 +08:00
parent 0168aa1929
commit 0ee2817376
10 changed files with 426 additions and 357 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Areas/Inventory/Models/CompanyModel.cs
View File

@ -1,4 +1,5 @@
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
namespace PSTW_CentralSystem.Areas.Inventory.Models
{
@ -7,5 +8,6 @@ namespace PSTW_CentralSystem.Areas.Inventory.Models
[Key]
public int CompanyId { get; set; }
public required string Name { get; set; }
public virtual ICollection<DepartmentModel>? Departments { get; set; }
}
}

2
Areas/Inventory/Models/ItemModel.cs
View File

@ -6,7 +6,7 @@ namespace PSTW_CentralSystem.Areas.Inventory.Models
public class ItemModel
{
[Key]
public required string ItemID { get; set; }
public string? ItemID { get; set; }
public required int CompanyId { get; set; }
public required int DepartmentId { get; set; }
public required int ProductId { get; set; }

1
Areas/Inventory/Models/ProductModel.cs
View File

@ -15,5 +15,6 @@ namespace PSTW_CentralSystem.Areas.Inventory.Models
public required string ImageProduct { get; set; }
[ForeignKey("ManufacturerId")]
public virtual ManufacturerModel? Manufacturer { get; set; }
public virtual ICollection<ItemModel>? Items { get; set; } // Navigation property>
}
}

367
Areas/Inventory/Views/Item/ItemRegistration.cshtml
View File

@ -4,10 +4,10 @@
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div id="registerItem">
@await Html.PartialAsync("~/Areas/Inventory/Views/_InventoryPartial.cshtml");
<div id="registerItem" class="row">
<div class="card">
<form v-on:submit.prevent="addItem" data-aos="fade-right">
<div class="container register" data-aos="fade-right">
<div class="row" data-aos="fade-right">
@*Left Side*@
@ -28,163 +28,127 @@
<!-- Company Dropdown -->
<div class="form-group row">
<label class="col-sm-3 col-form-label">Company:</label>
<div class="col-sm-9">
<label class="col-sm-4 col-form-label">Company:</label>
<div class="col-sm-8">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<span id="updateCompany">{{ company || 'Select Company' }}</span>
</button>
<div class="dropdown-menu p-3">
<div v-for="(comp, index) in companies" :key="index" class="form-check">
<input class="form-check-input" type="radio" :id="'company-' + index" :value="comp.Name" name="company" v-model="company" v-on:change="updateDepts(comp.Departments)">
<label class="form-check-label" :for="'company-' + index">{{ comp.Name }}</label>
</div>
</div>
<select class="btn btn-primary dropdown-toggle" v-model="selectedCompany" required>
<option class="btn-light" value="" disabled selected>Select Company</option>
<option class="btn-light" v-for="(item, index) in companies" :key="index" :value="item.companyId">{{item.companyName}}</option>
</select>
</div>
</div>
</div>
<!-- Department Dropdown -->
<div class="form-group row">
<label class="col-sm-3 col-form-label">Department:</label>
<div class="col-sm-9">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<span id="updateDept">{{ Dept || 'Select Dept/Div' }}</span>
</button>
<div class="dropdown-menu p-3">
<div v-for="(dept, index) in depts" :key="index" class="form-check">
<input class="form-check-input" type="radio" :id="'Dept-' + index" :value="dept" name="Dept" v-model="Dept">
<label class="form-check-label" :for="'Dept-' + index">{{ dept }}</label>
</div>
</div>
</div>
<label class="col-sm-4 col-form-label">Department:</label>
<div class="col-sm-8">
<select class="btn btn-primary dropdown-toggle" v-model="selectedDepartment" required>
<option class="btn-light" value="" disabled selected>Select Department</option>
<option class="btn-light" v-for="(dept, index) in filteredDepartments" :key="index" :value="dept.departmentId">{{ dept.departmentName }}</option>
</select>
</div>
</div>
@* Product Name Coding *@
<div class="form-group row">
<label class="col-sm-3 col-form-label">Product Name:</label>
<div class="col-sm-9">
<label class="col-sm-4 col-form-label">Product Name:</label>
<div class="col-sm-8">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<span id="updateName">{{ productName || 'Select Product Name' }}</span>
</button>
<div class="dropdown-menu p-3">
<div class="form-check" v-for="product in products" :key="product.modelNo">
<!-- Use modelNo as the key -->
<input class="form-check-input" type="radio" :id="product.modelNo" :value="product.modelNo"
v-on:click="updateProduct(product)" v-model="selectedProduct">
<label class="form-check-label" :for="product.modelNo">{{ product.productName }}</label>
</div>
</div>
<select type="button" class="btn btn-primary dropdown-toggle" v-model="selectedProduct" required>
<option class="btn-light" value="" disabled selected>Select Product</option>
<option class="btn-light" v-for="(item, index) in products" :key="index" :value="item.productId">{{ item.productName + ' (' + item.modelNo + ')' }}</option>
</select>
</div>
</div>
</div>
@* Product Image Display *@
<div class="form-group row align-items-center">
<label for="imageProduct" class="col-sm-3 col-form-label">Product Image: </label>
<div class="col-sm-9">
<img v-if="imageProduct" :src="'data:image/png;base64,' + imageProduct" alt="Product Image" class="img-fluid" v-on:click="openModal" />
<input type="hidden" id="imageProduct" name="imageProduct" v-model="imageProduct">
<label for="imageProduct" class="col-sm-4 col-form-label">Product Image: </label>
<div class="col-sm-8">
<img v-if="showProduct.imageProduct" :src="showProduct.imageProduct" alt="Product Image" class="img-fluid" data-toggle="modal" data-target="#imageModal" />
<input type="hidden" id="imageProduct" name="imageProduct" v-model="showProduct">
</div>
</div>
<div v-if="isModalOpen" class="modal" v-on:click="closeModal">
<div class="modal-content" v-on:click.stop>
<span class="close" v-on:click="closeModal">&times;</span>
<img :src="'data:image/png;base64,' + imageProduct" alt="Product Image" class="enlarged-image" />
<!-- Modal -->
<div class="modal fade" id="imageModal" tabindex="-1" role="dialog" aria-labelledby="imageModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="imageModalLabel">Product Image</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<img :src="showProduct.imageProduct" alt="Product Image" class="img-fluid">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
@* Product Category Coding *@
<div class="form-group row">
<label class="col-sm-3 col-form-label">Product Category:</label>
<div class="col-sm-9">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<span id="updateProductCategory">{{ productCategory || 'Select Product' }}</span>
</button>
<div class="dropdown-menu p-3">
<div class="form-check">
<input class="form-check-input" type="radio" name="productCategory" id="item" value="Item" v-on:click="updateProductCategory('Item')" v-model="productCategory">
<label class="form-check-label" for="item">Item</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="productCategory" id="part" value="Part" v-on:click="updateProductCategory('Part')" v-model="productCategory">
<label class="form-check-label" for="part">Part</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="productCategory" id="disposable" value="Disposable" v-on:click="updateProductCategory('Disposable')" v-model="productCategory">
<label class="form-check-label" for="disposable">Disposable</label>
</div>
</div>
</div>
<label class="col-sm-4 col-form-label">Product Category:</label>
<div class="col-sm-8">
<input type="text" id="category" name="category" v-model="showProduct.category" class="form-control" readonly />
</div>
</div>
@* Serial Number and Quantity Coding *@
<div v-if="showSerialNumber">
<div class="form-group row align-items-center">
<div class="col-sm-3">
<div class="col-sm-4">
<label for="serialNumber">Serial Number: </label>
</div>
<div class="col-sm-9">
<input type="text" id="serialNumber" name="serialNumber" v-if="showSerialNumber" v-model="serialNumber" class="form-control">
<div class="col-sm-8">
<input type="text" id="serialNumber" name="serialNumber" v-if="showSerialNumber" v-model="serialNumber" class="form-control" v-bind:required="showSerialNumber">
</div>
</div>
</div>
<div v-if="!showSerialNumber">
<div class="form-group row align-items-center">
<div class="col-sm-3">
<div class="col-sm-4">
<label for="quantity">Quantity: </label>
</div>
<div class="col-sm-9">
<input type="number" id="quantity" name="quantity" v-if="!showSerialNumber" v-model="quantity" class="form-control">
<div class="col-sm-8">
<input type="number" id="quantity" name="quantity" min="1" v-if="!showSerialNumber" v-model="quantity" class="form-control" v-bind:required="!showSerialNumber">
</div>
</div>
</div>
@* Supplier coding *@
<div class="form-group row align-items-center">
<label class="col-sm-3 col-form-label">Supplier: </label>
<div class="col-sm-9">
<label class="col-sm-4 col-form-label">Supplier: </label>
<div class="col-sm-8">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<span id="updateSupplierName">{{ supplierName || 'Select Supplier' }}</span>
</button>
<div class="dropdown-menu p-3">
<div class="form-check" v-for="supplier in supplies" :key="supplier.modelNoes">
<input class="form-check-input" type="radio" :id="supplier.modelNoes" :value="supplier.supplierName" v-on:click="updateSupplier(supplier)" v-model="selectedSupplier">
<label class="form-check-label" :for="supplier.modelNoes">{{ supplier.supplierName }}</label>
</div>@*
<div class="form-check">
<input class="form-check-input" type="radio" name="Supplier" id="otherS" v-on:click="toggleOtherInput('Supplier')">
<label class="form-check-label" for="otherS">Other:</label>
</div>
<div v-if="showOtherSupplier">
<input type="text" class="form-control" id="otherSupplier" name="Supplier" placeholder="Your Supplier Name" v-model="Supplier">
</div> *@
</div>
<select type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false" v-model="selectedSupplier" required>
<option class="btn-light" value="" disabled selected>Select Supplier</option>
<option class="btn-light" v-for="(item, index) in suppliers">{{ item.supplierName }}</option>
</select>
</div>
</div>
</div>
@* Purchase Date coding *@
<div class="form-group row align-items-center">
<label for="purchaseDate" class="col-sm-3 col-form-label">Purchase Date: </label>
<div class="col-sm-9">
<label for="purchaseDate" class="col-sm-4 col-form-label">Purchase Date: </label>
<div class="col-sm-8">
<input type="date" id="purchaseDate" name="purchaseDate" required v-model="purchaseDate" class="form-control">
</div>
</div>
@* PO coding *@
<div class="form-group row align-items-center">
<label for="PO" class="col-sm-3 col-form-label">Enter PO: </label>
<div class="col-sm-9">
<label for="PO" class="col-sm-4 col-form-label">Enter PO: </label>
<div class="col-sm-8">
<input type="text" id="PO" name="PO" required v-model="PO" placeholder="PO123456" class="form-control">
</div>
</div>
@ -193,16 +157,16 @@
<div class="col-md-6">
@* Item Price in RM *@
<div class="form-group row">
<label for="priceInRM" class="col-sm-3">Item Price In(RM):</label>
<div class="col-sm-9">
<label for="priceInRM" class="col-sm-4">Item Price In(RM):</label>
<div class="col-sm-8">
<input type="number" id="priceInRM" name="priceInRM" class="form-control" placeholder="RM 00.00" step="0.01" v-on:input="convertCurrency()" required v-model="priceInRM">
</div>
</div>
@* Currency Selection *@
<div class="form-group row">
<label for="currency" class="col-sm-3">Select Currency:</label>
<div class="col-sm-9">
<label for="currency" class="col-sm-4">Select Currency:</label>
<div class="col-sm-8">
<select id="currency" name="currency" class="form-control" v-model="currency" v-on:change="convertCurrency()">
<option value="" disabled selected>Select a currency</option>
<option v-for="(name, code) in currencies" :key="code" :value="code">
@ -214,48 +178,48 @@
@* Currency Rate *@
<div class="form-group row">
<label for="currencyRate" class="col-sm-3">Currency Rate(%):</label>
<div class="col-sm-9">
<label for="currencyRate" class="col-sm-4">Currency Rate(%):</label>
<div class="col-sm-8">
<input type="number" id="currencyRate" name="currencyRate" class="form-control" placeholder="0.01%" step="0.01" v-on:input="convertCurrency()" required v-model="currencyRate">
</div>
</div>
@* Item Convert Price *@
<div class="form-group row">
<label for="convertPrice" class="col-sm-3">{{ currency ? 'Item Price (' + currency + ') : ' : 'Item Price : ' }}</label>
<div class="col-sm-9">
<label for="convertPrice" class="col-sm-4">{{ currency ? 'Item Price (' + currency + ') : ' : 'Item Price : ' }}</label>
<div class="col-sm-8">
<input type="number" id="convertPrice" name="convertPrice" class="form-control" readonly v-model="convertPrice">
</div>
</div>
@* Delivery Order Date *@
<div class="form-group row">
<label for="DODate" class="col-sm-3">Enter DO Date:</label>
<div class="col-sm-9">
<label for="DODate" class="col-sm-4">Enter DO Date:</label>
<div class="col-sm-8">
<input type="date" id="DODate" name="DODate" class="form-control" v-on:input="calculateWarrantyEndDate()" required v-model="DODate">
</div>
</div>
@* Warranty *@
<div class="form-group row">
<label for="warranty" class="col-sm-3">Enter Warranty Months(Number):</label>
<div class="col-sm-9">
<label for="warranty" class="col-sm-4">Enter Warranty Months(Number):</label>
<div class="col-sm-8">
<input type="number" id="warranty" name="warranty" class="form-control" placeholder="0 , 1 , 2 , 3, ..." step="1" min="0" v-on:input="calculateWarrantyEndDate()" required v-model="warranty">
</div>
</div>
@* Warranty End Date *@
<div class="form-group row">
<label for="EndWDate" class="col-sm-3">Warranty End:</label>
<div class="col-sm-9">
<label for="EndWDate" class="col-sm-4">Warranty End:</label>
<div class="col-sm-8">
<input type="date" id="EndWDate" name="EndWDate" class="form-control" readonly v-model="EndWDate">
</div>
</div>
@* Invoice Date *@
<div class="form-group row">
<label for="invoiceDate" class="col-sm-3">Invoice Date:</label>
<div class="col-sm-9">
<label for="invoiceDate" class="col-sm-4">Invoice Date:</label>
<div class="col-sm-8">
<input type="date" id="invoiceDate" name="invoiceDate" class="form-control" required v-model="invoiceDate">
</div>
</div>
@ -264,7 +228,7 @@
@* Submit and Reset Buttons *@
<div class="form-group row">
<div class="col-sm-9 offset-sm-3">
<div class="col-sm-8 offset-sm-3">
<button type="button" v-on:click="resetForm" class="btn btn-secondary">Reset</button>
<input type="submit" class="btn btn-primary" value="Submit" />
</div>
@ -278,6 +242,7 @@
</div>
</form>
</div>
</div>
@*Vue Js - POST & RESET*@
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
@ -286,36 +251,56 @@
el: '#registerItem',
data() {
return {
company: null,
companies: [
{
companyId: 1,
companyName: "PSTW",
departments: [{ departmentId: 1, departmentName: "Air" }, { departmentId: 2, departmentName: "Marine" }, { departmentId: 3, departmentName: "River" }]
},
{
companyId: 2,
companyName: "TES",
departments: [{ departmentId: 1, departmentName: "Air" }],
},
],
company: "",
Dept: null,
productName: null,
imageProduct: null,
productCategory: null,
serialNumber: '',
quantity: 0,
serialNumber: "",
quantity: 1,
supplierName: null,
purchaseDate: null,
PO: null,
currency: null,
priceInRM: null,
currencyRate: null,
convertPrice: null,
currencyRate: 1,
convertPrice: 0,
DODate: null,
warranty: null,
warranty: 0,
EndWDate: null,
invoiceDate: null,
products: [],
companies: [],
depts: [],
supplies: [],
suppliers: [
{
supplierId: 1,
supplierName: "Pang",
},
{
supplierId: 2,
supplierName: "Ms Kim",
},
],
showOtherCompany: false,
showOtherDept: false,
showOtherSupplier: false,
isModalOpen: false,
selectedProduct: null,
selectedSupplier: null,
selectedCompany: null,
selectedDepartment: null,
selectedProduct: "",
selectedSupplier: "",
selectedCompany: "",
selectedDepartment: "",
currencies: {},
}
},
@ -325,76 +310,78 @@
this.fetchCurrencyData();
this.fetchCompanies();
this.fetchProducts();
this.fetchSupplies();
this.fetchSuppliers();
},
computed: {
showSerialNumber() {
return this.productCategory === 'Item' || this.productCategory === 'Part';
filteredDepartments() {
if (!this.selectedCompany) {
return []; // No company selected, return empty list
}
const company = this.companies.find(c => c.companyId === this.selectedCompany);
return company ? company.departments : [];
},
showProduct() {
if (!this.selectedProduct) {
return []; // No company selected, return empty list
}
const product = this.products.find(c => c.productId === this.selectedProduct);
return product ? product : {};
},
showSerialNumber() {
return this.showProduct.category === 'Item' || this.showProduct.category === 'Part';
},
},
methods: {
async addItem() {
const formData = {
company: this.showOtherCompany ? this.selectedCompany : this.company,
Dept: this.showOtherDept ? this.Dept : this.Dept,
productName: this.productName,
imageProduct: this.imageProduct,
productCategory: this.productCategory,
serialNumber: this.serialNumber,
quantity: this.quantity,
supplierName: this.supplierName,
purchaseDate: this.purchaseDate,
PO: this.PO,
currency: this.currency,
priceInRM: this.priceInRM,
currencyRate: this.currencyRate,
convertPrice: this.convertPrice,
CompanyId: this.selectedCompany,
DepartmentId: this.selectedDepartment,
ProductId: this.selectedProduct,
SerialNumber: this.serialNumber,
Quantity: this.quantity,
Supplier: this.selectedSupplier,
PurchaseDate: this.purchaseDate,
PONo: this.PO,
Currency: this.currency,
PriceInRM: this.priceInRM,
CurrencyRate: this.currencyRate,
ConvertPrice: this.convertPrice,
DODate: this.DODate,
warranty: this.warranty,
Warranty: this.warranty,
EndWDate: this.EndWDate,
invoiceDate: this.invoiceDate
InvoiceDate: this.invoiceDate
};
try {
// List of required fields (excluding serialNumber based on showSerialNumber)
const requiredFields = ['company', 'Dept', 'productCategory', 'productName', 'quantity', 'supplierName', 'purchaseDate', 'PO', 'currency', 'priceInRM', 'currencyRate', 'convertPrice', 'DODate', 'warranty', 'EndWDate', 'invoiceDate'];
// Loop through required fields and check if any are null or empty
for (let field of requiredFields) {
if (this[field] === null || this[field] === '') {
swal(`${field} Error`, `Please fill in required fields: ${field}.`, 'warning');
return; // Exit early if validation fails
}
}
// Additional specific checks
if (this.showSerialNumber) {
this.quantity = 0;
if (this.serialNumber === null || this.serialNumber === '') {
swal('Serial Number Error', 'Serial Number must be filled when selecting Item or Part.', 'warning');
alert('Serial Number Error', 'Serial Number must be filled when selecting Item or Part.', 'warning');
return;
}
}
else {
this.serialNumber = null;
if (this.quantity === 0 || this.quantity === null || this.quantity === '') {
swal('quantity Error', 'Quantity is required when selecting Disposable.', 'warning');
alert('quantity Error', 'Quantity is required when selecting Disposable.', 'warning');
return;
}
}
// Proceed to send the data to the API
const response = await fetch('/api/Item', {
const response = await fetch('/InvMainAPI/AddItem', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${this.token}`
// 'Authorization': `Bearer ${this.token}`
},
body: JSON.stringify(formData)
});
if (response.ok) {
// If the form submission was successful, display a success message
swal('Success!', 'Item form has been successfully submitted.', 'success');
alert('Success!', 'Item form has been successfully submitted.', 'success');
// Reset the form
this.resetForm();
@ -406,19 +393,19 @@
console.error('Error:', error);
// Displaying error message
swal('Inventory PSTW Error', `An error occurred: ${error.message}`, 'error');
alert('Inventory PSTW Error', `An error occurred: ${error.message}`, 'error');
}
},
async fetchProducts() {
try {
const token = localStorage.getItem('token'); // Get the token from localStorage
const response = await fetch('/api/Product/GetProducts', {
method: 'GET', // Specify the HTTP method
// const token = localStorage.getItem('token'); // Get the token from localStorage
const response = await fetch('/InvMainAPI/ProductList', {
method: 'POST', // Specify the HTTP method
headers: {
'Content-Type': 'application/json', // Set content type
'Authorization': `Bearer ${token}` // Include the token in the headers
// 'Authorization': `Bearer ${token}` // Include the token in the headers
}
});
@ -451,7 +438,7 @@
}
},
async fetchSupplies() {
async fetchSuppliers() {
try {
const response = await fetch('/api/Item/GetSupplies', {
method: 'GET', // Specify the HTTP method
@ -486,7 +473,6 @@
this.Dept = null;
this.productName = null;
this.imageProduct = null;
this.productCategory = null;
this.serialNumber = '';
this.quantity = 0;
this.supplierName = null;
@ -545,51 +531,6 @@
this.EndWDate = null;
}
},
//Update Select View
updateCompany(company) {
this.company = company.Name; // Only set the company name
this.depts = company.Departments || []; // Populate depts based on selected company
this.Dept = null; // Reset the selected department
this.showOtherCompany = false; // Hide other company input if needed
},
updateDepts(departments) {
this.depts = departments || []; // Populate depts for the selected company
this.Dept = null; // Reset the selected department
},
updateDept(dept) {
this.Dept = dept;
this.showOtherDept = false;
},
updateProductCategory(productCategory) {
this.productCategory = productCategory;
},
updateProduct(selectedProduct) {
this.productName = selectedProduct.productName;
this.imageProduct = selectedProduct.imageProduct;
this.selectedProduct = selectedProduct.modelNo;
},
updateSupplier(selectedSupplier) {
this.supplierName = selectedSupplier.supplierName;
this.selectedSupplier = selectedSupplier.supplierName;
},
//User Press button Other
toggleOtherInput(type) {
if (type === 'company') {
this.showOtherCompany = true;
this.selectedCompany = null; // Clear company selection when "Other" is chosen
this.company = null;
}
else if (type === 'Dept') {
this.showOtherDept = true;
this.Dept = null; // Clear department selection when "Other" is chosen
}
else if (type === 'Supplier') {
this.supplierName = null; // Clear supplier selection when "Other" is chosen
}
},
},
});
</script>

76
Areas/Inventory/Views/Item/ProductRegistration.cshtml
View File

@ -96,7 +96,7 @@
<button id="addProductBtn" class="btn btn-success col-md-3 m-1" v-show="addSection == false" v-on:click="addSection = true"><i class="fa fa-plus"></i>&nbsp;Show Add Product Section</button>
</div>
<div class="row">
<table class="table table-bordered table-hover" id="productTable"></table>
<table class="table table-bordered table-hover" id="productDatatable"></table>
</div>
</div>
</div>
@ -124,6 +124,7 @@
showOtherManufacturer: false,
imageSrc: '',
products: null,
productDatatable: null,
}
},
mounted() {
@ -134,7 +135,7 @@
methods: {
initiateTable() {
console.log(this.products)
this.manufacturerDatatable = $('#productTable').DataTable({
this.productDatatable = $('#productDatatable').DataTable({
"data": this.products,
"columns": [
{ "title": "Product Name",
@ -146,7 +147,7 @@
{ "title": "Manufacturer",
"data": "manufacturer.manufacturerName",
},
{ "title": "productName Category",
{ "title": "Product Category",
"data": "category",
},
{ "title": "Product Stock",
@ -154,21 +155,28 @@
},
{ "title": "Image",
"data": "imageProduct",
},
{ "title": "Delete",
"render": function (data, type, full, meta) {
var deleteButton = `<button type="button" class="btn btn-danger delete-btn" data-id="${full.manufacturerId}">Delete</button>`;
var image = `<a href="${data}" target="_blank" data-lightbox="image-1">
<img src="${data}" alt="Image" class="img-thumbnail" style="width: 100px; height: 100px;" />
</a>`;
return image;
},
},
{
"title": "Delete",
"render": function (data, type, full, meta) {
var deleteButton = `<button type="button" class="btn btn-danger delete-btn" data-id="${full.productId}">Delete</button>`;
return deleteButton;
},
"width": '10%',
},
}
],
})
self = this;
// Attach click event listener to the delete buttons
$('#manufacturerTable tbody').on('click', '.delete-btn', function () {
const manufacturerId = $(this).data('id'); // Get the manufacturer ID from the button
self.deleteManufacturer(manufacturerId); // Call the Vue method
$('#productDatatable tbody').on('click', '.delete-btn', function () {
const productId = $(this).data('id'); // Get the manufacturer ID from the button
self.deleteProduct(productId); // Call the Vue method
});
this.loading = false;
@ -207,7 +215,7 @@
async addProduct() {
const existingProduct = this.products.find(p => p.modelNo === this.modelNo);
if (existingProduct) {
alert('Product Error', `The model number ${this.modelNo} already exists.`, 'error');
alert(`Product Error: The model number ${this.modelNo} already exists.`, 'error');
return; // Exit early if the modelNo exists
}
@ -247,7 +255,9 @@
this.errorMessage = 'Error: ' + (errorData.message || 'Unknown error');
} else {
this.products = await response.json();
alert('Success!', 'Product form has been successfully submitted.', 'success');
this.fillTable(this.products);
this.resetForm();
}
@ -301,6 +311,48 @@
this.imageProduct = null;
}
},
async deleteProduct(productId) {
if (!confirm("Are you sure you want to delete this product?")) {
return;
}
try {
const response = await fetch(`/InvMainAPI/DeleteProduct/${productId}`, {
method: 'DELETE',
headers: {
'Content-Type': 'application/json',
},
});
const result = await response.json();
if (result.success) {
alert(result.message);
// Remove the row from DataTables
this.productDatatable
.row($(`.delete-btn[data-id="${productId}"]`).closest('tr'))
.remove()
.draw();
} else {
alert(result.message);
}
}
catch (error) {
console.error("Error deleting product:", error);
alert("An error occurred while deleting the product.");
}
finally {
this.loading = false;
}
},
fillTable(data){
if (!this.productDatatable) {
console.error("DataTable not initialized");
return;
}
this.productDatatable.clear();
this.productDatatable.rows.add(data);
this.productDatatable.draw();
this.loading = false;
},
}
});

86
Controllers/API/Inventory/InvMainAPI.cs
View File

@ -23,6 +23,7 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
_logger = logger;
_authDbContext = authDbContext;
}
#region Manufacturer
[HttpPost("ManufacturerList")]
@ -74,6 +75,7 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
return Ok(new { success = true, message = "Manufacturer deleted successfully" });
}
#endregion Manufacturer
#region Product
@ -81,10 +83,22 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
[HttpPost("ProductList")]
public async Task<IActionResult> ProductList()
{
var productList = await _authDbContext.Products.Include("Manufacturer").Where(x => x.ManufacturerId == x.ManufacturerId).ToListAsync();
var productList = await _authDbContext.Products.Include("Manufacturer").ToListAsync();
return Json(productList);
}
[HttpPost("ProductListWithItem")]
public async Task<IActionResult> ProductListWithItem()
{
var productList = await _authDbContext.Products
.Include(p => p.Items) // Include related items
.Include(p => p.Manufacturer) // Include related manufacturer
.ToListAsync();
return Json(productList);
}
[HttpPost("AddProduct")]
public async Task<IActionResult> AddProduct([FromBody] ProductModel product)
{
@ -104,13 +118,13 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
if (!string.IsNullOrEmpty(product.ImageProduct))
{
var bytes = Convert.FromBase64String(product.ImageProduct);
var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/media/inventory/images", product.ModelNo);
var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/media/inventory/images", product.ModelNo + ".jpg");
await System.IO.File.WriteAllBytesAsync(filePath, bytes);
product.ImageProduct = "/media/inventory/images/" + product.ModelNo;
product.ImageProduct = "/media/inventory/images/" + product.ModelNo + ".jpg";
}
_authDbContext.Products.Add(product);
await _authDbContext.SaveChangesAsync();
var updatedList = await _authDbContext.Manufacturers.Include("Manufacturer").Where(x => x.ManufacturerId == x.ManufacturerId).ToListAsync();
var updatedList = await _authDbContext.Products.Include("Manufacturer").Where(x => x.ManufacturerId == x.ManufacturerId).ToListAsync();
return Json(updatedList);
}
catch (Exception ex)
@ -122,18 +136,78 @@ namespace PSTW_CentralSystem.Controllers.API.Inventory
[HttpDelete("DeleteProduct/{id}")]
public async Task<IActionResult> DeleteProduct(int id)
{
var Product = await _authDbContext.Manufacturers.FindAsync(id);
var Product = await _authDbContext.Products.FindAsync(id);
if (Product == null)
{
return NotFound(new { success = false, message = "Product not found" });
}
_authDbContext.Manufacturers.Remove(Product);
_authDbContext.Products.Remove(Product);
await _authDbContext.SaveChangesAsync();
return Ok(new { success = true, message = "Product deleted successfully" });
}
#endregion Product
#region Company
[HttpPost("CompanyDepartmentList")]
public async Task<IActionResult> CompanyDepartmentList()
{
var productList = await _authDbContext.Companies.Include("Departments").ToListAsync();
return Json(productList);
}
#endregion Company
#region Item
[HttpPost("ItemList")]
public async Task<IActionResult> ItemList()
{
var itemList = await _authDbContext.Items.ToListAsync();
return Json(itemList);
}
[HttpPost("AddItem")]
public async Task<IActionResult> AddItem([FromBody] ItemModel item)
{
if (!ModelState.IsValid)
{
return BadRequest(ModelState);
}
if (item == null)
{
return NotFound("Item is null");
}
try
{
_authDbContext.Items.Add(item);
await _authDbContext.SaveChangesAsync();
var updatedList = await _authDbContext.Items.ToListAsync();
return Json(updatedList);
}
catch (Exception ex)
{
return BadRequest(ex.Message);
}
}
[HttpDelete("DeleteItem/{id}")]
public async Task<IActionResult> DeleteItem(int id)
{
var item = await _authDbContext.Items.FindAsync(id);
if (item == null)
{
return NotFound(new { success = false, message = "Item not found" });
}
_authDbContext.Items.Remove(item);
await _authDbContext.SaveChangesAsync();
return Ok(new { success = true, message = "Item deleted successfully" });
}
#endregion Item
}
}

1
PSTW_CentralSystem.csproj
View File

@ -30,7 +30,6 @@
<Folder Include="Controllers\JSA\API\" />
<Folder Include="Logs\" />
<Folder Include="Migrations\" />
<Folder Include="wwwroot\Media\Inventory\Images\" />
</ItemGroup>
</Project>

BIN
wwwroot/Media/Inventory/Images/ThermoSo2.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 130 KiB

BIN
wwwroot/Media/Inventory/Images/ThermoSo2V2.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 436 KiB

0
wwwroot/Media/Inventory/Images/YSISonde1 → wwwroot/Media/Inventory/Images/YSISonde1.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB