{% extends "base.html" %}

{% block title %}{{ t('pricing') if t('pricing') else '收费' }}{% endblock %}

{% block content %}
<!-- <section class="hero">
    <div class="container">
        <h2>{{ t('pricing') if t('pricing') else '收费方案' }}</h2>
        <p>{{ t('pricing_description') if t('pricing_description') else '透明合理的收费结构，助力您的投资成功' }}</p>
    </div>
</section> -->

<section class="commission-table">
    <div class="container">
        <div class="section-title">
            <h2>{{ t('commission_rates') if t('commission_rates') else '详细佣金费率' }}</h2>
            <p>{{ t('commission_rates_desc') if t('commission_rates_desc') else '透明公开的交易费用，助力您的投资决策' }}</p>
        </div>

        <div class="tabs-container">
            <div class="tabs">
                <button class="tab-button active" data-tab="stocks">{{ t('stocks') if t('stocks') else '股票、ETF和权证'
                    }}</button>
                <!-- <button class="tab-button" data-tab="options">{{ t('options') if t('options') else '期权' }}</button>
                <button class="tab-button" data-tab="futures">{{ t('futures') if t('futures') else '期货' }}</button>
                <button class="tab-button" data-tab="funds">{{ t('funds') if t('funds') else '基金' }}</button> -->
                <button class="tab-button" data-tab="other">{{ t('other_products') if t('other_products') else '其他产品'
                    }}</button>
            </div>

            <div class="tab-content">
                <!-- Stocks Tab -->
                <div id="stocks" class="tab-pane active">
                    <div class="table-container">
                        <table class="commission-rates-table">
                            <thead>
                                <tr>
                                    <th>{{ t('market') if t('market') else '市场' }}</th>
                                    <th>{{ t('product_type') if t('product_type') else '产品类型' }}</th>
                                    <th>{{ t('commission_rate') if t('commission_rate') else '佣金费率' }}</th>
                                    <th>{{ t('minimum_fee') if t('minimum_fee') else '最低收费' }}</th>
                                    <th>{{ t('additional_fees') if t('additional_fees') else '其他费用' }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>港股</td>
                                    <td>股票交易</td>
                                    <td>0.25%</td>
                                    <td>HK$ 100</td>
                                    <td>印花税: 0.13%<br>交易征费: 0.0027%<br>证监会征费: 0.00015%</td>
                                </tr>
                                <tr>
                                    <td>美股</td>
                                    <td>股票交易</td>
                                    <td>US$ 0.005/股</td>
                                    <td>US$ 1.00</td>
                                    <td>SEC Fee: 0.0000229%<br>FINRA TAF: US$ 0.000145/股</td>
                                </tr>
                                <!-- <tr>
                                    <td>A股</td>
                                    <td>股票交易</td>
                                    <td>0.03%</td>
                                    <td>¥ 5.00</td>
                                    <td>印花税: 0.1%</td>
                                </tr>
                                <tr>
                                    <td>日本</td>
                                    <td>股票交易</td>
                                    <td>0.20%</td>
                                    <td>¥ 100</td>
                                    <td>交易所费: 0.003%</td>
                                </tr> -->
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- Options Tab -->
                <div id="options" class="tab-pane">
                    <div class="table-container">
                        <table class="commission-rates-table">
                            <thead>
                                <tr>
                                    <th>{{ t('market') if t('market') else '市场' }}</th>
                                    <th>{{ t('product_type') if t('product_type') else '产品类型' }}</th>
                                    <th>{{ t('commission_rate') if t('commission_rate') else '佣金费率' }}</th>
                                    <th>{{ t('minimum_fee') if t('minimum_fee') else '最低收费' }}</th>
                                    <th>{{ t('additional_fees') if t('additional_fees') else '其他费用' }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td rowspan="3">港股</td>
                                    <td>股票期权（标准）</td>
                                    <td>HK$ 15/张</td>
                                    <td>HK$ 30</td>
                                    <td>交易征费: 0.0027%<br>证监会征费: 0.00015%<br>结算费: HK$ 0.5/张</td>
                                </tr>
                                <tr>
                                    <td>股票期权（大宗交易）</td>
                                    <td>HK$ 10/张</td>
                                    <td>HK$ 100</td>
                                    <td>交易征费: 0.0027%<br>证监会征费: 0.00015%</td>
                                </tr>
                                <tr>
                                    <td>指数期权</td>
                                    <td>HK$ 12/张</td>
                                    <td>HK$ 25</td>
                                    <td>交易征费: 0.0027%<br>证监会征费: 0.00015%</td>
                                </tr>
                                <tr>
                                    <td rowspan="4">美股</td>
                                    <td>股票期权（标准合约）</td>
                                    <td>US$ 0.65/合约</td>
                                    <td>US$ 1.00</td>
                                    <td>SEC Fee: 0.0000229%<br>FINRA TAF: US$ 0.000145/股</td>
                                </tr>
                                <tr>
                                    <td>股票期权（大宗交易）</td>
                                    <td>US$ 0.50/合约</td>
                                    <td>US$ 1.00</td>
                                    <td>SEC Fee: 0.0000229%<br>FINRA TAF: US$ 0.000145/股</td>
                                </tr>
                                <tr>
                                    <td>指数期权（标准）</td>
                                    <td>US$ 1.50/合约</td>
                                    <td>US$ 1.00</td>
                                    <td>交易所费用: US$ 0.15/合约<br>清算费: US$ 0.05/合约</td>
                                </tr>
                                <tr>
                                    <td>指数期权（迷你）</td>
                                    <td>US$ 0.75/合约</td>
                                    <td>US$ 1.00</td>
                                    <td>交易所费用: US$ 0.10/合约<br>清算费: US$ 0.03/合约</td>
                                </tr>
                                <tr>
                                    <td rowspan="2">A股</td>
                                    <td>上证50ETF期权</td>
                                    <td>¥ 5/张</td>
                                    <td>¥ 10</td>
                                    <td>经手费: ¥ 0.3/张<br>结算费: ¥ 0.3/张</td>
                                </tr>
                                <tr>
                                    <td>沪深300期权</td>
                                    <td>¥ 8/张</td>
                                    <td>¥ 15</td>
                                    <td>经手费: ¥ 0.5/张<br>结算费: ¥ 0.5/张</td>
                                </tr>
                                <tr>
                                    <td>新加坡</td>
                                    <td>新华A50指数期权</td>
                                    <td>US$ 2.00/合约</td>
                                    <td>US$ 5.00</td>
                                    <td>交易所费用: US$ 0.25/合约<br>清算费: US$ 0.10/合约</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>

                    <div class="volume-discounts">
                        <h4>成交量折扣计划</h4>
                        <div class="discount-grid">
                            <div class="discount-tier">
                                <h5>美股期权</h5>
                                <p>月交易量 1-999 合约: US$ 0.65/合约</p>
                                <p>月交易量 1,000-4,999 合约: US$ 0.55/合约</p>
                                <p>月交易量 5,000-9,999 合约: US$ 0.45/合约</p>
                                <p>月交易量 10,000+ 合约: US$ 0.35/合约</p>
                            </div>
                            <div class="discount-tier">
                                <h5>港股期权</h5>
                                <p>月交易量 1-499 张: HK$ 15/张</p>
                                <p>月交易量 500-1,999 张: HK$ 12/张</p>
                                <p>月交易量 2,000-4,999 张: HK$ 10/张</p>
                                <p>月交易量 5,000+ 张: HK$ 8/张</p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Futures Tab -->
                <div id="futures" class="tab-pane">
                    <div class="table-container">
                        <table class="commission-rates-table">
                            <thead>
                                <tr>
                                    <th>{{ t('market') if t('market') else '市场' }}</th>
                                    <th>{{ t('product_type') if t('product_type') else '产品类型' }}</th>
                                    <th>{{ t('commission_rate') if t('commission_rate') else '佣金费率' }}</th>
                                    <th>{{ t('minimum_fee') if t('minimum_fee') else '最低收费' }}</th>
                                    <th>{{ t('additional_fees') if t('additional_fees') else '其他费用' }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>港股</td>
                                    <td>期货交易</td>
                                    <td>HK$ 10/张</td>
                                    <td>HK$ 50</td>
                                    <td>证监会征费: 0.00015%</td>
                                </tr>
                                <tr>
                                    <td>美股</td>
                                    <td>指数期货</td>
                                    <td>US$ 2.50/合约</td>
                                    <td>US$ 1.00</td>
                                    <td>NFA Fee: US$ 0.02/合约</td>
                                </tr>
                                <tr>
                                    <td>商品期货</td>
                                    <td>黄金期货</td>
                                    <td>US$ 5.00/合约</td>
                                    <td>US$ 10.00</td>
                                    <td>交易所费用: US$ 1.50/合约</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- Funds Tab -->
                <div id="funds" class="tab-pane">
                    <div class="table-container">
                        <table class="commission-rates-table">
                            <thead>
                                <tr>
                                    <th>{{ t('market') if t('market') else '市场' }}</th>
                                    <th>{{ t('product_type') if t('product_type') else '产品类型' }}</th>
                                    <th>{{ t('commission_rate') if t('commission_rate') else '佣金费率' }}</th>
                                    <th>{{ t('minimum_fee') if t('minimum_fee') else '最低收费' }}</th>
                                    <th>{{ t('additional_fees') if t('additional_fees') else '其他费用' }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>港股</td>
                                    <td>互惠基金</td>
                                    <td>0.50%</td>
                                    <td>HK$ 100</td>
                                    <td>托管费: 0.15%/年</td>
                                </tr>
                                <tr>
                                    <td>美股</td>
                                    <td>ETF基金</td>
                                    <td>US$ 0.005/股</td>
                                    <td>US$ 1.00</td>
                                    <td>SEC Fee: 0.0000229%</td>
                                </tr>
                                <tr>
                                    <td>债券基金</td>
                                    <td>固定收益</td>
                                    <td>0.25%</td>
                                    <td>US$ 25.00</td>
                                    <td>管理费: 0.10%/年</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- Other Products Tab -->
                <div id="other" class="tab-pane">
                    <div class="table-container">
                        <table class="commission-rates-table">
                            <thead>
                                <tr>
                                    <th>{{ t('market') if t('market') else '市场' }}</th>
                                    <th>{{ t('product_type') if t('product_type') else '产品类型' }}</th>
                                    <th>{{ t('commission_rate') if t('commission_rate') else '佣金费率' }}</th>
                                    <th>{{ t('minimum_fee') if t('minimum_fee') else '最低收费' }}</th>
                                    <th>{{ t('additional_fees') if t('additional_fees') else '其他费用' }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <!-- <tr>
                                    <td>加密货币</td>
                                    <td>现货交易</td>
                                    <td>0.10%</td>
                                    <td>US$ 1.00</td>
                                    <td>网络费用: 可变</td>
                                </tr>
                                <tr>
                                    <td>外汇</td>
                                    <td>主要货币对</td>
                                    <td>0.08%</td>
                                    <td>US$ 10.00</td>
                                    <td>隔夜利息: 可变</td>
                                </tr> -->
                                <tr>
                                    <td>结构性产品</td>
                                    <td>牛熊证</td>
                                    <td>0.20%</td>
                                    <td>HK$ 50</td>
                                    <td>行使费: 0.003%</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="table-notes">
            <p>* {{ t('commission_note') if t('commission_note') else '以上费率仅供参考，实际费用可能因市场情况而变化。详细费用请参考最新费率表。' }}</p>
        </div>
    </div>
</section>

<section class="services">
    <div class="container">
        <div class="section-title">
            <h2>{{ t('pricing_plans') if t('pricing_plans') else '收费标准' }}</h2>
            <p>{{ t('choose_plan') if t('choose_plan') else '选择适合您的投资方案' }}</p>
        </div>

        <div class="feature-grid">
            <div class="feature">
                <div class="feature-icon">💰</div>
                <h3>{{ t('basic_plan') if t('basic_plan') else '基础套餐' }}</h3>
                <p>{{ t('basic_plan_desc') if t('basic_plan_desc') else '适合初级投资者的入门套餐' }}</p>
                <div class="price">¥299/月</div>
                <ul class="plan-features">
                    <li>{{ t('feature1') if t('feature1') else '基础行情数据' }}</li>
                    <li>{{ t('feature2') if t('feature2') else '5次免费交易' }}</li>
                    <li>{{ t('feature3') if t('feature3') else '基础分析工具' }}</li>
                </ul>
                <a href="{{ url_for('contact') }}" class="btn">{{ t('get_started') if t('get_started') else '立即开通'
                    }}</a>
            </div>

            <div class="feature">
                <div class="feature-icon">💎</div>
                <h3>{{ t('pro_plan') if t('pro_plan') else '专业套餐' }}</h3>
                <p>{{ t('pro_plan_desc') if t('pro_plan_desc') else '适合活跃交易者的专业套餐' }}</p>
                <div class="price">¥899/月</div>
                <ul class="plan-features">
                    <li>{{ t('feature4') if t('feature4') else '高级行情数据' }}</li>
                    <li>{{ t('feature5') if t('feature5') else '无限次交易' }}</li>
                    <li>{{ t('feature6') if t('feature6') else '专业分析工具' }}</li>
                    <li>{{ t('feature7') if t('feature7') else '实时市场警报' }}</li>
                </ul>
                <a href="{{ url_for('contact') }}" class="btn">{{ t('get_started') if t('get_started') else '立即开通'
                    }}</a>
            </div>

            <div class="feature">
                <div class="feature-icon">🏆</div>
                <h3>{{ t('vip_plan') if t('vip_plan') else 'VIP套餐' }}</h3>
                <p>{{ t('vip_plan_desc') if t('vip_plan_desc') else '适合机构投资者的尊贵套餐' }}</p>
                <div class="price">¥2999/月</div>
                <ul class="plan-features">
                    <li>{{ t('feature8') if t('feature8') else '全市场行情数据' }}</li>
                    <li>{{ t('feature9') if t('feature9') else '专属客户经理' }}</li>
                    <li>{{ t('feature10') if t('feature10') else '高级分析工具套件' }}</li>
                    <li>{{ t('feature11') if t('feature11') else '个性化投资策略' }}</li>
                    <li>{{ t('feature12') if t('feature12') else '优先客服支持' }}</li>
                </ul>
                <a href="{{ url_for('contact') }}" class="btn">{{ t('get_started') if t('get_started') else '立即开通'
                    }}</a>
            </div>
        </div>
    </div>
</section>

<section class="features">
    <div class="container">
        <div class="section-title">
            <h2>{{ t('why_choose_our_pricing') if t('why_choose_our_pricing') else '为什么选择我们的收费方案' }}</h2>
        </div>
        <div class="feature-grid">
            <div class="feature">
                <h3>{{ t('transparent_pricing') if t('transparent_pricing') else '透明收费' }}</h3>
                <p>{{ t('transparent_pricing_desc') if t('transparent_pricing_desc') else '无隐藏费用，所有收费项目清晰明了' }}</p>
            </div>
            <div class="feature">
                <h3>{{ t('value_for_money') if t('value_for_money') else '物超所值' }}</h3>
                <p>{{ t('value_for_money_desc') if t('value_for_money_desc') else '提供远超价格的优质服务和工具' }}</p>
            </div>
            <div class="feature">
                <h3>{{ t('flexible_plans') if t('flexible_plans') else '灵活选择' }}</h3>
                <p>{{ t('flexible_plans_desc') if t('flexible_plans_desc') else '多种套餐满足不同投资需求' }}</p>
            </div>
        </div>
    </div>
</section>
{% endblock %}