SADEWA

+ {h} +
+ #{order.id} +	+ {order.nama \|\| "—"} +	+ Rp { + (order.total \|\| 0) + .toLocaleString("id-ID") + } +	+ + {cfg ? ( + + + + + + {cfg.label} + + + + ) : ( + + + {order.status} + + + )} + +	+ + {order.bukti_pembayaran ? ( + + + 📄 Lihat + + + ) : ( + + + — + + + )} + +	+ + { + order.status === "menunggu_verifikasi" + + ? ( + + + + + + + + + + ) + + : ( + + — + + ) + } + +

+ {h} +

+ #{order.id} +

+ {order.nama || "—"} +

+ Rp { + (order.total || 0) + .toLocaleString("id-ID") + } +

+ + {cfg ? ( + + + + + + {cfg.label} + + + + ) : ( + + + {order.status} + + + )} + +

+ + {order.bukti_pembayaran ? ( + + + 📄 Lihat + + + ) : ( + + + — + + + )} + +

+ + { + order.status === "menunggu_verifikasi" + + ? ( + +

+ + + + + +

+ + ) + + : ( + + — + + ) + } + +

+ Stok Telur +

+ + {stock.map(item => { + + const qty = + getQty(item.grade) + + return ( + +

+ +

+ Grade {item.grade} +

+ +

+ {item.stok} +

+ +

+ Stok tersedia +

+ +

+ Rp { + PRICE[item.grade] + .toLocaleString() + } +

+ + {qty === 0 ? ( + + + + ) : ( + +

+ + + + + {qty} + + + + +

+ + )} + +

+ + ) + })} + +

+ +

+ Keranjang +

+ + + {cart.length} item + + +

+ + {cart.length === 0 ? ( + +

+ Keranjang masih kosong +

+ + ) : ( + + <> + + {cart.map(item => ( + +

+ +

+ Grade {item.grade} +

+ +

+ Rp { + PRICE[item.grade] + .toLocaleString() + } +

+ +

+ + + {item.qty}x + + + + +

+ +

+ + ))} + +

+ + Total + + + Rp {total.toLocaleString()} + + +

+ + + + + + )} + +

+ +

+ Scan QR Pembayaran +

+ +

+ Total: + {" "} + Rp {total.toLocaleString()} +

+ + + setFile(e.target.files[0]) + } + + style={styles.fileInput} + /> + + + +

+ 📜 History Pembelian +

+ Belum ada pembelian +

ID	Tanggal	Total	Status	Bukti
#{order.id}	+ { + new Date(order.created_at) + .toLocaleString("id-ID") + } +	+ Rp {order.total?.toLocaleString()} +	+ + + {order.status} + + +	+ + {order.bukti_pembayaran ? ( + + + Lihat Bukti + + + ) : ( + "-" + )} + +

Tanggal

Total

Status

Bukti

#{order.id}

+ { + new Date(order.created_at) + .toLocaleString("id-ID") + } +

+ Rp {order.total?.toLocaleString()} +

+ + + {order.status} + + +

+ + {order.bukti_pembayaran ? ( + + + Lihat Bukti + + + ) : ( + "-" + )} + +

+ + {/* LOGO */} + +

+ +

+ 🥚 +

+ +

+ Sadewa +

+ +

+ Egg Management +

+ +

+ + {/* USER CARD */} + +

+ +

+ { + (user?.nama || "G")[0] + .toUpperCase() + } +

+ +

+ {user?.nama || "Guest"} +

+ +

+ {role || "user"} +

+ +

+ + {/* NAVIGATION */} + +

+ + {menu.map(m => ( + + + + ))} + +

+ + {/* FOOTER */} + +

+ + + +

