File size: 4,459 Bytes
d3cadd5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>额度重置时间测试</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            padding: 20px;
            background: #f5f5f5;
        }
        .account-card {
            background: white;
            border-radius: 10px;
            padding: 20px;
            margin-bottom: 20px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        .quota-header {
            display: flex;
            justify-content: space-between;
            margin-bottom: 10px;
            font-weight: bold;
        }
        .progress-bar {
            background: #e0e0e0;
            border-radius: 4px;
            height: 10px;
            margin-bottom: 10px;
            overflow: hidden;
        }
        .progress-fill {
            background: #4CAF50;
            height: 100%;
            transition: width 0.3s;
        }
        .quota-detail {
            display: flex;
            gap: 20px;
            font-size: 0.9em;
            color: #666;
            margin-bottom: 10px;
        }
        .quota-reset-info {
            display: flex;
            gap: 20px;
            font-size: 0.8em;
            color: #888;
        }
        .badge {
            padding: 2px 8px;
            border-radius: 4px;
            font-size: 0.8em;
        }
        .badge.success { background: #4CAF50; color: white; }
        .badge.error { background: #f44336; color: white; }
    </style>
</head>
<body>
    <h1>额度重置时间测试</h1>
    <div id="accountsContainer"></div>

    <script>
        async function loadAccounts() {
            try {
                const response = await fetch('http://localhost:8080/api/accounts/status');
                const data = await response.json();
                
                const container = document.getElementById('accountsContainer');
                container.innerHTML = '';
                
                data.accounts.forEach(account => {
                    const quota = account.quota;
                    if (!quota) return;
                    
                    const usedPercent = quota.usage_limit > 0 ? (quota.current_usage / quota.usage_limit * 100) : 0;
                    const isExhausted = quota.is_exhausted;
                    
                    const card = document.createElement('div');
                    card.className = 'account-card';
                    card.innerHTML = `
                        <h3>${account.name} <span class="badge ${isExhausted ? 'error' : 'success'}">${isExhausted ? '额度耗尽' : '正常'}</span></h3>
                        <div class="quota-header">
                            <span>已用/总额</span>
                            <span>${quota.current_usage.toFixed(1)} / ${quota.usage_limit.toFixed(1)}</span>
                        </div>
                        <div class="progress-bar">
                            <div class="progress-fill" style="width: ${usedPercent}%"></div>
                        </div>
                        <div class="quota-detail">
                            <span>试用: ${quota.free_trial_usage.toFixed(0)}/${quota.free_trial_limit.toFixed(0)}</span>
                            <span>奖励: ${quota.bonus_usage.toFixed(0)}/${quota.bonus_limit.toFixed(0)} (${quota.active_bonuses}个)</span>
                            <span>更新: ${quota.updated_at || '未知'}</span>
                        </div>
                        ${quota.reset_date_text || quota.trial_expiry_text ? `
                        <div class="quota-reset-info">
                            ${quota.reset_date_text ? `<span>🔄 重置: ${quota.reset_date_text}</span>` : ''}
                            ${quota.trial_expiry_text ? `<span>🎁 试用过期: ${quota.trial_expiry_text}</span>` : ''}
                        </div>
                        ` : ''}
                    `;
                    
                    container.appendChild(card);
                });
            } catch (error) {
                console.error('加载失败:', error);
                document.getElementById('accountsContainer').innerHTML = '<p>加载失败,请确保服务器正在运行</p>';
            }
        }
        
        // 页面加载时获取数据
        loadAccounts();
        
        // 每30秒刷新一次
        setInterval(loadAccounts, 30000);
    </script>
</body>
</html>