feat(webui): add Tailwind build system and refactor frontend architecture
- Replace Tailwind CDN with local build (PostCSS + autoprefixer + daisyui) - Add CSS build scripts with automatic prepare hook on npm install - Create account-actions.js service layer with unified response format - Extend ErrorHandler.withLoading() for automatic loading state management - Add skeleton screens for initial load, silent refresh for subsequent updates - Implement loading animations for async operations (buttons, modals) - Improve empty states and add ARIA labels for accessibility - Abstract component styles using @apply (buttons, badges, inputs) - Add JSDoc documentation for Dashboard modules - Update README and CLAUDE.md with development guidelines
This commit is contained in:
@@ -1,12 +1,37 @@
|
||||
/**
|
||||
* Dashboard Stats Module
|
||||
* Handles account statistics calculation
|
||||
* 职责:根据 Alpine.store('data') 计算账号统计数据
|
||||
*
|
||||
* 调用时机:
|
||||
* - dashboard 组件 init() 时
|
||||
* - $store.data 更新时(通过 $watch 监听)
|
||||
*
|
||||
* 统计维度:
|
||||
* - total: 启用账号总数(排除禁用账号)
|
||||
* - active: 有可用配额的账号数
|
||||
* - limited: 配额受限或失效的账号数
|
||||
* - subscription: 按订阅级别分类(ultra/pro/free)
|
||||
*
|
||||
* @module DashboardStats
|
||||
*/
|
||||
window.DashboardStats = window.DashboardStats || {};
|
||||
|
||||
/**
|
||||
* Update account statistics (active, limited, total)
|
||||
* @param {object} component - Dashboard component instance
|
||||
* 更新账号统计数据
|
||||
*
|
||||
* 统计逻辑:
|
||||
* 1. 仅统计启用的账号(enabled !== false)
|
||||
* 2. 优先统计核心模型(Sonnet/Opus/Pro/Flash)的配额
|
||||
* 3. 配额 > 5% 视为 active,否则为 limited
|
||||
* 4. 状态非 'ok' 的账号归为 limited
|
||||
*
|
||||
* @param {object} component - Dashboard 组件实例(Alpine.js 上下文)
|
||||
* @param {object} component.stats - 统计数据对象(会被修改)
|
||||
* @param {number} component.stats.total - 启用账号总数
|
||||
* @param {number} component.stats.active - 活跃账号数
|
||||
* @param {number} component.stats.limited - 受限账号数
|
||||
* @param {object} component.stats.subscription - 订阅级别分布
|
||||
* @returns {void}
|
||||
*/
|
||||
window.DashboardStats.updateStats = function(component) {
|
||||
const accounts = Alpine.store('data').accounts;
|
||||
|
||||
Reference in New Issue
Block a user