+ + ) +} + +const s = { + + sidebar: { + + width: 260, + + minHeight: "100vh", + + padding: "22px 16px", + + boxSizing: "border-box", + + display: "flex", + + flexDirection: "column", + + background: ` + linear-gradient( + 180deg, + rgba(124,45,18,0.98), + rgba(154,52,18,0.96), + rgba(194,65,12,0.95) + ) + `, + + borderRight: + "1px solid rgba(255,255,255,0.08)", + + backdropFilter: "blur(12px)", + + boxShadow: + "10px 0 30px rgba(0,0,0,0.25)", + }, + + logoWrap: { + + display: "flex", + + alignItems: "center", + + gap: 12, + + marginBottom: 28, + + padding: "4px 6px", + }, + + logoIcon: { + + width: 50, + + height: 50, + + borderRadius: 16, + + background: + "linear-gradient(135deg, #f59e0b, #fb923c)", + + display: "flex", + + alignItems: "center", + + justifyContent: "center", + + fontSize: 24, + + boxShadow: + "0 10px 30px rgba(245,158,11,0.35)", + }, + + logoText: { + + color: "#fff7ed", + + fontSize: 20, + + fontWeight: 700, + + lineHeight: 1, + }, + + logoSub: { + + marginTop: 4, + + color: "#fed7aa", + + fontSize: 12, + }, + + userCard: { + + display: "flex", + + alignItems: "center", + + gap: 12, + + padding: "14px", + + marginBottom: 26, + + borderRadius: 18, + + background: + "rgba(255,255,255,0.08)", + + border: + "1px solid rgba(255,255,255,0.08)", + + backdropFilter: "blur(12px)", + + boxShadow: + "0 10px 25px rgba(0,0,0,0.15)", + }, + + avatar: { + + width: 42, + + height: 42, + + borderRadius: "50%", + + background: + "linear-gradient(135deg, #fbbf24, #f97316)", + + display: "flex", + + alignItems: "center", + + justifyContent: "center", + + fontWeight: 700, + + color: "white", + + fontSize: 15, + + flexShrink: 0, + }, + + userName: { + + color: "#fff7ed", + + fontSize: 14, + + fontWeight: 600, + }, + + userRole: { + + marginTop: 3, + + color: "#fdba74", + + fontSize: 12, + + textTransform: "capitalize", + }, + + nav: { + + display: "flex", + + flexDirection: "column", + + gap: 8, + }, + + menuBtn: { + + border: "none", + + background: "transparent", + + color: "#fed7aa", + + padding: "13px 14px", + + borderRadius: 14, + + display: "flex", + + alignItems: "center", + + gap: 12, + + cursor: "pointer", + + transition: "all 0.2s ease", + + position: "relative", + + fontSize: 14, + + boxShadow: + "0 4px 10px rgba(0,0,0,0.08)", + }, + + menuBtnActive: { + + background: + "linear-gradient(135deg, rgba(255,255,255,0.16), rgba(255,255,255,0.08))", + + color: "#ffffff", + + fontWeight: 700, + + border: + "1px solid rgba(255,255,255,0.12)", + + boxShadow: + "0 10px 25px rgba(0,0,0,0.18)", + + transform: "translateX(4px)", + }, + + menuIcon: { + fontSize: 17, + }, + + menuLabel: { + flex: 1, + textAlign: "left", + }, + + activeWrap: { + + marginLeft: "auto", + + display: "flex", + + alignItems: "center", + + gap: 8, + }, + + activeText: { + + fontSize: 11, + + color: "#fde68a", + + fontWeight: 700, + + letterSpacing: "0.03em", + }, + + activeDot: { + + width: 10, + + height: 10, + + borderRadius: "50%", + + background: "#fbbf24", + + boxShadow: + "0 0 14px rgba(251,191,36,0.95)", + }, + + logoutBtn: { + + border: + "1px solid rgba(255,255,255,0.12)", + + background: + "rgba(255,255,255,0.06)", + + color: "#fff7ed", + + padding: "13px 14px", + + borderRadius: 14, + + display: "flex", + + alignItems: "center", + + gap: 10, + + cursor: "pointer", + + fontSize: 14, + + transition: "0.2s", + + backdropFilter: "blur(10px)", + }, +} \ No newline at end of file diff --git a/src/context/AuthContext.jsx b/src/context/AuthContext.jsx new file mode 100644 index 0000000..ae561ef --- /dev/null +++ b/src/context/AuthContext.jsx @@ -0,0 +1,60 @@ +import { + createContext, + useState, + useEffect +} from "react" + +export const AuthContext = createContext() + +export function AuthProvider({ children }) { + + // 🔥 AMBIL USER DARI LOCAL STORAGE + const [user, setUser] = useState(() => { + + const savedUser = localStorage.getItem("user") + + return savedUser + ? JSON.parse(savedUser) + : null + }) + + // 🔥 SIMPAN USER KE LOCAL STORAGE + useEffect(() => { + + if (user) { + + localStorage.setItem( + "user", + JSON.stringify(user) + ) + + } else { + + localStorage.removeItem("user") + + } + + }, [user]) + + // 🔥 LOGIN + const login = (data) => { + setUser(data) + } + + // 🔥 LOGOUT + const logout = () => { + setUser(null) + } + + return ( + + {children} + + ) +} \ No newline at end of file diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..7111d4c --- /dev/null +++ b/src/index.css @@ -0,0 +1,92 @@ +:root { + font-family: + Inter, + system-ui, + sans-serif; + + color: #f8fafc; + + background: + linear-gradient( + 135deg, + #020617, + #0f172a, + #111827 + ); + + font-synthesis: none; + + text-rendering: + optimizeLegibility; + + -webkit-font-smoothing: + antialiased; + + -moz-osx-font-smoothing: + grayscale; +} + +* { + box-sizing: border-box; +} + +html, +body, +#root { + margin: 0; + padding: 0; + + width: 100%; + min-height: 100vh; +} + +body { + background: + radial-gradient( + circle at top left, + rgba(245,158,11,0.18), + transparent 20% + ), + + radial-gradient( + circle at bottom right, + rgba(239,68,68,0.12), + transparent 25% + ), + + linear-gradient( + 135deg, + #020617, + #0f172a, + #111827 + ); + + color: #f8fafc; +} + +button { + font-family: inherit; +} + +a { + color: inherit; + text-decoration: none; +} + +::-webkit-scrollbar { + width: 10px; +} + +::-webkit-scrollbar-track { + background: #0f172a; +} + +::-webkit-scrollbar-thumb { + background: + linear-gradient( + #f59e0b, + #ea580c + ); + + border-radius: 999px; +} \ No newline at end of file diff --git a/src/main.jsx b/src/main.jsx new file mode 100644 index 0000000..a6dd5ff --- /dev/null +++ b/src/main.jsx @@ -0,0 +1,17 @@ +import { StrictMode } from 'react' +import { createRoot } from 'react-dom/client' + +import './index.css' +import App from './App.jsx' + +import { AuthProvider } from './context/AuthContext.jsx' + +createRoot(document.getElementById('root')).render( + + + + + + + , +) \ No newline at end of file diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..8b0f57b --- /dev/null +++ b/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react' + +// https://vite.dev/config/ +export default defineConfig({ + plugins: [react()], +})

+ Admin Dashboard +

+ Sadewa Telur 🥚 +

+ Stok Telur +

+ {item.stok} +

+ Keranjang +

+ Scan QR Pembayaran +

+ 📜 History Pembelian +