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:
@@ -14,6 +14,7 @@ document.addEventListener('alpine:init', () => {
|
||||
quotaRows: [], // Filtered view
|
||||
usageHistory: {}, // Usage statistics history (from /account-limits?includeHistory=true)
|
||||
loading: false,
|
||||
initialLoad: true, // Track first load for skeleton screen
|
||||
connectionStatus: 'connecting',
|
||||
lastUpdated: '-',
|
||||
|
||||
@@ -36,7 +37,10 @@ document.addEventListener('alpine:init', () => {
|
||||
},
|
||||
|
||||
async fetchData() {
|
||||
this.loading = true;
|
||||
// Only show skeleton on initial load, not on refresh
|
||||
if (this.initialLoad) {
|
||||
this.loading = true;
|
||||
}
|
||||
try {
|
||||
// Get password from global store
|
||||
const password = Alpine.store('global').webuiPassword;
|
||||
@@ -72,6 +76,7 @@ document.addEventListener('alpine:init', () => {
|
||||
store.showToast(store.t('connectionLost'), 'error');
|
||||
} finally {
|
||||
this.loading = false;
|
||||
this.initialLoad = false; // Mark initial load as complete
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
Reference in New Issue
Block a user