create-jinmankn-app 1.0.12 → 1.0.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-jinmankn-app",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "type": "module",
   "bin": {
     "create-jinmankn-app": "./bin/index.js"

package/templates/EPMS(Employee Payroll Managment System)/package-lock.json

@@ -0,0 +1,13 @@
+{
+  "name": "jinman-blueprint",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "jinman-blueprint",
+      "version": "1.0.0",
+      "license": "ISC"
+    }
+  }
+}

package/templates/SMS(Stock Managment System)/backend-project/server.js

@@ -25,7 +25,7 @@ app.use('/api/sales', salesRoutes);
 app.use('/api/warehouse', warehouseRoutes);
 app.use('/api/reports', reportRoutes);
 
-const PORT = 5001;
+const PORT = 1000;
 app.listen(PORT, () => {
   console.log(`Server running on http://localhost:${PORT}`);
 });

package/templates/SMS(Stock Managment System)/frontend-project/src/components/AppLayout.jsx

@@ -23,7 +23,7 @@ function AppLayout({ title, subtitle, children }) {
     }
 
     axios
-      .get('http://localhost:5001/api/auth/me', {
+      .get('http://localhost:1000/api/auth/me', {
         headers: { Authorization: `Bearer ${localStorage.getItem('token')}` },
       })
       .then((response) => {

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Login.jsx

@@ -17,7 +17,7 @@ function Login() {
     setLoading(true);
 
     try {
-      const response = await axios.post('http://localhost:5001/api/auth/login', { email, password });
+      const response = await axios.post('http://localhost:1000/api/auth/login', { email, password });
       localStorage.setItem('token', response.data.token);
       localStorage.setItem('user', JSON.stringify(response.data.user));
       setMessage('Login successful');

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Product.jsx

@@ -1,8 +1,11 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import axios from 'axios';
 import AppLayout from '../components/AppLayout';
 
+const API_BASE = 'http://localhost:1000/api/product';
+
 function Product() {
+  const [products, setProducts] = useState([]);
   const [productCode, setProductCode] = useState('');
   const [productName, setProductName] = useState('');
   const [category, setCategory] = useState('');
@@ -11,6 +14,8 @@ function Product() {
   const [supplierName, setSupplierName] = useState('');
   const [dateReceived, setDateReceived] = useState('');
   const [message, setMessage] = useState('');
+  const [error, setError] = useState('');
+  const [editingId, setEditingId] = useState(null);
 
   const headers = {
     Authorization: `Bearer ${localStorage.getItem('token')}`,
@@ -24,96 +29,224 @@ function Product() {
     setQuantityInStock('');
     setSupplierName('');
     setDateReceived('');
+    setEditingId(null);
+  };
+
+  const fetchProducts = async () => {
+    try {
+      const response = await axios.get(`${API_BASE}/getproduct`, { headers });
+      setProducts(response.data);
+    } catch (err) {
+      setError('Failed to load products');
+      console.error(err);
+    }
   };
 
   const handleSubmit = async (e) => {
     e.preventDefault();
+    setError('');
+    setMessage('');
+
     try {
-      await axios.post(
-        'http://localhost:5001/api/product/addproduct',
-        {
-          productCode,
-          productName,
-          category,
-          unitPrice,
-          quantityInStock,
-          supplierName,
-          dateReceived,
-        },
-        { headers }
-      );
-      setMessage('Product added');
+      if (editingId) {
+        await axios.put(
+          `${API_BASE}/updateproduct/${editingId}`,
+          {
+            productCode,
+            productName,
+            category,
+            unitPrice,
+            quantityInStock,
+            supplierName,
+            dateReceived,
+          },
+          { headers }
+        );
+        setMessage('Product updated successfully');
+      } else {
+        await axios.post(
+          `${API_BASE}/addproduct`,
+          {
+            productCode,
+            productName,
+            category,
+            unitPrice,
+            quantityInStock,
+            supplierName,
+            dateReceived,
+          },
+          { headers }
+        );
+        setMessage('Product added successfully');
+      }
       clearForm();
+      fetchProducts();
+    } catch (err) {
+      setError(err.response?.data?.message || 'Failed to save product');
+      console.error(err);
+    }
+  };
+
+  const handleEdit = (product) => {
+    setEditingId(product._id);
+    setProductCode(product.productCode || '');
+    setProductName(product.productName || '');
+    setCategory(product.category || '');
+    setUnitPrice(product.unitPrice || '');
+    setQuantityInStock(product.quantityInStock || '');
+    setSupplierName(product.supplierName || '');
+    setDateReceived(product.dateReceived ? product.dateReceived.split('T')[0] : '');
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  };
+
+  const handleDelete = async (id) => {
+    try {
+      await axios.delete(`${API_BASE}/deleteproduct/${id}`, { headers });
+      setMessage('Product deleted successfully');
+      fetchProducts();
     } catch (err) {
-      console.log(err);
+      setError('Failed to delete product');
+      console.error(err);
     }
   };
 
+  useEffect(() => {
+    fetchProducts();
+  }, []);
+
   return (
     <AppLayout title="Product management" subtitle="Inventory">
-      <div className="mx-auto max-w-xl">
-        {message && <p className="alert-success mb-4">{message}</p>}
+      <div className="mx-auto max-w-6xl space-y-6">
+        <div className="card space-y-4 p-5">
+          {message && <p className="alert-success">{message}</p>}
+          {error && <p className="alert-error">{error}</p>}
+
+          <form onSubmit={handleSubmit} className="space-y-3">
+            <h2 className="text-lg font-semibold text-slate-800">
+              {editingId ? 'Edit product' : 'Add new product'}
+            </h2>
+            <div className="grid gap-4 sm:grid-cols-2">
+              <input
+                type="text"
+                placeholder="Product code"
+                value={productCode}
+                onChange={(e) => setProductCode(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="text"
+                placeholder="Product name"
+                value={productName}
+                onChange={(e) => setProductName(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="text"
+                placeholder="Category"
+                value={category}
+                onChange={(e) => setCategory(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="number"
+                placeholder="Unit price"
+                value={unitPrice}
+                onChange={(e) => setUnitPrice(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="number"
+                placeholder="Quantity in stock"
+                value={quantityInStock}
+                onChange={(e) => setQuantityInStock(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="text"
+                placeholder="Supplier name"
+                value={supplierName}
+                onChange={(e) => setSupplierName(e.target.value)}
+                className="input-field"
+                required
+              />
+              <input
+                type="date"
+                value={dateReceived}
+                onChange={(e) => setDateReceived(e.target.value)}
+                className="input-field"
+                required
+              />
+            </div>
+            <div className="flex flex-wrap gap-3">
+              <button type="submit" className="btn-primary">
+                {editingId ? 'Save changes' : 'Add product'}
+              </button>
+              {editingId && (
+                <button type="button" onClick={clearForm} className="btn-secondary">
+                  Cancel
+                </button>
+              )}
+            </div>
+          </form>
+        </div>
 
-        <form onSubmit={handleSubmit} className="card space-y-3 p-5">
-          <input
-            type="text"
-            placeholder="Product code"
-            value={productCode}
-            onChange={(e) => setProductCode(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="text"
-            placeholder="Product name"
-            value={productName}
-            onChange={(e) => setProductName(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="text"
-            placeholder="Category"
-            value={category}
-            onChange={(e) => setCategory(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="number"
-            placeholder="Unit price"
-            value={unitPrice}
-            onChange={(e) => setUnitPrice(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="number"
-            placeholder="Quantity in stock"
-            value={quantityInStock}
-            onChange={(e) => setQuantityInStock(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="text"
-            placeholder="Supplier name"
-            value={supplierName}
-            onChange={(e) => setSupplierName(e.target.value)}
-            className="input-field"
-            required
-          />
-          <input
-            type="date"
-            value={dateReceived}
-            onChange={(e) => setDateReceived(e.target.value)}
-            className="input-field"
-            required
-          />
-          <button type="submit" className="btn-primary">
-            Add product
-          </button>
-        </form>
+        <div className="card p-5">
+          <h2 className="text-lg font-semibold text-slate-800">Products</h2>
+          {products.length === 0 ? (
+            <p className="mt-4 text-sm text-slate-500">No products available yet.</p>
+          ) : (
+            <div className="mt-4 overflow-x-auto">
+              <table className="min-w-full divide-y divide-slate-200 text-sm">
+                <thead>
+                  <tr className="bg-slate-50 text-left text-slate-600">
+                    <th className="px-4 py-3">Code</th>
+                    <th className="px-4 py-3">Name</th>
+                    <th className="px-4 py-3">Category</th>
+                    <th className="px-4 py-3">Price</th>
+                    <th className="px-4 py-3">Stock</th>
+                    <th className="px-4 py-3">Supplier</th>
+                    <th className="px-4 py-3">Received</th>
+                    <th className="px-4 py-3">Actions</th>
+                  </tr>
+                </thead>
+                <tbody className="divide-y divide-slate-200">
+                  {products.map((product) => (
+                    <tr key={product._id} className="hover:bg-slate-50">
+                      <td className="px-4 py-3">{product.productCode}</td>
+                      <td className="px-4 py-3">{product.productName}</td>
+                      <td className="px-4 py-3">{product.category}</td>
+                      <td className="px-4 py-3">{product.unitPrice}</td>
+                      <td className="px-4 py-3">{product.quantityInStock}</td>
+                      <td className="px-4 py-3">{product.supplierName}</td>
+                      <td className="px-4 py-3">{product.dateReceived?.split('T')[0] || '-'}</td>
+                      <td className="px-4 py-3 space-x-2">
+                        <button
+                          type="button"
+                          onClick={() => handleEdit(product)}
+                          className="btn-secondary"
+                        >
+                          Edit
+                        </button>
+                        <button
+                          type="button"
+                          onClick={() => handleDelete(product._id)}
+                          className="btn-danger"
+                        >
+                          Delete
+                        </button>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </div>
       </div>
     </AppLayout>
   );

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Profile.jsx

@@ -8,7 +8,7 @@ function Profile() {
 
   const handleRetrieve = async () => {
     try {
-      const response = await axios.get('http://localhost:5001/api/auth/me', {
+      const response = await axios.get('http://localhost:1000/api/auth/me', {
         headers: {
           Authorization: `Bearer ${localStorage.getItem('token')}`,
         },

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Register.jsx

@@ -18,7 +18,7 @@ function Register() {
     setLoading(true);
 
     try {
-      const response = await axios.post('http://localhost:5001/api/auth/register', {
+      const response = await axios.post('http://localhost:1000/api/auth/register', {
         name,
         email,
         password,

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Reports.jsx

@@ -12,7 +12,7 @@ function Reports() {
 
   const fetchReports = async () => {
     try {
-      const res = await axios.get('http://localhost:5001/api/reports/summary', { headers });
+      const res = await axios.get('http://localhost:1000/api/reports/summary', { headers });
       setReports(res.data);
     } catch (err) {
       setError('Could not load reports');

package/templates/SMS(Stock Managment System)/frontend-project/src/pages/Sales.jsx

@@ -29,7 +29,7 @@ function Sales() {
 
   const fetchProducts = async () => {
     try {
-      const res = await axios.get('http://localhost:5001/api/product/getproduct', { headers });
+      const res = await axios.get('http://localhost:1000/api/product/getproduct', { headers });
       setProducts(res.data);
     } catch (error) {
       console.log(error);
@@ -38,7 +38,7 @@ function Sales() {
 
   const fetchWarehouses = async () => {
     try {
-      const res = await axios.get('http://localhost:5001/api/warehouse/getwarehouse', { headers });
+      const res = await axios.get('http://localhost:1000/api/warehouse/getwarehouse', { headers });
       setWarehouses(res.data);
     } catch (error) {
       console.log(error);
@@ -47,7 +47,7 @@ function Sales() {
 
   const handleGet = async () => {
     try {
-      const res = await axios.get('http://localhost:5001/api/sales/getsales', { headers });
+      const res = await axios.get('http://localhost:1000/api/sales/getsales', { headers });
       setTransactions(res.data);
     } catch (error) {
       console.log(error);
@@ -65,14 +65,14 @@ function Sales() {
     try {
       if (editId) {
         await axios.put(
-          `http://localhost:5001/api/sales/updatesales/${editId}`,
+          `http://localhost:1000/api/sales/updatesales/${editId}`,
           { transactionDate, quantityMoved, transactionType, productId, warehouseId },
           { headers }
         );
         setMessage('Transaction updated successfully');
       } else {
         await axios.post(
-          'http://localhost:5001/api/sales/addsales',
+          'http://localhost:1000/api/sales/addsales',
           { transactionDate, quantityMoved, transactionType, productId, warehouseId },
           { headers }
         );
@@ -87,7 +87,7 @@ function Sales() {
 
   const handledelete = async (id) => {
     try {
-      await axios.delete(`http://localhost:5001/api/sales/deletesales/${id}`, { headers });
+      await axios.delete(`http://localhost:1000/api/sales/deletesales/${id}`, { headers });
       handleGet();
     } catch (error) {
       console.log(error);