EasyLink 商戶入網申請 - 專業支付申請平台

??/div>

甇?撽??餉?蝣潘?隢???..

?? ??亦雯?唾?銵?/h2>
經營地址證明（最多5個文件）* ??雿敹‵??/p>

1?? ?砍?辣 & OCR

2基本資訊

3經營信息

4結算信息

5提交審核

公司文件上傳 & OCR 識別

註冊公司必須文件，支持PDF, JPG, PNG 格式，單個文件不超過 10MB

店鋪外觀及內部照片 3-5 張

平均交易金額 (HKD)*

??

收貨方式

提示：請在 BR 上查找地址並填寫

?砍閮餃?霅???CI 嚗???賊?剁?

公司註冊證書 (CI)

??

收貨方式

如有最終受益人涉及複雜股權結構，請提供相關結構圖

瘜犖/???頨思遢霅?* 嚗?憭?2 ??隞塚?甇????ｇ?

?牧

請點擊下方按鈕前往 WhatsApp，發送驗證碼完成身份認證。
僅支持 PDF, JPG, PNG 格式，單個文件不超過 10MB

?銵?蝯 *

?

收貨方式

僅支持 PDF, JPG, PNG 格式，單個文件不超過 10MB，最多5個文件

?砍?辣嚗???賊?剁?

周年申報表 (NAR1)

??

收貨方式

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

公司章程 (M&A)

??

暺????暹?隞嗉甇方?銝

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

頨思遢霅??辣

提示：請在 BR 上查找登記號碼並填寫

?牧

暺????暹?隞嗉甇方?銝

上傳文件後，系統將自動識別並提取關鍵資料，減少手動輸入

蝬??湔?霅?

蝬??湔??抒?嚗?憭?5 ??隞塚?

?

暺????暹?隞嗉甇方?銝

僅支持 PDF, JPG, PNG 格式，單個文件不超過 10MB，最多2個文件

蝘???

??

暺????暹?隞嗉甇方?銝

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

璆剖??膩

銀行月結單

璆剖??膩?辣

??

暺????暹?隞嗉甇方?銝

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

?Ｗ硫?砍 / ?⊥?蝯?

?Ｗ硫?砍霅?
填寫商戶基本註冊信息（如已使用 OCR 識別，部分資料已自動填入，請檢查）

??

暺????暹?隞嗉甇方?銝

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

?⊥?蝯???/label>
EasyLink 專業支付申請平台 · 香港特別行政區

??

暺????暹?隞嗉甇方?銝

?舀? PDF, JPG, PNG ?澆?嚗?憭?10MB

?? ?箸鞈?

最多3個文件，僅支持 PDF, JPG, PNG 格式，單個文件不超過 10MB

??迂 * 商業登記證 (BR)

?蝪∠迂 ?憿? *

銵平憿? *

平均交易金額 (HKD)*
僅支持 PDF, JPG, PNG 格式，單個文件不超過 10MB

?砍閮餃?蝺刻?

閮餃??啣? *
香港特別行政區 · 專業支付申請平台

蝬??啣? * 平均交易金額 (HKD)

? ???/瘜犖鞈?

???憪? ? 隢??扯澈隞質?銝?憪?憛怠神

????瑚?

???頨思遢霅?蝣?/label>
? 隢??扯澈隞質?銝??Ⅳ憛怠神

????餉店

????駁

? 蝬?靽⊥

憛怠神?亙虜蝬??賊?靽⊥

???漱?? (HKD) *

撟喳?鈭斗??? (HKD) *

公司網站/網店 URL

銝餉??Ｗ?/??

?平??

?嗉疏?孵?

? 蝯?靽⊥

閮剔蔭鈭斗?蝯??銵閉??/p>

有效期內的商業登記證

?銵?蝔?*

?銵閉?嗅?蝔?* ?銵閉??* ??隞?Ⅳ 蝯?撟?車 *

???漱撖拇

公司文件

?舐鼠鈭箏???*

?舐鼠鈭箄雿?/label>

?舐鼠鈭粹閰?(WhatsApp)
?

WhatsApp 撽?

提交審核

?舐鼠鈭粹??*

