feat: 管理后台日志查询系统

后端：
- 新增 /api/logs 路由，支持日志文件列表、统计、查询
- 按日期/级别/关键词筛选日志

前端：
- 新增日志管理页面，展示今日统计和7天趋势
- 支持按级别筛选和关键词搜索
- 管理后台添加「系统日志」入口

client/src/api/logs.ts

@@ -0,0 +1,46 @@
+import { request } from '@/utils/request'
+
+/** 日志文件信息 */
+export interface LogFileInfo {
+  name: string
+  date: string
+  size: number
+  modified: string
+}
+
+/** 日志统计 */
+export interface LogStats {
+  today: {
+    total: number
+    errors: number
+    slow: number
+    warns: number
+  }
+  daily: Array<{
+    date: string
+    total: number
+    errors: number
+    slow: number
+  }>
+}
+
+/** 获取日志文件列表 */
+export function getLogFiles(): Promise<LogFileInfo[]> {
+  return request({ url: '/logs/files' })
+}
+
+/** 获取日志统计 */
+export function getLogStats(): Promise<LogStats> {
+  return request({ url: '/logs/stats' })
+}
+
+/** 查询日志 */
+export function queryLogs(params: {
+  date: string
+  level?: string
+  keyword?: string
+  page?: number
+  pageSize?: number
+}): Promise<{ lines: string[]; total: number; page: number; pageSize: number }> {
+  return request({ url: `/logs/${params.date}`, data: { ...params, date: undefined } })
+}

client/src/pages.json

@@ -131,6 +131,14 @@
         "navigationBarTitleText": "系统配置",
         "enablePullDownRefresh": true
       }
