first commit
This commit is contained in:
172
ad-approval-matrix.html
Normal file
172
ad-approval-matrix.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Approval Matrix - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Admin / Approval</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Approval Matrix</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Rule</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Approval Rules</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Document Type</th><th class="px-3 py-2 text-left">Level</th><th class="px-3 py-2 text-left">Approver Role</th><th class="px-3 py-2 text-left">Min</th><th class="px-3 py-2 text-left">Max</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Purchase Order</td><td class="px-3 py-2">1</td><td class="px-3 py-2">Procurement Manager</td><td class="px-3 py-2">0</td><td class="px-3 py-2">50M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Purchase Order</td><td class="px-3 py-2">2</td><td class="px-3 py-2">Finance Manager</td><td class="px-3 py-2">50M+</td><td class="px-3 py-2">500M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Purchase Order</td><td class="px-3 py-2">3</td><td class="px-3 py-2">Director</td><td class="px-3 py-2">500M+</td><td class="px-3 py-2">∞</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Material Request</td><td class="px-3 py-2">1</td><td class="px-3 py-2">Branch Manager</td><td class="px-3 py-2">0</td><td class="px-3 py-2">100M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Sales Order</td><td class="px-3 py-2">1</td><td class="px-3 py-2">Sales Manager</td><td class="px-3 py-2">0</td><td class="px-3 py-2">100M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ad-audit-log.html
Normal file
172
ad-audit-log.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Audit Log - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Admin / Audit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Audit Log</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Audit Trail</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="User or doc..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Module</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Item</option><option>PO</option><option>MR</option><option>SO</option><option>GRN</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Action</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Create</option><option>Edit</option><option>Delete</option><option>Approve</option><option>Login</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Timestamp</th><th class="px-3 py-2 text-left">User</th><th class="px-3 py-2 text-left">Action</th><th class="px-3 py-2 text-left">Module</th><th class="px-3 py-2 text-left">Doc#</th><th class="px-3 py-2 text-left">Detail</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">30 May 08:15</td><td class="px-3 py-2">admin</td><td class="px-3 py-2">Approve</td><td class="px-3 py-2">PO</td><td class="px-3 py-2">PO-2025-0041</td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">30 May 08:00</td><td class="px-3 py-2">admin</td><td class="px-3 py-2">Login</td><td class="px-3 py-2">-</td><td class="px-3 py-2">-</td><td class="px-3 py-2">-</td><td class="px-3 py-2 text-right">-</td></tr><tr class=""><td class="px-3 py-2">29 May 14:30</td><td class="px-3 py-2">budi</td><td class="px-3 py-2">Create</td><td class="px-3 py-2">PO</td><td class="px-3 py-2">PO-2025-0042</td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">29 May 10:00</td><td class="px-3 py-2">sari</td><td class="px-3 py-2">Edit</td><td class="px-3 py-2">Item</td><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td></tr><tr class=""><td class="px-3 py-2">28 May 16:00</td><td class="px-3 py-2">rudi</td><td class="px-3 py-2">Approve</td><td class="px-3 py-2">MR</td><td class="px-3 py-2">MR-2025-0104</td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">View</a></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ad-numbering-profile.html
Normal file
172
ad-numbering-profile.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Numbering Profiles - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Admin / Numbering</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Numbering Profiles</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Document Numbering</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Doc Type</th><th class="px-3 py-2 text-left">Prefix</th><th class="px-3 py-2 text-left">Format</th><th class="px-3 py-2 text-left">Last#</th><th class="px-3 py-2 text-left">Preview</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Purchase Order</td><td class="px-3 py-2">PO</td><td class="px-3 py-2">PO-{YYYY}-{COUNTER}</td><td class="px-3 py-2">0042</td><td class="px-3 py-2">PO-2025-0043</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Material Request</td><td class="px-3 py-2">MR</td><td class="px-3 py-2">MR-{YYYY}-{COUNTER}</td><td class="px-3 py-2">0105</td><td class="px-3 py-2">MR-2025-0106</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Goods Receipt</td><td class="px-3 py-2">GRN</td><td class="px-3 py-2">GRN-{YYYY}-{COUNTER}</td><td class="px-3 py-2">0042</td><td class="px-3 py-2">GRN-2025-0043</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Sales Order</td><td class="px-3 py-2">SO</td><td class="px-3 py-2">SO-{YYYY}-{COUNTER}</td><td class="px-3 py-2">0085</td><td class="px-3 py-2">SO-2025-0086</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Shipment</td><td class="px-3 py-2">SHP</td><td class="px-3 py-2">SHP-{YYYY}-{COUNTER}</td><td class="px-3 py-2">0035</td><td class="px-3 py-2">SHP-2025-0036</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
ad-role-permission.html
Normal file
167
ad-role-permission.html
Normal file
File diff suppressed because one or more lines are too long
172
ad-user-management.html
Normal file
172
ad-user-management.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>User Management - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Admin / Users</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">User Management</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add User</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Users</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Username..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Role</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Admin</option><option>Procurement</option><option>Warehouse</option><option>Sales</option><option>QC</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Active</option><option>Inactive</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Username</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Email</th><th class="px-3 py-2 text-left">Role</th><th class="px-3 py-2 text-left">Branch</th><th class="px-3 py-2 text-left">Last Login</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">admin</td><td class="px-3 py-2">Supply Chain Admin</td><td class="px-3 py-2">admin@scm.co.id</td><td class="px-3 py-2">Admin</td><td class="px-3 py-2">HQ</td><td class="px-3 py-2">30 May 08:00</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">budi</td><td class="px-3 py-2">Budi Purchasing</td><td class="px-3 py-2">budi@scm.co.id</td><td class="px-3 py-2">Procurement</td><td class="px-3 py-2">HQ</td><td class="px-3 py-2">30 May 07:30</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">sari</td><td class="px-3 py-2">Sari Warehouse</td><td class="px-3 py-2">sari@scm.co.id</td><td class="px-3 py-2">Warehouse</td><td class="px-3 py-2">Branch A</td><td class="px-3 py-2">29 May 16:00</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">rudi</td><td class="px-3 py-2">Rudi QC</td><td class="px-3 py-2">rudi@scm.co.id</td><td class="px-3 py-2">QC</td><td class="px-3 py-2">HQ</td><td class="px-3 py-2">28 May 10:00</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
assets/image/favicon-32x32.png
Normal file
BIN
assets/image/favicon-32x32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
assets/image/logo.png
Normal file
BIN
assets/image/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 MiB |
184
dash-demand.html
Normal file
184
dash-demand.html
Normal file
@@ -0,0 +1,184 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Demand Planning - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Dashboard / Demand</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Demand Planning</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Forecast Accuracy</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">90%</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Weighted</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">To Replenish</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-warning]">3</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Below safety</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Avg Error</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">8%</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">MAPE</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Seasonal Items</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">12</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">With factors</p>
|
||||||
|
</div></div> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Replenishment Suggestions</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Current</th><th class="px-3 py-2 text-left">Forecast</th><th class="px-3 py-2 text-left">Safety</th><th class="px-3 py-2 text-left">Net Req</th><th class="px-3 py-2 text-left">Suggested</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">530</td><td class="px-3 py-2">200</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">150</td><td class="px-3 py-2">300</td><td class="px-3 py-2">200</td><td class="px-3 py-2">350</td><td class="px-3 py-2">500</td><td class="px-3 py-2 text-right">500</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">2,100</td><td class="px-3 py-2">500</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
184
dash-inventory.html
Normal file
184
dash-inventory.html
Normal file
@@ -0,0 +1,184 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Inventory - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Dashboard / Inventory</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Inventory</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Total Items</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">1,247</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Active SKUs</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Stock Value</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">Rp 95.1M</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Avg cost</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Low Stock</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-danger]">5</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Below reorder pt</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Turnover</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">4.2x</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">30 days</p>
|
||||||
|
</div></div> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Stock by Warehouse</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Warehouse</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">Utilization</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">850</td><td class="px-3 py-2">Rp 55.2M</td><td class="px-3 py-2">78%</td><td class="px-3 py-2 text-right">78%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">WH-002 Satellite A</td><td class="px-3 py-2">280</td><td class="px-3 py-2">Rp 25.0M</td><td class="px-3 py-2">65%</td><td class="px-3 py-2 text-right">65%</td></tr><tr class=""><td class="px-3 py-2">WH-003 Satellite B</td><td class="px-3 py-2">117</td><td class="px-3 py-2">Rp 14.9M</td><td class="px-3 py-2">45%</td><td class="px-3 py-2 text-right">45%</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
184
dash-logistics.html
Normal file
184
dash-logistics.html
Normal file
@@ -0,0 +1,184 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Logistics - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Dashboard / Logistics</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Logistics</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">On-Time</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">88%</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Target: 95%</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">In Transit</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">15</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Shipments</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Avg Transit</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">2.5 days</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Door to door</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Exceptions</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-danger]">3</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">This week</p>
|
||||||
|
</div></div> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Carrier Performance</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Carrier</th><th class="px-3 py-2 text-left">Shipments</th><th class="px-3 py-2 text-left">On-Time %</th><th class="px-3 py-2 text-left">Avg Days</th><th class="px-3 py-2 text-left">Exceptions</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">JNE</td><td class="px-3 py-2">25</td><td class="px-3 py-2">92%</td><td class="px-3 py-2">2.0</td><td class="px-3 py-2">1</td><td class="px-3 py-2 text-right">1</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SiCepat</td><td class="px-3 py-2">18</td><td class="px-3 py-2">88%</td><td class="px-3 py-2">1.5</td><td class="px-3 py-2">1</td><td class="px-3 py-2 text-right">1</td></tr><tr class=""><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">15</td><td class="px-3 py-2">85%</td><td class="px-3 py-2">2.5</td><td class="px-3 py-2">2</td><td class="px-3 py-2 text-right">2</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
191
dash-overview.html
Normal file
191
dash-overview.html
Normal file
@@ -0,0 +1,191 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Executive Overview - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Dashboard</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Executive Overview</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Inventory Value</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">Rp 95.1M</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">3 warehouses</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Outstanding POs</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-warning]">Rp 725M</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">16 pending</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Shipments</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">12</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">8 destinations</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Active SOs</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-primary]">24</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 180M total</p>
|
||||||
|
</div></div><div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Status Summary</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Category</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Stock below reorder</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">2 items</span></td><td class="px-3 py-2">Create PO</td><td class="px-3 py-2 text-right">Create PO</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Pending PO approvals</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">8 POs</span></td><td class="px-3 py-2">Review</td><td class="px-3 py-2 text-right">Review</td></tr><tr class=""><td class="px-3 py-2">Overdue shipments</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">3</span></td><td class="px-3 py-2">Track</td><td class="px-3 py-2 text-right">Track</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Metric</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">Trend</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Inventory Turnover</td><td class="px-3 py-2">4.2x</td><td class="px-3 py-2">30 days</td><td class="px-3 py-2 text-right">30 days</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Supplier OTIF</td><td class="px-3 py-2">92%</td><td class="px-3 py-2">Above target</td><td class="px-3 py-2 text-right">Above target</td></tr><tr class=""><td class="px-3 py-2">Fulfillment Rate</td><td class="px-3 py-2">87%</td><td class="px-3 py-2">Improving</td><td class="px-3 py-2 text-right">Improving</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Quick Links</h2></div><div class="grid grid-cols-2 gap-2"><a href="./po-list.html" class="rounded-lg border border-[var(--scm-border)] bg-[var(--scm-primary-bg)] px-4 py-3 text-sm font-semibold text-[var(--scm-primary)] hover:bg-blue-100">Purchase Orders</a><a href="./mr-list.html" class="rounded-lg border border-[var(--scm-border)] bg-[var(--scm-primary-bg)] px-4 py-3 text-sm font-semibold text-[var(--scm-primary)] hover:bg-blue-100">Material Requests</a><a href="./rcv-list.html" class="rounded-lg border border-[var(--scm-border)] bg-[var(--scm-primary-bg)] px-4 py-3 text-sm font-semibold text-[var(--scm-primary)] hover:bg-blue-100">Goods Receipt</a><a href="./inv-stock-overview.html" class="rounded-lg border border-[var(--scm-border)] bg-[var(--scm-primary-bg)] px-4 py-3 text-sm font-semibold text-[var(--scm-primary)] hover:bg-blue-100">Stock Overview</a></div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
184
dash-procurement.html
Normal file
184
dash-procurement.html
Normal file
@@ -0,0 +1,184 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Procurement - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Dashboard / Procurement</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Procurement</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">POs This Month</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">18</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 950M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Pending Approval</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-warning]">8</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 450M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Avg Lead Time</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">12 days</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Supplier to WH</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Top Supplier</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">PT Supplier A</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">45% of spend</p>
|
||||||
|
</div></div> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Supplier Performance</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Supplier</th><th class="px-3 py-2 text-left">PO Count</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">On-Time %</th><th class="px-3 py-2 text-left">Quality %</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">12</td><td class="px-3 py-2">Rp 450M</td><td class="px-3 py-2">95%</td><td class="px-3 py-2">98%</td><td class="px-3 py-2 text-right">98%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">8</td><td class="px-3 py-2">Rp 200M</td><td class="px-3 py-2">88%</td><td class="px-3 py-2">95%</td><td class="px-3 py-2 text-right">95%</td></tr><tr class=""><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rp 300M</td><td class="px-3 py-2">92%</td><td class="px-3 py-2">96%</td><td class="px-3 py-2 text-right">96%</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
dp-forecast.html
Normal file
172
dp-forecast.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Demand Forecast - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Planning / Forecast</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Demand Forecast</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Demand Forecast</h2></div><div class="flex flex-wrap gap-3 mb-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Method</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Moving Avg (3mo)</option><option>Moving Avg (6mo)</option><option>Exponential Smoothing</option><option>Manual</option></select></label><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Calculate</button></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Jan</th><th class="px-3 py-2 text-left">Feb</th><th class="px-3 py-2 text-left">Mar</th><th class="px-3 py-2 text-left">Apr</th><th class="px-3 py-2 text-left">May</th><th class="px-3 py-2 text-left">Jun (F)</th><th class="px-3 py-2 text-left">Jul (F)</th><th class="px-3 py-2 text-left">Accuracy</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">500</td><td class="px-3 py-2">550</td><td class="px-3 py-2">480</td><td class="px-3 py-2">600</td><td class="px-3 py-2">520</td><td class="px-3 py-2">530</td><td class="px-3 py-2">540</td><td class="px-3 py-2">92%</td><td class="px-3 py-2 text-right">92%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">2,100</td><td class="px-3 py-2">1,900</td><td class="px-3 py-2">2,200</td><td class="px-3 py-2">2,050</td><td class="px-3 py-2">2,100</td><td class="px-3 py-2">2,150</td><td class="px-3 py-2">90%</td><td class="px-3 py-2 text-right">90%</td></tr><tr class=""><td class="px-3 py-2">Hand Sanitizer</td><td class="px-3 py-2">1,500</td><td class="px-3 py-2">1,400</td><td class="px-3 py-2">1,600</td><td class="px-3 py-2">1,800</td><td class="px-3 py-2">1,700</td><td class="px-3 py-2">1,650</td><td class="px-3 py-2">1,600</td><td class="px-3 py-2">88%</td><td class="px-3 py-2 text-right">88%</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
dp-replenishment.html
Normal file
172
dp-replenishment.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Replenishment Plan - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Planning / Replenishment</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Replenishment Plan</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Replenishment Plan</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Stock</th><th class="px-3 py-2 text-left">Safety</th><th class="px-3 py-2 text-left">Forecast</th><th class="px-3 py-2 text-left">Open PO</th><th class="px-3 py-2 text-left">Net Req</th><th class="px-3 py-2 text-left">EOQ</th><th class="px-3 py-2 text-left">Suggested</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">200</td><td class="px-3 py-2">530</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">150</td><td class="px-3 py-2">200</td><td class="px-3 py-2">300</td><td class="px-3 py-2">0</td><td class="px-3 py-2">350</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">Create PR</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">Create PR</a></td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">500</td><td class="px-3 py-2">2,100</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
70
index.html
Normal file
70
index.html
Normal file
@@ -0,0 +1,70 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Slicing Hub - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="mx-auto max-w-5xl px-4 py-8 sm:px-6 lg:px-8">
|
||||||
|
<header class="mb-6 rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center gap-3">
|
||||||
|
<div class="flex h-11 w-11 items-center justify-center rounded-lg bg-[var(--scm-primary)] text-lg font-extrabold text-white">SCM</div>
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-[0.14em] text-[var(--scm-primary)]">Supply Chain Management</p>
|
||||||
|
<h1 class="text-2xl font-extrabold">Slicing Table of Contents</h1>
|
||||||
|
<p class="text-sm text-[var(--scm-text-muted)]">Quick navigation to all prototype pages under <code class="text-xs bg-[var(--scm-primary-bg)] px-1.5 py-0.5 rounded text-[var(--scm-primary)]">slicing-scm/</code></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="space-y-3">
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<h2 class="text-lg font-bold">Login</h2>
|
||||||
|
<a href="./login.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Open</a>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm text-[var(--scm-text-muted)]">Login page with SCM branding.</p>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-3">
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Dashboard</h3><div class="space-y-1 text-sm"><a href="./dash-overview.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Executive Overview</a><a href="./dash-procurement.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Procurement Dashboard</a><a href="./dash-inventory.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inventory Dashboard</a><a href="./dash-logistics.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Logistics Dashboard</a><a href="./dash-demand.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Demand Planning</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Master Data — Item</h3><div class="space-y-1 text-sm"><a href="./md-item-master.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Item Master List</a><a href="./md-item-master-new.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">New Item</a><a href="./md-item-category.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Item Categories</a><a href="./md-item-group.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Item Groups</a><a href="./md-item-uom.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">UOM Conversion</a><a href="./md-item-inspection.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inspection Profiles</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Master Data — Partner</h3><div class="space-y-1 text-sm"><a href="./md-vendor-master.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Vendor / Supplier</a><a href="./md-vendor-contract.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Vendor Contracts</a><a href="./md-vendor-item-terms.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Vendor Item Terms</a><a href="./md-customer-master.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Customer Master</a><a href="./md-carrier-master.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Carrier Master</a><a href="./md-carrier-rate.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Carrier Rates</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Master Data — Facility</h3><div class="space-y-1 text-sm"><a href="./md-warehouse.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Warehouse Master</a><a href="./md-warehouse-zone.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Warehouse Zones</a><a href="./md-warehouse-bin.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Bin Locations</a><a href="./md-transport-mode.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Transport Modes</a><a href="./md-bom.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Bill of Materials</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Procurement</h3><div class="space-y-1 text-sm"><a href="./po-list.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Purchase Orders</a><a href="./po-approval.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">PO Approvals</a><a href="./mr-list.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Material Requests</a><a href="./mr-approval.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">MR Approvals</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Receiving & Inventory</h3><div class="space-y-1 text-sm"><a href="./rcv-list.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Goods Receipt</a><a href="./inv-stock-overview.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Stock Overview</a><a href="./inv-stock-movement.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Movement Log</a><a href="./inv-stock-transfer.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Transfer</a><a href="./inv-stock-count.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Stock Count</a><a href="./inv-aging.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inventory Aging</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Sales & Logistics</h3><div class="space-y-1 text-sm"><a href="./so-list.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Sales Orders</a><a href="./so-invoice.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Sales Invoices</a><a href="./ship-list.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Shipments</a><a href="./ship-tracking.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Tracking</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Quality & Planning</h3><div class="space-y-1 text-sm"><a href="./qc-inspection-plan.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inspection Plans</a><a href="./qc-inspection-record.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inspection Records</a><a href="./qc-nonconformance.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Non-Conformance</a><a href="./dp-forecast.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Demand Forecast</a><a href="./dp-replenishment.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Replenishment</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Administration</h3><div class="space-y-1 text-sm"><a href="./ad-user-management.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">User Management</a><a href="./ad-role-permission.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Role & Permission</a><a href="./ad-approval-matrix.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Approval Matrix</a><a href="./ad-numbering-profile.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Numbering Profiles</a><a href="./ad-audit-log.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Audit Log</a></div></article>
|
||||||
|
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><h3 class="mb-2 font-bold">Reporting</h3><div class="space-y-1 text-sm"><a href="./rp-inventory.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inventory Reports</a><a href="./rp-procurement.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Procurement Reports</a><a href="./rp-sales.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Sales Reports</a><a href="./rp-logistics.html" class="block rounded-md border border-[var(--scm-border)] px-3 py-2 font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Logistics Reports</a></div></article>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-aging.html
Normal file
172
inv-aging.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Inventory Aging - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Aging</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Inventory Aging</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Aging Report</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Item..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>WH-001</option><option>WH-002</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">0-30d</th><th class="px-3 py-2 text-left">31-60d</th><th class="px-3 py-2 text-left">61-90d</th><th class="px-3 py-2 text-left">91-180d</th><th class="px-3 py-2 text-left">181-365d</th><th class="px-3 py-2 text-left">365+d</th><th class="px-3 py-2 text-left">Value</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">800</td><td class="px-3 py-2">400</td><td class="px-3 py-2">200</td><td class="px-3 py-2">100</td><td class="px-3 py-2">0</td><td class="px-3 py-2">Rp 37.5M</td><td class="px-3 py-2 text-right">Rp 37.5M</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">800</td><td class="px-3 py-2">200</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2">Rp 20M</td><td class="px-3 py-2 text-right">Rp 20M</td></tr><tr class=""><td class="px-3 py-2">Hand Sanitizer</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">800</td><td class="px-3 py-2">300</td><td class="px-3 py-2">100</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2">Rp 25.6M</td><td class="px-3 py-2 text-right">Rp 25.6M</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
inv-disposal.html
Normal file
167
inv-disposal.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Material Disposal - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Disposal</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Material Disposal</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Material Disposal</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>WH-001 Main</option><option>WH-002 Satellite A</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Item</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Raw Material Alpha</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Available</span><input type="text" value="500" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Disposal Qty</span><input type="text" value="50" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Reason</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Expired</option><option>Damaged</option><option>Obsolete</option><option>Recall</option><option>Other</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Method</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Landfill</option><option>Recycle</option><option>Incineration</option><option>Return to Supplier</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" placeholder="Additional notes..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./inv-stock-overview.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Post Disposal</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-reorder.html
Normal file
172
inv-reorder.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Reorder Suggestions - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Reorder</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Reorder Suggestions</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Reorder Suggestions</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Stock</th><th class="px-3 py-2 text-left">Reorder Pt</th><th class="px-3 py-2 text-left">Safety</th><th class="px-3 py-2 text-left">EOQ</th><th class="px-3 py-2 text-left">Suggested</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">200</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">150</td><td class="px-3 py-2">500</td><td class="px-3 py-2">200</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2"><a href="./po-create.html" class="text-xs font-semibold text-[var(--scm-primary)]">Create PO</a></td><td class="px-3 py-2 text-right"><a href="./po-create.html" class="text-xs font-semibold text-[var(--scm-primary)]">Create PO</a></td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">500</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">0</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">OK</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Cleaning Chemical</td><td class="px-3 py-2">50</td><td class="px-3 py-2">100</td><td class="px-3 py-2">50</td><td class="px-3 py-2">200</td><td class="px-3 py-2">100</td><td class="px-3 py-2"><a href="./po-create.html" class="text-xs font-semibold text-[var(--scm-primary)]">Create PO</a></td><td class="px-3 py-2 text-right"><a href="./po-create.html" class="text-xs font-semibold text-[var(--scm-primary)]">Create PO</a></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
inv-stock-adjustment.html
Normal file
167
inv-stock-adjustment.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Stock Adjustment - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Adjustment</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Stock Adjustment</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Stock Adjustment</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>WH-001 Main</option><option>WH-002 Satellite A</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Item</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Raw Material Alpha</option><option>Bottle HDPE</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Current Stock</span><input type="text" value="2,500" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Adj. Qty</span><input type="text" placeholder="+/- quantity" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Reason</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Damage</option><option>Expired</option><option>Found</option><option>Recount</option><option>Write-Off</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" placeholder="Reason..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./inv-stock-overview.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Post Adjustment</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
179
inv-stock-count.html
Normal file
179
inv-stock-count.html
Normal file
@@ -0,0 +1,179 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Stock Count - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Count</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Stock Count</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">New Session</button></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Count Sessions</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Session ID..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Planned</option><option>In Progress</option><option>Counted</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Session#</th><th class="px-3 py-2 text-left">Warehouse</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Variances</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">SC-2025-0005</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Progress</span></td><td class="px-3 py-2">150</td><td class="px-3 py-2">-</td><td class="px-3 py-2 text-right">-</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SC-2025-0004</td><td class="px-3 py-2">WH-002</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Variance Check</span></td><td class="px-3 py-2">200</td><td class="px-3 py-2">12</td><td class="px-3 py-2 text-right">12</td></tr><tr class=""><td class="px-3 py-2">SC-2025-0003</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">20 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Posted</span></td><td class="px-3 py-2">500</td><td class="px-3 py-2">8</td><td class="px-3 py-2 text-right">8</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Variance Report — SC-2025-0004</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">System</th><th class="px-3 py-2 text-left">Counted</th><th class="px-3 py-2 text-left">Variance</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">2,480</td><td class="px-3 py-2">-20</td><td class="px-3 py-2">-Rp 300K</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Adjust</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Adjust</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">8,050</td><td class="px-3 py-2">+50</td><td class="px-3 py-2">+Rp 125K</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Adjust</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Adjust</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-stock-movement.html
Normal file
172
inv-stock-movement.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Stock Movement Log - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Movement</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Stock Movement Log</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Movement Log</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Item or ref..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Type</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Receipt</option><option>Issue</option><option>Transfer</option><option>Adjustment</option><option>Usage</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Type</th><th class="px-3 py-2 text-left">Reference</th><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">Balance</th><th class="px-3 py-2 text-left">WH</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">30 May</td><td class="px-3 py-2">Receipt</td><td class="px-3 py-2">GRN-0042</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">+1,000</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2 text-right">WH-001</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">29 May</td><td class="px-3 py-2">Usage</td><td class="px-3 py-2">USG-0050</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">-200</td><td class="px-3 py-2">1,500</td><td class="px-3 py-2">WH-002</td><td class="px-3 py-2 text-right">WH-002</td></tr><tr class=""><td class="px-3 py-2">28 May</td><td class="px-3 py-2">Transfer</td><td class="px-3 py-2">TRF-0015</td><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">-500</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2 text-right">WH-001</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">27 May</td><td class="px-3 py-2">Adjust</td><td class="px-3 py-2">ADJ-0003</td><td class="px-3 py-2">Hand Sanitizer</td><td class="px-3 py-2">+50</td><td class="px-3 py-2">3,200</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2 text-right">WH-001</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-stock-overview.html
Normal file
172
inv-stock-overview.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Stock Overview - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Overview</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Stock Overview</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./inv-stock-transfer.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">New Transfer</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Stock by Warehouse</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>WH-001</option><option>WH-002</option><option>WH-003</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">WH</th><th class="px-3 py-2 text-left">On Hand</th><th class="px-3 py-2 text-left">Available</th><th class="px-3 py-2 text-left">Reserved</th><th class="px-3 py-2 text-left">Cost</th><th class="px-3 py-2 text-left">Value</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">2,300</td><td class="px-3 py-2">200</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 37.5M</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">ITM-PKG-000042</td><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">7,500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Rp 2,500</td><td class="px-3 py-2">Rp 20M</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">ITM-FG-000215</td><td class="px-3 py-2">Hand Sanitizer 500ml</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">3,200</td><td class="px-3 py-2">3,000</td><td class="px-3 py-2">200</td><td class="px-3 py-2">Rp 8,000</td><td class="px-3 py-2">Rp 25.6M</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-stock-transfer.html
Normal file
172
inv-stock-transfer.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Stock Transfer - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Transfer</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Stock Transfer</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create Transfer</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Transfer List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Transfer#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Draft</option><option>In Transit</option><option>Pending</option><option>Completed</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Transfer#</th><th class="px-3 py-2 text-left">From</th><th class="px-3 py-2 text-left">To</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">TRF-2025-0015</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">WH-002</td><td class="px-3 py-2">3</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">Receive</a></td><td class="px-3 py-2 text-right"><a href="#" class="text-xs font-semibold text-[var(--scm-primary)]">Receive</a></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">TRF-2025-0014</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">WH-003</td><td class="px-3 py-2">5</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td></tr><tr class=""><td class="px-3 py-2">TRF-2025-0013</td><td class="px-3 py-2">WH-002</td><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">2</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Completed</span></td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
inv-usage.html
Normal file
172
inv-usage.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Material Usage - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Inventory / Usage</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Material Usage</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Material Usage</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Date</span><input type="text" value="30 May 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Branch</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Branch A</option><option>Branch B</option><option>HQ</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Cost Center</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Production</option><option>QC</option><option>Warehouse</option><option>Office</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Reference</span><input type="text" value="WO-2025-" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><h3 class="text-sm font-semibold mb-3">Usage Items</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Available</th><th class="px-3 py-2 text-left">Usage Qty</th><th class="px-3 py-2 text-left">Notes</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Batch production</td><td class="px-3 py-2 text-right">Batch production</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">Packaging line A</td><td class="px-3 py-2 text-right">Packaging line A</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="flex gap-2 pt-2"><a href="./inv-stock-overview.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Post Usage</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
59
login.html
Normal file
59
login.html
Normal file
@@ -0,0 +1,59 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Login - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen items-center justify-center px-4 py-12">
|
||||||
|
<div class="w-full max-w-sm rounded-xl border border-[var(--scm-border)] bg-white p-6 shadow-lg sm:p-8">
|
||||||
|
<div class="mb-6 text-center">
|
||||||
|
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-xl bg-[var(--scm-primary)] text-xl font-extrabold text-white">SCM</div>
|
||||||
|
<h1 class="mt-4 text-xl font-extrabold text-[var(--scm-text)]">Supply Chain Management</h1>
|
||||||
|
<p class="mt-1 text-sm text-[var(--scm-text-muted)]">Sign in to your account</p>
|
||||||
|
</div>
|
||||||
|
<form class="space-y-4">
|
||||||
|
<label class="space-y-1.5">
|
||||||
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Username / Email</span>
|
||||||
|
<input type="text" placeholder="user@company.com" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" />
|
||||||
|
</label>
|
||||||
|
<label class="space-y-1.5">
|
||||||
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Password</span>
|
||||||
|
<input type="password" placeholder="••••••••" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" />
|
||||||
|
</label>
|
||||||
|
<label class="space-y-1.5">
|
||||||
|
<span class="text-xs font-semibold text-[var(--scm-text-muted)]">Branch / Tenant</span>
|
||||||
|
<select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2.5 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30">
|
||||||
|
<option>SCM Group — HQ</option>
|
||||||
|
<option>SCM Group — Warehouse A</option>
|
||||||
|
<option>SCM Group — Warehouse B</option>
|
||||||
|
</select>
|
||||||
|
</label>
|
||||||
|
<div class="flex items-center justify-between text-xs">
|
||||||
|
<label class="flex items-center gap-2"><input type="checkbox" class="rounded border-[var(--scm-border)] accent-[var(--scm-primary)]" /><span class="text-[var(--scm-text-muted)]">Remember me</span></label>
|
||||||
|
<a href="#" class="font-semibold text-[var(--scm-primary)] hover:text-[var(--scm-primary-dark)]">Forgot Password?</a>
|
||||||
|
</div>
|
||||||
|
<button type="button" onclick="window.location.href='./dash-overview.html'" class="w-full rounded-lg bg-[var(--scm-primary)] px-4 py-2.5 text-sm font-bold text-white hover:bg-[var(--scm-primary-dark)]">Sign In</button>
|
||||||
|
</form>
|
||||||
|
<p class="mt-6 text-center text-xs text-[var(--scm-text-muted)]">© 2025 SCM Platform. All rights reserved.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-bom-edit.html
Normal file
172
md-bom-edit.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit BOM - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / BOM / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit BOM</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit BOM — BOM-2025-001</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Parent</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Hand Sanitizer 500ml</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">BOM#</span><input type="text" value="BOM-2025-001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">From</span><input type="text" value="01 Jan 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">To</span><input type="text" value="31 Dec 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><h3 class="text-sm font-semibold mb-3">Components</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Scrap</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">0.5</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">2%</td><td class="px-3 py-2 text-right">2%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">0.3</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">1%</td><td class="px-3 py-2 text-right">1%</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">1</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">0%</td><td class="px-3 py-2 text-right">0%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Label Sticker</td><td class="px-3 py-2">1</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">0%</td><td class="px-3 py-2 text-right">0%</td></tr><tr class=""><td class="px-3 py-2">Cleaning Chemical</td><td class="px-3 py-2">0.01</td><td class="px-3 py-2">LTR</td><td class="px-3 py-2">0%</td><td class="px-3 py-2 text-right">0%</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="flex gap-2 pt-2"><a href="./md-bom.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-bom-new.html
Normal file
172
md-bom-new.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New BOM - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / BOM / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New BOM</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New BOM</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Parent</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Hand Sanitizer 500ml</option><option>Liquid Soap 1L</option><option>Surface Cleaner</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">BOM#</span><input type="text" value="BOM-2025-" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Effective From</span><input type="text" value="01 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Effective To</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><h3 class="text-sm font-semibold mb-3">Components</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Scrap %</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">0.5</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">2%</td><td class="px-3 py-2 text-right">2%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">0.3</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">1%</td><td class="px-3 py-2 text-right">1%</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">1</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">0%</td><td class="px-3 py-2 text-right">0%</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Cleaning Chemical</td><td class="px-3 py-2">0.01</td><td class="px-3 py-2">LTR</td><td class="px-3 py-2">0%</td><td class="px-3 py-2 text-right">0%</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="flex gap-2 pt-2"><a href="./md-bom.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-bom.html
Normal file
172
md-bom.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Bill of Materials - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / BOM</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Bill of Materials</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-bom-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add BOM</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">BOM List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Parent item..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Active</option><option>Draft</option><option>Inactive</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">BOM#</th><th class="px-3 py-2 text-left">Parent Item</th><th class="px-3 py-2 text-left">Components</th><th class="px-3 py-2 text-left">Revision</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">BOM-2025-001</td><td class="px-3 py-2">Hand Sanitizer 500ml</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rev 1</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">BOM-2025-002</td><td class="px-3 py-2">Liquid Soap 1L</td><td class="px-3 py-2">3</td><td class="px-3 py-2">Rev 0</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">BOM-2024-015</td><td class="px-3 py-2">Surface Cleaner</td><td class="px-3 py-2">4</td><td class="px-3 py-2">Rev 2</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Expiring</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-carrier-master-new.html
Normal file
167
md-carrier-master-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Carrier - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Carrier / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Carrier</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Carrier</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Service</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Express</option><option>Standard</option><option>Economy</option><option>Same Day</option><option>Cargo</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Email</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Address</span><input type="text" placeholder="Street, City" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-carrier-master.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-carrier-master.html
Normal file
172
md-carrier-master.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Carrier Master - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Carrier</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Carrier Master</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-carrier-master-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Carrier</a><a href="./md-carrier-rate.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Rates</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Carrier List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Service</th><th class="px-3 py-2 text-left">Contact</th><th class="px-3 py-2 text-left">Phone</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">CRR-001</td><td class="px-3 py-2">JNE</td><td class="px-3 py-2">Express</td><td class="px-3 py-2">Customer Service</td><td class="px-3 py-2">(021) 555-5001</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CRR-002</td><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">Standard</td><td class="px-3 py-2">Customer Service</td><td class="px-3 py-2">(022) 555-5002</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">CRR-003</td><td class="px-3 py-2">SiCepat</td><td class="px-3 py-2">Express</td><td class="px-3 py-2">Customer Service</td><td class="px-3 py-2">(021) 555-5003</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CRR-004</td><td class="px-3 py-2">Pos Indonesia</td><td class="px-3 py-2">Standard</td><td class="px-3 py-2">Customer Service</td><td class="px-3 py-2">(021) 555-5004</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-carrier-rate.html
Normal file
172
md-carrier-rate.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Carrier Rates - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Carrier / Rates</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Carrier Rates</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Rate</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Rate Cards</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Carrier or origin..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Carrier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>JNE</option><option>Tiki</option><option>SiCepat</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Carrier</th><th class="px-3 py-2 text-left">Origin</th><th class="px-3 py-2 text-left">Destination</th><th class="px-3 py-2 text-left">Mode</th><th class="px-3 py-2 text-left">Min</th><th class="px-3 py-2 text-left">Max</th><th class="px-3 py-2 text-left">Rate</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">JNE</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Surabaya</td><td class="px-3 py-2">Road</td><td class="px-3 py-2">0</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rp 12,000</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">JNE</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Surabaya</td><td class="px-3 py-2">Air</td><td class="px-3 py-2">0</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rp 25,000</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Bandung</td><td class="px-3 py-2">Road</td><td class="px-3 py-2">0</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rp 8,000</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SiCepat</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Semarang</td><td class="px-3 py-2">Road</td><td class="px-3 py-2">0</td><td class="px-3 py-2">5</td><td class="px-3 py-2">Rp 10,000</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-customer-master-edit.html
Normal file
167
md-customer-master-edit.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit Customer - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Customer / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit Customer</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit Customer — CUS-001</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" value="CUS-001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Name</span><input type="text" value="PT Retail A" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact</span><input type="text" value="Sari Dewi" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Tax ID</span><input type="text" value="05.678.901.2-345.000" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-2"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Shipping</span><input type="text" value="Jl. Jenderal Sudirman No. 45, Jakarta" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Billing</span><input type="text" value="Jl. Gatot Subroto No. 100, Jakarta" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" value="(021) 555-1001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Email</span><input type="text" value="sari@retaila.com" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option><option>Net 15</option><option>Net 60</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Credit Limit</span><input type="text" value="500,000,000" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-customer-master.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-customer-master-new.html
Normal file
167
md-customer-master-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Customer - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Customer / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Customer</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Customer</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Company Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact Person</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Tax ID</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-2"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Shipping Address</span><input type="text" placeholder="Street, City" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Billing Address</span><input type="text" placeholder="Street, City" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Email</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 15</option><option>Net 30</option><option>Net 60</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Credit Limit</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-customer-master.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-customer-master.html
Normal file
172
md-customer-master.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Customer Master - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Customer</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Customer Master</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-customer-master-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Customer</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Customer List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Active</option><option>Inactive</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Contact</th><th class="px-3 py-2 text-left">Tax ID</th><th class="px-3 py-2 text-left">Credit Limit</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">CUS-001</td><td class="px-3 py-2">PT Retail A</td><td class="px-3 py-2">Sari Dewi</td><td class="px-3 py-2">05.678.901.2-345.000</td><td class="px-3 py-2">Rp 500M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CUS-002</td><td class="px-3 py-2">CV Distributor B</td><td class="px-3 py-2">Rudi Hartono</td><td class="px-3 py-2">06.789.012.3-456.000</td><td class="px-3 py-2">Rp 200M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">CUS-003</td><td class="px-3 py-2">PT Retail C</td><td class="px-3 py-2">Ani Puspita</td><td class="px-3 py-2">07.890.123.4-567.000</td><td class="px-3 py-2">Rp 350M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CUS-004</td><td class="px-3 py-2">Toko Makmur</td><td class="px-3 py-2">Bambang G</td><td class="px-3 py-2">08.901.234.5-678.000</td><td class="px-3 py-2">Rp 75M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-item-category-edit.html
Normal file
167
md-item-category-edit.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit Category - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Categories / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit Category</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit Item Category</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" value="CHEM" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Name</span><input type="text" value="Chemicals" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Group</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Raw Material</option><option>Packaging</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-item-category.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-item-category-new.html
Normal file
167
md-item-category-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Category - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Categories / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Category</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Item Category</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Group</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Raw Material</option><option>Packaging</option><option>Finished Goods</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-item-category.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-item-category.html
Normal file
172
md-item-category.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Item Categories - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Categories</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Item Categories</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Category</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Category List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Group</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">CHEM</td><td class="px-3 py-2">Chemicals</td><td class="px-3 py-2">Raw Material</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PLAS</td><td class="px-3 py-2">Plastics</td><td class="px-3 py-2">Packaging</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">HYGN</td><td class="px-3 py-2">Hygiene</td><td class="px-3 py-2">Finished Goods</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">FURN</td><td class="px-3 py-2">Furniture</td><td class="px-3 py-2">Trading Goods</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-item-group.html
Normal file
172
md-item-group.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Item Groups - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Groups</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Item Groups</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Group</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Group List</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Default Tracking</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">RAW</td><td class="px-3 py-2">Raw Material</td><td class="px-3 py-2">Batch+ED</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PKG</td><td class="px-3 py-2">Packaging</td><td class="px-3 py-2">Qty Only</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">FG</td><td class="px-3 py-2">Finished Goods</td><td class="px-3 py-2">Batch+ED</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">TRD</td><td class="px-3 py-2">Trading Goods</td><td class="px-3 py-2">Qty Only</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">SRV</td><td class="px-3 py-2">Services</td><td class="px-3 py-2">Qty Only</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">AST</td><td class="px-3 py-2">Assets</td><td class="px-3 py-2">Serial</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-item-inspection.html
Normal file
172
md-item-inspection.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Item Inspection Profiles - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Inspection</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Item Inspection Profiles</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Profile</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Inspection Profiles</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Group or category..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Group</th><th class="px-3 py-2 text-left">Category</th><th class="px-3 py-2 text-left">Checklist Items</th><th class="px-3 py-2 text-left">Sampling</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material</td><td class="px-3 py-2">Chemicals</td><td class="px-3 py-2">5</td><td class="px-3 py-2">AQL</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Packaging</td><td class="px-3 py-2">Plastics</td><td class="px-3 py-2">3</td><td class="px-3 py-2">Fixed Sample</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Finished Goods</td><td class="px-3 py-2">Hygiene</td><td class="px-3 py-2">7</td><td class="px-3 py-2">100%</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
195
md-item-master-detail.html
Normal file
195
md-item-master-detail.html
Normal file
@@ -0,0 +1,195 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Item Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Item Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">ITM-RM-000001 — Raw Material Alpha</h2></div><div class="grid grid-cols-2 gap-4 text-sm"><div><span class="text-xs text-[var(--scm-text-muted)]">Barcode</span><p class="font-semibold">8901234567890</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">HS Code</span><p>2905.39</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">ABC Class</span><p><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">A</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Group/Category</span><p>Raw Material / Chemical</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Tracking</span><p>Batch+ED</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Country</span><p>Indonesia</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Dimensions</span><p>50 x 30 x 20 cm</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Weight</span><p>25 kg (gross) / 24 kg (net)</p></div></div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Stock per Warehouse</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Warehouse</th><th class="px-3 py-2 text-left">On Hand</th><th class="px-3 py-2 text-left">Available</th><th class="px-3 py-2 text-left">Reserved</th><th class="px-3 py-2 text-left">Unit Cost</th><th class="px-3 py-2 text-left">Total Value</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">WH Main</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">2,300</td><td class="px-3 py-2">200</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 37.5M</td><td class="px-3 py-2 text-right">Rp 37.5M</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">WH Satellite</td><td class="px-3 py-2">800</td><td class="px-3 py-2">750</td><td class="px-3 py-2">50</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 12.0M</td><td class="px-3 py-2 text-right">Rp 12.0M</td></tr><tr class=""><td class="px-3 py-2">WH Transit</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 0</td><td class="px-3 py-2 text-right">Rp 0</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">UOM Conversions</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Conversion</th><th class="px-3 py-2 text-left">MR UOM</th><th class="px-3 py-2 text-left">Purchase UOM</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">KG</td><td class="px-3 py-2">1 (Base)</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">BAL</td><td class="px-3 py-2">x25</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td></tr><tr class=""><td class="px-3 py-2">BOX</td><td class="px-3 py-2">x5</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Vendor Terms</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Vendor</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Price</th><th class="px-3 py-2 text-left">MOQ</th><th class="px-3 py-2 text-left">Valid</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">100</td><td class="px-3 py-2">31 Dec 2025</td><td class="px-3 py-2 text-right">31 Dec 2025</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">BAL</td><td class="px-3 py-2">Rp 350,000</td><td class="px-3 py-2">5</td><td class="px-3 py-2">30 Jun 2025</td><td class="px-3 py-2 text-right">30 Jun 2025</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Transaction History</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Type</th><th class="px-3 py-2 text-left">Reference</th><th class="px-3 py-2 text-left">In</th><th class="px-3 py-2 text-left">Out</th><th class="px-3 py-2 text-left">Balance</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">01 May 2025</td><td class="px-3 py-2">Goods Receipt</td><td class="px-3 py-2">GRN-2025-0001</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2"></td><td class="px-3 py-2">2,500</td><td class="px-3 py-2 text-right">2,500</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">28 Apr 2025</td><td class="px-3 py-2">Usage</td><td class="px-3 py-2">USG-2025-0042</td><td class="px-3 py-2"></td><td class="px-3 py-2">200</td><td class="px-3 py-2">1,500</td><td class="px-3 py-2 text-right">1,500</td></tr><tr class=""><td class="px-3 py-2">25 Apr 2025</td><td class="px-3 py-2">Transfer</td><td class="px-3 py-2">TRF-2025-0011</td><td class="px-3 py-2"></td><td class="px-3 py-2">300</td><td class="px-3 py-2">1,700</td><td class="px-3 py-2 text-right">1,700</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-item-master-edit.html
Normal file
167
md-item-master-edit.html
Normal file
File diff suppressed because one or more lines are too long
167
md-item-master-new.html
Normal file
167
md-item-master-new.html
Normal file
File diff suppressed because one or more lines are too long
172
md-item-master.html
Normal file
172
md-item-master.html
Normal file
File diff suppressed because one or more lines are too long
167
md-item-uom-edit.html
Normal file
167
md-item-uom-edit.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit UOM Conversion - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / UOM / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit UOM Conversion</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit UOM Conversion</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Item Code</span><input type="text" value="ITM-RM-000001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Item Name</span><input type="text" value="Raw Material Alpha" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Base UOM</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>KG</option><option>PCS</option><option>LTR</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">UOM</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>BAL</option><option>BOX</option><option>CARTON</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Factor</span><input type="text" value="25" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">MR UOM</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Purchase UOM</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>N</option><option>Y</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-item-uom.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-item-uom.html
Normal file
172
md-item-uom.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Item UOM Conversion - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Item / UOM</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Item UOM Conversion</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Conversion</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">UOM Conversions</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Item name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item Code</th><th class="px-3 py-2 text-left">Item Name</th><th class="px-3 py-2 text-left">Base UOM</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Factor</th><th class="px-3 py-2 text-left">MR</th><th class="px-3 py-2 text-left">Purchase</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">BAL</td><td class="px-3 py-2">25</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">N</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">BOX</td><td class="px-3 py-2">5</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">ITM-PKG-000042</td><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">CARTON</td><td class="px-3 py-2">100</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-transport-mode.html
Normal file
172
md-transport-mode.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Transport Modes - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Transport</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Transport Modes</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Transport Modes</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Default Carrier</th><th class="px-3 py-2 text-left">Lead Time</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">AIR</td><td class="px-3 py-2">Air Freight</td><td class="px-3 py-2">Various</td><td class="px-3 py-2">1-3 days</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SEA</td><td class="px-3 py-2">Sea Freight</td><td class="px-3 py-2">Various</td><td class="px-3 py-2">7-21 days</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">ROAD</td><td class="px-3 py-2">Road / Trucking</td><td class="px-3 py-2">Various</td><td class="px-3 py-2">1-5 days</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">RAIL</td><td class="px-3 py-2">Rail Freight</td><td class="px-3 py-2">Various</td><td class="px-3 py-2">3-7 days</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">CPR</td><td class="px-3 py-2">Courier</td><td class="px-3 py-2">JNE</td><td class="px-3 py-2">1-2 days</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-vendor-contract-edit.html
Normal file
167
md-vendor-contract-edit.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit Contract - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / Contracts / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit Contract</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit Contract — CNT-2025-001</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Vendor</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>PT Supplier A</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contract#</span><input type="text" value="CNT-2025-001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Start</span><input type="text" value="01 Jan 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">End</span><input type="text" value="31 Dec 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Value</span><input type="text" value="500,000,000" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" value="Annual supply agreement" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./md-vendor-contract.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-vendor-contract-new.html
Normal file
167
md-vendor-contract-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Contract - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / Contracts / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Contract</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Vendor Contract</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Vendor</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>PT Supplier A</option><option>CV Supplier B</option><option>PT Supplier C</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contract#</span><input type="text" value="CNT-2025-" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Start</span><input type="text" value="01 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">End</span><input type="text" value="31 May 2026" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Value</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option><option>Net 15</option><option>Net 60</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" placeholder="Scope of work..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./md-vendor-contract.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-vendor-contract.html
Normal file
172
md-vendor-contract.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Vendor Contracts - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / Contracts</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Vendor Contracts</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-vendor-contract-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Contract</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Contract List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Number or vendor..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Active</option><option>Expired</option><option>Draft</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Contract#</th><th class="px-3 py-2 text-left">Vendor</th><th class="px-3 py-2 text-left">Start</th><th class="px-3 py-2 text-left">End</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">CNT-2025-001</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">01 Jan 2025</td><td class="px-3 py-2">31 Dec 2025</td><td class="px-3 py-2">Rp 500M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">CNT-2025-002</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">01 Mar 2025</td><td class="px-3 py-2">28 Feb 2026</td><td class="px-3 py-2">Rp 250M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">CNT-2024-015</td><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">01 Jun 2024</td><td class="px-3 py-2">31 May 2025</td><td class="px-3 py-2">Rp 750M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Expiring</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-vendor-item-terms.html
Normal file
172
md-vendor-item-terms.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Vendor Item Terms - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / Item Terms</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Vendor Item Terms</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Terms</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Pricing Terms</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Item or vendor..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Vendor</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>PT Supplier A</option><option>CV Supplier B</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Vendor</th><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Price</th><th class="px-3 py-2 text-left">MOQ</th><th class="px-3 py-2 text-left">Currency</th><th class="px-3 py-2 text-left">Valid</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">100</td><td class="px-3 py-2">IDR</td><td class="px-3 py-2">31 Dec 2025</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">ITM-RM-000001</td><td class="px-3 py-2">BAL</td><td class="px-3 py-2">Rp 350,000</td><td class="px-3 py-2">5</td><td class="px-3 py-2">IDR</td><td class="px-3 py-2">31 Dec 2025</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">ITM-RM-000456</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">Rp 12,500</td><td class="px-3 py-2">200</td><td class="px-3 py-2">IDR</td><td class="px-3 py-2">30 Jun 2025</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-vendor-master-edit.html
Normal file
167
md-vendor-master-edit.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Edit Vendor - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / Edit</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Edit Vendor</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Edit Vendor — VDR-001</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" value="VDR-001" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Company</span><input type="text" value="PT Supplier A" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact</span><input type="text" value="Budi Santoso" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">NPWP</span><input type="text" value="01.234.567.8-901.000" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" value="(021) 555-0101" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Email</span><input type="text" value="budi@suppliera.com" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Address</span><input type="text" value="Jl. Industri Raya No. 10, Jakarta" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option><option>Net 15</option><option>Net 60</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Bank</span><input type="text" value="Bank Mandiri" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Account</span><input type="text" value="123-456-7890" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-vendor-master.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-vendor-master-new.html
Normal file
167
md-vendor-master-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Vendor - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Vendor</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Vendor</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Company Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact Person</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Tax ID (NPWP)</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Email</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Address</span><input type="text" placeholder="Street, City" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment Terms</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 15</option><option>Net 30</option><option>Net 60</option><option>CBD</option><option>COD</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Bank Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Bank Account</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="flex gap-2 pt-2"><a href="./md-vendor-master.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-vendor-master.html
Normal file
172
md-vendor-master.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Vendor / Supplier Master - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Vendor</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Vendor / Supplier Master</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-vendor-master-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Vendor</a><a href="./md-vendor-contract.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Contracts</a><a href="./md-vendor-item-terms.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Item Terms</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Vendor List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Active</option><option>Inactive</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Contact</th><th class="px-3 py-2 text-left">Tax ID (NPWP)</th><th class="px-3 py-2 text-left">Phone</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">VDR-001</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">Budi Santoso</td><td class="px-3 py-2">01.234.567.8-901.000</td><td class="px-3 py-2">(021) 555-0101</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">VDR-002</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">Siti Rahayu</td><td class="px-3 py-2">02.345.678.9-012.000</td><td class="px-3 py-2">(022) 555-0202</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">VDR-003</td><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">Agus Wijaya</td><td class="px-3 py-2">03.456.789.0-123.000</td><td class="px-3 py-2">(031) 555-0303</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">VDR-004</td><td class="px-3 py-2">PT Supplier D</td><td class="px-3 py-2">Dewi Lestari</td><td class="px-3 py-2">04.567.890.1-234.000</td><td class="px-3 py-2">(061) 555-0404</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">N</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-warehouse-bin.html
Normal file
172
md-warehouse-bin.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Bin Locations - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Warehouse / Bins</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Bin Locations</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Bin</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Bin List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Bin code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Zone</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Z-STOR-A</option><option>Z-PICK</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Bin</th><th class="px-3 py-2 text-left">Zone</th><th class="px-3 py-2 text-left">Aisle</th><th class="px-3 py-2 text-left">Rack</th><th class="px-3 py-2 text-left">Level</th><th class="px-3 py-2 text-left">Capacity</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">A-01-01</td><td class="px-3 py-2">Z-STOR-A</td><td class="px-3 py-2">A</td><td class="px-3 py-2">01</td><td class="px-3 py-2">1</td><td class="px-3 py-2">50</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">A-01-02</td><td class="px-3 py-2">Z-STOR-A</td><td class="px-3 py-2">A</td><td class="px-3 py-2">01</td><td class="px-3 py-2">2</td><td class="px-3 py-2">50</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">A-02-01</td><td class="px-3 py-2">Z-STOR-A</td><td class="px-3 py-2">A</td><td class="px-3 py-2">02</td><td class="px-3 py-2">1</td><td class="px-3 py-2">50</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">B-01-01</td><td class="px-3 py-2">Z-STOR-A</td><td class="px-3 py-2">B</td><td class="px-3 py-2">01</td><td class="px-3 py-2">1</td><td class="px-3 py-2">50</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">P-01-01</td><td class="px-3 py-2">Z-PICK</td><td class="px-3 py-2">P</td><td class="px-3 py-2">01</td><td class="px-3 py-2">1</td><td class="px-3 py-2">20</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
md-warehouse-new.html
Normal file
167
md-warehouse-new.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>New Warehouse - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Warehouse / New</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">New Warehouse</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">New Warehouse</h2></div><form class="space-y-3"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Code</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Name</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Type</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Main</option><option>Satellite</option><option>Transit</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Active</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Y</option><option>N</option></select></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Address</span><input type="text" placeholder="Street, City" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Contact</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Phone</span><input type="text" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./md-warehouse.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Save</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-warehouse-zone.html
Normal file
172
md-warehouse-zone.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Warehouse Zones - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Warehouse / Zones</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Warehouse Zones</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Add Zone</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Zone List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Zone or warehouse..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>WH-001</option><option>WH-002</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Warehouse</th><th class="px-3 py-2 text-left">Type</th><th class="px-3 py-2 text-left">Capacity</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Z-RECV</td><td class="px-3 py-2">Receiving</td><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">Receiving</td><td class="px-3 py-2">500 pallets</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Z-STOR-A</td><td class="px-3 py-2">Storage A</td><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">Storage</td><td class="px-3 py-2">2000 pallets</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Z-PICK</td><td class="px-3 py-2">Picking</td><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">Picking</td><td class="px-3 py-2">500 pallets</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Z-SHIP</td><td class="px-3 py-2">Shipping</td><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">Shipping</td><td class="px-3 py-2">300 pallets</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">Z-QUAR</td><td class="px-3 py-2">Quarantine</td><td class="px-3 py-2">WH-001 Main</td><td class="px-3 py-2">Quarantine</td><td class="px-3 py-2">100 pallets</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
md-warehouse.html
Normal file
172
md-warehouse.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Warehouse Master - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Master Data / Warehouse</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Warehouse Master</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./md-warehouse-new.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Add Warehouse</a><a href="./md-warehouse-zone.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Zones</a><a href="./md-warehouse-bin.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Bins</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Warehouse List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Name or code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Type</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Main</option><option>Satellite</option><option>Transit</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Code</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Type</th><th class="px-3 py-2 text-left">Location</th><th class="px-3 py-2 text-left">Contact</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">WH-001</td><td class="px-3 py-2">Main Warehouse</td><td class="px-3 py-2">Main</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">(021) 555-2001</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">WH-002</td><td class="px-3 py-2">Satellite A</td><td class="px-3 py-2">Satellite</td><td class="px-3 py-2">Bandung</td><td class="px-3 py-2">(022) 555-2002</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">WH-003</td><td class="px-3 py-2">Satellite B</td><td class="px-3 py-2">Satellite</td><td class="px-3 py-2">Surabaya</td><td class="px-3 py-2">(031) 555-2003</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">WH-004</td><td class="px-3 py-2">Transit Hub</td><td class="px-3 py-2">Transit</td><td class="px-3 py-2">Semarang</td><td class="px-3 py-2">(024) 555-2004</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
mr-approval.html
Normal file
172
mr-approval.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>MR Approvals - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / MR / Approval</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">MR Approvals</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Approval Queue</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="MR# or branch..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">MR#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Requestor</th><th class="px-3 py-2 text-left">Branch</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Priority</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">MR-2025-0105</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">Dewi Production</td><td class="px-3 py-2">Branch A</td><td class="px-3 py-2">3</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Normal</span></td><td class="px-3 py-2"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-amber-50 px-2 py-1 text-xs font-semibold text-amber-700">Revise</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td><td class="px-3 py-2 text-right"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-amber-50 px-2 py-1 text-xs font-semibold text-amber-700">Revise</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">MR-2025-0102</td><td class="px-3 py-2">20 May</td><td class="px-3 py-2">Sari Warehouse</td><td class="px-3 py-2">Branch A</td><td class="px-3 py-2">8</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Urgent</span></td><td class="px-3 py-2"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td><td class="px-3 py-2 text-right"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
mr-create.html
Normal file
172
mr-create.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Create Material Request - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / MR / Create</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Create Material Request</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Create MR</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Requested By</span><input type="text" value="Dewi Production" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Branch</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Branch A</option><option>Branch B</option><option>HQ</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Required Date</span><input type="text" value="05 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Priority</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Normal</option><option>High</option><option>Urgent</option></select></label></div><h3 class="text-sm font-semibold mb-3">Requested Items</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Req. Qty</th><th class="px-3 py-2 text-left">Available</th><th class="px-3 py-2 text-left">Notes</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">500</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">200</td><td class="px-3 py-2">800</td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Justification</span><input type="text" placeholder="Reason for request..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><div class="flex gap-2 pt-2"><a href="./mr-list.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Save Draft</button><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Submit</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
179
mr-detail.html
Normal file
179
mr-detail.html
Normal file
@@ -0,0 +1,179 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>MR Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / MR / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">MR Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">MR-2025-0105 — Branch A</h2></div><div class="grid grid-cols-3 gap-4 text-sm mb-4"><div><span class="text-xs text-[var(--scm-text-muted)]">Status</span><p><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Requestor</span><p>Dewi Production</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Req. Date</span><p>05 Jun 2025</p></div></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Req. Qty</th><th class="px-3 py-2 text-left">Stock</th><th class="px-3 py-2 text-left">PO Ref</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">500</td><td class="px-3 py-2">2,500</td><td class="px-3 py-2">-</td><td class="px-3 py-2 text-right">-</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">200</td><td class="px-3 py-2">800</td><td class="px-3 py-2">-</td><td class="px-3 py-2 text-right">-</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">2,000</td><td class="px-3 py-2">8,000</td><td class="px-3 py-2">-</td><td class="px-3 py-2 text-right">-</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Approval History</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Approver</th><th class="px-3 py-2 text-left">Action</th><th class="px-3 py-2 text-left">Comment</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">29 May 2025</td><td class="px-3 py-2">John Manager</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
mr-list.html
Normal file
172
mr-list.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Material Request List - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / Material Request</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Material Request List</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./mr-create.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create MR</a><a href="./mr-approval.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Approvals</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Material Requests</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="MR# or requestor..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Draft</option><option>Pending</option><option>Approved</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Branch</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>HQ</option><option>Branch A</option><option>Branch B</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">MR#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Requestor</th><th class="px-3 py-2 text-left">Branch</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Req. Date</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">MR-2025-0105</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">Dewi Production</td><td class="px-3 py-2">Branch A</td><td class="px-3 py-2">3</td><td class="px-3 py-2">05 Jun</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">MR-2025-0104</td><td class="px-3 py-2">27 May</td><td class="px-3 py-2">Rudi QC</td><td class="px-3 py-2">HQ</td><td class="px-3 py-2">5</td><td class="px-3 py-2">10 Jun</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">MR-2025-0103</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">Dewi Production</td><td class="px-3 py-2">Branch B</td><td class="px-3 py-2">2</td><td class="px-3 py-2">01 Jun</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Converted</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">MR-2025-0102</td><td class="px-3 py-2">20 May</td><td class="px-3 py-2">Sari Warehouse</td><td class="px-3 py-2">Branch A</td><td class="px-3 py-2">8</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Draft</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
po-approval.html
Normal file
172
po-approval.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>PO Approvals - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / PO / Approval</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">PO Approvals</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Approval Queue</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="PO# or supplier..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">PO#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Supplier</th><th class="px-3 py-2 text-left">Amount</th><th class="px-3 py-2 text-left">Requested By</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">PO-2025-0041</td><td class="px-3 py-2">27 May</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">Rp 75M</td><td class="px-3 py-2">Budi Purchasing</td><td class="px-3 py-2"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td><td class="px-3 py-2 text-right"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PO-2025-0040</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">Rp 200M</td><td class="px-3 py-2">Ani Procurement</td><td class="px-3 py-2"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td><td class="px-3 py-2 text-right"><div class="flex gap-1"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Approve</button><button class="rounded bg-red-50 px-2 py-1 text-xs font-semibold text-red-700">Reject</button></div></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
po-create.html
Normal file
172
po-create.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Create Purchase Order - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / PO / Create</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Create Purchase Order</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Create PO</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Supplier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>PT Supplier A</option><option>CV Supplier B</option><option>PT Supplier C</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Delivery WH</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>WH-001 Main</option><option>WH-002 Satellite A</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Req. Delivery</span><input type="text" value="15 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option><option>Net 15</option><option>Net 60</option><option>CBD</option></select></label></div><h3 class="text-sm font-semibold mb-3">Line Items</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">Unit Price</th><th class="px-3 py-2 text-left">Total</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 15M</td><td class="px-3 py-2 text-right">Rp 15M</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Rp 12,500</td><td class="px-3 py-2">Rp 6.25M</td><td class="px-3 py-2 text-right">Rp 6.25M</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">Rp 2,500</td><td class="px-3 py-2">Rp 12.5M</td><td class="px-3 py-2 text-right">Rp 12.5M</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="grid grid-cols-1 gap-4 md:grid-cols-2"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" placeholder="Internal notes..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Delivery Instructions</span><input type="text" placeholder="Special handling..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./po-list.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Save Draft</button><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Submit</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
186
po-detail.html
Normal file
186
po-detail.html
Normal file
@@ -0,0 +1,186 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>PO Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / PO / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">PO Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">PO-2025-0042 — PT Supplier A</h2></div><div class="grid grid-cols-3 gap-4 text-sm mb-4"><div><span class="text-xs text-[var(--scm-text-muted)]">Status</span><p><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Delivery</span><p>15 Jun 2025</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Total</span><p class="font-bold">Rp 33,750,000</p></div></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">Price</th><th class="px-3 py-2 text-left">Total</th><th class="px-3 py-2 text-left">Received</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 15M</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Rp 12,500</td><td class="px-3 py-2">Rp 6.25M</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">Rp 2,500</td><td class="px-3 py-2">Rp 12.5M</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Approval History</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Approver</th><th class="px-3 py-2 text-left">Action</th><th class="px-3 py-2 text-left">Comment</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">28 May 2025</td><td class="px-3 py-2">John Manager</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></td><td class="px-3 py-2">Proceed</td><td class="px-3 py-2 text-right">Proceed</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">27 May 2025</td><td class="px-3 py-2">Sara Supervisor</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Related Receipts</h2></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">GRN#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Received By</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">GRN-2025-0015</td><td class="px-3 py-2">30 May 2025</td><td class="px-3 py-2">Warehouse Staff</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
190
po-list.html
Normal file
190
po-list.html
Normal file
@@ -0,0 +1,190 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Purchase Order List - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Procurement / Purchase Order</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Purchase Order List</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./po-create.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create PO</a><a href="./po-approval.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Approvals</a></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-6 mb-6"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Total POs</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">42</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 2.5B</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Draft</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">5</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 120M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Pending</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-warning]">8</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 450M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Approved</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold">12</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 800M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Overdue</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-danger]">3</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 180M</p>
|
||||||
|
</div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm">
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-text-muted)]">Completed</p>
|
||||||
|
<p class="mt-1 text-2xl font-extrabold text-[--scm-success]">14</p><p class="mt-0.5 text-xs text-[var(--scm-text-muted)]">Rp 950M</p>
|
||||||
|
</div></div> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Purchase Orders</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="PO# or supplier..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Draft</option><option>Approved</option><option>Partial</option><option>Completed</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Supplier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>PT Supplier A</option><option>CV Supplier B</option><option>PT Supplier C</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">PO#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Supplier</th><th class="px-3 py-2 text-left">Amount</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Approval</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">PO-2025-0042</td><td class="px-3 py-2">28 May 2025</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">Rp 150M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PO-2025-0041</td><td class="px-3 py-2">27 May 2025</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">Rp 75M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">PO-2025-0040</td><td class="px-3 py-2">25 May 2025</td><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">Rp 200M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Draft</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Draft</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">PO-2025-0039</td><td class="px-3 py-2">20 May 2025</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">Rp 85M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">PO-2025-0038</td><td class="px-3 py-2">15 May 2025</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">Rp 300M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Completed</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Approved</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
qc-inspection-plan.html
Normal file
172
qc-inspection-plan.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Inspection Plans - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Quality / Plans</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Inspection Plans</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create Plan</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Inspection Plans</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Plan code..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Group</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Raw Material</option><option>Packaging</option><option>Finished Goods</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Plan</th><th class="px-3 py-2 text-left">Name</th><th class="px-3 py-2 text-left">Group</th><th class="px-3 py-2 text-left">Category</th><th class="px-3 py-2 text-left">Checklist</th><th class="px-3 py-2 text-left">Sampling</th><th class="px-3 py-2 text-left">Active</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">IP-RAW-001</td><td class="px-3 py-2">RM Chemical Inspection</td><td class="px-3 py-2">Raw Material</td><td class="px-3 py-2">Chemical</td><td class="px-3 py-2">7</td><td class="px-3 py-2">AQL</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">IP-PKG-001</td><td class="px-3 py-2">Packaging Plastic</td><td class="px-3 py-2">Packaging</td><td class="px-3 py-2">Plastic</td><td class="px-3 py-2">4</td><td class="px-3 py-2">Fixed</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr><tr class=""><td class="px-3 py-2">IP-FG-001</td><td class="px-3 py-2">FG Hygiene</td><td class="px-3 py-2">Finished Goods</td><td class="px-3 py-2">Hygiene</td><td class="px-3 py-2">10</td><td class="px-3 py-2">100%</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Y</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
qc-inspection-record.html
Normal file
172
qc-inspection-record.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Inspection Records - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Quality / Records</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Inspection Records</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">New Record</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Records</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Record#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Result</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Pass</option><option>Fail</option><option>Pending</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Record#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Inspector</th><th class="px-3 py-2 text-left">Reference</th><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Score</th><th class="px-3 py-2 text-left">Result</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">IR-2025-0042</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">Rudi QC</td><td class="px-3 py-2">GRN-0042</td><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">95%</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">IR-2025-0041</td><td class="px-3 py-2">29 May</td><td class="px-3 py-2">Sari QC</td><td class="px-3 py-2">GRN-0041</td><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">88%</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=""><td class="px-3 py-2">IR-2025-0040</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">Rudi QC</td><td class="px-3 py-2">GRN-0040</td><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">65%</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">FAIL</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">FAIL</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
qc-nonconformance.html
Normal file
172
qc-nonconformance.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Non-Conformance Reports - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Quality / NCR</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Non-Conformance Reports</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><button class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create NCR</button></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">NCR List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="NCR#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Severity</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Critical</option><option>Major</option><option>Minor</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">NCR#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Source</th><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">Defect</th><th class="px-3 py-2 text-left">Severity</th><th class="px-3 py-2 text-left">Disposition</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">NCR-2025-0008</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">IR-0042</td><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">Moisture exceeds spec</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Major</span></td><td class="px-3 py-2">Return</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Open</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Open</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">NCR-2025-0007</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">IR-0040</td><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">Label misprint</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Minor</span></td><td class="px-3 py-2">Rework</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Progress</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Progress</span></td></tr><tr class=""><td class="px-3 py-2">NCR-2025-0006</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">IR-0038</td><td class="px-3 py-2">Hand Sanitizer</td><td class="px-3 py-2">pH out of range</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Critical</span></td><td class="px-3 py-2">Return</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Closed</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Closed</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
rcv-create.html
Normal file
172
rcv-create.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Record Goods Receipt - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Receiving / Create</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Record Goods Receipt</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Record Goods Receipt</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">PO</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>PO-2025-0040 - PT Supplier A</option><option>PO-2025-0039 - CV Supplier B</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Supplier</span><input type="text" value="PT Supplier A" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Delivery Date</span><input type="text" value="30 May 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">DN#</span><input type="text" value="DN-2025-088" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Warehouse</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>WH-001 Main</option><option>WH-002 Satellite A</option></select></label></div><h3 class="text-sm font-semibold mb-3">Received Items</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">PO Qty</th><th class="px-3 py-2 text-left">Received</th><th class="px-3 py-2 text-left">Accepted</th><th class="px-3 py-2 text-left">Rejected</th><th class="px-3 py-2 text-left">Lot/Serial</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">980</td><td class="px-3 py-2">20</td><td class="px-3 py-2">LOT-2025-042</td><td class="px-3 py-2 text-right">LOT-2025-042</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">KG</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">0</td><td class="px-3 py-2">LOT-2025-043</td><td class="px-3 py-2 text-right">LOT-2025-043</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">4,800</td><td class="px-3 py-2">4,750</td><td class="px-3 py-2">50</td><td class="px-3 py-2"></td><td class="px-3 py-2 text-right"></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><div class="flex gap-2 pt-2"><a href="./rcv-list.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Save Draft</button><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Post Receipt</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
rcv-detail.html
Normal file
172
rcv-detail.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Receipt Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Receiving / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Receipt Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">GRN-2025-0042 — PO-2025-0040</h2></div><div class="grid grid-cols-3 gap-4 text-sm mb-4"><div><span class="text-xs text-[var(--scm-text-muted)]">Supplier</span><p>PT Supplier A</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Status</span><p><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pend. Insp.</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Date</span><p>30 May 2025</p></div></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">PO Qty</th><th class="px-3 py-2 text-left">Recv.</th><th class="px-3 py-2 text-left">Accept</th><th class="px-3 py-2 text-left">Reject</th><th class="px-3 py-2 text-left">Lot/Serial</th><th class="px-3 py-2 text-left">Bin</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Raw Material Alpha</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">1,000</td><td class="px-3 py-2">980</td><td class="px-3 py-2">20</td><td class="px-3 py-2">LOT-2025-042</td><td class="px-3 py-2">A-01-01</td><td class="px-3 py-2 text-right">A-01-01</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Raw Material Beta</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">500</td><td class="px-3 py-2">0</td><td class="px-3 py-2">LOT-2025-043</td><td class="px-3 py-2">A-02-01</td><td class="px-3 py-2 text-right">A-02-01</td></tr><tr class=""><td class="px-3 py-2">Bottle HDPE</td><td class="px-3 py-2">5,000</td><td class="px-3 py-2">4,800</td><td class="px-3 py-2">4,750</td><td class="px-3 py-2">50</td><td class="px-3 py-2"></td><td class="px-3 py-2">B-01-01</td><td class="px-3 py-2 text-right">B-01-01</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
179
rcv-inspection.html
Normal file
179
rcv-inspection.html
Normal file
@@ -0,0 +1,179 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Receipt Inspection - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Receiving / Inspection</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Receipt Inspection</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 lg:grid-cols-2"> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Inspection Queue</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="GRN#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Result</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Pending</option><option>Passed</option><option>Failed</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">GRN#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Supplier</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">GRN-2025-0042</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">3</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"><a href="./rcv-detail.html" class="text-xs font-semibold text-[var(--scm-primary)] hover:underline">Inspect</a></td><td class="px-3 py-2 text-right"><a href="./rcv-detail.html" class="text-xs font-semibold text-[var(--scm-primary)] hover:underline">Inspect</a></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">GRN-2025-0038</td><td class="px-3 py-2">22 May</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">2</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2"><a href="./rcv-detail.html" class="text-xs font-semibold text-[var(--scm-primary)] hover:underline">Inspect</a></td><td class="px-3 py-2 text-right"><a href="./rcv-detail.html" class="text-xs font-semibold text-[var(--scm-primary)] hover:underline">Inspect</a></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article> <article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Inspection Checklist — Raw Material Alpha (GRN-2025-0042)</h2></div><div class="flex gap-2 mb-4"><button class="rounded bg-green-50 px-3 py-1 text-xs font-semibold text-green-700">Accept All</button><button class="rounded bg-red-50 px-3 py-1 text-xs font-semibold text-red-700">Create NCR</button></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Checkpoint</th><th class="px-3 py-2 text-left">Specification</th><th class="px-3 py-2 text-left">Actual</th><th class="px-3 py-2 text-left">Result</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Visual Appearance</td><td class="px-3 py-2">Clear, no impurities</td><td class="px-3 py-2">Pass</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Packaging Integrity</td><td class="px-3 py-2">Sealed, no damage</td><td class="px-3 py-2">Pass</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=""><td class="px-3 py-2">Weight per Unit</td><td class="px-3 py-2">25 kg ± 0.5</td><td class="px-3 py-2">25.2 kg</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Label Accuracy</td><td class="px-3 py-2">Matches PO</td><td class="px-3 py-2">Matches</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=""><td class="px-3 py-2">Expiry Date</td><td class="px-3 py-2">> 12 months</td><td class="px-3 py-2">18 months</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Sample Quantity</td><td class="px-3 py-2">Per AQL II</td><td class="px-3 py-2">OK</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">PASS</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
rcv-list.html
Normal file
172
rcv-list.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Goods Receipt List - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Receiving</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Goods Receipt List</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./rcv-create.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Record Receipt</a><a href="./rcv-inspection.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Inspections</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Goods Receipts</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="GRN# or PO..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Pending</option><option>Accepted</option><option>Rejected</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Supplier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>PT Supplier A</option><option>CV Supplier B</option><option>PT Supplier C</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">GRN#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Supplier</th><th class="px-3 py-2 text-left">PO Ref</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Inspection</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">GRN-2025-0042</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">PO-2025-0040</td><td class="px-3 py-2">3</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pend. Insp.</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pend</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">GRN-2025-0041</td><td class="px-3 py-2">29 May</td><td class="px-3 py-2">CV Supplier B</td><td class="px-3 py-2">PO-2025-0039</td><td class="px-3 py-2">2</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Accepted</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Pass</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">GRN-2025-0040</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">PT Supplier C</td><td class="px-3 py-2">PO-2025-0038</td><td class="px-3 py-2">5</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">GRN-2025-0039</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">PT Supplier A</td><td class="px-3 py-2">PO-2025-0037</td><td class="px-3 py-2">1</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Rejected</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Fail</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
165
rp-inventory.html
Normal file
165
rp-inventory.html
Normal file
@@ -0,0 +1,165 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Inventory Reports - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Reports / Inventory</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Inventory Reports</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Stock Balance</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Current stock by item/warehouse</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Movement Summary</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Transaction log summary</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Stock Aging</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Inventory by age bracket</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">ABC Analysis</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">ABC classification breakdown</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Slow Moving</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Items with low turnover</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Stock Valuation</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Total inventory value</p></div></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
165
rp-logistics.html
Normal file
165
rp-logistics.html
Normal file
@@ -0,0 +1,165 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Logistics Reports - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Reports / Logistics</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Logistics Reports</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Shipment Summary</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Shipping overview</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Carrier Performance</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">OTIF comparison</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">On-Time Delivery</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Performance trend</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Freight Cost</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Carrier costs</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Transit Time</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Avg transit analysis</p></div></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
165
rp-procurement.html
Normal file
165
rp-procurement.html
Normal file
@@ -0,0 +1,165 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Procurement Reports - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Reports / Procurement</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Procurement Reports</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">PO Summary</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Purchase order overview</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Supplier Performance</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">OTIF and quality metrics</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Delivery Performance</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">On-time analysis</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Spend by Supplier</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Supplier spending</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Spend by Category</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Category-wise spend</p></div></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
165
rp-sales.html
Normal file
165
rp-sales.html
Normal file
@@ -0,0 +1,165 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Sales Reports - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Reports / Sales</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Sales Reports</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3"> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Sales Summary</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Revenue overview</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Sales by Customer</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Cust. analysis</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Sales by Item</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Top sellers</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Sales by Category</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Category perf.</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Fulfillment Rate</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Order fulfillment</p></div> <div class="rounded-xl border border-[var(--scm-border)] bg-white p-4 shadow-sm"><p class="text-sm font-semibold text-[var(--scm-text)]">Revenue Trend</p><p class="mt-1 text-xs text-[var(--scm-text-muted)]">Monthly trend</p></div></div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
167
ship-create.html
Normal file
167
ship-create.html
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Create Shipment - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Logistics / Create</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Create Shipment</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Create Shipment</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Carrier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>JNE</option><option>Tiki</option><option>SiCepat</option><option>Pos Indonesia</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Mode</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Air</option><option>Sea</option><option>Road</option><option>Rail</option><option>Courier</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Pick-up</span><input type="text" value="31 May 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">ETA</span><input type="text" value="02 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-2"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Origin</span><input type="text" value="Jakarta" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Destination</span><input type="text" value="Surabaya" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="grid grid-cols-1 gap-4 md:grid-cols-3"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Packages</span><input type="text" value="5" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Weight (kg)</span><input type="text" value="50" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Volume (m³)</span><input type="text" value="2.5" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="flex gap-2 pt-2"><a href="./ship-list.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create Shipment</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ship-delivery.html
Normal file
172
ship-delivery.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Delivery Confirmation - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Logistics / Delivery</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Delivery Confirmation</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Delivery Confirmation</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Tracking#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Tracking#</th><th class="px-3 py-2 text-left">Shipment#</th><th class="px-3 py-2 text-left">Carrier</th><th class="px-3 py-2 text-left">ETA</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">JNE-2025-042</td><td class="px-3 py-2">SHP-2025-0035</td><td class="px-3 py-2">JNE</td><td class="px-3 py-2">02 Jun</td><td class="px-3 py-2"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Confirm</button></td><td class="px-3 py-2 text-right"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Confirm</button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">TKI-2025-028</td><td class="px-3 py-2">SHP-2025-0033</td><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">31 May</td><td class="px-3 py-2"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Confirm</button></td><td class="px-3 py-2 text-right"><button class="rounded bg-green-50 px-2 py-1 text-xs font-semibold text-green-700">Confirm</button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ship-detail.html
Normal file
172
ship-detail.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Shipment Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Logistics / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Shipment Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">SHP-2025-0035 — JNE</h2></div><div class="grid grid-cols-3 gap-4 text-sm mb-4"><div><span class="text-xs text-[var(--scm-text-muted)]">Tracking</span><p class="font-mono">JNE-2025-042</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Status</span><p><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Route</span><p>Jakarta → Surabaya</p></div></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Package</th><th class="px-3 py-2 text-left">Weight</th><th class="px-3 py-2 text-left">Dimensions</th><th class="px-3 py-2 text-left">Contents</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">001</td><td class="px-3 py-2">10 kg</td><td class="px-3 py-2">30x20x15 cm</td><td class="px-3 py-2">Hand Sanitizer 500ml x 100</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">002</td><td class="px-3 py-2">10 kg</td><td class="px-3 py-2">30x20x15 cm</td><td class="px-3 py-2">Hand Sanitizer 500ml x 100</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td></tr><tr class=""><td class="px-3 py-2">003</td><td class="px-3 py-2">10 kg</td><td class="px-3 py-2">30x20x15 cm</td><td class="px-3 py-2">Hand Sanitizer 500ml x 100</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ship-list.html
Normal file
172
ship-list.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Shipment List - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Logistics / Shipment</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Shipment List</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./ship-create.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create Shipment</a><a href="./ship-tracking.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Tracking</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Shipments</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Tracking# or carrier..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Pending</option><option>In Transit</option><option>Delivered</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Shipment#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Carrier</th><th class="px-3 py-2 text-left">Tracking#</th><th class="px-3 py-2 text-left">Origin</th><th class="px-3 py-2 text-left">Dest.</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">ETA</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">SHP-2025-0035</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">JNE</td><td class="px-3 py-2">JNE-2025-042</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Surabaya</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2">02 Jun</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SHP-2025-0034</td><td class="px-3 py-2">29 May</td><td class="px-3 py-2">SiCepat</td><td class="px-3 py-2">SCP-2025-031</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Bandung</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Delivered</span></td><td class="px-3 py-2">30 May</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">SHP-2025-0033</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">TKI-2025-028</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Semarang</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2">31 May</td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
ship-tracking.html
Normal file
172
ship-tracking.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Shipment Tracking - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Logistics / Tracking</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Shipment Tracking</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Tracking</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Tracking#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Carrier</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>JNE</option><option>Tiki</option><option>SiCepat</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Tracking#</th><th class="px-3 py-2 text-left">Carrier</th><th class="px-3 py-2 text-left">Origin</th><th class="px-3 py-2 text-left">Dest.</th><th class="px-3 py-2 text-left">Last Update</th><th class="px-3 py-2 text-left">Location</th><th class="px-3 py-2 text-left">ETA</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">JNE-2025-042</td><td class="px-3 py-2">JNE</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Surabaya</td><td class="px-3 py-2">01 Jun 08:00</td><td class="px-3 py-2">Transit Hub Semarang</td><td class="px-3 py-2">02 Jun</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">In Transit</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SCP-2025-031</td><td class="px-3 py-2">SiCepat</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Bandung</td><td class="px-3 py-2">30 May 14:30</td><td class="px-3 py-2">Destination WH</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Delivered</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Delivered</span></td></tr><tr class=""><td class="px-3 py-2">TKI-2025-028</td><td class="px-3 py-2">Tiki</td><td class="px-3 py-2">Jakarta</td><td class="px-3 py-2">Semarang</td><td class="px-3 py-2">29 May 10:00</td><td class="px-3 py-2">Origin WH</td><td class="px-3 py-2">31 May</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
so-create.html
Normal file
172
so-create.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Create Sales Order - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Sales / SO / Create</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Create Sales Order</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Create SO</h2></div><form class="space-y-4"><div class="grid grid-cols-1 gap-4 md:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Customer</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>PT Retail A</option><option>CV Distributor B</option><option>Toko Makmur</option></select></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Shipping</span><input type="text" value="Jl. Jenderal Sudirman No. 45, Jakarta" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Req. Delivery</span><input type="text" value="10 Jun 2025" class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>Net 30</option><option>Net 15</option><option>Net 60</option><option>COD</option></select></label></div><h3 class="text-sm font-semibold mb-3">Line Items</h3><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">Price</th><th class="px-3 py-2 text-left">Discount</th><th class="px-3 py-2 text-left">Total</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Hand Sanitizer 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">0%</td><td class="px-3 py-2">Rp 7.5M</td><td class="px-3 py-2 text-right">Rp 7.5M</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Liquid Soap 1L</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">300</td><td class="px-3 py-2">Rp 25,000</td><td class="px-3 py-2">5%</td><td class="px-3 py-2">Rp 7.125M</td><td class="px-3 py-2 text-right">Rp 7.125M</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Notes</span><input type="text" placeholder="Special instructions..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><div class="flex gap-2 pt-2"><a href="./so-list.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-4 py-2 text-sm font-semibold">Cancel</a><button class="rounded-lg bg-[var(--scm-primary)] px-4 py-2 text-sm font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create SO</button></div></form>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
so-detail.html
Normal file
172
so-detail.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>SO Detail - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Sales / SO / Detail</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">SO Detail</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">SO-2025-0085 — PT Retail A</h2></div><div class="grid grid-cols-3 gap-4 text-sm mb-4"><div><span class="text-xs text-[var(--scm-text-muted)]">Status</span><p><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Confirmed</span></p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Value</span><p class="font-bold">Rp 45,000,000</p></div><div><span class="text-xs text-[var(--scm-text-muted)]">Delivery</span><p>10 Jun 2025</p></div></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Item</th><th class="px-3 py-2 text-left">UOM</th><th class="px-3 py-2 text-left">Qty</th><th class="px-3 py-2 text-left">Price</th><th class="px-3 py-2 text-left">Total</th><th class="px-3 py-2 text-left">Fulfilled</th><th class="px-3 py-2 text-left">Shipped</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">Hand Sanitizer 500ml</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">500</td><td class="px-3 py-2">Rp 15,000</td><td class="px-3 py-2">Rp 7.5M</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">Liquid Soap 1L</td><td class="px-3 py-2">PCS</td><td class="px-3 py-2">300</td><td class="px-3 py-2">Rp 25,000</td><td class="px-3 py-2">Rp 7.125M</td><td class="px-3 py-2">0</td><td class="px-3 py-2">0</td><td class="px-3 py-2 text-right">0</td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
so-fulfillment.html
Normal file
172
so-fulfillment.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Order Fulfillment - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Sales / Fulfillment</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Order Fulfillment</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Fulfillment Queue</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="SO#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">SO#</th><th class="px-3 py-2 text-left">Customer</th><th class="px-3 py-2 text-left">Items</th><th class="px-3 py-2 text-left">Priority</th><th class="px-3 py-2 text-left">Stock</th><th class="px-3 py-2 text-left">Action</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">SO-2025-0085</td><td class="px-3 py-2">PT Retail A</td><td class="px-3 py-2">2</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Normal</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Available</span></td><td class="px-3 py-2"><button class="rounded border border-[var(--scm-border)] bg-white px-2 py-1 text-xs font-semibold">Pick List</button></td><td class="px-3 py-2 text-right"><button class="rounded border border-[var(--scm-border)] bg-white px-2 py-1 text-xs font-semibold">Pick List</button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SO-2025-0084</td><td class="px-3 py-2">CV Distributor B</td><td class="px-3 py-2">3</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-red-50 text-red-700 px-2 py-0.5 text-xs font-semibold">Urgent</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2"><button class="rounded border border-[var(--scm-border)] bg-white px-2 py-1 text-xs font-semibold">Pick List</button></td><td class="px-3 py-2 text-right"><button class="rounded border border-[var(--scm-border)] bg-white px-2 py-1 text-xs font-semibold">Pick List</button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
so-invoice.html
Normal file
172
so-invoice.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Sales Invoices - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Sales / Invoice</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Sales Invoices</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Invoice List</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="Inv#..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Payment</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Unpaid</option><option>Partial</option><option>Paid</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">Invoice#</th><th class="px-3 py-2 text-left">SO#</th><th class="px-3 py-2 text-left">Customer</th><th class="px-3 py-2 text-left">Inv. Date</th><th class="px-3 py-2 text-left">Due</th><th class="px-3 py-2 text-left">Amount</th><th class="px-3 py-2 text-left">Tax</th><th class="px-3 py-2 text-left">Total</th><th class="px-3 py-2 text-left">Status</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">INV-2025-0042</td><td class="px-3 py-2">SO-0082</td><td class="px-3 py-2">Toko Makmur</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">27 Jun</td><td class="px-3 py-2">Rp 12M</td><td class="px-3 py-2">Rp 1.2M</td><td class="px-3 py-2">Rp 13.2M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Unpaid</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Unpaid</span></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">INV-2025-0041</td><td class="px-3 py-2">SO-0081</td><td class="px-3 py-2">PT Retail A</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">24 Jun</td><td class="px-3 py-2">Rp 25M</td><td class="px-3 py-2">Rp 2.5M</td><td class="px-3 py-2">Rp 27.5M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Paid</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Paid</span></td></tr><tr class=""><td class="px-3 py-2">INV-2025-0040</td><td class="px-3 py-2">SO-0080</td><td class="px-3 py-2">CV Dist. B</td><td class="px-3 py-2">20 May</td><td class="px-3 py-2">19 Jun</td><td class="px-3 py-2">Rp 18M</td><td class="px-3 py-2">Rp 1.8M</td><td class="px-3 py-2">Rp 19.8M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2 text-right"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
172
so-list.html
Normal file
172
so-list.html
Normal file
@@ -0,0 +1,172 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="id">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>Sales Order List - SCM</title>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/image/favicon-32x32.png" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<style>:root {
|
||||||
|
--scm-primary: #5699DA;
|
||||||
|
--scm-primary-dark: #417DB8;
|
||||||
|
--scm-primary-light: #80B9EC;
|
||||||
|
--scm-primary-bg: #EBF3F9;
|
||||||
|
--scm-surface: #FFFFFF;
|
||||||
|
--scm-bg: #F1F5F9;
|
||||||
|
--scm-border: #E2E8F0;
|
||||||
|
--scm-border-light: #F1F5F9;
|
||||||
|
--scm-accent: #0EA5E9;
|
||||||
|
--scm-success: #059669;
|
||||||
|
--scm-danger: #DC2626;
|
||||||
|
--scm-warning: #D97706;
|
||||||
|
--scm-text: #0F172A;
|
||||||
|
--scm-text-muted: #64748B;
|
||||||
|
}</style>
|
||||||
|
</head>
|
||||||
|
<body class="min-h-screen bg-[var(--scm-bg)] font-['Inter'] text-[var(--scm-text)]">
|
||||||
|
<div class="flex min-h-screen">
|
||||||
|
<aside class="flex w-60 shrink-0 flex-col bg-[var(--scm-primary)] text-white lg:w-64">
|
||||||
|
<div class="px-5 py-6">
|
||||||
|
<span class="text-lg font-extrabold tracking-tight">SCM</span>
|
||||||
|
<p class="mt-0.5 text-xs text-white/60">Supply Chain Management</p>
|
||||||
|
</div>
|
||||||
|
<div class="mb-4 mx-4 rounded-xl bg-white/10 px-3 py-3">
|
||||||
|
<p class="text-sm font-bold">Supply Chain Admin</p>
|
||||||
|
<p class="text-xs text-white/60">PT SCM Group — HQ</p>
|
||||||
|
<a href="./login.html" class="mt-2 block rounded-lg bg-white/15 px-3 py-1.5 text-center text-xs font-semibold text-white hover:bg-white/25">Logout</a>
|
||||||
|
</div>
|
||||||
|
<nav class="flex-1 space-y-0.5 overflow-y-auto px-2 text-sm">
|
||||||
|
<p class="mb-1 px-3 text-[10px] font-semibold uppercase tracking-[0.14em] text-white/40">Main Menu</p>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Dashboard</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dash-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Executive Overview</a>
|
||||||
|
<a href="./dash-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./dash-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./dash-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
<a href="./dash-demand.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Demand</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Master Data</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./md-item-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Item</a>
|
||||||
|
<a href="./md-vendor-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Vendor/Supplier</a>
|
||||||
|
<a href="./md-customer-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Customer</a>
|
||||||
|
<a href="./md-carrier-master.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Carrier</a>
|
||||||
|
<a href="./md-warehouse.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Warehouse</a>
|
||||||
|
<a href="./md-bom.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">BOM</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Procurement</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./po-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Purchase Order</a>
|
||||||
|
<a href="./mr-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Material Request</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Receiving</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rcv-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Goods Receipt</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Inventory</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./inv-stock-overview.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Stock Overview</a>
|
||||||
|
<a href="./inv-stock-movement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Movement</a>
|
||||||
|
<a href="./inv-stock-transfer.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Transfer</a>
|
||||||
|
<a href="./inv-stock-adjustment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Adjustment</a>
|
||||||
|
<a href="./inv-stock-count.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Count</a>
|
||||||
|
<a href="./inv-usage.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Usage</a>
|
||||||
|
<a href="./inv-disposal.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Disposal</a>
|
||||||
|
<a href="./inv-aging.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Aging</a>
|
||||||
|
<a href="./inv-reorder.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Reorder</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold bg-white/15 text-white">Sales</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./so-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs bg-white/20 font-bold text-white">Sales Order</a>
|
||||||
|
<a href="./so-invoice.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Invoice</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Logistics</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ship-list.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Shipment</a>
|
||||||
|
<a href="./ship-tracking.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Tracking</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Quality</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./qc-inspection-plan.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Plan</a>
|
||||||
|
<a href="./qc-inspection-record.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inspection Record</a>
|
||||||
|
<a href="./qc-nonconformance.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Non-Conformance</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Planning</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./dp-forecast.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Forecast</a>
|
||||||
|
<a href="./dp-replenishment.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Replenishment</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Admin</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./ad-user-management.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Users</a>
|
||||||
|
<a href="./ad-role-permission.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Roles</a>
|
||||||
|
<a href="./ad-approval-matrix.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Approval</a>
|
||||||
|
<a href="./ad-numbering-profile.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Numbering</a>
|
||||||
|
<a href="./ad-audit-log.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="rounded-lg px-3 py-1.5 font-semibold text-white/75 hover:bg-white/10 hover:text-white">Reports</p>
|
||||||
|
<div class="ml-3 mt-0.5 space-y-0.5 border-l border-white/10">
|
||||||
|
<a href="./rp-inventory.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Inventory</a>
|
||||||
|
<a href="./rp-procurement.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Procurement</a>
|
||||||
|
<a href="./rp-sales.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Sales</a>
|
||||||
|
<a href="./rp-logistics.html" class="block rounded-r-lg py-1.5 pl-3 pr-2 text-xs text-white/65 hover:bg-white/10 hover:text-white">Logistics</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
<div class="flex min-w-0 flex-1 flex-col">
|
||||||
|
<header class="border-b border-[var(--scm-border)] bg-white px-4 py-3 lg:px-8">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<button class="h-9 w-9 rounded-lg text-[var(--scm-text)] hover:bg-[var(--scm-bg)] lg:hidden" aria-label="Menu">
|
||||||
|
<svg viewBox="0 0 24 24" class="h-5 w-5 mx-auto" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 7h16M4 12h16M4 17h16" stroke-linecap="round"/></svg>
|
||||||
|
</button>
|
||||||
|
<span class="text-lg font-extrabold tracking-tight text-[var(--scm-primary)]">SCM</span>
|
||||||
|
<span class="hidden text-xs font-semibold text-[var(--scm-text-muted)] sm:inline">Supply Chain Management</span>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="flex-1 p-4 lg:p-8">
|
||||||
|
<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
|
||||||
|
<div>
|
||||||
|
<p class="text-xs font-semibold uppercase tracking-wider text-[var(--scm-primary)]">Sales / Sales Order</p>
|
||||||
|
<h1 class="text-xl font-extrabold text-[var(--scm-text)]">Sales Order List</h1>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap gap-2"><a href="./so-create.html" class="rounded-lg bg-[var(--scm-primary)] px-3 py-1.5 text-xs font-semibold text-white hover:bg-[var(--scm-primary-dark)]">Create SO</a><a href="./so-invoice.html" class="rounded-lg border border-[var(--scm-border)] bg-white px-3 py-1.5 text-xs font-semibold text-[var(--scm-text)] hover:bg-[var(--scm-bg)]">Invoices</a></div>
|
||||||
|
</div>
|
||||||
|
<article class="rounded-xl border border-[var(--scm-border)] bg-white p-5 shadow-sm">
|
||||||
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-4"><h2 class="text-base font-bold">Sales Orders</h2></div><div class="mb-4 grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4"><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Search</span><input type="text" placeholder="SO# or customer..." class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30" /></label><label class="space-y-1"><span class="text-xs font-semibold text-[var(--scm-text-muted)]">Status</span><select class="w-full rounded-lg border border-[var(--scm-border)] bg-white px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-[var(--scm-primary-light)]/30"><option>All</option><option>Draft</option><option>Confirmed</option><option>Picking</option><option>Shipped</option><option>Invoiced</option></select></label></div><div class="overflow-x-auto">
|
||||||
|
<table class="min-w-full text-sm">
|
||||||
|
<thead class="border-b border-[var(--scm-border)] bg-[var(--scm-bg)]/60 text-xs uppercase tracking-wider text-[var(--scm-text-muted)]"><tr><th class="px-3 py-2 text-left">SO#</th><th class="px-3 py-2 text-left">Date</th><th class="px-3 py-2 text-left">Customer</th><th class="px-3 py-2 text-left">Value</th><th class="px-3 py-2 text-left">Status</th><th class="px-3 py-2 text-left">Fulfillment</th><th class="w-12 px-3 py-2 text-right"></th></tr></thead>
|
||||||
|
<tbody class="divide-y divide-[var(--scm-border)]"><tr class=""><td class="px-3 py-2">SO-2025-0085</td><td class="px-3 py-2">30 May</td><td class="px-3 py-2">PT Retail A</td><td class="px-3 py-2">Rp 45M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Confirmed</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Pending</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SO-2025-0084</td><td class="px-3 py-2">29 May</td><td class="px-3 py-2">CV Distributor B</td><td class="px-3 py-2">Rp 25M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Picking</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-amber-50 text-amber-700 px-2 py-0.5 text-xs font-semibold">Partial</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=""><td class="px-3 py-2">SO-2025-0083</td><td class="px-3 py-2">28 May</td><td class="px-3 py-2">PT Retail A</td><td class="px-3 py-2">Rp 60M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Shipped</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Shipped</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr><tr class=" bg-[var(--scm-bg)]/60"><td class="px-3 py-2">SO-2025-0082</td><td class="px-3 py-2">25 May</td><td class="px-3 py-2">Toko Makmur</td><td class="px-3 py-2">Rp 12M</td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Invoiced</span></td><td class="px-3 py-2"><span class="inline-flex rounded-full bg-blue-50 text-blue-700 px-2 py-0.5 text-xs font-semibold">Completed</span></td><td class="px-3 py-2 text-right"><button class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-[var(--scm-border)] text-[var(--scm-text-muted)] hover:bg-[var(--scm-bg)] hover:text-[var(--scm-text)]"><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M4 20h4l10-10a1.8 1.8 0 0 0 0-2.6l-1.4-1.4a1.8 1.8 0 0 0-2.6 0L4 16v4Z"/><path d="m12.5 6.5 5 5"/></svg></button></td></tr></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a id="overlay-back-home" href="./index.html" class="fixed bottom-4 right-4 z-[9999] rounded-full border border-[var(--scm-border)] bg-white px-4 py-2 text-xs font-semibold text-[var(--scm-text-muted)] shadow-lg hover:bg-[var(--scm-bg)]">Back to Home</a>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user