create-cactus 1.0.4 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/template/frontend-project/src/pages/Reports.jsx +20 -27
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-cactus",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "Create a new Stock Management System (Cactus)",
5
5
  "type": "module",
6
6
  "main": "index.js",
package/template/frontend-project/src/pages/Reports.jsx CHANGED
@@ -1,35 +1,29 @@
1
- import React, { useEffect, useState } from "react";
1
+ import { useEffect, useState } from "react";
2
2
  import { getReports } from "../api/api";
3
3
 
4
+ const periods = [
5
+ { label: "Daily", i: "dailyStockIn", o: "dailyStockOut" },
6
+ { label: "Weekly", i: "weeklyStockIn", o: "weeklyStockOut" },
7
+ { label: "Monthly", i: "monthlyStockIn", o: "monthlyStockOut" },
8
+ ];
9
+
4
10
  export default function Reports() {
5
- const [reports, setReports] = useState({});
11
+ const [r, setR] = useState({});
6
12
 
7
- useEffect(() => {
8
- getReports()
9
- .then((res) => setReports(res.data))
10
- .catch((err) => console.log(err));
11
- }, []);
13
+ useEffect(() => { getReports().then(d => setR(d.data)).catch(console.error) }, []);
12
14
 
13
15
  return (
14
16
  <div>
15
17
  <h1 className="text-xl font-bold text-gray-800 mb-4 hover:text-olive-600 cursor-pointer">Reports</h1>
16
18
 
17
19
  <div className="grid grid-cols-1 sm:grid-cols-3 gap-4 mb-6">
18
- <div className="bg-white border border-gray-200 rounded-lg p-4">
19
- <h2 className="text-sm font-semibold text-gray-600 mb-2 hover:text-olive-600 cursor-pointer">Daily</h2>
20
- <p className="text-sm">Stock In: <span className="font-bold">{reports.dailyStockIn?.length || 0}</span></p>
21
- <p className="text-sm">Stock Out: <span className="font-bold">{reports.dailyStockOut?.length || 0}</span></p>
22
- </div>
23
- <div className="bg-white border border-gray-200 rounded-lg p-4">
24
- <h2 className="text-sm font-semibold text-gray-600 mb-2 hover:text-olive-600 cursor-pointer">Weekly</h2>
25
- <p className="text-sm">Stock In: <span className="font-bold">{reports.weeklyStockIn?.length || 0}</span></p>
26
- <p className="text-sm">Stock Out: <span className="font-bold">{reports.weeklyStockOut?.length || 0}</span></p>
27
- </div>
28
- <div className="bg-white border border-gray-200 rounded-lg p-4">
29
- <h2 className="text-sm font-semibold text-gray-600 mb-2 hover:text-olive-600 cursor-pointer">Monthly</h2>
30
- <p className="text-sm">Stock In: <span className="font-bold">{reports.monthlyStockIn?.length || 0}</span></p>
31
- <p className="text-sm">Stock Out: <span className="font-bold">{reports.monthlyStockOut?.length || 0}</span></p>
32
- </div>
20
+ {periods.map(p => (
21
+ <div key={p.label} className="bg-white border border-gray-200 rounded-lg p-4">
22
+ <h2 className="text-sm font-semibold text-gray-600 mb-2 hover:text-olive-600 cursor-pointer">{p.label}</h2>
23
+ <p className="text-sm">Stock In: <span className="font-bold">{(r[p.i]?.length || 0)}</span></p>
24
+ <p className="text-sm">Stock Out: <span className="font-bold">{(r[p.o]?.length || 0)}</span></p>
25
+ </div>
26
+ ))}
33
27
  </div>
34
28
 
35
29
  <div className="bg-white border border-gray-200 rounded-lg p-4">
@@ -37,14 +31,13 @@ export default function Reports() {
37
31
  <table className="w-full text-sm">
38
32
  <thead>
39
33
  <tr className="border-b border-gray-200">
40
- <th className="text-left py-2 pr-4 font-medium text-gray-500">Product</th>
41
- <th className="text-left py-2 pr-4 font-medium text-gray-500">Category</th>
42
- <th className="text-left py-2 pr-4 font-medium text-gray-500">Quantity</th>
43
- <th className="text-left py-2 font-medium text-gray-500">Price</th>
34
+ {["Product", "Category", "Quantity", "Price"].map(h => (
35
+ <th key={h} className="text-left py-2 pr-4 font-medium text-gray-500">{h}</th>
36
+ ))}
44
37
  </tr>
45
38
  </thead>
46
39
  <tbody>
47
- {reports.availableStock?.map((p) => (
40
+ {(r.availableStock || []).map(p => (
48
41
  <tr key={p._id} className="border-b border-gray-100">
49
42
  <td className="py-2 pr-4">{p.ProductName}</td>
50
43
  <td className="py-2 pr-4 text-gray-600">{p.Category}</td>