diff --git a/src/pages/history/index.css b/src/pages/history/index.css index 3b86f12..4529b32 100644 --- a/src/pages/history/index.css +++ b/src/pages/history/index.css @@ -1,54 +1,10 @@ .history { - background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%); + background: #fff; min-height: 100vh; display: flex; flex-direction: column; } -.history-header { - display: flex; - justify-content: space-between; - align-items: flex-end; - padding: 40px 32px 32px; - background: #fff; - border-bottom: 2px solid #eee; -} - -.header-left { - display: flex; - flex-direction: column; - gap: 8px; -} - -.history-title { - font-size: 40px; - font-weight: 700; - color: #333; - letter-spacing: 0.5px; - line-height: 1.2; -} - -.record-count { - font-size: 24px; - color: #666; - font-weight: 500; -} - -.clear-btn { - font-size: 28px; - color: #007aff; - background: rgb(0 122 255 / 10%); - padding: 16px 24px; - border-radius: 24px; - cursor: pointer; - border: 1px solid rgb(0 122 255 / 20%); - font-weight: 500; -} - -.clear-btn:active { - background: rgb(0 122 255 / 20%); -} - .history-list { height: 100vh; padding: 0; @@ -58,7 +14,7 @@ .history-grid { margin: 0 auto; - padding: 12px 16px; + padding: 8px 16px; min-height: 100%; } @@ -116,43 +72,36 @@ .history-item { background: #fff; - border-radius: 24px; - padding: 32px; - margin-bottom: 24px; + border-radius: 12px; + padding: 20px; + margin-bottom: 8px; display: flex; align-items: center; - box-shadow: 0 4px 16px rgb(0 0 0 / 8%); - border: 1px solid #f0f0f0; position: relative; overflow: hidden; } -.history-item:active { - box-shadow: 0 2px 8px rgb(0 0 0 / 12%); -} - .item-thumbnail { - width: 100px; - height: 100px; - border-radius: 20px; - margin-right: 32px; + width: 160px; + height: 160px; + border-radius: 12px; + margin-right: 20px; flex-shrink: 0; overflow: hidden; position: relative; - box-shadow: 0 2px 8px rgb(0 0 0 / 10%); } .thumbnail-image { width: 100%; height: 100%; - border-radius: 20px; + border-radius: 12px; background: #f5f5f5; } .thumbnail-placeholder { width: 100%; height: 100%; - border-radius: 20px; + border-radius: 12px; display: flex; align-items: center; justify-content: center; @@ -185,13 +134,13 @@ display: flex; justify-content: space-between; align-items: flex-start; - margin-bottom: 20px; + margin-bottom: 8px; } .item-title { - font-size: 34px; - font-weight: 700; - color: #1a1a1a; + font-size: 28px; + font-weight: 600; + color: #333; flex: 1; overflow: hidden; text-overflow: ellipsis; @@ -289,10 +238,10 @@ } .item-time { - font-size: 24px; - color: #8e8e93; - font-weight: 500; - opacity: 0.8; + font-size: 22px; + color: #999; + font-weight: 400; + opacity: 0.7; } /* 加载指示器 */ diff --git a/src/pages/history/index.tsx b/src/pages/history/index.tsx index 91d5ca6..b2e5e41 100644 --- a/src/pages/history/index.tsx +++ b/src/pages/history/index.tsx @@ -76,32 +76,6 @@ export default function History() { } }; - const getStatusText = (status: string) => { - switch (status) { - case 'processing': - return '生成中'; - case 'completed': - return '已完成'; - case 'failed': - return '生成失败'; - default: - return '未知状态'; - } - }; - - const getStatusColor = (status: string) => { - switch (status) { - case 'processing': - return '#FF9500'; - case 'completed': - return '#34C759'; - case 'failed': - return '#FF3B30'; - default: - return '#8E8E93'; - } - }; - const formatTime = (timeStr: string) => { const date = new Date(timeStr); const year = date.getFullYear(); @@ -153,10 +127,6 @@ export default function History() { {record.templateName} - - {getStatusText(record.status)} - - {/* 添加状态指示器 */} {record.status === 'generating' && (