鋆?隤芣?嚗憛恬? <label style="display: flex; align-items: flex-start; gap: 12px; cursor: pointer;"> <input type="checkbox" id="agreement" style="width: 20px; height: 20px; margin-top: 2px; accent-color: var(--primary);"> <span style="font-size: 14px; line-height: 1.5;"> 行業類型 </span> </label> </div> </div> </div> <div style="margin-bottom: 16px;"> <div id="turnstile-widget"></div> <div id="turnstile-error" style="color: var(--danger); font-size: 13px; margin-top: 8px; display: none;">隢??犖璈?霅???鈭?/div> </div> <div class="action-bar"> <button type="button" class="gov-btn gov-btn-secondary" onclick="goToStep(4)">??銝?甇?/button> <button type="button" class="gov-btn gov-btn-success" id="btnSubmit" onclick="startSubmitProcess()"> ?? ?漱?唾? </button> </div> </div> </form> </div>  <div id="tabChecklist" class="tab-content" style="display: none;"> <div class="gov-page-title"> <h2>?? ??亦雯?辣皜</h2> <p>隱私政策</p> </div> <div class="gov-alert gov-alert-info"> <strong>上傳必要的公司證明文件（PDF, JPG, PNG 格式，每個文件不超過 10MB） </div> <div style="margin-bottom: 20px;"> <button class="gov-btn gov-btn-primary" id="btnOffline" onclick="setBusinessType('offline')">提交申請</button> <button class="gov-btn gov-btn-secondary" id="btnOnline" onclick="setBusinessType('online')" style="margin-left: 10px;">?? 蝺??</button> </div> <div class="checklist-container"> <div class="checklist-panel"> <div class="checklist-panel-header" id="checklistTitle">蝺???辣皜嚗???</div> <div class="checklist-panel-body" id="checklistBody">  </div> </div> <div class="checklist-panel"> <div class="checklist-panel-header">? WhatsApp ??閮</div> <div class="checklist-panel-body"> <p style="font-size: 14px; color: var(--text-muted); margin-bottom: 12px;">退款政策 <button class="gov-btn gov-btn-accent gov-btn-sm" onclick="generateWhatsAppMessage()">?? WhatsApp 閮</button> <button class="gov-btn gov-btn-secondary gov-btn-sm" onclick="copyMessage()" style="margin-left: 8px;">?? 銴ˊ閮</button> <div class="message-box" id="messageBox" style="display: none;"></div> </div> </div> </div> </div> </div> </main>  <div class="modal-overlay" id="verifyModal"> <div class="modal"> <div class="modal-icon" id="verifyModalIcon">??</div> <h3 class="modal-title" id="verifyModalTitle">WhatsApp 身份驗證</h3> <p class="modal-text" id="verifyModalText"> 📄 公司文件上傳 </p> <div id="verifyModalContent"> <div class="verify-code-display" id="verifyCodeDisplay" style="display: none;">------</div> <div style="display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 16px;"> <button class="gov-btn gov-btn-primary" id="btnOpenWa" onclick="openWhatsAppDeepLink()" style="display: none;"> 重新發送 WhatsApp 驗證 </button> <button class="gov-btn gov-btn-secondary" id="btnCopyMsg" onclick="copyVerificationMessage()" style="display: none;"> ?? 銴ˊ撽?閮 </button> </div> <div class="verify-status pending" id="verifyStatusBox" style="display: none;"> 正在等待驗證... 請在 WhatsApp 發送驗證碼，系統將自動檢測</span>/60嚗? </div> </div> </div> </div>  <div class="modal-overlay" id="successModal"> <div class="modal"> <div class="modal-icon">??</div> <h3 class="modal-title">?唾??漱??嚗?/h3> <p class="modal-text"> ?函??唾?撌脫???鈭扎?br> ?唾?蝺刻?嚗?strong id="modalAppId" style="font-size: 18px; color: var(--primary);"></strong><br><br> 隱私政策 </p> <button class="gov-btn gov-btn-primary" onclick="location.reload()">摰?</button> </div> </div> <footer class="gov-footer"> <p>實際擁有人身份證（持股5%以上，最多2個文件）</p> <p style="margin-top: 4px; opacity: 0.7;">穢 2026 EasyLink. All rights reserved. | <a href="#" style="color: rgba(255,255,255,0.7);">蝘?輻?</a> | <a href="#" style="color: rgba(255,255,255,0.7);">??璇狡</a></p> </footer> <script> const API_BASE = 'https://api-agent.jkdcoding.com'; const TURNSTILE_SITE_KEY = '0x4AAAAAADMHLknxPE8M5Ikp'; // <-- 憛怠雿? Cloudflare Turnstile Site Key (?祇??航?) // Turnstile widget render let turnstileToken = null; function renderTurnstile() { if (!TURNSTILE_SITE_KEY) return; const container = document.getElementById('turnstile-widget'); if (!container || container.hasChildNodes()) return; turnstile.ready(function() { turnstile.render('#turnstile-widget', { sitekey: TURNSTILE_SITE_KEY, callback: function(token) { turnstileToken = token; }, 'expired-callback': function() { turnstileToken = null; }, 'error-callback': function() { turnstileToken = null; } }); }); } async function getUploadToken() { try { const response = await fetch(`${API_BASE}/api/v1/public/upload-token`, { method: 'POST' }); const result = await response.json(); if (result.success && result.token) { return result.token; } } catch (e) { console.error('Get upload token error:', e); } return null; } const urlParams = new URLSearchParams(window.location.search); const rcodeFull = urlParams.get('rcode'); const rcode = rcodeFull ? rcodeFull.substring(0, 4) : null; let currentAgent = null; let currentStep = 1; const totalSteps = 5; let currentBusinessType = 'offline'; let isVerified = false; let currentVerifyCode = ''; let pollInterval = null; let pollAttempts = 0; const MAX_POLL_ATTEMPTS = 60; let extractedData = { br: null, id: null }; let pendingOCRData = null; let uploadedFiles = {}; const MAX_FILE_SIZE = 10 * 1024 * 1024; const ALLOWED_TYPES = ['.pdf', '.jpg', '.jpeg', '.png']; const LS_KEY = 'chklist_form_progress_' + (rcode || 'guest'); const checklistData = { offline: [ { id: 'br', label: '?平?餉?霅?(BR)', note: '?????璆剔閮?' }, { id: 'ci', label: '?砍閮餃?霅???(CI)', note: '???砍???' }, { id: 'nar1', label: '?典僑?喳銵?(NAR1)', note: '?餈??撟渡?梯”' }, { id: 'ma', label: '?砍蝡? (MA)', note: 'Memorandum & Articles of Association' }, { id: 'bank', label: '?銵?瘞渲???, note: '?餈?1-3 ???銵?蝯' }, { id: 'id', label: '???/瘜犖頨思遢霅?, note: '??鈭?頨思遢霅?? }, { id: 'photo', label: '蝬??湔??抒?', note: '摨憭???函??3-5 撘? } ], online: [ { id: 'br', label: '?平?餉?霅?(BR)', note: '?????璆剔閮?' }, { id: 'ci', label: '?砍閮餃?霅???(CI)', note: '???砍???' }, { id: 'nar1', label: '?典僑?喳銵?(NAR1)', note: '?餈??撟渡?梯”' }, { id: 'ma', label: '?砍蝡? (MA)', note: 'Memorandum & Articles of Association' }, { id: 'bank', label: '?銵?瘞渲???, note: '?餈?1-3 ???銵?蝯' }, { id: 'id', label: '???/瘜犖頨思遢霅?, note: '??鈭?頨思遢霅?? }, { id: 'photo', label: '蝬??湔??抒?', note: '摨憭???函??3-5 撘? }, { id: 'website', label: '蝬脩??芸?', note: '蝬脩?擐?????芸?' }, { id: 'refund', label: '?甈暹蝑?, note: '蝬脩?銝??甈??鞎冽蝑??? } ] }; async function init() { document.getElementById('loadingState').style.display = 'none'; document.getElementById('contentArea').style.display = 'block'; renderChecklist(); setupDragAndDrop(); switchTab('apply'); restoreFormProgress(); if (!rcode) { document.getElementById('agentBadge').textContent = '隢撓?亦閮Ⅳ'; return; } try { const response = await fetch(`${API_BASE}/api/v1/public/agent?rcode=${encodeURIComponent(rcode)}`); const result = await response.json(); if (result.success && result.agent) { currentAgent = result.agent; document.getElementById('agentBadge').textContent = `?餉?蝣? ${rcodeFull}`; } else { document.getElementById('agentBadge').textContent = `?餉?蝣? ${rcodeFull}`; } } catch (error) { console.error('Init error:', error); document.getElementById('agentBadge').textContent = `?餉?蝣? ${rcodeFull}`; } } function switchTab(tab) { document.querySelectorAll('.gov-nav-item').forEach(el => el.classList.remove('active')); document.querySelector(`[data-tab="${tab}"]`).classList.add('active'); document.querySelectorAll('.tab-content').forEach(el => el.style.display = 'none'); document.getElementById('tab' + tab.charAt(0).toUpperCase() + tab.slice(1)).style.display = 'block'; } function setBusinessType(type) { currentBusinessType = type; document.getElementById('btnOffline').className = type === 'offline' ? 'gov-btn gov-btn-primary' : 'gov-btn gov-btn-secondary'; document.getElementById('btnOnline').className = type === 'online' ? 'gov-btn gov-btn-primary' : 'gov-btn gov-btn-secondary'; renderChecklist(); } function renderChecklist() { const items = checklistData[currentBusinessType]; document.getElementById('checklistTitle').textContent = (currentBusinessType === 'offline' ? '蝺?' : '蝺?') + `??辣皜嚗?{items.length}??`; document.getElementById('checklistBody').innerHTML = items.map(item => ` <div class="checklist-item"> <input type="checkbox" id="chk_${item.id}" data-label="${item.label}"> <label for="chk_${item.id}">${item.label}</label> <span class="note">${item.note}</span> </div> `).join(''); } function generateWhatsAppMessage() { const checked = document.querySelectorAll('.checklist-item input:checked'); const unchecked = document.querySelectorAll('.checklist-item input:not(:checked)'); const checkedItems = Array.from(checked).map(chk => chk.dataset.label); const uncheckedItems = Array.from(unchecked).map(chk => { const label = chk.dataset.label; const note = chk.closest('.checklist-item').querySelector('.note').textContent; return `${label}嚗?{note}嚗; }); let message = `?asyLink ??亦雯?辣皜?n\n`; message += `璆剖?憿?: ${currentBusinessType === 'offline' ? '蝺??' : '蝺??'}\n`; message += `?餉?蝣? ${rcodeFull}\n\n`; if (checkedItems.length > 0) { message += `??撌脫???(${checkedItems.length}??:\n${checkedItems.map(i => '??' + i).join('\n')}\n\n`; } if (uncheckedItems.length > 0) { message += `??敺???(${uncheckedItems.length}??:\n${uncheckedItems.map(i => '??' + i).join('\n')}\n\n`; } message += `隢敹急???餈唳?隞塚?摰?敺??隞乩?????漱?唾?:\n`; message += `${window.location.href}`; const box = document.getElementById('messageBox'); box.innerHTML = `<div class="message-box-header">撌脩?????/div>${escapeHtml(message)}`; box.style.display = 'block'; return message; } function copyMessage() { const message = generateWhatsAppMessage(); navigator.clipboard.writeText(message).then(() => { alert('閮撌脰?鋆賢?芾票蝪?); }).catch(() => { alert('發送失敗，請重試'); }); } function goToStep(step) { if (step > currentStep && !validateStep(currentStep)) { return; } document.getElementById(`wizard-step-${currentStep}`).classList.remove('active'); document.querySelector(`.step[data-step="${currentStep}"]`).classList.remove('active'); if (step > currentStep) { document.querySelector(`.step[data-step="${currentStep}"]`).classList.add('completed'); } else if (step < currentStep) { for (let i = step + 1; i <= currentStep; i++) { document.querySelector(`.step[data-step="${i}"]`).classList.remove('completed'); } } currentStep = step; document.getElementById(`wizard-step-${currentStep}`).classList.add('active'); document.querySelector(`.step[data-step="${currentStep}"]`).classList.add('active'); // Render Turnstile when reaching the final step if (step === 5 && TURNSTILE_SITE_KEY) { renderTurnstile(); } window.scrollTo({ top: 0, behavior: 'smooth' }); saveFormProgress(); } function validateStep(step) { let valid = true; const stepEl = document.getElementById(`wizard-step-${step}`); stepEl.querySelectorAll('.field-error').forEach(el => el.classList.remove('field-error')); if (step === 1) { if (!uploadedFiles.br_certificate || uploadedFiles.br_certificate.length === 0) { alert('請上傳商業登記證'); valid = false; } if (!uploadedFiles.director_id || uploadedFiles.director_id.length === 0) { alert('隢??單?鈭????頨思遢霅?); valid = false; } if (!uploadedFiles.bank_statement || uploadedFiles.bank_statement.length === 0) { alert('請上傳身份證'); valid = false; } const merchantType = document.getElementById('merchant_type').value; if (merchantType === 'limited') { if (!uploadedFiles.ci_certificate || uploadedFiles.ci_certificate.length === 0) { alert('請上傳公司註冊證書 (CI)'); valid = false; } } } if (step === 2) { const required = ['merchant_name', 'merchant_type', 'industry_type', 'br_number', 'registered_address', 'business_address']; for (const id of required) { const el = document.getElementById(id); if (!el.value.trim()) { el.classList.add('field-error'); valid = false; } } } if (step === 3) { const required = ['monthly_volume', 'avg_transaction']; for (const id of required) { const el = document.getElementById(id); if (!el.value.trim()) { el.classList.add('field-error'); valid = false; } } } if (step === 4) { const required = ['bank_name', 'account_name', 'account_number']; for (const id of required) { const el = document.getElementById(id); if (!el.value.trim()) { el.classList.add('field-error'); valid = false; } } } if (!valid) { const firstError = stepEl.querySelector('.field-error'); if (firstError) firstError.focus(); } return valid; } // ===== business_address toggle ===== function toggleBusinessAddress() { const same = document.getElementById('sameAsRegistered').checked; const ba = document.getElementById('business_address'); if (same) { ba.value = document.getElementById('registered_address').value; ba.disabled = true; ba.style.background = 'var(--bg)'; } else { ba.disabled = false; ba.style.background = 'white'; } saveFormProgress(); } // ===== LocalStorage ===== function saveFormProgress() { const data = { step: currentStep, fields: {}, uploadedFiles: uploadedFiles, extractedData: extractedData, timestamp: Date.now() }; const fieldIds = [ 'merchant_name', 'merchant_short_name', 'merchant_type', 'industry_type', 'br_number', 'cr_number', 'registered_address', 'business_address', 'director_name', 'director_position', 'director_id_number', 'director_phone', 'director_email', 'monthly_volume', 'avg_transaction', 'website', 'products', 'business_hours', 'delivery_method', 'bank_name', 'account_name', 'account_number', 'branch_code', 'settlement_currency', 'contact_name', 'contact_position', 'contact_phone', 'contact_email', 'notes' ]; fieldIds.forEach(id => { const el = document.getElementById(id); if (el) data.fields[id] = el.value; }); const cb = document.getElementById('sameAsRegistered'); if (cb) data.sameAsRegistered = cb.checked; try { localStorage.setItem(LS_KEY, JSON.stringify(data)); } catch (e) { console.error('localStorage save failed:', e); } } function restoreFormProgress() { try { const saved = localStorage.getItem(LS_KEY); if (!saved) return; const data = JSON.parse(saved); if (data.fields) { Object.entries(data.fields).forEach(([id, value]) => { const el = document.getElementById(id); if (el) el.value = value || ''; }); } if (data.uploadedFiles) { uploadedFiles = data.uploadedFiles; Object.entries(uploadedFiles).forEach(([field, files]) => { const container = document.getElementById('list-' + field); if (!container) return; container.innerHTML = ''; files.forEach(f => { const item = document.createElement('div'); item.className = 'gov-file-item'; item.innerHTML = ` <div class="file-info"> <span>??/span> <div> <div>${escapeHtml(f.name)}</div> <div style="font-size:12px;color:var(--text-muted);">${formatFileSize(f.size)}</div> </div> </div> <button type="button" class="file-remove" onclick="removeFile(this, '${field}')">??/button> `; container.appendChild(item); }); }); } if (data.extractedData) { extractedData = data.extractedData; } if (data.sameAsRegistered !== undefined) { const cb = document.getElementById('sameAsRegistered'); if (cb) { cb.checked = data.sameAsRegistered; toggleBusinessAddress(); } } if (data.step && data.step > 1) { for (let i = 1; i < data.step; i++) { document.querySelector(`.step[data-step="${i}"]`).classList.add('completed'); } goToStep(data.step); } } catch (e) { console.error('localStorage restore failed:', e); } } function clearFormProgress() { try { localStorage.removeItem(LS_KEY); } catch (e) { console.error('localStorage clear failed:', e); } } // ===== WhatsApp Verification ===== function generateVerifyCode() { const chars = 'ABCDEFGHJKMNPQRSTUVWXYZ23456789'; let code = ''; for (let i = 0; i < 6; i++) { code += chars.charAt(Math.floor(Math.random() * chars.length)); } return code; } function isMobile() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); } async function startSubmitProcess() { for (let i = 1; i <= totalSteps; i++) { if (!validateStep(i)) { goToStep(i); return; } } if (!document.getElementById('agreement').checked) { alert('請同意條款'); return; } if (isVerified) { submitForm(); return; } openVerifyModal(); } function openVerifyModal() { const modal = document.getElementById('verifyModal'); document.getElementById('verifyModalIcon').textContent = '??'; document.getElementById('verifyModalTitle').textContent = 'WhatsApp 頨思遢撽?'; document.getElementById('verifyModalText').textContent = '隢????寞???敺 WhatsApp嚗??霅Ⅳ摰?頨思遢隤???; document.getElementById('verifyCodeDisplay').style.display = 'none'; document.getElementById('btnOpenWa').style.display = 'none'; document.getElementById('btnCopyMsg').style.display = 'none'; document.getElementById('verifyStatusBox').style.display = 'none'; modal.classList.add('active'); startWhatsAppVerification(); } async function startWhatsAppVerification() { currentVerifyCode = generateVerifyCode(); try { const response = await fetch(`${API_BASE}/api/v1/public/verify/request`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ code: currentVerifyCode }) }); const result = await response.json(); if (!result.success) { alert('??撽?憭望?: ' + (result.error || '隢?敺?閰?)); closeVerifyModal(); return; } } catch (error) { console.error('Verify request error:', error); alert('驗證失敗，請檢查網絡連接'); closeVerifyModal(); return; } document.getElementById('verifyCodeDisplay').textContent = currentVerifyCode; document.getElementById('verifyCodeDisplay').style.display = 'inline-block'; document.getElementById('btnOpenWa').style.display = 'inline-flex'; document.getElementById('btnCopyMsg').style.display = 'inline-flex'; document.getElementById('verifyStatusBox').style.display = 'block'; document.getElementById('verifyStatusBox').className = 'verify-status pending'; document.getElementById('verifyStatusBox').innerHTML = '??蝑?撽?銝?.. 隢 WhatsApp ?潮?霅Ⅳ嚗頂蝯勗??芸?瑼Ｘ葫嚗?span id="pollCount">0</span>/60嚗?; openWhatsAppDeepLink(); pollAttempts = 0; startPolling(); } function closeVerifyModal() { document.getElementById('verifyModal').classList.remove('active'); if (pollInterval) { clearInterval(pollInterval); pollInterval = null; } } function getWhatsAppDeepLink() { const text = `?末?撽??n\n撽?蝣潘?${currentVerifyCode}\n\n隢?亦?迨閮隞亙??澈隞賡?霅; const encodedText = encodeURIComponent(text); if (isMobile()) { return `https://wa.me/85268810677?text=${encodedText}`; } else { return `https://web.whatsapp.com/send?phone=85268810677&text=${encodedText}`; } } function openWhatsAppDeepLink() { const link = getWhatsAppDeepLink(); if (isMobile()) { window.location.href = link; } else { window.open(link, '_blank'); } } function copyVerificationMessage() { const message = `?末?撽??n\n撽?蝣潘?${currentVerifyCode}\n\n隢?亦?迨閮隞亙??澈隞賡?霅; navigator.clipboard.writeText(message).then(() => { alert('撽?閮撌脰?鋆賢?芾票蝪選?隢票銝 WhatsApp ?潮?); }).catch(() => { alert('銴ˊ憭望?嚗???銴ˊ撽?蝣?); }); } function startPolling() { if (pollInterval) clearInterval(pollInterval); pollInterval = setInterval(async () => { pollAttempts++; const countEl = document.getElementById('pollCount'); if (countEl) countEl.textContent = pollAttempts; if (pollAttempts > MAX_POLL_ATTEMPTS) { clearInterval(pollInterval); const statusBox = document.getElementById('verifyStatusBox'); if (statusBox) { statusBox.className = 'verify-status error'; statusBox.innerHTML = '??撽?頞???暺???敺 WhatsApp 撽????啁??霅Ⅳ嚗?暺???鋆賡?霅??胯??票銝?; } return; } try { const response = await fetch(`${API_BASE}/api/v1/public/verify/status?code=${currentVerifyCode}`); const result = await response.json(); if (result.verified) { clearInterval(pollInterval); isVerified = true; const phone = result.phone || ''; document.getElementById('contact_phone').value = phone; document.getElementById('verifyModalIcon').textContent = '??; document.getElementById('verifyModalTitle').textContent = '撽???嚗?; document.getElementById('verifyModalText').textContent = 'WhatsApp 撽???嚗迤?冽?鈭斤隢?..'; document.getElementById('verifyModalContent').style.display = 'none'; setTimeout(() => { closeVerifyModal(); submitForm(); }, 1500); } } catch (error) { console.error('Poll error:', error); } }, 5000); } // ===== File Upload (with OCR auto-trigger) ===== function setupDragAndDrop() { document.querySelectorAll('.gov-file-upload').forEach(uploadArea => { const input = uploadArea.querySelector('input[type="file"]'); if (!input) return; ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => { uploadArea.addEventListener(eventName, preventDefaults, false); }); ['dragenter', 'dragover'].forEach(eventName => { uploadArea.addEventListener(eventName, () => uploadArea.classList.add('dragover'), false); }); ['dragleave', 'drop'].forEach(eventName => { uploadArea.addEventListener(eventName, () => uploadArea.classList.remove('dragover'), false); }); uploadArea.addEventListener('drop', (e) => { const dt = e.dataTransfer; const files = dt.files; handleFiles(files, input); }, false); }); } function preventDefaults(e) { e.preventDefault(); e.stopPropagation(); } function handleFileSelect(event) { const input = event.target; const files = input.files; handleFiles(files, input); input.value = ''; } function handleFiles(files, input) { const fieldName = input.dataset.field; const maxFiles = parseInt(input.dataset.max) || 1; const container = document.getElementById('list-' + fieldName); Array.from(files).forEach(file => { const ext = '.' + file.name.split('.').pop().toLowerCase(); if (!ALLOWED_TYPES.includes(ext)) { showFileError(container, file.name, '銝???辣?澆?'); return; } if (file.size > MAX_FILE_SIZE) { showFileError(container, file.name, '?辣憭批?頞? 10MB ?'); return; } const currentCount = container.querySelectorAll('.gov-file-item:not(.error)').length; if (currentCount >= maxFiles) { showFileError(container, file.name, `?憭?賭???${maxFiles} ??隞跆); return; } uploadFile(file, fieldName, container); // OCR will be triggered after successful upload in uploadFile() function }); } async function runOCR(fileUrl, fieldName) { const previewId = fieldName === 'br_certificate' ? 'ocr-br-preview' : 'ocr-id-preview'; const previewEl = document.getElementById(previewId); if (!previewEl) return; previewEl.style.display = 'block'; previewEl.innerHTML = '<div style="background:#ebf8ff;border-left:3px solid var(--info);padding:10px 12px;font-size:13px;color:#2c5282;">請如實填寫以下資料</div>'; const docType = fieldName === 'br_certificate' ? 'br' : 'hkid'; try { // Render Turnstile if needed for OCR if (TURNSTILE_SITE_KEY && !turnstileToken) { renderTurnstile(); previewEl.innerHTML = '<div style="background:#fffaf0;border-left:3px solid var(--warning);padding:10px 12px;font-size:13px;color:#744210;">?? 隢?摰?銝?犖璈?霅????‵?亥”?柴???/div>'; return; } const payload = { fileUrl, docType }; if (TURNSTILE_SITE_KEY && turnstileToken) { payload.turnstileToken = turnstileToken; } const response = await fetch(`${API_BASE}/api/v1/public/extract-document`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); const result = await response.json(); if (!result.success) { throw new Error(result.error || '霅憭望?'); } const data = result.data || {}; const raw = result.raw || {}; let html = ''; const debugInfo = escapeHtml(JSON.stringify(raw, null, 2)).substring(0, 2000); if (docType === 'br') { html = ` <div style="background:#f0fff4;border:1px solid #c6f6d5;padding:12px;font-size:13px;"> <div style="font-weight:600;color:var(--success);margin-bottom:6px;">平均交易金額 (HKD) <div style="margin-bottom:4px;"><span style="color:var(--text-muted);">公司名稱</div> <div style="margin-bottom:4px;"><span style="color:var(--text-muted);">BR ?Ⅳ嚗?/span>${escapeHtml(data.br_number || '?芾???)}</div> <div style="margin-bottom:8px;"><span style="color:var(--text-muted);">?啣?嚗?/span>${escapeHtml(data.address || '?芾???)}</div> <button type="button" class="gov-btn gov-btn-success gov-btn-sm" onclick='fillExtractedData("br", ${JSON.stringify(data).replace(/'/g, "'")})'>??憛怠銵典</button> <details style="margin-top:8px;"><summary style="color:var(--text-muted);cursor:pointer;font-size:12px;">最近 3 個月內的月結單，支持 PDF, JPG, PNG 格式，最大 10MB<pre style="font-size:11px;background:#fff;padding:8px;margin-top:4px;overflow:auto;max-height:200px;">${debugInfo}</pre></details> </div> `; } else { html = ` <div style="background:#f0fff4;border:1px solid #c6f6d5;padding:12px;font-size:13px;"> <div style="font-weight:600;color:var(--success);margin-bottom:6px;">??頨思遢霅??亦???/div> <div style="margin-bottom:4px;"><span style="color:var(--text-muted);">憪?嚗?/span>${escapeHtml(data.name || '?芾???)}</div> <div style="margin-bottom:8px;"><span style="color:var(--text-muted);">頨思遢霅?蝣潘?</span>${escapeHtml(data.id_number || '?芾???)}</div> <button type="button" class="gov-btn gov-btn-success gov-btn-sm" onclick='fillExtractedData("hkid", ${JSON.stringify(data).replace(/'/g, "'")})'>??憛怠銵典</button> <details style="margin-top:8px;"><summary style="color:var(--text-muted);cursor:pointer;font-size:12px;">最近 3 個月內的月結單，支持 PDF, JPG, PNG 格式，最大 10MB<pre style="font-size:11px;background:#fff;padding:8px;margin-top:4px;overflow:auto;max-height:200px;">${debugInfo}</pre></details> </div> `; } previewEl.innerHTML = html; } catch (err) { console.error('OCR error:', err); previewEl.innerHTML = '<div style="background:#fffaf0;border-left:3px solid var(--warning);padding:10px 12px;font-size:13px;color:#744210;">?? ?芸?霅憭望?嚗??銝??隞嗆??‵撖怒?/div>'; } } function fileToBase64(file) { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.onload = () => resolve(reader.result); reader.onerror = reject; reader.readAsDataURL(file); }); } function fillExtractedData(docType, data) { if (docType === 'br') { if (data.company_name || data.business_name) { const el = document.getElementById('merchant_name'); if (el && !el.value) el.value = data.company_name || data.business_name; } if (data.br_number) { const el = document.getElementById('br_number'); if (el && !el.value) el.value = data.br_number; } if (data.address) { const el = document.getElementById('registered_address'); if (el && !el.value) { el.value = data.address; if (document.getElementById('sameAsRegistered').checked) { document.getElementById('business_address').value = data.address; } } } } else if (docType === 'hkid') { if (data.name) { const el = document.getElementById('director_name'); if (el && !el.value) el.value = data.name; // Auto-fill contact_name from director for small businesses const contactEl = document.getElementById('contact_name'); if (contactEl && !contactEl.value) contactEl.value = data.name; } if (data.id_number) { const el = document.getElementById('director_id_number'); if (el && !el.value) el.value = data.id_number; } // Default contact position to "???" for convenience const posEl = document.getElementById('contact_position'); if (posEl && !posEl.value) posEl.value = '???'; } saveFormProgress(); // Hide the preview after filling const previewId = docType === 'br' ? 'ocr-br-preview' : 'ocr-id-preview'; const previewEl = document.getElementById(previewId); if (previewEl) { previewEl.innerHTML = '<div style="background:#f0fff4;border-left:3px solid var(--success);padding:10px 12px;font-size:13px;color:#22543d;">已自動填寫表單資料，請確認資料正確 } } function showFileError(container, fileName, error) { const item = document.createElement('div'); item.className = 'gov-file-item error'; item.innerHTML = ` <div class="file-info"> <span>??/span> <div> <div>${escapeHtml(fileName)}</div> <div style="font-size:12px;color:var(--danger);">${error}</div> </div> </div> <button type="button" class="file-remove" onclick="this.closest('.gov-file-item').remove()">??/button> `; container.appendChild(item); setTimeout(() => item.remove(), 5000); } async function uploadFile(file, fieldName, container) { const item = document.createElement('div'); item.className = 'gov-file-item uploading'; item.innerHTML = ` <div class="file-info"> <span>??</span> <div> <div>${escapeHtml(file.name)}</div> <div style="font-size:12px;color:var(--text-muted);">${formatFileSize(file.size)}</div> </div> </div> <div class="file-progress"><div class="file-progress-bar" style="width:10%"></div></div> `; container.appendChild(item); try { // Get upload token first const uploadToken = await getUploadToken(); if (!uploadToken) { throw new Error('?⊥??脣?銝??嚗??瑟??岫'); } const formData = new FormData(); formData.append('file', file); formData.append('upload_token', uploadToken); const response = await fetch(`${API_BASE}/api/v1/public/upload`, { method: 'POST', body: formData }); const result = await response.json(); if (result.success && result.url) { item.classList.remove('uploading'); item.innerHTML = ` <div class="file-info"> <span>??/span> <div> <div>${escapeHtml(file.name)}</div> <div style="font-size:12px;color:var(--text-muted);">${formatFileSize(file.size)}</div> </div> </div> <button type="button" class="file-remove" onclick="removeFile(this, '${fieldName}')">??/button> `; if (!uploadedFiles[fieldName]) uploadedFiles[fieldName] = []; uploadedFiles[fieldName].push({ name: file.name, url: result.url, size: file.size }); // 銝 CI 敺?身蝵桀??園?????砍 if (fieldName === 'ci_certificate') { const mt = document.getElementById('merchant_type'); if (mt) { mt.value = 'limited'; } } saveFormProgress(); // Trigger OCR after successful upload for images (not PDF) const ext = '.' + file.name.split('.').pop().toLowerCase(); if ((fieldName === 'br_certificate' || fieldName === 'director_id') && ext !== '.pdf') { runOCR(result.url, fieldName); } } else { throw new Error(result.error || 'Upload failed'); } } catch (error) { item.remove(); showFileError(container, file.name, '銝憭望?嚗??岫'); console.error('Upload error:', error); } } function removeFile(btn, fieldName) { btn.closest('.gov-file-item').remove(); if (uploadedFiles[fieldName]) { const container = document.getElementById('list-' + fieldName); const items = container.querySelectorAll('.gov-file-item:not(.error):not(.uploading)'); const names = Array.from(items).map(el => { const nameDiv = el.querySelector('.file-info div div'); return nameDiv ? nameDiv.textContent : null; }); uploadedFiles[fieldName] = (uploadedFiles[fieldName] || []).filter(f => names.includes(f.name)); if (uploadedFiles[fieldName].length === 0) { delete uploadedFiles[fieldName]; // ?芷 CI 敺?蝷箇?嗆炎?亙??園??? if (fieldName === 'ci_certificate') { const mt = document.getElementById('merchant_type'); if (mt && mt.value === 'limited') { // 銝撥?嗆?蝛綽?霈?嗉銵捱摰? } } } } saveFormProgress(); } function handleBankChange(select) { const otherInput = document.getElementById('bank_name_other'); if (select.value === 'other') { otherInput.style.display = 'block'; otherInput.focus(); } else { otherInput.style.display = 'none'; otherInput.value = ''; } } function formatFileSize(bytes) { if (bytes === 0) return '0 Bytes'; const k = 1024; const sizes = ['Bytes', 'KB', 'MB', 'GB']; const i = Math.floor(Math.log(bytes) / Math.log(k)); return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; } function escapeHtml(text) { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } // ===== Submit Application ===== async function submitForm() { const btn = document.getElementById('btnSubmit'); btn.disabled = true; btn.textContent = '?漱銝?..'; const formData = { rcode: rcode, merchant_name: document.getElementById('merchant_name').value.trim(), merchant_short_name: document.getElementById('merchant_short_name').value.trim(), merchant_type: document.getElementById('merchant_type').value, industry_type: document.getElementById('industry_type').value, br_number: document.getElementById('br_number').value.trim(), cr_number: document.getElementById('cr_number').value.trim(), registered_address: document.getElementById('registered_address').value.trim(), business_address: document.getElementById('business_address').value.trim(), director_name: document.getElementById('director_name').value.trim(), director_position: document.getElementById('director_position').value.trim(), director_id_number: document.getElementById('director_id_number').value.trim(), director_phone: document.getElementById('director_phone').value.trim(), director_email: document.getElementById('director_email').value.trim(), contact_name: document.getElementById('contact_name').value.trim(), contact_position: document.getElementById('contact_position').value.trim(), contact_phone: document.getElementById('contact_phone').value.trim(), contact_email: document.getElementById('contact_email').value.trim(), monthly_volume: document.getElementById('monthly_volume').value, avg_transaction: document.getElementById('avg_transaction').value, website: document.getElementById('website').value.trim(), products: document.getElementById('products').value.trim(), business_hours: document.getElementById('business_hours').value.trim(), delivery_method: document.getElementById('delivery_method').value, bank_name: (function() { const bn = document.getElementById('bank_name'); if (bn.value === 'other') { return document.getElementById('bank_name_other').value.trim(); } return bn.value; })(), account_name: document.getElementById('account_name').value.trim(), account_number: document.getElementById('account_number').value.trim(), branch_code: document.getElementById('branch_code').value.trim(), settlement_currency: document.getElementById('settlement_currency').value, settlement_cycle: document.getElementById('settlement_cycle').value, notes: document.getElementById('notes').value.trim(), files_json: { br_certificate: (uploadedFiles.br_certificate || []).map(f => f.url), ci_certificate: (uploadedFiles.ci_certificate || []).map(f => f.url), nar1_report: (uploadedFiles.nar1_report || []).map(f => f.url), articles_of_association: (uploadedFiles.articles_of_association || []).map(f => f.url), bank_statement: (uploadedFiles.bank_statement || []).map(f => f.url), director_id: (uploadedFiles.director_id || []).map(f => f.url), ubo_id: (uploadedFiles.ubo_id || []).map(f => f.url), shop_photos: (uploadedFiles.shop_photos || []).map(f => f.url), lease_agreement: (uploadedFiles.lease_agreement || []).map(f => f.url), business_description: (uploadedFiles.business_description || []).map(f => f.url), offshore_certificate: (uploadedFiles.offshore_certificate || []).map(f => f.url), shareholding_structure: (uploadedFiles.shareholding_structure || []).map(f => f.url) }, verification_code: currentVerifyCode, turnstile_token: turnstileToken || null, honeypot: document.getElementById('website_url').value }; // Check Turnstile if configured if (TURNSTILE_SITE_KEY && !turnstileToken) { alert('隢?摰?鈭箸?撽?敺??漱'); document.getElementById('turnstile-error').style.display = 'block'; btn.disabled = false; btn.textContent = '?? ?漱?唾?'; return; } try { const response = await fetch(`${API_BASE}/api/v1/public/applications/submit`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(formData) }); const result = await response.json(); if (result.success) { clearFormProgress(); document.getElementById('modalAppId').textContent = result.app_id || '撌脫?鈭?; document.getElementById('successModal').classList.add('active'); window.scrollTo(0, 0); } else { alert('?漱憭望?: ' + (result.error || '?芰?航炊')); btn.disabled = false; btn.textContent = '?? ?漱?唾?'; } } catch (error) { console.error('Submit error:', error); alert('?漱憭望?嚗?瑼Ｘ蝬脩窗??敺?閰?); btn.disabled = false; btn.textContent = '?? ?漱?唾?'; } } document.querySelectorAll('.modal-overlay').forEach(overlay => { overlay.addEventListener('click', (e) => { if (e.target === overlay && overlay.id !== 'verifyModal') { overlay.classList.remove('active'); } }); }); init(); </script> </body> </html>

?? ??亦雯?唾?銵?/h2> 經營地址證明（最多5個文件）* ??雿敹‵??/p>

公司文件上傳 & OCR 識別

?? ?箸鞈?

? 蝬?靽⊥

? 蝯?靽⊥

???漱撖拇

?? ??亦雯?唾?銵?/h2>
經營地址證明（最多5個文件）* ??雿敹‵??/p>