feat: 完成布局优化 - 操作列固定、批量按钮自适应、分类标签带数量

优化内容: 1. 表格布局: - 使用 calc(100vw - 160px) 确保表格不超出视口 - 操作列 fixed='right' 固定在右侧，宽度 300px - 按钮 3 个后自动换行 (max-width: 200px) - 恢复合理列宽，不再过度压缩 2. 批量操作区域: - 容器改为 inline-block，宽度自适应按钮内容 - 背景宽度与按钮总宽度匹配 3. 分类标签: - 显示数量 (如 '待处理 (20)') - 点击切换筛选，去掉误导的 'X' 图标 4. 删除功能: - 操作列增加删除按钮 - 删除前弹出确认对话框 5. 系统日志: - 修复后端日志路径 (parents[4]) - 404 时显示友好提示 6. 其他: - 左侧菜单宽度 160px - 所有功能保留 (登录、用户管理、批量操作等)
2026-04-27 11:32:17 +08:00
parent 59d2a76df4
commit 277b13eaae
137 changed files with 8615 additions and 1213 deletions
@@ -0,0 +1,116 @@
+// Service Worker for 宇之然内容创作平台
+const CACHE_NAME = 'yuzhiran-v1';
+const CACHE_URLS = [
+  '/',
+  '/index.html',
+  '/offline.html',
+  '/static/vue.global.prod.js',
+  '/static/element-plus.css',
+  '/static/element-plus.full.js',
+  '/manifest.json'
+];
+
+// 安装事件：预缓存核心资源
+self.addEventListener('install', (event) => {
+  console.log('[SW] Installing...');
+  event.waitUntil(
+    caches.open(CACHE_NAME).then((cache) => {
+      console.log('[SW] Pre-caching core assets');
+      return cache.addAll(CACHE_URLS.map(url => {
+        // 忽略同源请求404错误（静态资源可能不存在）
+        return new Promise((resolve, reject) => {
+          fetch(url).then(response => {
+            if (response.ok) {
+              resolve(url);
+            } else {
+              reject(new Error(`Failed to fetch ${url}: ${response.status}`));
+            }
+          }).catch(() => {
+            // 静默失败，不阻止安装
+            resolve(url);
+          });
+        });
+      }));
+    }).catch(err => {
+      console.error('[SW] Install failed:', err);
+    })
+  );
+  self.skipWaiting();
+});
+
+// 激活事件：清理旧缓存
+self.addEventListener('activate', (event) => {
+  console.log('[SW] Activating...');
+  event.waitUntil(
+    caches.keys().then((cacheNames) => {
+      return Promise.all(
+        cacheNames.map((cache) => {
+          if (cache !== CACHE_NAME) {
+            console.log('[SW] Deleting old cache:', cache);
+            return caches.delete(cache);
+          }
+        })
+      );
+    })
+  );
+  self.clients.claim();
+});
+
+// 网络请求拦截：Cache First + Network Fallback
+self.addEventListener('fetch', (event) => {
+  const { request } = event;
+  const url = new URL(request.url);
+
+  // 只处理同源请求
+  if (url.origin !== location.origin) {
+    return;
+  }
+
+  // API 请求：Network Only（不走缓存）
+  if (url.pathname.startsWith('/api/')) {
+    event.respondWith(fetch(request));
+    return;
+  }
+
+  // 静态资源：Cache First
+  event.respondWith(
+    caches.match(request).then((cached) => {
+      if (cached) {
+        // 返回缓存，并在后台更新
+        fetch(request).then(response => {
+          if (response.ok) {
+            caches.open(CACHE_NAME).then(cache => cache.put(request, response));
+          }
+        });
+        return cached;
+      }
+
+      // 无缓存，发起网络请求
+      return fetch(request).then(response => {
+        // 成功且为有效响应，加入缓存
+        if (response.ok && response.status === 200) {
+          const responseClone = response.clone();
+          caches.open(CACHE_NAME).then(cache => cache.put(request, responseClone));
+        }
+        return response;
+      }).catch(() => {
+        // 网络失败，尝试返回离线页面（如果是文档请求）
+        if (request.destination === 'document') {
+          return caches.match('/offline.html');
+        }
+      });
+    })
+  );
+});
+
+// 后台同步（可选：在网络恢复后发送错误日志）
+self.addEventListener('sync', (event) => {
+  if (event.tag === 'sync-logs') {
+    event.waitUntil(syncLogs());
+  }
+});
+
+async function syncLogs() {
+  // TODO: 实现日志同步
+  console.log('[SW] Syncing logs...');
+}