Preserve latest comparison functionality

templates/wehago_compare.html

@@ -466,6 +466,12 @@
         margin-left: 0;
     }
 
+    .status-card[data-count-pending="true"] .status-value {
+        color: #64748b;
+        font-size: 13px;
+        line-height: 1.15;
+    }
+
     .status-card[data-status="matched"] {
         background: #f7faf8;
         border-color: #d2ddd6;
@@ -1640,15 +1646,17 @@
                     class="status-card"
                     data-target="detail-{{ section.key }}"
                     data-status="{{ section.key }}"
+                    data-count-pending="{% if wehago_compare.pending and section.count == 0 %}true{% else %}false{% endif %}"
                     aria-expanded="false"
                 >
                     <span class="status-label">{{ section.label }}</span>
-                    <span class="status-value">{{ "{:,}".format(section.count) }}</span>
+                    <span class="status-value">
+                        {% if wehago_compare.pending and section.count == 0 %}갱신 중{% else %}{{ "{:,}".format(section.count) }}{% endif %}
+                    </span>
                 </button>
                 {% endif %}
                 {% endfor %}
             </div>
-
             <div class="detail-stack">
                 {% for section in wehago_compare.metric_sections %}
                 {% if section.key in ['voucher_matched', 'voucher_unmatched', 'voucher_recheck', 'voucher_excepted', 'hanmac_unconnected', 'erp_voucher_matched', 'erp_voucher_unmatched'] %}
@@ -2024,12 +2032,22 @@
 
         const getColumnClass = (field) => `col-${String(field || '').replace(/[^a-zA-Z0-9_]/g, '_')}`;
 
-        const renderVoucherDetailTable = (group) => {
-            if (!voucherDetailTableWrap) return;
-            const rows = Array.isArray(group?.rows) ? group.rows : [];
-            const lineColumns = [
+        const getVoucherLineColumns = (statusKey = '') => {
+            if (statusKey === 'hanmac_unconnected') {
+                return [
+                    ['fiscal_year', '연도'],
+                    ['proof_date', 'Hanmac 일자'],
+                    ['voucher_no', '확정전표번호'],
+                    ['draft_no', '가전표번호'],
+                    ['voucher_account_name', 'Hanmac 계정'],
+                    ['voucher_vendor', 'Hanmac 거래처'],
+                    ['voucher_debit', 'Hanmac 차변'],
+                    ['voucher_credit', 'Hanmac 대변'],
+                    ['voucher_desc', 'Hanmac 적요'],
+                ];
+            }
+            return [
                 ['fiscal_year', '연도'],
-                ['status_label', '구분'],
                 ['ledger_date', 'WEHAGO 일자'],
                 ['voucher_no', '전표번호'],
                 ['draft_no', '가전표번호'],
@@ -2044,6 +2062,16 @@
                 ['ledger_desc', 'WEHAGO 적요'],
                 ['voucher_desc', 'ERP 적요'],
             ];
+        };
+
+        const renderVoucherDetailTable = (group) => {
+            if (!voucherDetailTableWrap) return;
+            const rows = Array.isArray(group?.rows) ? group.rows : [];
+            const isHanmacUnconnected = String(group?.summary?.status_label || '').toLowerCase() === 'hanmac unconnected';
+            const lineColumns = [
+                ['status_label', '구분'],
+                ...getVoucherLineColumns(isHanmacUnconnected ? 'hanmac_unconnected' : ''),
+            ];
             if (!rows.length) {
                 voucherDetailTableWrap.innerHTML = '<div class="table-placeholder">표시할 상세 행이 없습니다.</div>';
                 return;
@@ -2335,22 +2363,7 @@
                     });
                 });
             };
-            const lineColumns = [
-                ['fiscal_year', '연도'],
-                ['ledger_date', 'WEHAGO 일자'],
-                ['voucher_no', '전표번호'],
-                ['draft_no', '가전표번호'],
-                ['ledger_account_name', 'WEHAGO 계정'],
-                ['voucher_account_name', 'ERP 계정'],
-                ['ledger_vendor', 'WEHAGO 거래처'],
-                ['voucher_vendor', 'ERP 거래처'],
-                ['ledger_debit', 'WEHAGO 차변'],
-                ['ledger_credit', 'WEHAGO 대변'],
-                ['voucher_debit', 'ERP 차변'],
-                ['voucher_credit', 'ERP 대변'],
-                ['ledger_desc', 'WEHAGO 적요'],
-                ['voucher_desc', 'ERP 적요'],
-            ];
+            const lineColumns = getVoucherLineColumns(statusKey);
             const stripAccountCodePrefix = (value) => {
                 const text = String(value ?? '');
                 return text
@@ -2746,8 +2759,13 @@
             sections.forEach((section) => {
                 const card = document.querySelector(`.status-card[data-status="${escapeSelectorValue(section.key || '')}"]`);
                 const valueNode = card?.querySelector('.status-value');
+                const countValue = Number(section.count || 0);
+                const isPendingCount = Boolean(payload?.pending) && countValue === 0;
+                if (card) {
+                    card.dataset.countPending = isPendingCount ? 'true' : 'false';
+                }
                 if (valueNode) {
-                    valueNode.textContent = Number(section.count || 0).toLocaleString();
+                    valueNode.textContent = isPendingCount ? '갱신 중' : countValue.toLocaleString();
                 }
             });
             const lastAction = payload?.last_action;