From 19acf4ed96eb6fb735419a17c4ff0d6a4e2ce076 Mon Sep 17 00:00:00 2001
From: hyeongwoo-choi <hyeongwoo.choi@klaroworks.ai>
Date: Mon, 20 Jul 2026 03:35:45 +0000
Subject: [PATCH] =?UTF-8?q?=EC=97=85=EB=AC=B4=ED=99=94=EB=A9=B4=20?=
 =?UTF-8?q?=EA=B3=A0=EB=8F=84=ED=99=94:=20MDI=20=ED=83=AD=C2=B7=EA=B7=B8?=
 =?UTF-8?q?=EB=A6=AC=EB=93=9C(=EC=A0=95=EB=A0=AC/=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=95/CSV/=ED=95=A9=EA=B3=84/=EB=B0=B0=EC=A7=80)=C2=B7?=
 =?UTF-8?q?=EC=83=81=EC=84=B8=ED=8C=9D=EC=97=85=C2=B7=EB=A7=88=EC=8A=A4?=
 =?UTF-8?q?=ED=84=B0-=EB=94=94=ED=85=8C=EC=9D=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- MDI 탭바: 화면 다중 오픈/전환/닫기 (상태 유지, 레거시 업무포털 방식)
- 그리드 컴포넌트: 컬럼 정렬, 페이징(1/34), CSV 저장, 금액 합계행, 상태 한글배지
  (접수/대사/정산완료/취소/보류), 행 hover·클릭
- 매입 상세 팝업: 행 클릭 → 매입원장 + 승인/정산/원장(복식기표) 연계조회
  + 보류(ACQ_HOLD)·취소(ACQ_CANCEL) 실 tpcall XA 액션 (상태별 버튼 활성화)
- 가맹점 관리(QR0301): 마스터 그리드 ↔ 상세폼, 신규등록/정보수정/상태변경
  실 tpcall(MM_MERCH_REG/UPD/STATUS) + 확장마스터/변경이력 연계
