Files
WebServer/templates/help.html
2025-08-28 23:59:13 +08:00

1292 lines
53 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ company.name }} - {% block title %}{{ t('help') if t('help') else '帮助中心' }}{% endblock %}</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
/* 基础样式 */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
body {
background-color: #f5f7fa;
color: #333;
line-height: 1.6;
}
.container {
max-width: 1400px;
margin: 0px auto;
padding: 0 20px;
display: grid;
grid-template-columns: 320px 1fr;
gap: 20px;
}
@media (max-width: 1024px) {
.container {
grid-template-columns: 1fr;
gap: 15px;
}
.sticky-nav {
position: relative;
top: 0;
margin-bottom: 20px;
}
.nav-container {
border-radius: 8px;
}
.help-content {
margin-top: 0;
padding: 20px;
}
}
@media (max-width: 768px) {
.container {
padding: 0 10px;
gap: 10px;
}
.nav-main-link {
padding: 10px 15px;
font-size: 0.9rem;
}
.sub-menu a {
padding: 8px 15px 8px 35px;
font-size: 0.85rem;
}
.sub-menu a:before {
left: 25px;
}
.help-content {
padding: 15px;
border-radius: 8px;
}
.help-header h1 {
font-size: 1.5rem;
gap: 10px;
}
.help-header p {
font-size: 1rem;
}
.article-content h2 {
font-size: 1.3rem;
margin: 20px 0 12px;
}
.article-content p {
font-size: 0.95rem;
}
.step {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.step-number {
margin-right: 0;
margin-bottom: 10px;
}
.info-box {
padding: 15px;
}
.contact-support {
padding: 20px;
}
.btn-support {
padding: 10px 20px;
}
/* Mobile menu toggle for navigation */
.nav-menu-toggle {
display: block;
background: none;
border: none;
cursor: pointer;
padding: 10px;
margin: 10px 0;
width: 100%;
text-align: left;
font-weight: 600;
color: #4a6bdf;
border-bottom: 1px solid #eee;
}
.nav-menu-toggle .arrow {
float: right;
transition: transform 0.3s ease;
}
.nav-menu-toggle.expanded .arrow {
transform: rotate(180deg);
}
/* Initially hide nav menu on mobile */
.nav-container {
max-height: 60px;
overflow: hidden;
transition: max-height 0.3s ease;
}
.nav-container.expanded {
max-height: 1000px;
}
}
/* Very small devices */
@media (max-width: 480px) {
.container {
padding: 0 5px;
}
.help-content {
padding: 12px;
}
.nav-main-link {
padding: 8px 12px;
font-size: 0.85rem;
}
.sub-menu a {
padding: 7px 12px 7px 30px;
}
.sub-menu a:before {
left: 20px;
}
.help-header h1 {
font-size: 1.3rem;
}
.article-content h2 {
font-size: 1.2rem;
}
}
/* 导航菜单样式 */
.sticky-nav {
position: sticky;
top: 220px;
height: fit-content;
}
.nav-container {
background: white;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
overflow: hidden;
}
.search-box {
padding: 20px;
background: #f8f9fa;
border-bottom: 1px solid #eee;
}
.search-box input {
width: 100%;
padding: 12px 15px;
border: 1px solid #ddd;
border-radius: 6px;
font-size: 1rem;
}
.nav-menu {
list-style: none;
max-height: 70vh;
overflow-y: auto;
padding: 10px 0;
}
.nav-item {
margin-bottom: 5px;
}
.nav-main-link {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 20px;
color: #333;
text-decoration: none;
transition: all 0.3s ease;
font-weight: 500;
cursor: pointer;
border-left: 4px solid transparent;
}
.nav-main-link:hover {
background: #f0f7ff;
color: #4a6bdf;
border-left-color: #4a6bdf;
}
.nav-main-link.active {
background: #e6f0ff;
color: #4a6bdf;
border-left-color: #4a6bdf;
}
.nav-main-link .arrow {
transition: transform 0.3s ease;
}
.sub-menu {
list-style: none;
max-height: 0;
overflow: hidden;
transition: max-height 0.5s ease;
background: #f8f9fa;
}
.sub-menu.expanded {
max-height: 1000px;
}
.sub-menu li {
margin: 5px 0;
}
.sub-menu a {
display: block;
padding: 10px 20px 10px 40px;
color: #555;
text-decoration: none;
transition: all 0.2s ease;
position: relative;
cursor: pointer;
}
.sub-menu a:before {
content: "";
position: absolute;
left: 30px;
top: 50%;
width: 5px;
height: 5px;
background: #4a6bdf;
border-radius: 50%;
transform: translateY(-50%);
}
.sub-menu a:hover {
background: #e6e9f0;
color: #4a6bdf;
}
.sub-menu a.active {
background: #e6e9f0;
color: #4a6bdf;
font-weight: 500;
}
/* 帮助内容区域样式 - 修改位置 */
.help-content {
background: white;
border-radius: 10px;
padding: 30px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
min-height: 600px;
margin-top: 20px;
}
.help-header {
margin-bottom: 30px;
}
.help-header h1 {
color: #333;
margin-bottom: 15px;
display: flex;
align-items: center;
gap: 15px;
}
.help-header p {
color: #666;
line-height: 1.6;
font-size: 1.1rem;
}
.breadcrumb {
display: flex;
align-items: center;
margin-bottom: 20px;
color: #666;
font-size: 0.9rem;
}
.breadcrumb a {
color: #4a6bdf;
text-decoration: none;
cursor: pointer;
}
.breadcrumb span {
margin: 0 8px;
}
.article-content {
margin-top: 30px;
}
.article-content h2 {
color: #4a6bdf;
margin: 25px 0 15px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
.article-content p {
color: #444;
line-height: 1.7;
margin-bottom: 15px;
}
.article-content ul,
.article-content ol {
margin: 15px 0;
padding-left: 25px;
}
.article-content li {
margin-bottom: 10px;
color: #444;
line-height: 1.6;
}
.info-box {
background: #f0f7ff;
border-left: 4px solid #4a6bdf;
padding: 20px;
border-radius: 6px;
margin: 20px 0;
}
.info-box h3 {
color: #4a6bdf;
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.steps {
margin: 25px 0;
}
.step {
display: flex;
margin-bottom: 20px;
}
.step-number {
background: #4a6bdf;
color: white;
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 15px;
flex-shrink: 0;
}
.step-content {
flex-grow: 1;
}
.step-content h4 {
margin-bottom: 8px;
color: #333;
}
.contact-support {
background: #4a6bdf;
color: white;
border-radius: 10px;
padding: 30px;
text-align: center;
margin-top: 40px;
}
.contact-support h2 {
margin-bottom: 15px;
}
.contact-support p {
margin-bottom: 20px;
opacity: 0.9;
}
.btn-support {
display: inline-block;
background: white;
color: #4a6bdf;
padding: 12px 25px;
border-radius: 6px;
text-decoration: none;
font-weight: 500;
transition: all 0.3s ease;
}
.btn-support:hover {
background: #f5f5f5;
transform: translateY(-2px);
}
</style>
</head>
<body>
<!-- 头部 -->
<header>
<div class="container">
<h1>
<a href="{{ url_for('index') }}" class="logo">
<img src="{{ url_for('static', filename='images/logo1.png') }}" alt="{{ t('company_name') }}"
class="logo-img">
<!-- {{ t('company_name') }} -->
</a>
</h1>
<button class="mobile-menu-toggle" aria-label="Toggle menu">
<span></span>
<span></span>
<span></span>
</button>
<nav class="nav-menu">
<ul>
<li><a href="{{ url_for('index') }}">{{ t('home') }}</a></li>
<li><a href="{{ url_for('services') }}">{{ t('services') }}</a></li>
<li><a href="{{ url_for('pricing') }}">{{ t('pricing') if t('pricing') else '收费' }}</a></li>
<li><a href="{{ url_for('download') }}">{{ t('download') if t('download') else '下载' }}</a></li>
<li><a href="{{ url_for('help') }}" class="active">{{ t('help') if t('help') else '帮助' }}</a></li>
<li><a href="{{ url_for('contact') }}">{{ t('contact') }}</a></li>
<li><a href="{{ url_for('about') }}">{{ t('about') }}</a></li>
<li><a href="https://bayizhinengjf.vip.cpolar.cn/" target="_blank">{{ t('online') }}</a></li>
</ul>
<div class="language-switcher">
<select id="language-dropdown" onchange="changeLanguage(this.value)">
<option value="" disabled selected>{{ t('language') if t('language') else 'Language' }}</option>
{% for lang_code, lang_name in languages.items() %}
<option value="{{ lang_code }}" {% if lang==lang_code %}selected{% endif %}>{{ lang_name }}
</option>
{% endfor %}
</select>
</div>
</nav>
</div>
</header>
<main>
<section class="hero">
<div class="container">
<h2>{{ t('help') if t('help') else '帮助中心' }}</h2>
<p>{{ t('help_description') if t('help_description') else '获取使用指南和常见问题解答' }}</p>
</div>
</section>
</main>
<!-- 主内容区域 -->
<div class="container">
<!-- 导航菜单 -->
<div class="sticky-nav">
<div class="nav-container">
<!-- 手机版显示有点问题暂时不使用 -->
<!-- <div class="search-box">
<input type="text" placeholder="搜索帮助内容...">
</div> -->
<ul class="nav-menu">
<li class="nav-item">
<a class="nav-main-link active" onclick="toggleMenu(event, this)">
<span>开户指南</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu expanded">
<li><a class="nav-link active" data-content="online-transfers"
onclick="loadContent(this)">中国香港地区用户如何开户? - 入金见证</a></li>
<li><a class="nav-link" data-content="check-account"
onclick="loadContent(this)">中国香港地区用户如何开户? - 邮寄支票</a></li>
<li><a class="nav-link" data-content="third-party" onclick="loadContent(this)">中国香港地区用户如何开户?
- 第三方见证</a></li>
<li><a class="nav-link" data-content="crs" onclick="loadContent(this)">共同汇报标准 (CRS)</a></li>
<li><a class="nav-link" data-content="fatca" onclick="loadContent(this)">海外账户税收合规法案
(FATCA)</a></li>
<li><a class="nav-link" data-content="agreement" onclick="loadContent(this)">客户协议</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>存入资金</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">入金指引(通用)</a></li>
<li><a class="nav-link" data-content="credit-card"
onclick="loadContent(this)">网银转账通用说明(香港地区银行)</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">如何完成
ATM/柜台转账入金?</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">如何完成 Cheque
支票转账入金?</a></li>
<li><a class="nav-link" data-content="credit-card" onclick="loadContent(this)">eDDA
授权及入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">电汇转账入金指引(非香港银行卡)</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">汇丰银行网银转账指引</a></li>
<li><a class="nav-link" data-content="credit-card" onclick="loadContent(this)">汇丰银行 FPS
入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">香港汇丰银行 eDDA
银行端授权指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">恒生银行网银转账入金指引</a></li>
<li><a class="nav-link" data-content="credit-card"
onclick="loadContent(this)">e中国银行香港网银转账入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">香港渣打银行入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">民生银行「银证转账」开通指引</a></li>
<li><a class="nav-link" data-content="credit-card"
onclick="loadContent(this)">民生银行「银证转帐」转账指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">民生香港网银转账入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">众安银行 FPS
入金指引</a></li>
<li><a class="nav-link" data-content="credit-card"
onclick="loadContent(this)">众安银行网银转账说明</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">招行香港一卡通入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">招行香港一卡通 FPS
入金指引</a></li>
<li><a class="nav-link" data-content="credit-card" onclick="loadContent(this)">招商银行香港 eDDA
授权指引</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">花旗银行网银转账入金指引</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">工银亚洲 FPS
入金指引
国家外汇政策</a></li>
<li><a class="nav-link" data-content="credit-card" onclick="loadContent(this)">银行卡指引(通用)</a>
</li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">中银香港eDDA
授权指引</a></li>
<li><a class="nav-link" data-content="credit-card" onclick="loadContent(this)">恒生银行 eDDA
授权指引</a></li>
<li><a class="nav-link" data-content="bank-transfer" onclick="loadContent(this)">工银亚洲 eDDA
授权指引</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>股票转移</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="credit-card"
onclick="loadContent(this)">从华盛证券转仓到富泽国际</a></li>
<li><a class="nav-link" data-content="bank-transfer"
onclick="loadContent(this)">从恒星证券转入股票指引</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>账户安全</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">什么是休眠账户?</a></li>
<li><a class="nav-link" data-content="password-mgmt" onclick="loadContent(this)">防诈骗提示 -
提防诈骗链接</a></li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">如何完成账号注销?</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>美股市场</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">美股卖空(融券)常见问题</a></li>
<li><a class="nav-link" data-content="password-mgmt" onclick="loadContent(this)">场外交易 /
粉单常见问题</a></li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">市价单注意事项</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>港股市场</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">港股牛熊证回收及结算时间</a></li>
<li><a class="nav-link" data-content="password-mgmt" onclick="loadContent(this)">市价单注意事项</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">碎股交易常见问题</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>企业行动</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">什么是派息/特殊派息及处理时间</a>
</li>
<li><a class="nav-link" data-content="password-mgmt"
onclick="loadContent(this)">什么是送股及处理时间</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">什么是选股选息及处理时间</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>融资相关</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">富泽综合账户</a>
</li>
<li><a class="nav-link" data-content="password-mgmt"
onclick="loadContent(this)">什么情况下会要求追缴保证金?</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">什么是货币保证金</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>其他</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">结单相关说明</a>
</li>
<li><a class="nav-link" data-content="password-mgmt"
onclick="loadContent(this)">结单字段解释说明</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">什么是附加订单</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>提取资金</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">通用出金指引</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>货币兑换</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">货币兑换操作指南</a>
</li>
<li><a class="nav-link" data-content="password-mgmt" onclick="loadContent(this)">客户确认函
-自动换汇还款服务</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">自动还款常见问题解答</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-main-link" onclick="toggleMenu(event, this)">
<span>行情与交易</span>
<span class="arrow"><i class="fas fa-chevron-down"></i></span>
</a>
<ul class="sub-menu">
<li><a class="nav-link" data-content="2fa" onclick="loadContent(this)">什么是美股夜盘</a>
</li>
<li><a class="nav-link" data-content="password-mgmt"
onclick="loadContent(this)">美股深度摆盘介绍</a>
</li>
<li><a class="nav-link" data-content="security-notifications"
onclick="loadContent(this)">行情权限单设备使用说明</a></li>
</ul>
</li>
</ul>
</div>
</div>
<!-- 帮助内容区域 -->
<div class="help-content">
<div class="breadcrumb">
<a onclick="loadDefaultContent()">帮助中心</a>
<span>/</span>
<a onclick="loadCategoryContent('account-opening')">Account Opening Guide</a>
<span>/</span>
<span>How can users in Hong Kong open an account using online transfers?</span>
</div>
<div class="help-header">
<h1><i class="fas fa-question-circle"></i> How can users in Hong Kong open an account using online
transfers?</h1>
<p>了解如何通过在线转账方式在香港开设账户的详细步骤和注意事项。</p>
</div>
<div class="article-content">
<div class="info-box">
<h3><i class="fas fa-lightbulb"></i> 重要提示</h3>
<p>在线开户过程通常需要10-15分钟完成。请确保您准备好身份证明文件和地址证明。</p>
</div>
<h2>在线开户要求</h2>
<p>在香港通过在线转账方式开设账户,您需要满足以下基本要求:</p>
<ul>
<li>年满18周岁</li>
<li>有效的身份证明文件(香港身份证或护照)</li>
<li>最近三个月内的地址证明(水电费账单、银行对账单等)</li>
<li>香港银行账户</li>
<li>稳定的互联网连接和设备(电脑或智能手机)</li>
</ul>
<h2>开户步骤</h2>
<div class="steps">
<div class="step">
<div class="step-number">1</div>
<div class="step-content">
<h4>访问开户页面</h4>
<p>登录我们的官方网站,点击"立即开户"按钮开始申请流程。</p>
</div>
</div>
<div class="step">
<div class="step-number">2</div>
<div class="step-content">
<h4>填写个人信息</h4>
<p>准确填写您的个人信息,包括姓名、出生日期、联系方式等。确保所有信息与您的身份证件一致。</p>
</div>
</div>
<div class="step">
<div class="step-number">3</div>
<div class="step-content">
<h4>上传证明文件</h4>
<p>上传您的身份证明文件和地址证明的清晰照片或扫描件。文件格式可以是JPG、PNG或PDF大小不超过5MB。</p>
</div>
</div>
<div class="step">
<div class="step-number">4</div>
<div class="step-content">
<h4>进行在线验证</h4>
<p>完成身份验证过程,这可能包括面部识别或回答安全问题。</p>
</div>
</div>
<div class="step">
<div class="step-number">5</div>
<div class="step-content">
<h4>进行初始存款</h4>
<p>通过在线转账方式完成初始存款。最低存款要求为1,000港元。</p>
</div>
</div>
<div class="step">
<div class="step-number">6</div>
<div class="step-content">
<h4>等待审核</h4>
<p>提交申请后我们将在1-2个工作日内完成审核。审核通过后您将收到确认电子邮件。</p>
</div>
</div>
</div>
<h2>常见问题</h2>
<div class="info-box">
<h3><i class="fas fa-question"></i> 开户需要多长时间?</h3>
<p>在线申请过程通常需要10-15分钟。审核过程需要1-2个工作日。一旦审核通过您的账户将立即激活。</p>
</div>
<div class="info-box">
<h3><i class="fas fa-question"></i> 是否需要最低存款?</h3>
<p>是的开户需要最低1,000港元的初始存款。您可以通过多种方式完成存款包括银行转账和电子支付。</p>
</div>
<div class="info-box">
<h3><i class="fas fa-question"></i> 如果我的申请被拒绝怎么办?</h3>
<p>如果您的申请未被批准,我们将通过电子邮件说明具体原因。您可以纠正问题后重新申请,或联系客户支持获取帮助。</p>
</div>
</div>
<div class="contact-support">
<h2><i class="fas fa-headset"></i> 需要更多帮助?</h2>
<p>我们的客户支持团队随时为您提供帮助。</p>
<a href="#" class="btn-support">联系支持</a>
</div>
</div>
</div>
<!-- 底部 -->
<footer>
<div class="container">
<div class="footer-brand">
<h3>{{ t('company_name') }}</h3>
<p>{{ t('slogan') }}</p>
</div>
<div class="footer-links">
<h4>{{ t('quick_links') if t('quick_links') else '快速链接' }}</h4>
<ul>
<li><a href="{{ url_for('index') }}">{{ t('home') }}</a></li>
<li><a href="{{ url_for('about') }}">{{ t('about') }}</a></li>
<li><a href="{{ url_for('services') }}">{{ t('services') }}</a></li>
<li><a href="{{ url_for('contact') }}">{{ t('contact') }}</a></li>
<li><a href="https://bayizhinengjf.vip.cpolar.cn/" target="_blank">{{ t('online') }}</a></li>
</ul>
</div>
<div class="footer-links">
<h4>{{ t('services') }}</h4>
<ul>
{% for service in company.services %}
<li><a href="{{ url_for('services') }}">{{ service.name }}</a></li>
{% endfor %}
</ul>
</div>
<div class="footer-links">
<h4>{{ t('contact_us') if t('contact_us') else '联系我们' }}</h4>
<ul>
<li>{{ company.contact.address }}</li>
<li>{{ t('tel') }}: {{ company.contact.Tel }}</li>
<li>{{ t('fax') }}: {{ company.contact.Fax }}</li>
<li>{{ t('email') }}: {{ company.contact.Email }}</li>
</ul>
</div>
<div class="footer-bottom">
<p>&copy; 2025 {{ company.name }}. {{ t('all_rights_reserved') }}</p>
<div class="footer-links">
<a href="#">{{ t('privacy_policy') }}</a>
<a href="#">{{ t('terms_of_use') }}</a>
</div>
</div>
</div>
</footer>
<script src="{{ url_for('static', filename='js/mobile-menu.js') }}"></script>
<script src="{{ url_for('static', filename='js/tabs.js') }}"></script>
<script src="{{ url_for('static', filename='js/market-ticker.js') }}"></script>
<script src="{{ url_for('static', filename='js/help-navigation.js') }}"></script>
<script>
// 帮助菜单展开/收起功能
function toggleMenu(event, element) {
event.preventDefault();
event.stopPropagation();
const menuItem = element.parentElement;
const subMenu = menuItem.querySelector('.sub-menu');
const arrow = menuItem.querySelector('.arrow i');
const isExpanding = !subMenu.classList.contains('expanded');
// 收起所有其他菜单
document.querySelectorAll('.nav-item').forEach(item => {
if (item !== menuItem) {
const otherSubMenu = item.querySelector('.sub-menu');
const otherArrow = item.querySelector('.arrow i');
otherSubMenu.classList.remove('expanded');
otherArrow.style.transform = 'rotate(0deg)';
item.querySelector('.nav-main-link').classList.remove('active');
}
});
// 切换当前菜单的展开状态
if (isExpanding) {
subMenu.classList.add('expanded');
arrow.style.transform = 'rotate(180deg)';
element.classList.add('active');
} else {
subMenu.classList.remove('expanded');
arrow.style.transform = 'rotate(0deg)';
element.classList.remove('active');
}
}
// 内容加载功能
function loadContent(element) {
const contentId = element.getAttribute('data-content');
// 移除所有活动类
document.querySelectorAll('.nav-link').forEach(link => {
link.classList.remove('active');
});
// 添加活动类到当前点击的链接
element.classList.add('active');
// 根据内容ID加载不同的内容
switch (contentId) {
case 'online-transfers':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="online-transfers"]').innerHTML;
break;
case 'check-account':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="check-account"]').innerHTML;
break;
case 'third-party':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="third-party"]').innerHTML;
break;
case 'bank-transfer':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="bank-transfer"]').innerHTML;
break;
case 'credit-card':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="credit-card"]').innerHTML;
break;
case '2fa':
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="2fa"]').innerHTML;
break;
default:
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="default"]').innerHTML;
}
}
// 加载默认内容
function loadDefaultContent() {
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="default"]').innerHTML;
// 重置所有活动链接
document.querySelectorAll('.nav-link').forEach(link => {
link.classList.remove('active');
});
}
// 加载分类内容
function loadCategoryContent(category) {
document.querySelector('.help-content').innerHTML = document.querySelector('[data-template="category"]').innerHTML;
}
// 初始加载时设置第一个菜单为活动状态
document.addEventListener('DOMContentLoaded', function () {
const firstMenu = document.querySelector('.nav-item');
if (firstMenu) {
const arrow = firstMenu.querySelector('.arrow i');
arrow.style.transform = 'rotate(180deg)';
}
// 移动端初始化:隐藏导航菜单
if (window.innerWidth <= 768) {
const navContainer = document.querySelector('.nav-container');
if (navContainer) {
navContainer.style.maxHeight = '60px';
}
}
});
// 移动端导航菜单切换
function toggleMobileNav() {
const navContainer = document.querySelector('.nav-container');
const toggleButton = document.querySelector('.nav-menu-toggle');
if (navContainer && toggleButton) {
if (navContainer.classList.contains('expanded')) {
navContainer.classList.remove('expanded');
toggleButton.classList.remove('expanded');
} else {
navContainer.classList.add('expanded');
toggleButton.classList.add('expanded');
}
}
}
// 监听窗口大小变化,调整导航菜单状态
window.addEventListener('resize', function () {
const navContainer = document.querySelector('.nav-container');
const toggleButton = document.querySelector('.nav-menu-toggle');
if (window.innerWidth > 768) {
// 桌面端:显示完整导航
if (navContainer) {
navContainer.style.maxHeight = 'none';
navContainer.classList.remove('expanded');
}
if (toggleButton) {
toggleButton.classList.remove('expanded');
}
} else {
// 移动端:默认收起导航
if (navContainer && !navContainer.classList.contains('expanded')) {
navContainer.style.maxHeight = '60px';
}
}
});
</script>
<!-- 内容模板 -->
<div style="display: none;">
<!-- 默认内容模板 -->
<div data-template="default">
<div class="breadcrumb">
<a onclick="loadDefaultContent()">帮助中心</a>
</div>
<div class="help-header">
<h1><i class="fas fa-home"></i> 帮助中心首页</h1>
<p>欢迎使用帮助中心,请选择左侧菜单查看详细帮助内容</p>
</div>
<div class="article-content">
<div class="info-box">
<h3><i class="fas fa-info-circle"></i> 使用提示</h3>
<p>您可以通过左侧导航菜单浏览不同的帮助主题,或使用搜索框快速查找您需要的内容。</p>
</div>
<h2>常见问题分类</h2>
<div class="steps">
<div class="step">
<div class="step-number"><i class="fas fa-user-plus"></i></div>
<div class="step-content">
<h4>账户开户指南</h4>
<p>了解如何开设账户的不同方式和要求</p>
</div>
</div>
<div class="step">
<div class="step-number"><i class="fas fa-money-bill-wave"></i></div>
<div class="step-content">
<h4>存款方式</h4>
<p>了解各种存款方式及操作流程</p>
</div>
</div>
<div class="step">
<div class="step-number"><i class="fas fa-shield-alt"></i></div>
<div class="step-content">
<h4>账户安全</h4>
<p>了解如何保护您的账户安全</p>
</div>
</div>
</div>
</div>
</div>
<!-- 在线转账内容模板 -->
<div data-template="online-transfers">
<div class="breadcrumb">
<a onclick="loadDefaultContent()">帮助中心</a>
<span>/</span>
<a onclick="loadCategoryContent('account-opening')">Account Opening Guide</a>
<span>/</span>
<span>How can users in Hong Kong open an account using online transfers?</span>
</div>
<div class="help-header">
<h1><i class="fas fa-question-circle"></i> How can users in Hong Kong open an account using online
transfers?</h1>
<p>了解如何通过在线转账方式在香港开设账户的详细步骤和注意事项。</p>
</div>
<div class="article-content">
<div class="info-box">
<h3><i class="fas fa-lightbulb"></i> 重要提示</h3>
<p>在线开户过程通常需要10-15分钟完成。请确保您准备好身份证明文件和地址证明。</p>
</div>
<h2>在线开户要求</h2>
<p>在香港通过在线转账方式开设账户,您需要满足以下基本要求:</p>
<ul>
<li>年满18周岁</li>
<li>有效的身份证明文件(香港身份证或护照)</li>
<li>最近三个月内的地址证明(水电费账单、银行对账单等)</li>
<li>香港银行账户</li>
<li>稳定的互联网连接和设备(电脑或智能手机)</li>
</ul>
<h2>开户步骤</h2>
<div class="steps">
<div class="step">
<div class="step-number">1</div>
<div class="step-content">
<h4>访问开户页面</h4>
<p>登录我们的官方网站,点击"立即开户"按钮开始申请流程。</p>
</div>
</div>
<div class="step">
<div class="step-number">2</div>
<div class="step-content">
<h4>填写个人信息</h4>
<p>准确填写您的个人信息,包括姓名、出生日期、联系方式等。确保所有信息与您的身份证件一致。</p>
</div>
</div>
<div class="step">
<div class="step-number">3</div>
<div class="step-content">
<h4>上传证明文件</h4>
<p>上传您的身份证明文件和地址证明的清晰照片或扫描件。文件格式可以是JPG、PNG或PDF大小不超过5MB。</p>
</div>
</div>
<div class="step">
<div class="step-number">4</div>
<div class="step-content">
<h4>进行在线验证</h4>
<p>完成身份验证过程,这可能包括面部识别或回答安全问题。</p>
</div>
</div>
<div class="step">
<div class="step-number">5</div>
<div class="step-content">
<h4>进行初始存款</h4>
<p>通过在线转账方式完成初始存款。最低存款要求为1,000港元。</p>
</div>
</div>
<div class="step">
<div class="step-number">6</div>
<div class="step-content">
<h4>等待审核</h4>
<p>提交申请后我们将在1-2个工作日内完成审核。审核通过后您将收到确认电子邮件。</p>
</div>
</div>
</div>
</div>
</div>
<!-- 在线转账内容模板 -->
<div data-template="check-account">
<div class="breadcrumb">
<a onclick="loadDefaultContent()">帮助中心</a>
<span>/</span>
<a onclick="loadCategoryContent('check-account')">Account Opening Guide</a>
<span>/</span>
<span>How can users in Hong Kong open an account using online transfers?</span>
</div>
<div class="help-header">
<h1><i class="fas fa-question-circle"></i> How can users in Hong Kong open an account using online
transfers?</h1>
<p>了解如何通过在线转账方式在香港开设账户的详细步骤和注意事项。</p>
</div>
<div class="article-content">
<div class="info-box">
<h3><i class="fas fa-lightbulb"></i> 重要提示</h3>
<p>在线开户过程通常需要10-15分钟完成。请确保您准备好身份证明文件和地址证明。</p>
</div>
<h2>在线开户要求</h2>
<p>在香港通过在线转账方式开设账户,您需要满足以下基本要求:</p>
<ul>
<li>年满18周岁</li>
<li>有效的身份证明文件(香港身份证或护照)</li>
<li>最近三个月内的地址证明(水电费账单、银行对账单等)</li>
<li>香港银行账户</li>
<li>稳定的互联网连接和设备(电脑或智能手机)</li>
</ul>
<h2>开户步骤</h2>
<div class="steps">
<div class="step">
<div class="step-number">1</div>
<div class="step-content">
<h4>访问开户页面</h4>
<p>登录我们的官方网站,点击"立即开户"按钮开始申请流程。</p>
</div>
</div>
<div class="step">
<div class="step-number">2</div>
<div class="step-content">
<h4>填写个人信息</h4>
<p>准确填写您的个人信息,包括姓名、出生日期、联系方式等。确保所有信息与您的身份证件一致。</p>
</div>
</div>
<div class="step">
<div class="step-number">3</div>
<div class="step-content">
<h4>上传证明文件</h4>
<p>上传您的身份证明文件和地址证明的清晰照片或扫描件。文件格式可以是JPG、PNG或PDF大小不超过5MB。</p>
</div>
</div>
<div class="step">
<div class="step-number">4</div>
<div class="step-content">
<h4>进行在线验证</h4>
<p>完成身份验证过程,这可能包括面部识别或回答安全问题。</p>
</div>
</div>
<div class="step">
<div class="step-number">5</div>
<div class="step-content">
<h4>进行初始存款</h4>
<p>通过在线转账方式完成初始存款。最低存款要求为1,000港元。</p>
</div>
</div>
<div class="step">
<div class="step-number">6</div>
<div class="step-content">
<h4>等待审核</h4>
<p>提交申请后我们将在1-2个工作日内完成审核。审核通过后您将收到确认电子邮件。</p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>