Invoice Software
Retail Management System
Inventory Management
| Product Name |
Stock |
Price |
Actions |
Point of Sale (POS)
| Product |
Quantity |
Price |
Total |
Actions |
body {
font-family: Arial, sans-serif;
background-color: #f5f5f5;
margin: 0;
padding: 0;
}
#app {
max-width: 1200px;
margin: auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h1 {
text-align: center;
color: #333;
}
h2 {
color: #555;
}
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
}
th, td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
margin: 5px 0;
}
button:hover {
background-color: #45a049;
}
input {
padding: 5px;
margin: 5px 0;
}
let inventory = [
{ name: 'Product 1', stock: 10, price: 100 },
{ name: 'Product 2', stock: 5, price: 200 }
];
let cart = [];
function displayInventory() {
const inventoryTable = document.getElementById('inventoryTable').getElementsByTagName('tbody')[0];
inventoryTable.innerHTML = '';
inventory.forEach((item, index) => {
let row = inventoryTable.insertRow();
row.insertCell(0).innerText = item.name;
row.insertCell(1).innerText = item.stock;
row.insertCell(2).innerText = item.price;
let actionsCell = row.insertCell(3);
let editButton = document.createElement('button');
editButton.innerText = 'Edit';
editButton.onclick = () => editInventoryItem(index);
actionsCell.appendChild(editButton);
let addButton = document.createElement('button');
addButton.innerText = 'Add to Cart';
addButton.onclick = () => addToCart(item.name);
actionsCell.appendChild(addButton);
});
}
function addInventoryItem() {
let newItem = { name: prompt('Enter product name:'), stock: parseInt(prompt('Enter stock quantity:')), price: parseFloat(prompt('Enter price:')) };
if (newItem.name && !isNaN(newItem.stock) && !isNaN(newItem.price)) {
inventory.push(newItem);
displayInventory();
}
}
function editInventoryItem(index) {
let item = inventory[index];
let newName = prompt('Enter new product name:', item.name);
let newStock = parseInt(prompt('Enter new stock quantity:', item.stock));
let newPrice = parseFloat(prompt('Enter new price:', item.price));
if (newName && !isNaN(newStock) && !isNaN(newPrice)) {
inventory[index] = { name: newName, stock: newStock, price: newPrice };
displayInventory();
}
}
function displayPOS() {
const posTable = document.getElementById('posTable').getElementsByTagName('tbody')[0];
posTable.innerHTML = '';
cart.forEach((item, index) => {
let row = posTable.insertRow();
row.insertCell(0).innerText = item.name;
row.insertCell(1).innerText = item.quantity;
row.insertCell(2).innerText = item.price;
row.insertCell(3).innerText = item.quantity * item.price;
let actionsCell = row.insertCell(4);
let removeButton = document.createElement('button');
removeButton.innerText = 'Remove';
removeButton.onclick = () => removeFromCart(index);
actionsCell.appendChild(removeButton);
});
}
function addToCart(productName) {
let product = inventory.find(item => item.name === productName);
if (product) {
let cartItem = cart.find(item => item.name === productName);
if (cartItem) {
cartItem.quantity++;
} else {
cart.push({ name: product.name, quantity: 1, price: product.price });
}
displayPOS();
}
}
function removeFromCart(index) {
cart.splice(index, 1);
displayPOS();
}
function processTransaction() {
// Implement the transaction processing logic here
alert('Transaction processed successfully!');
cart = [];
displayPOS();
}
displayInventory();
displayPOS();
Comments
Post a Comment