Initial commit

2026-05-25 08:22:12 +07:00
commit a152c99cce
154 changed files with 39033 additions and 0 deletions
--- a/ui/hub.html
+++ b/ui/hub.html
@ -0,0 +1,92 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>QRIS Soundbox UI Hub</title>
+    <style>
+      :root{--bg:#f8fafc;--text:#0f172a;--line:#e2e8f0;--accent:#2563eb;--muted:#64748b;}
+      body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}
+      header{position:sticky;top:0;z-index:2;padding:14px 20px;border-bottom:1px solid var(--line);background:white;display:flex;gap:12px;align-items:center}
+      header h1{margin:0;font-size:18px}
+      .pill{font-size:12px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:white;color:var(--text);text-decoration:none}
+      .layout{display:grid;grid-template-columns:260px 1fr;height:calc(100vh - 58px)}
+      nav{padding:16px;border-right:1px solid var(--line);background:#fff;overflow:auto}
+      nav a{display:block;padding:8px 10px;border-radius:8px;color:var(--text);text-decoration:none;margin-bottom:6px}
+      nav a.active{background:#e0ecff;color:var(--accent);font-weight:600}
+      nav a:hover{background:#eef2ff}
+      iframe{width:100%;height:100%;border:0;background:white}
+      .hint{font-size:12px;color:var(--muted);margin:0 0 12px}
+      .small{font-size:12px}
+    </style>
+  </head>
+  <body>
+    <header>
+      <h1>QRIS Soundbox UI Hub</h1>
+      <a class="pill" href="/ui">Kembali ke Katalog</a>
+      <span class="small" id="current"></span>
+    </header>
+    <div class="layout">
+      <nav id="menu"></nav>
+      <iframe id="preview" src=""></iframe>
+    </div>
+    <script>
+      const pages = [
+        'admin-application-review-detail',
+        'admin-dashboard-overview',
+        'admin-fee-pricing-management',
+        'admin-login',
+        'admin-login-portal',
+        'admin-onboarding-review-queue',
+        'admin-reconciliation-management',
+        'admin-system-audit-logs',
+        'device-registry-monitoring',
+        'device-technical-detail',
+        'device-ui-payment-success',
+        'device-ui-qr-payment-display',
+        'merchant-dashboard-portal',
+        'merchant-detail-view',
+        'merchant-list-management',
+        'merchant-login',
+        'merchant-login-portal',
+        'merchant-settlement-history',
+        'onboarding-bank-account',
+        'onboarding-business-info',
+        'onboarding-document-upload',
+        'onboarding-pic-details',
+        'outlet-branch-management',
+        'qris-soundbox-logo',
+        'settlement-batch-management',
+        'soundbox-ops',
+        'transaction-history-monitoring',
+      ];
+      const menu = document.getElementById('menu');
+      const frame = document.getElementById('preview');
+      const current = document.getElementById('current');
+      const params = new URLSearchParams(window.location.search);
+      const selected = params.get('page') || pages[0];
+      const safePage = pages.includes(selected) ? selected : pages[0];
+
+      menu.innerHTML = '<p class="hint">Klik untuk buka halaman:</p>' + pages.map((slug) => {
+        const active = slug === safePage ? ' active' : '';
+        return `<a href="/ui/hub?page=${encodeURIComponent(slug)}" class="${active}">${slug}</a>`;
+      }).join('');
+
+      frame.src = `/ui/${safePage}`;
+      current.textContent = `Preview: ${safePage}`;
+
+      menu.addEventListener('click', (evt) => {
+        const a = evt.target.closest('a');
+        if (!a) return;
+        evt.preventDefault();
+        const next = new URL(a.href).searchParams.get('page');
+        if (!next) return;
+        current.textContent = `Preview: ${next}`;
+        frame.src = `/ui/${next}`;
+        menu.querySelectorAll('a').forEach((link) => link.classList.remove('active'));
+        a.classList.add('active');
+        history.replaceState(null, '', `/ui/hub?page=${encodeURIComponent(next)}`);
+      });
+    </script>
+  </body>
+</html>