+    },
+    {
+      "path": "pages/admin/logs",
+      "style": {
+        "navigationStyle": "custom",
+        "navigationBarTitleText": "系统日志",
+        "enablePullDownRefresh": true
+      }
     }
   ],
   "globalStyle": {

client/src/pages/admin/index.vue

@@ -82,6 +82,11 @@
           <text class="entry-text">系统配置</text>
           <Icon name="chevronRight" :size="24" color="#BFB3B3" />
         </view>
+        <view class="entry-item" @tap="goLogs">
+          <Icon name="edit" :size="32" color="#FF8C69" />
+          <text class="entry-text">系统日志</text>
+          <Icon name="chevronRight" :size="24" color="#BFB3B3" />
+        </view>
       </view>
     </view>
   </view>
@@ -147,6 +152,7 @@ function goUsers() { uni.navigateTo({ url: '/pages/admin/users' }) }
 function goNotificationManage() { uni.navigateTo({ url: '/pages/admin/notifications' }) }
 function goFeedbackManage() { uni.navigateTo({ url: '/pages/admin/feedback' }) }
 function goConfig() { uni.navigateTo({ url: '/pages/admin/config' }) }
+function goLogs() { uni.navigateTo({ url: '/pages/admin/logs' }) }
 </script>
 
 <style lang="scss" scoped>

client/src/pages/admin/logs.vue

@@ -0,0 +1,462 @@
+<template>
+  <view class="page">
+    <view class="header-fixed">
+      <view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
+      <view class="nav-bar">
+        <view class="nav-back" @tap="goBack">
+          <Icon name="arrowLeft" :size="40" color="#2D1B1B" />
+        </view>
+        <text class="nav-title">系统日志</text>
+        <view class="nav-placeholder"></view>
+      </view>
+    </view>
+
+    <!-- 今日统计 -->
+    <view class="stats-card" v-if="stats">
+      <text class="card-title">今日概况</text>
+      <view class="stats-grid">
+        <view class="stat-item">
+          <text class="stat-value">{{ stats.today.total }}</text>
+          <text class="stat-label">总请求</text>
+        </view>
+        <view class="stat-item error">
+          <text class="stat-value">{{ stats.today.errors }}</text>
+          <text class="stat-label">错误</text>
+        </view>
+        <view class="stat-item warn">
+          <text class="stat-value">{{ stats.today.warns }}</text>
+          <text class="stat-label">警告</text>
+        </view>
+        <view class="stat-item slow">
+          <text class="stat-value">{{ stats.today.slow }}</text>
+          <text class="stat-label">慢请求</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 最近7天趋势 -->
+    <view class="stats-card" v-if="stats && stats.daily.length > 0">
+      <text class="card-title">最近7天</text>
+      <view class="daily-list">
+        <view v-for="day in stats.daily" :key="day.date" class="daily-item" @tap="selectDate(day.date)">
+          <text class="daily-date">{{ day.date.slice(5) }}</text>
+          <view class="daily-bar">
+            <view class="bar-fill" :style="{ width: getBarWidth(day.total) + '%' }"></view>
+          </view>
+          <text class="daily-count">{{ day.total }}</text>
+          <text v-if="day.errors > 0" class="daily-errors">{{ day.errors }} 错误</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 日志查询 -->
+    <view class="query-section">
+      <view class="query-header">
+        <text class="section-title">日志查询</text>
+        <view class="date-picker" @tap="showDatePicker = true">
+          <Icon name="calendar" :size="28" color="#8B7E7E" />
+          <text class="date-text">{{ selectedDate }}</text>
+        </view>
+      </view>
+
+      <!-- 筛选条件 -->
+      <view class="filter-row">
+        <view class="filter-tabs">
+          <view class="filter-tab" :class="{ active: filterLevel === 'all' }" @tap="filterLevel = 'all'">全部</view>
+          <view class="filter-tab" :class="{ active: filterLevel === 'error' }" @tap="filterLevel = 'error'">错误</view>
+          <view class="filter-tab" :class="{ active: filterLevel === 'warn' }" @tap="filterLevel = 'warn'">警告</view>
+          <view class="filter-tab" :class="{ active: filterLevel === 'info' }" @tap="filterLevel = 'info'">信息</view>
+        </view>
+        <input class="search-input" v-model="keyword" placeholder="搜索关键词" @confirm="loadLogs" />
+      </view>
+
+      <!-- 日志列表 -->
+      <scroll-view class="log-list" scroll-y @scrolltolower="loadMore">
+        <view v-for="(line, index) in logLines" :key="index" class="log-line" :class="getLineClass(line)">
+          <text class="log-text" user-select>{{ line }}</text>
+        </view>
+
+        <view v-if="loading" class="loading-box">
+          <text class="loading-text">加载中...</text>
+        </view>
+
+        <view v-if="!loading && logLines.length === 0" class="empty-box">
+          <text class="empty-text">暂无日志</text>
+        </view>
+
+        <view v-if="noMore && logLines.length > 0" class="no-more">
+          <text class="no-more-text">共 {{ total }} 条</text>
+        </view>
+      </scroll-view>
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, onMounted, watch } from 'vue'
+import { onShow, onPullDownRefresh } from '@dcloudio/uni-app'
+import { waitForReady } from '@/utils/app-ready'
+import { statusBarHeight } from '@/utils/system'
+import { getLogStats, queryLogs } from '@/api/logs'
+import Icon from '@/components/Icon/Icon.vue'
+import type { LogStats } from '@/api/logs'
+
+const stats = ref<LogStats | null>(null)
+const selectedDate = ref(getTodayStr())
+const filterLevel = ref('all')
+const keyword = ref('')
+const logLines = ref<string[]>([])
+const loading = ref(false)
+const page = ref(1)
+const total = ref(0)
+
+const noMore = computed(() => logLines.value.length >= total.value && total.value > 0)
+
+function getTodayStr(): string {
+  const d = new Date()
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
+}
+
+onMounted(async () => {
+  await waitForReady()
+  await Promise.all([loadStats(), loadLogs()])
+})
+
+onShow(() => {
+  loadStats()
+})
+
+onPullDownRefresh(async () => {
+  await Promise.all([loadStats(), loadLogs()])
+  uni.stopPullDownRefresh()
+})
+
+async function loadStats() {
+  try {
+    stats.value = await getLogStats()
+  } catch {}
+}
+
+async function loadLogs(append = false) {
+  if (loading.value) return
+  if (!append) {
+    page.value = 1
+    logLines.value = []
+  }
+  loading.value = true
+  try {
+    const data = await queryLogs({
+      date: selectedDate.value,
+      level: filterLevel.value === 'all' ? undefined : filterLevel.value,
+      keyword: keyword.value || undefined,
+      page: page.value,
+      pageSize: 100
+    })
+    if (append) {
+      logLines.value = [...logLines.value, ...data.lines]
+    } else {
+      logLines.value = data.lines
+    }
+    total.value = data.total
+  } catch {
+    uni.showToast({ title: '加载失败', icon: 'none' })
+  } finally {
+    loading.value = false
+  }
+}
+
+function loadMore() {
+  if (noMore.value || loading.value) return
+  page.value++
+  loadLogs(true)
+}
+
+function selectDate(date: string) {
+  selectedDate.value = date
+  loadLogs()
+}
+
+function getBarWidth(count: number): number {
+  if (!stats.value) return 0
+  const max = Math.max(...stats.value.daily.map(d => d.total), 1)
+  return (count / max) * 100
+}
+
+function getLineClass(line: string): string {
+  if (line.includes(' ERROR ')) return 'error'
+  if (line.includes(' WARN ')) return 'warn'
+  return ''
+}
+
+// 筛选条件变化时重新加载
+watch([filterLevel], () => loadLogs())
+
+function goBack() {
+  uni.navigateBack()
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/styles/mixins.scss';
+
+.page {
+  min-height: 100vh;
+  background: $bg;
+}
+
+.header-fixed {
+  @include sticky-header;
+}
+
+.status-bar { @include status-bar; }
+
+.nav-bar {
+  display: flex;
+  align-items: center;
+  padding: $space-sm $space-xl $space-md;
+}
+
+.nav-back { @include nav-back; }
+
+.nav-title {
+  flex: 1;
+  text-align: center;
+  font-size: $font-2xl;
+  font-weight: 600;
+  color: $text;
+}
+
+.nav-placeholder { width: 88rpx; }
+
+.stats-card {
+  margin: $space-md $space-xl;
+  background: $surface;
+  border-radius: $radius-xl;
+  border: 2rpx solid $border;
+  box-shadow: $shadow-md;
+  padding: $space-lg;
+}
+
+.card-title {
+  font-size: $font-lg;
+  font-weight: 600;
+  color: $text;
+  display: block;
+  margin-bottom: $space-md;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: $space-md;
+}
+
+.stat-item {
+  text-align: center;
+  padding: $space-sm;
+  border-radius: $radius-lg;
+  background: $bg;
+
+  &.error { background: #FFF0F0; }
+  &.warn { background: #FFF8E1; }
+  &.slow { background: #FFF3E0; }
+}
+
+.stat-value {
+  font-family: 'Fredoka', sans-serif;
+  font-size: $font-2xl;
+  font-weight: 600;
+  color: $text;
+  display: block;
+
+  .error & { color: $danger; }
+  .warn & { color: #F57C00; }
+  .slow & { color: #FF9800; }
+}
+
+.stat-label {
+  font-size: $font-sm;
+  color: $text-sec;
+  display: block;
+  margin-top: $space-xs;
+}
+
+.daily-list {
+  display: flex;
+  flex-direction: column;
+  gap: $space-sm;
+}
+
+.daily-item {
+  display: flex;
+  align-items: center;
+  gap: $space-sm;
+  padding: $space-xs 0;
+
+  &:active { opacity: 0.7; }
+}
+
+.daily-date {
+  width: 80rpx;
+  font-size: $font-md;
+  color: $text-sec;
+}
+
+.daily-bar {
+  flex: 1;
+  height: 16rpx;
+  background: $border;
+  border-radius: 8rpx;
+  overflow: hidden;
+}
+
+.bar-fill {
+  height: 100%;
+  background: linear-gradient(90deg, $primary, #FFB89A);
+  border-radius: 8rpx;
+}
+
+.daily-count {
+  width: 80rpx;
+  text-align: right;
+  font-family: 'Fredoka', sans-serif;
+  font-size: $font-md;
+  color: $text;
+}
+
+.daily-errors {
+  font-size: $font-xs;
+  color: $danger;
+  width: 100rpx;
+}
+
+.query-section {
+  margin: $space-md $space-xl;
+}
+
+.query-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: $space-md;
+}
+
+.section-title {
+  font-size: $font-lg;
+  font-weight: 600;
+  color: $text;
+}
+
+.date-picker {
+  display: flex;
+  align-items: center;
+  gap: $space-xs;
+  padding: $space-xs $space-md;
+  background: $surface;
+  border-radius: $radius-lg;
+  border: 2rpx solid $border;
+
+  &:active { background: $bg; }
+}
+
+.date-text {
+  font-size: $font-md;
+  color: $text;
+}
+
+.filter-row {
+  display: flex;
+  gap: $space-md;
+  margin-bottom: $space-md;
+}
+
+.filter-tabs {
+  display: flex;
+  gap: $space-xs;
+  background: $surface-warm;
+  border-radius: $radius-lg;
+  padding: $space-xs;
+}
+
+.filter-tab {
+  padding: $space-xs $space-md;
+  border-radius: $radius-md;
+  font-size: $font-md;
+  color: $text-sec;
+
+  &.active {
+    background: $surface;
+    color: $primary;
+    font-weight: 500;
+  }
+}
+
+.search-input {
+  flex: 1;
+  height: 64rpx;
+  padding: 0 $space-md;
+  background: $surface;
+  border-radius: $radius-lg;
+  border: 2rpx solid $border;
+  font-size: $font-md;
+}
+
+.log-list {
+  height: calc(100vh - 700rpx);
+  background: $surface;
+  border-radius: $radius-xl;
+  border: 2rpx solid $border;
+  padding: $space-sm;
+}
+
+.log-line {
+  padding: $space-xs $space-sm;
+  border-bottom: 1rpx solid $border;
+
+  &:last-child { border-bottom: none; }
+
+  &.error {
+    background: #FFF5F5;
+    border-left: 4rpx solid $danger;
+  }
+
+  &.warn {
+    background: #FFFBF0;
+    border-left: 4rpx solid #F57C00;
+  }
+}
+
+.log-text {
+  font-size: $font-sm;
+  font-family: 'Courier New', monospace;
+  color: $text;
+  word-break: break-all;
+  line-height: 1.6;
+}
+
+.loading-box, .empty-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: $space-xl 0;
+}
+
+.loading-text, .empty-text {
+  font-size: $font-md;
+  color: $text-muted;
+}
+
+.no-more {
+  text-align: center;
+  padding: $space-md 0;
+}
+
+.no-more-text {
+  font-size: $font-sm;
+  color: $text-muted;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .bar-fill { transition: none; }
+}
+</style>