- 매입목록 필터 확장(상태), 해시 딥링크(#q=/#s=), 거래저널 전화면 공유
- 검증: 헤드리스 스크린샷 3종(대시보드/매입목록/가맹점관리) 렌더 확인

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 app/ui/index.html | 641 +++++++++++++++++++++++++++++-----------------
 1 file changed, 405 insertions(+), 236 deletions(-)

diff --git a/app/ui/index.html b/app/ui/index.html
index be71684..2c2b8fc 100644
--- a/app/ui/index.html
+++ b/app/ui/index.html
@@ -4,7 +4,7 @@
 <meta charset="utf-8">
 <title>ACQUIRE-CORE-X 매입업무포털</title>
 <style>
-  /* Xplatform(UXStudio) 풍 내부 업무화면 스타일 */
+  /* Xplatform(UXStudio) 풍 내부 업무화면 */
   * { box-sizing: border-box; margin: 0; padding: 0; }
   html, body { height: 100%; font-family: "Malgun Gothic", "맑은 고딕", Dotum, sans-serif; font-size: 12px; color: #222; }
   body { display: flex; flex-direction: column; background: #e8ebef; }
@@ -17,8 +17,7 @@
 
   #main { flex: 1; display: flex; min-height: 0; }
 
-  /* 좌측 메뉴 트리 */
-  #menuwrap { width: 232px; background: #f4f6f8; border-right: 1px solid #b8c2cc; display: flex; flex-direction: column; }
+  #menuwrap { width: 232px; background: #f4f6f8; border-right: 1px solid #b8c2cc; display: flex; flex-direction: column; flex-shrink: 0; }
   #menusearch { padding: 6px; border-bottom: 1px solid #ccd4dc; }
   #menusearch input { width: 100%; height: 24px; border: 1px solid #9aa8b5; padding: 0 8px; font-size: 12px; }
   #menu { flex: 1; overflow-y: auto; }
@@ -34,9 +33,18 @@
   #menu .itm .cd { color: #888; font-size: 10px; margin-right: 5px; font-family: Consolas, monospace; }
 
   #content { flex: 1; display: flex; flex-direction: column; min-width: 0; }
-  #tabbar { height: 30px; background: #d5dce3; border-bottom: 1px solid #a9b4bf; display: flex; align-items: flex-end; padding: 0 8px; flex-shrink: 0; }
-  #tabbar .tab { padding: 5px 16px 4px; background: #fff; border: 1px solid #a9b4bf; border-bottom: none; font-weight: bold; color: #1d4269; }
+
+  /* MDI 탭바 */
+  #tabbar { min-height: 30px; background: #d5dce3; border-bottom: 1px solid #a9b4bf; display: flex; align-items: flex-end; padding: 4px 8px 0; flex-wrap: wrap; gap: 2px; flex-shrink: 0; }
+  #tabbar .tab { padding: 5px 8px 4px 14px; background: #e9edf1; border: 1px solid #a9b4bf; border-bottom: none; color: #55677a; cursor: pointer; display: flex; align-items: center; max-width: 210px; }
+  #tabbar .tab.on { background: #fff; font-weight: bold; color: #1d4269; }
+  #tabbar .tab .tnm { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
+  #tabbar .tab .x { margin-left: 8px; color: #98a4b0; font-weight: bold; padding: 0 3px; }
+  #tabbar .tab .x:hover { color: #c22; }
+
   #work { flex: 1; overflow: auto; padding: 12px; }
+  .tabpane { display: none; }
+  .tabpane.on { display: block; }
 
   .panel { background: #fff; border: 1px solid #b0bac4; margin-bottom: 12px; }
   .panel h3 { font-size: 12px; padding: 6px 10px; background: #eef2f6; border-bottom: 1px solid #ccd4dc; color: #1d4269; display: flex; align-items: center; }
@@ -46,34 +54,58 @@
   table.frm { border-collapse: collapse; width: 100%; }
   table.frm th { background: #f0f3f6; border: 1px solid #d3dae1; padding: 5px 8px; text-align: right; width: 150px; font-weight: normal; color: #445; }
   table.frm td { border: 1px solid #d3dae1; padding: 3px 6px; }
-  table.frm input[type=text] { width: 100%; max-width: 280px; height: 22px; border: 1px solid #9aa8b5; padding: 0 6px; font-size: 12px; }
+  table.frm input[type=text], table.frm select { width: 100%; max-width: 280px; height: 22px; border: 1px solid #9aa8b5; padding: 0 6px; font-size: 12px; background:#fff; }
+  table.frm input[readonly] { background: #f0f3f6; color: #667; }
   table.frm .fldcd { color: #98a4b0; font-size: 10px; margin-left: 8px; font-family: Consolas, monospace; }
   .btnrow { margin-top: 10px; text-align: right; }
-  button { height: 26px; padding: 0 16px; margin-left: 6px; background: linear-gradient(#fdfdfd, #dfe5ea); border: 1px solid #8fa0b0; cursor: pointer; font-size: 12px; }
+  button { height: 26px; padding: 0 14px; margin-left: 6px; background: linear-gradient(#fdfdfd, #dfe5ea); border: 1px solid #8fa0b0; cursor: pointer; font-size: 12px; }
   button.pri { background: linear-gradient(#3f76ad, #29578a); color: #fff; border-color: #1d4269; font-weight: bold; }
+  button.warn { background: linear-gradient(#e8a54a, #c8862c); color: #fff; border-color: #a06a1e; }
+  button.dang { background: linear-gradient(#d95f5f, #b23c3c); color: #fff; border-color: #8f2b2b; }
   button:hover { filter: brightness(1.06); }
+  button:disabled { opacity: .5; cursor: default; }
 
+  /* 그리드 */
+  .gtools { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; color: #556; }
+  .gtools .sp { flex: 1; }
+  .gtools button { height: 22px; padding: 0 10px; margin: 0; font-size: 11px; }
   table.grd { border-collapse: collapse; width: 100%; }
-  table.grd th { background: #dfe6ec; border: 1px solid #b8c2cc; padding: 4px 6px; color: #2c4a66; }
-  table.grd td { border: 1px solid #d3dae1; padding: 3px 6px; background: #fff; }
+  table.grd th { background: #dfe6ec; border: 1px solid #b8c2cc; padding: 4px 6px; color: #2c4a66; cursor: pointer; user-select: none; white-space: nowrap; }
+  table.grd th .sa { color: #29578a; margin-left: 3px; }
+  table.grd td { border: 1px solid #d3dae1; padding: 3px 6px; background: #fff; white-space: nowrap; }
   table.grd tr:nth-child(even) td { background: #f7fafc; }
+  table.grd tr.rw:hover td { background: #e8f2fb; cursor: pointer; }
+  table.grd tr.sum td { background: #eef3f8; font-weight: bold; border-top: 2px solid #a9b4bf; }
   .num { text-align: right; font-family: Consolas, monospace; }
   .ok  { color: #0a7d2c; font-weight: bold; }
   .err { color: #c22; font-weight: bold; }
+  .bdg { display: inline-block; padding: 1px 7px; border-radius: 2px; font-size: 11px; color: #fff; }
+  .bA { background: #3a7bbf; } .bM { background: #d98a2b; } .bS { background: #2b9e4e; }
+  .bC { background: #c24444; } .bH { background: #7c8a99; } .bV { background: #8f2b8f; }
 
-  #statusbar { height: 24px; background: #d5dce3; border-top: 1px solid #a9b4bf; display: flex; align-items: center; padding: 0 10px; font-size: 11px; color: #345; flex-shrink: 0; }
-  #statusbar .dot { width: 8px; height: 8px; border-radius: 50%; background: #23a54a; margin-right: 6px; }
   .cards { display: flex; gap: 10px; flex-wrap: wrap; }
   .card { flex: 1; min-width: 128px; border: 1px solid #c6d0da; background: #f7fafd; padding: 8px 10px; }
   .card .cl { font-size: 11px; color: #667; }
   .card .cv { font-size: 16px; font-weight: bold; color: #1d4269; margin-top: 4px; text-align: right; font-family: Consolas, monospace; }
+
+  /* 팝업(모달) */
+  #ovl { position: fixed; inset: 0; background: rgba(20,30,40,.45); display: none; z-index: 50; }
+  #ovl.show { display: block; }
+  #pop { position: absolute; top: 6%; left: 50%; transform: translateX(-50%); width: 880px; max-height: 86%;
+         overflow: auto; background: #eef1f4; border: 2px solid #2c5d8f; box-shadow: 0 8px 30px rgba(0,0,0,.35); }
+  #pop .phd { background: linear-gradient(#2c5d8f, #1d4269); color: #fff; padding: 8px 12px; font-weight: bold; display: flex; }
+  #pop .phd .x { margin-left: auto; cursor: pointer; padding: 0 6px; }
+  #pop .pbd { padding: 12px; }
+
+  #statusbar { height: 24px; background: #d5dce3; border-top: 1px solid #a9b4bf; display: flex; align-items: center; padding: 0 10px; font-size: 11px; color: #345; flex-shrink: 0; }
+  #statusbar .dot { width: 8px; height: 8px; border-radius: 50%; background: #23a54a; margin-right: 6px; }
 </style>
 </head>
 <body>
   <div id="titlebar">
     <span class="logo">ACQUIRE-CORE-X</span>
     <span class="sub">글로벌 매입업무포털 (Enduro/X · ECPG/PostgreSQL · XA)</span>
-    <span class="right">사용자: <b>매입운영1팀</b> | 영업일 <span id="bizdate"></span> | 화면 <span id="scrno">-</span> | 전체화면 <b id="scrcnt">-</b>종</span>
+    <span class="right">사용자: <b>매입운영1팀</b> | 영업일 <span id="bizdate"></span> | 전체화면 <b id="scrcnt">-</b>종</span>
   </div>
 
   <div id="main">
@@ -82,12 +114,14 @@
       <div id="menu"></div>
     </div>
     <div id="content">
-      <div id="tabbar"><span class="tab" id="tabname">-</span></div>
+      <div id="tabbar"></div>
       <div id="work"></div>
       <div id="statusbar"><span class="dot"></span><span id="stmsg">TP 모니터 연결됨 — 게이트웨이 /api/call</span></div>
     </div>
   </div>
 
+  <div id="ovl"><div id="pop"><div class="phd"><span id="ptit">상세</span><span class="x" onclick="closePop()">✕</span></div><div class="pbd" id="pbd"></div></div></div>
+
 <script>
 /* === 화면 매니페스트 (인라인; 재생성: tools/gen_screens.py) === */
 /* 자동생성 화면 매니페스트 - tools/gen_screens.py 가 svc 소스에서 추출 */
@@ -4396,13 +4430,25 @@ const SVC_SCREENS = [
 ];
 </script>
 <script>
-window.onerror = function(m, src, line){ 
-  var e=document.getElementById('stmsg'); 
+window.onerror = function(m, src, line){
+  var e=document.getElementById('stmsg');
   if(e){ e.textContent='JS 오류: '+m+' ('+(src||'').split('/').pop()+':'+line+')'; e.style.color='#c22'; }
 };
-/* ───────── 공통: 필드 한글 라벨 / 기본값 ───────── */
+
+/* ───────── 공통 ───────── */
 const today = new Date().toISOString().slice(0,10).replace(/-/g,'');
 document.getElementById('bizdate').textContent = today;
+const fmtN = v => (v===null||v===undefined||v==='') ? '' : (/^-?\d+$/.test(String(v)) ? Number(v).toLocaleString('ko-KR') : v);
+const STMAP = { A:['접수','bA'], M:['대사','bM'], S:['정산완료','bS'], C:['취소','bC'], H:['보류','bH'], V:['VOID','bV'],
+                ACTIVE:['정상','bS'], HOLD:['보류','bH'], PENDING:['심사중','bM'], SETTLED:['지급완료','bS'] };
+const badge = v => { const m=STMAP[v]; return m? `<span class="bdg ${m[1]}">${m[0]}</span>` : v; };
+const setStatus = (m, err) => { const e=document.getElementById('stmsg'); e.textContent=m; e.style.color=err?'#c22':'#345'; };
+async function runQuery(sql){ try { return await (await fetch('api/query?q='+encodeURIComponent(sql))).json(); } catch(e){ return {ok:false,error:String(e)}; } }
+async function callSvc(svc, fields, tx){
+  const p = new URLSearchParams({svc, _tx: tx?1:0});
+  Object.entries(fields||{}).forEach(([k,v])=>{ if(v!=='') p.append(k,v); });
+  try { return await (await fetch('api/call?'+p.toString())).json(); } catch(e){ return {ok:false,error:String(e)}; }
+}
 
 const LBL = {
   T_MERCHANT:"가맹점번호", T_AMOUNT:"금액(원)", T_FEE:"수수료", T_NET:"정산액", T_STATUS:"상태",
@@ -4414,20 +4460,347 @@ const LBL = {
 };
 for (let i=1;i<=8;i++){ LBL['T_ARG'+i]='인자'+i; LBL['T_STR'+i]='문자'+i; }
 for (let i=1;i<=4;i++){ LBL['T_AMT'+i]='금액'+i; }
-
 const DEF = {
-  T_MERCHANT:"M0001", T_AMOUNT:"1000000", T_BIZDATE:today, T_PURCHASE_ID:"1", T_SETTLE_ID:"1",
-  T_CANCEL_ID:"1", T_ADJ:"1", T_ID1:"1", T_ID2:"1", T_INSTALL_N:"3", T_COUNT:"10",
+  T_MERCHANT:"M0001", T_AMOUNT:"1000000", T_BIZDATE:today, T_PURCHASE_ID:"1001", T_SETTLE_ID:"3001",
+  T_CANCEL_ID:"1", T_ADJ:"1", T_ID1:"5001", T_ID2:"1", T_INSTALL_N:"3", T_COUNT:"10",
   T_CCY:"KRW", T_CHANNEL:"POS", T_ISSUER:"BC", T_CATEGORY:"5411", T_STATUS:"A",
   T_KEY1:"4111111111111111", T_STR5:"4111111111111111", T_FEE:"2500", T_DOCNO:"D0001",
   T_SVCNAME:"ACQUIRE", T_GROSS:"0", T_DELTA:"0", T_TAX:"0", T_FX_AMT:"0",
 };
 const dflt = f => DEF[f] !== undefined ? DEF[f] : (/T_(ARG|AMT)/.test(f) ? "0" : "");
-
-/* XA 를 기본으로 켤 화면(갱신성) 판단: 조회성 키워드면 OFF */
 const READONLY = /(_INQ|_CHK|STATUS|SUMMARY|STATS|HISTORY|REPORT|_SUM|BALCHK|LUHN|CRC|WEEKDAY|MONTHEND|BIZDAY|CODENAME|VALIDATE|PROGRESS|VERIFY|DIFFCHK|INQUIRY|TRIALBAL)/;
 
-/* ───────── 즐겨찾기(주요 업무) ───────── */
+/* ───────── 그리드 컴포넌트 (정렬·페이징·CSV·합계·행클릭) ───────── */
+const __G = {}; let __gid = 0;
+function grid(el, data, opt={}){
+  if (!data.ok) { el.innerHTML = `<span class="err">${data.error||'조회 실패'}</span>`; return; }
+  const id = 'g' + (++__gid);
+  const g = { el, data, opt, st: { sort: null, dir: 1, page: 0, psz: opt.psz || 15 } };
+  __G[id] = g;
+  const sorted = () => {
+    let view = [...g.data.rows];
+    if (g.st.sort !== null) {
+      const i = g.st.sort;
+      view.sort((a,b) => { const x=a[i], y=b[i];
+        return (/^-?\d+$/.test(x) && /^-?\d+$/.test(y) ? Number(x)-Number(y) : String(x).localeCompare(String(y))) * g.st.dir; });
+    }
+    return view;
+  };
+  g.render = () => {
+    const { cols, rows } = g.data, st = g.st;
+    const view = sorted();
+    const np = Math.max(1, Math.ceil(view.length / st.psz));
+    if (st.page >= np) st.page = np - 1;
+    const pg = view.slice(st.page*st.psz, (st.page+1)*st.psz);
+    const isNum = cols.map((_,i) => rows.length > 0 && rows.every(r => r[i]==='' || /^-?\d+$/.test(r[i])));
+    const doSum = cols.map((c,i) => isNum[i] && /금액|수수료|정산액|지급액|건수|합계|세액/.test(c));
+    let h = `<div class="gtools"><span>총 <b>${rows.length.toLocaleString()}</b>건</span><span class="sp"></span>
+      <button onclick="__G['${id}'].csv()">CSV 저장</button>
+      <button onclick="__G['${id}'].pg(-1)">◀ 이전</button><span>${st.page+1} / ${np}</span><button onclick="__G['${id}'].pg(1)">다음 ▶</button></div>`;
+    h += '<table class="grd"><tr>' + cols.map((c,i) =>
+      `<th onclick="__G['${id}'].sort(${i})">${c}${st.sort===i ? `<span class="sa">${st.dir>0?'▲':'▼'}</span>`:''}</th>`).join('') + '</tr>';
+    h += pg.map((r,ri) => `<tr class="${opt.onRow?'rw':''}" ${opt.onRow?`onclick="__G['${id}'].row(${st.page*st.psz+ri})"`:''}>` +
+      r.map((v,i) => `<td class="${isNum[i]?'num':''}">${cols[i]==='상태'?badge(v):fmtN(v)}</td>`).join('') + '</tr>').join('');
+    if (doSum.some(Boolean) && rows.length > 1)
+      h += '<tr class="sum">' + cols.map((c,i) => doSum[i]
+        ? `<td class="num">${fmtN(rows.reduce((s,r)=>s+Number(r[i]||0),0))}</td>`
+        : `<td>${i===0?'합계':''}</td>`).join('') + '</tr>';
+    h += '</table>';
+    el.innerHTML = h;
+  };
+  g.sort = i => { g.st.dir = (g.st.sort===i) ? -g.st.dir : 1; g.st.sort = i; g.render(); };
+  g.pg = d => { g.st.page = Math.max(0, g.st.page + d); g.render(); };
+  g.row = i => { opt.onRow(sorted()[i]); };
+  g.csv = () => {
+    const csv = '' + [g.data.cols.join(','), ...g.data.rows.map(r=>r.map(v=>`"${String(v).replace(/"/g,'""')}"`).join(','))].join('\n');
+    const a = document.createElement('a');
+    a.href = URL.createObjectURL(new Blob([csv], {type:'text/csv;charset=utf-8'}));
+    a.download = (opt.name||'grid') + '_' + today + '.csv'; a.click();
+  };
+  g.render();
+}
+
+/* ───────── MDI 탭 ───────── */
+const TABS = {}; let activeTab = null;
+const tabbar = document.getElementById('tabbar'), work = document.getElementById('work');
+function openTab(key, title, renderFn){
+  if (TABS[key]) return focusTab(key);
+  const pane = document.createElement('div'); pane.className = 'tabpane'; work.appendChild(pane);
+  const tab = document.createElement('span'); tab.className = 'tab';
+  tab.innerHTML = `<span class="tnm">${title}</span><span class="x">✕</span>`;
+  tab.onclick = e => { if (!e.target.classList.contains('x')) focusTab(key); };
+  tab.querySelector('.x').onclick = e => { e.stopPropagation(); closeTab(key); };
+  tabbar.appendChild(tab);
+  TABS[key] = { pane, tab, title };
+  renderFn(pane);
+  focusTab(key);
+}
+function focusTab(key){
+  Object.entries(TABS).forEach(([k,t]) => { t.pane.classList.toggle('on', k===key); t.tab.classList.toggle('on', k===key); });
+  activeTab = key;
+}
+function closeTab(key){
+  const t = TABS[key]; if (!t) return;
+  t.pane.remove(); t.tab.remove(); delete TABS[key];
+  if (activeTab === key) { const ks = Object.keys(TABS); if (ks.length) focusTab(ks[ks.length-1]); else activeTab = null; }
+}
+
+/* ───────── 매입 상세 팝업 (연계조회 + 보류/취소 액션) ───────── */
+function closePop(){ document.getElementById('ovl').classList.remove('show'); }
+async function openPurchaseDetail(pid){
+  const ovl = document.getElementById('ovl'), bd = document.getElementById('pbd');
+  document.getElementById('ptit').textContent = `매입 상세조회 — 매입번호 ${pid}`;
+  bd.innerHTML = '조회 중 ...'; ovl.classList.add('show');
+  const [p, ap, st, lg] = await Promise.all([
+    runQuery(`select p.purchase_id 매입번호, p.biz_date 영업일, p.merchant_id 가맹점번호, m.name 상호, p.amount 매입금액, p.fee 수수료, p.net 정산액, p.status 상태, p.channel 채널, p.issuer 발급사, p.category 업종, to_char(p.created_at,'YYYY-MM-DD HH24:MI:SS') 접수시각 from purchase p join merchant m on m.merchant_id=p.merchant_id where p.purchase_id=${pid}`),
+    runQuery(`select approval_id 승인번호, case when approved then '승인' else '거절' end 결과, to_char(approved_at,'YYYY-MM-DD HH24:MI:SS') 승인시각 from approval where purchase_id=${pid}`),
+    runQuery(`select settlement_id 정산번호, net 지급액, status 상태, to_char(settled_at,'YYYY-MM-DD HH24:MI') 지급시각 from settlement where purchase_id=${pid}`),
+    runQuery(`select ledger_id 전표번호, entry_type 유형, amount 금액, biz_date 영업일 from ledger where purchase_id=${pid} order by ledger_id`),
+  ]);
+  let info = '<span class="err">매입 없음</span>', stv = '';
+  if (p.ok && p.rows.length) {
+    stv = p.rows[0][p.cols.indexOf('상태')];
+    info = '<table class="frm">' + p.cols.map((c,i) =>
+      `<tr><th>${c}</th><td>${c==='상태'?badge(p.rows[0][i]):fmtN(p.rows[0][i])}</td></tr>`).join('') + '</table>';
+  }
+  bd.innerHTML = `
+    <div style="display:flex;gap:12px">
+      <div class="panel" style="flex:1"><h3>매입 원장</h3><div class="bd">${info}</div></div>
+      <div style="flex:1.2">
+        <div class="panel"><h3>승인 연계</h3><div class="bd" id="pp_ap"></div></div>
+        <div class="panel"><h3>정산 연계</h3><div class="bd" id="pp_st"></div></div>
+        <div class="panel"><h3>원장 기표 (복식)</h3><div class="bd" id="pp_lg"></div></div>
+      </div>
+    </div>
+    <div class="btnrow">
+      <button class="warn" ${['A','M'].includes(stv)?'':'disabled'} onclick="actHold(${pid})">보류 처리 (ACQ_HOLD)</button>
+      <button class="dang" ${['A','M','H'].includes(stv)?'':'disabled'} onclick="actCancel(${pid})">매입 취소 (ACQ_CANCEL·XA)</button>
+      <button onclick="closePop()">닫기</button>
+    </div>`;
+  grid(document.getElementById('pp_ap'), ap, {psz:3});
+  grid(document.getElementById('pp_st'), st, {psz:3});
+  grid(document.getElementById('pp_lg'), lg, {psz:5});
+}
+async function actHold(pid){
+  const j = await callSvc('ACQ_HOLD', {T_PURCHASE_ID: pid}, true);
+  jlog('POP', 'ACQ_HOLD', true, j);
+  alert(j.ok ? `보류 처리 완료 (반영 ${(j.fields||{}).T_RC||0}건)` : `실패: ${j.error}`);
+  openPurchaseDetail(pid);
+}
+async function actCancel(pid){
+  const reason = prompt('취소 사유를 입력하세요', '가맹점 요청');
+  if (reason === null) return;
+  const j = await callSvc('ACQ_CANCEL', {T_PURCHASE_ID: pid, T_BIZDATE: today, T_REASON: reason}, true);
+  jlog('POP', 'ACQ_CANCEL', true, j);
+  alert(j.ok ? `취소 접수 완료 (취소번호 ${(j.fields||{}).T_CANCEL_ID||'-'})` : `실패: ${j.error}`);
+  openPurchaseDetail(pid);
+}
+
+/* ───────── 거래 저널 ───────── */
+const journal = [];
+function jlog(cd, svc, tx, j){
+  journal.unshift({ t:new Date().toLocaleTimeString('ko-KR'), cd, svc, tx: tx?'Y':'N', ok: j.ok,
+    sum: j.ok ? Object.entries(j.fields||{}).slice(0,4).map(([k,v])=>`${k}=${v}`).join(' ') : (j.error||'').slice(0,70) });
+  document.querySelectorAll('.jgrid').forEach(renderJournalIn);
+}
+function renderJournalIn(g){
+  g.innerHTML = '<tr><th>시각</th><th>화면</th><th>서비스</th><th>XA</th><th>결과</th><th>요약</th></tr>' +
+    journal.slice(0,30).map(r=>`<tr><td>${r.t}</td><td>${r.cd}</td><td>${r.svc}</td><td>${r.tx}</td>
+      <td class="${r.ok?'ok':'err'}">${r.ok?'정상':'오류'}</td><td>${r.sum}</td></tr>`).join('');
+}
+
+/* ───────── 조회/현황 화면 정의 ───────── */
+const QSCREENS = [
+ {cd:'HM0001', nm:'운영 대시보드', dash:true},
+ {cd:'QR0101', nm:'매입 목록 조회', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19'],['merch','가맹점번호(선택)',''],['st','상태(선택)','']],
+  detail:true,
+  sql:f=>`select p.purchase_id 매입번호, p.biz_date 영업일, p.merchant_id 가맹점번호, m.name 상호, p.amount 매입금액, p.fee 수수료, p.net 정산액, p.status 상태, p.channel 채널, p.issuer 발급사 from purchase p join merchant m on m.merchant_id=p.merchant_id where p.biz_date between '${f.from}' and '${f.to}' ${f.merch?`and p.merchant_id='${f.merch}'`:''} ${f.st?`and p.status='${f.st}'`:''} order by p.purchase_id desc limit 500`},
+ {cd:'QR0201', nm:'정산 목록 조회', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19']],
+  sql:f=>`select s.settlement_id 정산번호, s.biz_date 영업일, s.merchant_id 가맹점번호, m.name 상호, s.net 지급액, s.status 상태, to_char(s.settled_at,'MM-DD HH24:MI') 지급시각 from settlement s join merchant m on m.merchant_id=s.merchant_id where s.biz_date between '${f.from}' and '${f.to}' order by s.settlement_id desc limit 500`},
+ {cd:'QR0301', nm:'가맹점 관리', merch:true},
+ {cd:'QR0401', nm:'일자별 실적 집계', filters:[['from','시작일','2026-06-20'],['to','종료일','2026-07-19']],
+  sql:f=>`select biz_date 영업일, count(*) 건수, sum(amount) 매입금액, sum(fee) 수수료, sum(net) 정산액, count(*) filter (where status='S') 정산완료, count(*) filter (where status in ('A','M')) 진행중 from purchase where biz_date between '${f.from}' and '${f.to}' group by biz_date order by biz_date desc limit 200`},
+ {cd:'QR0501', nm:'원장 조회', filters:[['from','시작일','2026-07-10'],['to','종료일','2026-07-19']],
+  sql:f=>`select l.ledger_id 전표번호, l.biz_date 영업일, l.entry_type 유형, l.purchase_id 매입번호, l.amount 금액 from ledger l where l.biz_date between '${f.from}' and '${f.to}' order by l.ledger_id desc limit 500`},
+ {cd:'QR0601', nm:'채널·발급사 분석', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19']],
+  sql:f=>`select channel 채널, issuer 발급사, count(*) 건수, sum(amount) 매입금액, round(avg(amount)) 평균금액 from purchase where biz_date between '${f.from}' and '${f.to}' group by channel, issuer order by 4 desc limit 200`},
+];
+
+function renderQueryIn(pane, q){
+  const fid = 'qf' + q.cd;
+  const f = (q.filters||[]).map(([id,label,dv]) =>
+    `<tr><th>${label}</th><td><input type="text" id="${fid}_${id}" value="${dv}"></td></tr>`).join('');
+  pane.innerHTML = `
+   <div class="panel"><h3>${q.cd} · ${q.nm}${q.detail?' — <span style="font-weight:normal;color:#667">행 클릭 = 상세 팝업(승인·정산·원장 연계, 보류/취소 처리)</span>':''}</h3><div class="bd">
+     <table class="frm">${f||'<tr><th>조건</th><td style="color:#889">전체 조회</td></tr>'}</table>
+     <div class="btnrow"><button class="pri" id="${fid}_run">조회</button></div>
+   </div></div>
+   <div class="panel"><h3>조회 결과</h3><div class="bd" id="${fid}_grid" style="overflow:auto">조회 중 ...</div></div>`;
+  const run = async () => {
+    const fv = {}; (q.filters||[]).forEach(([id]) => { fv[id] = document.getElementById(`${fid}_${id}`).value || ''; });
+    setStatus('조회 중 ...');
+    const j = await runQuery(q.sql(fv));
+    grid(document.getElementById(`${fid}_grid`), j, {
+      name: q.cd, psz: 15,
+      onRow: q.detail ? (r => openPurchaseDetail(r[0])) : null,
+    });
+    setStatus(j.ok ? `${q.nm} — ${j.rows.length}건 조회` : '조회 실패', !j.ok);
+  };
+  document.getElementById(`${fid}_run`).onclick = run;
+  run();
+}
+
+/* ───────── 운영 대시보드 ───────── */
+async function renderDashIn(pane){
+  pane.innerHTML = `
+    <div class="panel"><h3>HM0001 · 운영 대시보드 — 글로벌 매입 현황</h3><div class="bd"><div class="cards" id="dcards">로딩...</div></div></div>
+    <div class="panel"><h3>최근 매입 거래 <span style="font-weight:normal;color:#667">— 행 클릭 시 상세</span></h3><div class="bd" id="drecent" style="overflow:auto">로딩...</div></div>
+    <div style="display:flex; gap:12px">
+      <div class="panel" style="flex:1"><h3>당월 가맹점 TOP 7</h3><div class="bd" id="dtop">로딩...</div></div>
+      <div class="panel" style="flex:1"><h3>최근 7영업일 실적</h3><div class="bd" id="ddaily">로딩...</div></div>
+    </div>`;
+  const k = await runQuery(`select to_char((select max(biz_date) from purchase),'YYYY-MM-DD') 기준일,(select count(*) from purchase where biz_date=(select max(biz_date) from purchase)) 오늘건수,(select coalesce(sum(amount),0) from purchase where biz_date=(select max(biz_date) from purchase)) 오늘매입액,(select count(*) from purchase where date_trunc('month',biz_date)=date_trunc('month',(select max(biz_date) from purchase))) 당월건수,(select coalesce(sum(amount),0) from purchase where date_trunc('month',biz_date)=date_trunc('month',(select max(biz_date) from purchase))) 당월매입액,(select count(*) from merchant where status='ACTIVE') 활성가맹점,(select count(*) from purchase where status in ('A','M','H')) 미정산건`);
+  document.getElementById('dcards').innerHTML = k.ok
+    ? k.cols.map((n,i)=>`<div class="card"><div class="cl">${n}</div><div class="cv">${fmtN(k.rows[0][i])}</div></div>`).join('')
+    : `<span class="err">${k.error}</span>`;
+  const r = await runQuery(`select p.purchase_id 매입번호, p.biz_date 영업일, m.name 가맹점, p.amount 금액, p.fee 수수료, p.status 상태, p.channel 채널, p.issuer 발급사 from purchase p join merchant m on m.merchant_id=p.merchant_id order by p.purchase_id desc limit 40`);
+  grid(document.getElementById('drecent'), r, {psz:10, name:'recent', onRow: rr => openPurchaseDetail(rr[0])});
+  const t = await runQuery(`select m.name 가맹점, count(*) 건수, sum(p.amount) 매입금액 from purchase p join merchant m on m.merchant_id=p.merchant_id where date_trunc('month',p.biz_date)=date_trunc('month',(select max(biz_date) from purchase)) group by m.name order by 3 desc limit 7`);
+  grid(document.getElementById('dtop'), t, {psz:7});
+  const d = await runQuery(`select biz_date 영업일, count(*) 건수, sum(amount) 매입금액, sum(net) 정산액 from purchase group by biz_date order by biz_date desc limit 7`);
+  grid(document.getElementById('ddaily'), d, {psz:7});
+  setStatus('대시보드 로드 완료 — 운영 데이터 기준');
+}
+
+/* ───────── 가맹점 관리 (마스터-디테일 + CRUD tpcall) ───────── */
+async function renderMerchIn(pane){
+  pane.innerHTML = `
+    <div style="display:flex; gap:12px">
+      <div class="panel" style="flex:1.3"><h3>QR0301 · 가맹점 목록 <span style="font-weight:normal;color:#667">— 행 클릭 = 상세</span></h3>
+        <div class="bd" id="mgrid" style="overflow:auto">로딩...</div></div>
+      <div style="flex:1">
+        <div class="panel"><h3>가맹점 상세 / 등록·수정 (tpcall · XA)</h3><div class="bd">
+          <table class="frm">
+            <tr><th>가맹점번호<span class="fldcd">T_MERCHANT</span></th><td><input type="text" id="mf_id" value=""></td></tr>
+            <tr><th>상호<span class="fldcd">T_STR1</span></th><td><input type="text" id="mf_nm" value=""></td></tr>
+            <tr><th>업종/구분<span class="fldcd">T_STR2</span></th><td><input type="text" id="mf_cat" value="일반"></td></tr>
+            <tr><th>정산계좌<span class="fldcd">T_STR3</span></th><td><input type="text" id="mf_acct" value="110-234-567890"></td></tr>
+            <tr><th>상태<span class="fldcd">T_STATUS</span></th><td><select id="mf_st"><option>ACTIVE</option><option>HOLD</option><option>PENDING</option><option>CLOSED</option></select></td></tr>
+          </table>
+          <div class="btnrow">
+            <button class="pri" onclick="merchReg()">신규등록 (MM_MERCH_REG)</button>
+            <button onclick="merchUpd()">정보수정 (MM_MERCH_UPD)</button>
+            <button class="warn" onclick="merchSt()">상태변경 (MM_MERCH_STATUS)</button>
+          </div>
+        </div></div>
+        <div class="panel"><h3>확장 마스터 / 변경 이력</h3><div class="bd" id="mhist">가맹점을 선택하세요</div></div>
+      </div>
+    </div>
+    <div class="panel"><h3>거래 저널</h3><div class="bd"><table class="grd jgrid"></table></div></div>`;
+  renderJournalIn(pane.querySelector('.jgrid'));
+  loadMerchGrid();
+}
+async function loadMerchGrid(){
+  const j = await runQuery(`select m.merchant_id 가맹점번호, m.name 상호, m.mdr_bps "MDR(bp)", m.daily_limit 일한도, m.status 상태, coalesce(t.cnt,0) 누적건수, coalesce(t.amt,0) 누적매입액 from merchant m left join (select merchant_id, count(*) cnt, sum(amount) amt from purchase group by merchant_id) t on t.merchant_id=m.merchant_id order by m.merchant_id limit 300`);
+  const el = document.getElementById('mgrid');
+  if (el) grid(el, j, {psz:14, name:'merchants', onRow: r => selectMerch(r)});
+}
+async function selectMerch(r){
+  document.getElementById('mf_id').value = r[0];
+  document.getElementById('mf_nm').value = r[1];
+  document.getElementById('mf_st').value = STMAP[r[4]] ? r[4] : 'ACTIVE';
+  const h = await runQuery(`select 'EXT' 구분, coalesce(biz_name,'-') 내용1, coalesce(settle_acct,'-') 내용2, coalesce(to_char(updated_at,'MM-DD HH24:MI'),'') 시각 from mm_merchant_ext where merchant_id='${r[0]}' union all select 'HIST', coalesce(chg_type,'-'), coalesce(chg_detail,'-'), to_char(chg_at,'MM-DD HH24:MI') from mm_merch_hist where merchant_id='${r[0]}' limit 20`);
+  const el = document.getElementById('mhist');
+  if (h.ok && h.rows.length) grid(el, h, {psz:8});
+  else el.innerHTML = '<span style="color:#889">확장 마스터/이력 없음 — 신규등록으로 생성</span>';
+}
+const mf = k => document.getElementById('mf_'+k).value.trim();
+async function merchReg(){
+  const j = await callSvc('MM_MERCH_REG', { T_MERCHANT: mf('id'), T_STR1: mf('nm'), T_STR2: mf('cat'), T_STR3: mf('acct') }, true);
+  jlog('QR0301','MM_MERCH_REG',true,j); alert(j.ok?'등록 완료':'실패: '+j.error); loadMerchGrid(); selectMerch([mf('id'), mf('nm'),'','','ACTIVE']);
+}
+async function merchUpd(){
+  const j = await callSvc('MM_MERCH_UPD', { T_MERCHANT: mf('id'), T_STR1: mf('nm'), T_STR3: mf('acct') }, true);
+  jlog('QR0301','MM_MERCH_UPD',true,j); alert(j.ok?'수정 완료':'실패: '+j.error); loadMerchGrid(); selectMerch([mf('id'), mf('nm'),'','','ACTIVE']);
+}
+async function merchSt(){
+  const j = await callSvc('MM_MERCH_STATUS', { T_MERCHANT: mf('id'), T_STATUS: document.getElementById('mf_st').value }, true);
+  jlog('QR0301','MM_MERCH_STATUS',true,j); alert(j.ok?'상태변경 완료':'실패: '+j.error); loadMerchGrid();
+}
+
+/* ───────── 서비스 실행 화면 (330종) ───────── */
+const byMod = {}; SVC_SCREENS.forEach(s => { (byMod[s.mod] = byMod[s.mod] || []).push(s); });
+const bySvc = Object.fromEntries(SVC_SCREENS.map(s => [s.svc, s]));
+document.getElementById('scrcnt').textContent = SVC_SCREENS.length + QSCREENS.length;
+function scrCode(s){ const i = byMod[s.mod].indexOf(s); return s.mod.toUpperCase() + String(i+1).padStart(2,'0') + '01'; }
+
+function renderSvcIn(pane, s, nm, note){
+  const cd = scrCode(s), fid = 'sf' + s.svc;
+  const useTx = !READONLY.test(s.svc);
+  const rows = (s.in.length ? s.in : []).map((f,i) =>
+    `<tr><th>${LBL[f]||f}<span class="fldcd">${f}</span></th>
+       <td><input type="text" id="${fid}_${i}" data-fld="${f}" value="${dflt(f)}"></td></tr>`).join('')
+    || `<tr><th>입력</th><td style="color:#889">입력 필드 없음 — 즉시 실행</td></tr>`;
+  pane.innerHTML = `
+    <div class="panel"><h3>${cd} · ${nm || s.svc} — <span style="font-weight:normal;color:#667">${s.desc || note || ''}</span></h3>
+      <div class="bd">
+        <table class="frm">
+          <tr><th>서비스명</th><td><b>${s.svc}</b> <span class="fldcd">(${s.modnm} 모듈 · ${s.mod}_svr)</span></td></tr>
+          ${rows}
+          <tr><th>글로벌 XA</th><td><label><input type="checkbox" id="${fid}_tx" ${useTx?'checked':''}> tpbegin / tpcommit (2PC)</label></td></tr>
+        </table>
+        <div style="margin-top:6px;color:#889">응답 필드: ${s.out.length ? s.out.map(f=>LBL[f]||f).join(', ') : '-'}</div>
+        <div class="btnrow"><button class="pri" id="${fid}_run">실행 (tpcall)</button></div>
+      </div>
+    </div>
+    <div class="panel"><h3>처리 결과 (응답 전문 UBF)</h3>
+      <div class="bd"><table class="grd" id="${fid}_res"><tr><th style="width:200px">필드</th><th>값</th></tr>
+        <tr><td colspan="2" style="color:#999">실행 전</td></tr></table></div></div>
+    <div class="panel"><h3>거래 저널</h3><div class="bd"><table class="grd jgrid"></table></div></div>`;
+  renderJournalIn(pane.querySelector('.jgrid'));
+  document.getElementById(`${fid}_run`).onclick = async () => {
+    const fields = {};
+    s.in.forEach((f,i) => { const v = document.getElementById(`${fid}_${i}`).value; if (v!=='') fields[f]=v; });
+    const tx = document.getElementById(`${fid}_tx`).checked;
+    setStatus(`tpcall("${s.svc}") 호출 중 ...`);
+    const j = await callSvc(s.svc, fields, tx);
+    const g = document.getElementById(`${fid}_res`);
+    g.innerHTML = '<tr><th style="width:200px">필드</th><th>값</th></tr>';
+    if (j.ok) {
+      const f = j.fields || {};
+      if (!Object.keys(f).length) g.innerHTML += '<tr><td colspan="2">(응답 필드 없음 — 정상 처리)</td></tr>';
+      for (const [k,v] of Object.entries(f))
+        g.innerHTML += `<tr><td>${LBL[k.replace('#','')]||k} <span class="fldcd">${k}</span></td><td class="num">${k==='T_STATUS'?badge(v):fmtN(v)}</td></tr>`;
+      setStatus(`tpcall("${s.svc}") 정상 처리${tx?' · XA tpcommit(2PC)':''}`);
+    } else {
+      g.innerHTML += `<tr><td>오류</td><td class="err">${j.error||'unknown'}</td></tr>`;
+      setStatus(`tpcall("${s.svc}") 실패`, true);
+    }
+    jlog(cd, s.svc, tx, j);
+  };
+}
+
+/* ───────── 메뉴 ───────── */
+const menuEl = document.getElementById('menu');
+function addGroup(title, items, open){
+  const gd = document.createElement('div'); gd.className = 'grp' + (open?' open':'');
+  gd.innerHTML = `${title}<span class="cnt">${items.length}</span>`;
+  const wrap = document.createElement('div'); wrap.className = 'itms';
+  gd.onclick = () => gd.classList.toggle('open');
+  menuEl.appendChild(gd); menuEl.appendChild(wrap);
+  items.forEach(({cd, nm, key, open: openFn}) => {
+    const it = document.createElement('div'); it.className = 'itm';
+    it.innerHTML = `<span class="cd">${cd}</span>${nm}`;
+    it.dataset.k = (cd+' '+nm+' '+key).toLowerCase();
+    it.onclick = e => { e.stopPropagation(); openFn(); };
+    wrap.appendChild(it);
+  });
+}
+const openQueryTab = q => openTab('q:'+q.cd, q.nm, pane =>
+  q.dash ? renderDashIn(pane) : q.merch ? renderMerchIn(pane) : renderQueryIn(pane, q));
+const openSvcTab = (s, nm, note) => openTab('s:'+s.svc, nm || s.svc, pane => renderSvcIn(pane, s, nm, note));
+
+addGroup('조회/현황 (운영)', QSCREENS.map(q => ({cd:q.cd, nm:q.nm, key:q.cd, open:()=>openQueryTab(q)})), true);
 const FAVS = [
   { svc:"ACQUIRE",      nm:"매입 접수(정산체인)", note:"글로벌 XA: ACQUIRE→RECONCILE→SETTLE 체인 후 2PC 커밋" },
   { svc:"ACQ_STATUS",   nm:"매입 상태조회" },
@@ -4436,137 +4809,12 @@ const FAVS = [
   { svc:"ST_MDR",       nm:"MDR 수수료 산출" },
   { svc:"LG_BALCHK",    nm:"원장 잔액검증" },
   { svc:"CL_DAILY",     nm:"일마감 처리" },
-  { svc:"MM_MERCH_INQ", nm:"가맹점 조회" },
   { svc:"CM_LUHN",      nm:"카드번호 검증(Luhn)" },
 ];
+addGroup('★ 주요 업무', FAVS.filter(f=>bySvc[f.svc]).map(f=>({cd:scrCode(bySvc[f.svc]), nm:f.nm, key:f.svc, open:()=>openSvcTab(bySvc[f.svc], f.nm, f.note)})), true);
+Object.keys(byMod).sort().forEach(m =>
+  addGroup(`${byMod[m][0].modnm} (${m}) 업무`, byMod[m].map(s=>({cd:scrCode(s), nm:s.svc, key:s.svc+' '+s.desc, open:()=>openSvcTab(s)})), false));
 
-/* ───────── 메뉴 구성: 즐겨찾기 + 11개 모듈 × 30 화면 ───────── */
-const byMod = {};
-SVC_SCREENS.forEach(s => { (byMod[s.mod] = byMod[s.mod] || []).push(s); });
-const bySvc = Object.fromEntries(SVC_SCREENS.map(s => [s.svc, s]));
-document.getElementById('scrcnt').textContent = SVC_SCREENS.length;
-
-const menuEl = document.getElementById('menu');
-let CUR = null;
-
-function scrCode(s){ const i = byMod[s.mod].indexOf(s); return s.mod.toUpperCase() + String(i+1).padStart(2,'0') + '01'; }
-
-function addGroup(title, items, open) {
-  const gd = document.createElement('div'); gd.className = 'grp' + (open?' open':'');
-  gd.innerHTML = `${title}<span class="cnt">${items.length}</span>`;
-  const wrap = document.createElement('div'); wrap.className = 'itms';
-  gd.onclick = () => gd.classList.toggle('open');
-  menuEl.appendChild(gd); menuEl.appendChild(wrap);
-  items.forEach(({s, nm, note}) => {
-    const it = document.createElement('div'); it.className = 'itm';
-    const cd = scrCode(s);
-    it.innerHTML = `<span class="cd">${cd}</span>${nm || s.svc}`;
-    it.title = (s.desc || s.svc);
-    it.dataset.k = (cd + ' ' + s.svc + ' ' + (nm||'') + ' ' + (s.desc||'')).toLowerCase();
-    it.onclick = (e) => { e.stopPropagation(); openScreen(s, it, nm, note); };
-    wrap.appendChild(it);
-  });
-}
-
-
-/* ───────── 조회/현황 화면 (운영 데이터 그리드 — /api/query) ───────── */
-let CURQ = null;
-const fmtN = v => (v===null||v===undefined||v==='') ? '' : (/^-?\d+$/.test(String(v)) ? Number(v).toLocaleString('ko-KR') : v);
-async function runQuery(sql){
-  try { return await (await fetch('api/query?q='+encodeURIComponent(sql))).json(); }
-  catch(e){ return {ok:false, error:String(e)}; }
-}
-const QSCREENS = [
- {cd:'HM0001', nm:'운영 대시보드', dash:true},
- {cd:'QR0101', nm:'매입 목록 조회', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19'],['merch','가맹점번호(선택)','']],
-  sql:f=>`select p.purchase_id 매입번호, p.biz_date 영업일, p.merchant_id 가맹점, m.name 상호, p.amount 매입금액, p.fee 수수료, p.net 정산액, p.status 상태, p.channel 채널, p.issuer 발급사 from purchase p join merchant m on m.merchant_id=p.merchant_id where p.biz_date between '${f.from}' and '${f.to}' ${f.merch?`and p.merchant_id='${f.merch}'`:''} order by p.purchase_id desc limit 200`},
- {cd:'QR0201', nm:'정산 목록 조회', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19']],
-  sql:f=>`select s.settlement_id 정산번호, s.biz_date 영업일, s.merchant_id 가맹점, m.name 상호, s.net 지급액, s.status 상태, to_char(s.settled_at,'MM-DD HH24:MI') 지급시각 from settlement s join merchant m on m.merchant_id=s.merchant_id where s.biz_date between '${f.from}' and '${f.to}' order by s.settlement_id desc limit 200`},
- {cd:'QR0301', nm:'가맹점 현황', filters:[],
-  sql:f=>`select m.merchant_id 가맹점번호, m.name 상호, m.mdr_bps "MDR(bp)", m.daily_limit 일한도, m.status 상태, coalesce(t.cnt,0) 누적건수, coalesce(t.amt,0) 누적매입액 from merchant m left join (select merchant_id, count(*) cnt, sum(amount) amt from purchase group by merchant_id) t on t.merchant_id=m.merchant_id order by m.merchant_id limit 200`},
- {cd:'QR0401', nm:'일자별 실적 집계', filters:[['from','시작일','2026-06-20'],['to','종료일','2026-07-19']],
-  sql:f=>`select biz_date 영업일, count(*) 건수, sum(amount) 매입금액, sum(fee) 수수료, sum(net) 정산액, count(*) filter (where status='S') 정산완료, count(*) filter (where status in ('A','M')) 진행중 from purchase where biz_date between '${f.from}' and '${f.to}' group by biz_date order by biz_date desc limit 200`},
- {cd:'QR0501', nm:'원장 조회', filters:[['from','시작일','2026-07-10'],['to','종료일','2026-07-19']],
-  sql:f=>`select l.ledger_id 전표번호, l.biz_date 영업일, l.entry_type 유형, l.purchase_id 매입번호, l.amount 금액 from ledger l where l.biz_date between '${f.from}' and '${f.to}' order by l.ledger_id desc limit 200`},
- {cd:'QR0601', nm:'채널·발급사 분석', filters:[['from','시작일','2026-07-01'],['to','종료일','2026-07-19']],
-  sql:f=>`select channel 채널, issuer 발급사, count(*) 건수, sum(amount) 매입금액, round(avg(amount)) 평균금액 from purchase where biz_date between '${f.from}' and '${f.to}' group by channel, issuer order by 4 desc limit 200`},
-];
-function gridHtml(j){
-  if (!j.rows.length) return '<span style="color:#889">데이터 없음</span>';
-  return '<table class="grd"><tr>' + j.cols.map(c=>`<th>${c}</th>`).join('') + '</tr>' +
-    j.rows.map(r=>'<tr>'+r.map(v=>`<td class="${/^-?\d+$/.test(v)?'num':''}">${fmtN(v)}</td>`).join('')+'</tr>').join('') + '</table>';
-}
-async function openQuery(q, itEl){
-  CUR = null; CURQ = q;
-  document.querySelectorAll('#menu .itm').forEach(e=>e.classList.remove('on'));
-  if (itEl) itEl.classList.add('on');
-  document.getElementById('tabname').textContent = q.nm;
-  document.getElementById('scrno').textContent = q.cd;
-  if (q.dash) return renderDash();
-  const f = (q.filters||[]).map(([id,label,dv]) =>
-    `<tr><th>${label}</th><td><input type="text" id="qf_${id}" value="${dv}"></td></tr>`).join('');
-  work.innerHTML = `
-   <div class="panel"><h3>${q.cd} · ${q.nm}</h3><div class="bd">
-     <table class="frm">${f||'<tr><th>조건</th><td style="color:#889">전체 조회</td></tr>'}</table>
-     <div class="btnrow"><button class="pri" onclick="runQ()">조회</button></div>
-   </div></div>
-   <div class="panel"><h3>조회 결과</h3><div class="bd" id="qgrid" style="overflow:auto">조회 중 ...</div></div>`;
-  runQ();
-}
-async function runQ(){
-  const q = CURQ, f = {};
-  (q.filters||[]).forEach(([id]) => { f[id] = (document.getElementById('qf_'+id)||{}).value || ''; });
-  setStatus('조회 중 ...');
-  const j = await runQuery(q.sql(f));
-  const g = document.getElementById('qgrid');
-  if (!j.ok) { g.innerHTML = `<span class="err">${j.error}</span>`; setStatus('조회 실패', true); return; }
-  g.innerHTML = gridHtml(j);
-  setStatus(`조회 완료 — ${j.rows.length}건`);
-}
-async function renderDash(){
-  work.innerHTML = `
-    <div class="panel"><h3>HM0001 · 운영 대시보드 — 글로벌 매입 현황</h3><div class="bd"><div class="cards" id="cards">로딩...</div></div></div>
-    <div class="panel"><h3>최근 매입 거래</h3><div class="bd" id="d_recent" style="overflow:auto">로딩...</div></div>
-    <div style="display:flex; gap:12px">
-      <div class="panel" style="flex:1"><h3>당월 가맹점 TOP 7</h3><div class="bd" id="d_top">로딩...</div></div>
-      <div class="panel" style="flex:1"><h3>최근 7영업일 실적</h3><div class="bd" id="d_daily">로딩...</div></div>
-    </div>`;
-  const k = await runQuery(`select to_char((select max(biz_date) from purchase),'YYYY-MM-DD') 기준일,(select count(*) from purchase where biz_date=(select max(biz_date) from purchase)) 오늘건수,(select coalesce(sum(amount),0) from purchase where biz_date=(select max(biz_date) from purchase)) 오늘매입액,(select count(*) from purchase where date_trunc('month',biz_date)=date_trunc('month',(select max(biz_date) from purchase))) 당월건수,(select coalesce(sum(amount),0) from purchase where date_trunc('month',biz_date)=date_trunc('month',(select max(biz_date) from purchase))) 당월매입액,(select count(*) from merchant where status='ACTIVE') 활성가맹점,(select count(*) from purchase where status in ('A','M','H')) 미정산건`);
-  if (k.ok) {
-    document.getElementById('cards').innerHTML =
-      k.cols.map((n,i)=>`<div class="card"><div class="cl">${n}</div><div class="cv">${fmtN(k.rows[0][i])}</div></div>`).join('');
-  } else document.getElementById('cards').innerHTML = `<span class="err">${k.error}</span>`;
-  const r = await runQuery(`select p.purchase_id 매입번호, p.biz_date 영업일, m.name 가맹점, p.amount 금액, p.fee 수수료, p.status 상태, p.channel 채널, p.issuer 발급사 from purchase p join merchant m on m.merchant_id=p.merchant_id order by p.purchase_id desc limit 12`);
-  if (r.ok) document.getElementById('d_recent').innerHTML = gridHtml(r);
-  const t = await runQuery(`select m.name 가맹점, count(*) 건수, sum(p.amount) 매입금액 from purchase p join merchant m on m.merchant_id=p.merchant_id where date_trunc('month',p.biz_date)=date_trunc('month',(select max(biz_date) from purchase)) group by m.name order by 3 desc limit 7`);
-  if (t.ok) document.getElementById('d_top').innerHTML = gridHtml(t);
-  const d = await runQuery(`select biz_date 영업일, count(*) 건수, sum(amount) 매입금액, sum(net) 정산액 from purchase group by biz_date order by biz_date desc limit 7`);
-  if (d.ok) document.getElementById('d_daily').innerHTML = gridHtml(d);
-  setStatus('대시보드 로드 완료 — 운영 데이터 기준');
-}
-function addQueryGroup(){
-  const gd = document.createElement('div'); gd.className = 'grp open';
-  gd.innerHTML = `조회/현황 (운영)<span class="cnt">${QSCREENS.length}</span>`;
-  const wrap = document.createElement('div'); wrap.className = 'itms';
-  gd.onclick = () => gd.classList.toggle('open');
-  menuEl.appendChild(gd); menuEl.appendChild(wrap);
-  QSCREENS.forEach(q => {
-    const it = document.createElement('div'); it.className = 'itm';
-    it.innerHTML = `<span class="cd">${q.cd}</span>${q.nm}`;
-    it.dataset.k = (q.cd+' '+q.nm).toLowerCase();
-    it.onclick = e => { e.stopPropagation(); openQuery(q, it); };
-    wrap.appendChild(it);
-  });
-}
-addQueryGroup();
-
-addGroup('★ 주요 업무', FAVS.filter(f=>bySvc[f.svc]).map(f=>({s:bySvc[f.svc], nm:f.nm, note:f.note})), true);
-Object.keys(byMod).sort().forEach(m => {
-  addGroup(`${byMod[m][0].modnm} (${m}) 업무`, byMod[m].map(s=>({s})), false);
-});
-setTimeout(()=>openQuery(QSCREENS[0], document.querySelector('#menu .itms .itm')), 0);
-
-/* 검색 */
 document.getElementById('q').addEventListener('input', e => {
   const q = e.target.value.trim().toLowerCase();
   document.querySelectorAll('#menu .itms').forEach(w => w.classList.toggle('show', !!q));
@@ -4574,92 +4822,13 @@ document.getElementById('q').addEventListener('input', e => {
     it.style.display = (!q || it.dataset.k.includes(q)) ? (q ? 'block' : '') : 'none');
 });
 
-/* ───────── 화면 렌더 ───────── */
-const work = document.getElementById('work');
-const journal = [];
-
-function openScreen(s, itEl, nm, note) {
-  CUR = { s, nm: nm || s.svc };
-  document.querySelectorAll('#menu .itm').forEach(e=>e.classList.remove('on'));
-  if (itEl) itEl.classList.add('on');
-  const cd = scrCode(s);
-  document.getElementById('tabname').textContent = `${nm || s.svc}`;
-  document.getElementById('scrno').textContent = cd;
-
-  const useTx = !READONLY.test(s.svc);
-  const rows = (s.in.length ? s.in : []).map((f,i) =>
-    `<tr><th>${LBL[f]||f}<span class="fldcd">${f}</span></th>
-       <td><input type="text" id="f_${i}" data-fld="${f}" value="${dflt(f)}"></td></tr>`).join('')
-    || `<tr><th>입력</th><td style="color:#889">입력 필드 없음 — 즉시 실행</td></tr>`;
-  const outHint = s.out.length ? s.out.map(f=>LBL[f]||f).join(', ') : '-';
-
-  work.innerHTML = `
-    <div class="panel"><h3>${cd} · ${nm || s.svc} — <span style="font-weight:normal;color:#667">${s.desc || note || ''}</span></h3>
-      <div class="bd">
-        <table class="frm">
-          <tr><th>서비스명</th><td><b>${s.svc}</b> <span class="fldcd">(${s.modnm} 모듈 · ${s.mod}_svr)</span></td></tr>
-          ${rows}
-          <tr><th>글로벌 XA</th><td><label><input type="checkbox" id="usetx" ${useTx?'checked':''}> tpbegin / tpcommit (2PC)</label></td></tr>
-        </table>
-        <div style="margin-top:6px;color:#889">응답 필드: ${outHint}</div>
-        <div class="btnrow">
-          <button onclick="resetForm()">초기화</button>
-          <button class="pri" onclick="execute()">실행 (tpcall)</button>
-        </div>
-      </div>
-    </div>
-    <div class="panel"><h3>처리 결과 (응답 전문 UBF)</h3>
-      <div class="bd"><table class="grd" id="resgrid"><tr><th style="width:200px">필드</th><th>값</th></tr>
-        <tr><td colspan="2" style="color:#999">실행 전</td></tr></table></div>
-    </div>
-    <div class="panel"><h3>거래 저널 (금일 호출이력)</h3>
-      <div class="bd"><table class="grd" id="jgrid">
-        <tr><th>시각</th><th>화면</th><th>서비스</th><th>XA</th><th>결과</th><th>요약</th></tr></table></div>
-    </div>`;
-  renderJournal();
-}
-
-function resetForm(){ const on = document.querySelector('#menu .itm.on'); openScreen(CUR.s, on, CUR.nm); }
-
-async function execute() {
-  const { s } = CUR;
-  const useTx = document.getElementById('usetx').checked ? 1 : 0;
-  const p = new URLSearchParams({ svc: s.svc, _tx: useTx });
-  s.in.forEach((f,i) => {
-    const v = document.getElementById('f_'+i)?.value;
-    if (v !== undefined && v !== '') p.append(f, v);
-  });
-  setStatus(`tpcall("${s.svc}") 호출 중 ...`);
-  let j;
-  try { j = await (await fetch('api/call?' + p.toString())).json(); }
-  catch (e) { j = { ok:false, error: String(e) }; }
-
-  const g = document.getElementById('resgrid');
-  g.innerHTML = '<tr><th style="width:200px">필드</th><th>값</th></tr>';
-  if (j.ok) {
-    const f = j.fields || {};
-    if (!Object.keys(f).length) g.innerHTML += '<tr><td colspan="2">(응답 필드 없음 — 정상 처리)</td></tr>';
-    for (const [k,v] of Object.entries(f))
-      g.innerHTML += `<tr><td>${LBL[k.replace('#','')]||k} <span class="fldcd">${k}</span></td><td class="num">${fmt(k,v)}</td></tr>`;
-    setStatus(`tpcall("${s.svc}") 정상 처리${useTx?' · XA tpcommit 완료(2PC)':''}`);
-  } else {
-    g.innerHTML += `<tr><td>오류</td><td class="err">${j.error||'unknown'}</td></tr>`;
-    setStatus(`tpcall("${s.svc}") 실패`, true);
-  }
-  journal.unshift({ t:new Date().toLocaleTimeString('ko-KR'), cd:scrCode(s), svc:s.svc, tx:useTx?'Y':'N',
-                    ok:j.ok, sum: j.ok ? summarize(j.fields) : (j.error||'').slice(0,70) });
-  renderJournal();
-}
-
-function fmt(k, v){ return /AMOUNT|FEE|NET|GROSS|AMT|TAX|DELTA/.test(k) && /^\-?\d+$/.test(v) ? Number(v).toLocaleString('ko-KR') : v; }
-function summarize(f){ if(!f) return ''; return Object.entries(f).slice(0,4).map(([k,v])=>`${k}=${v}`).join(' '); }
-function renderJournal(){
-  const g = document.getElementById('jgrid'); if (!g) return;
-  g.innerHTML = '<tr><th>시각</th><th>화면</th><th>서비스</th><th>XA</th><th>결과</th><th>요약</th></tr>' +
-    journal.map(r=>`<tr><td>${r.t}</td><td>${r.cd}</td><td>${r.svc}</td><td>${r.tx}</td>
-      <td class="${r.ok?'ok':'err'}">${r.ok?'정상':'오류'}</td><td>${r.sum}</td></tr>`).join('');
-}
-function setStatus(m, err){ const e=document.getElementById('stmsg'); e.textContent=m; e.style.color=err?'#c22':'#345'; }
+/* 시작: 대시보드 (+ 해시로 특정 화면: #q=QR0101 / #s=ACQUIRE / #m=1 가맹점관리) */
+setTimeout(() => {
+  openQueryTab(QSCREENS[0]);
+  const h = location.hash;
+  if (h.startsWith('#q=')) { const q = QSCREENS.find(x=>x.cd===h.slice(3)); if (q) openQueryTab(q); }
+  if (h.startsWith('#s=')) { const s = bySvc[h.slice(3)]; if (s) openSvcTab(s); }
+}, 0);
 </script>
 </body>
 </html>