From 06b3147b53c20f58aed6a803302a01fc440ee761 Mon Sep 17 00:00:00 2001 From: Alirea <2981883527@qq.com> Date: Thu, 25 Sep 2025 19:26:02 +0800 Subject: [PATCH] =?UTF-8?q?feat(ui):=20=E5=8E=86=E5=8F=B2=E8=AE=B0?= =?UTF-8?q?=E5=BD=95=E8=AF=A6=E7=BB=86=E6=97=A5=E5=BF=97=E5=A2=9E=E5=8A=A0?= =?UTF-8?q?=E5=AD=97=E4=BD=93=E5=A4=A7=E5=B0=8F=E8=B0=83=E6=95=B4=E9=80=89?= =?UTF-8?q?=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/views/History.vue | 267 +++++++++------------------------ 1 file changed, 73 insertions(+), 194 deletions(-) diff --git a/frontend/src/views/History.vue b/frontend/src/views/History.vue index 7b556c2..c41e2fe 100644 --- a/frontend/src/views/History.vue +++ b/frontend/src/views/History.vue @@ -26,7 +26,7 @@ - + @@ -277,43 +277,54 @@ -
+ 
{{ currentDetail.log_content }}
@@ -341,7 +352,7 @@ import { FileOutlined, } from '@ant-design/icons-vue' import { Service } from '@/api/services/Service' -import type { HistorySearchIn, HistoryData } from '@/api' +import { HistorySearchIn, type HistoryData } from '@/api' // 调整：枚举需要值导入 import dayjs from 'dayjs' import NodataImage from '@/assets/NoData.png' @@ -358,62 +369,20 @@ const selectedRecordIndex = ref(-1) const currentDetail = ref(null) const currentJsonFile = ref('') -// 快捷时间选择预设 +// 快捷时间选择预设（改用枚举值） const timePresets = [ - { - key: 'today', - label: '今天', - startDate: () => dayjs().format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按日合并' as HistorySearchIn.mode, - }, - { - key: 'yesterday', - label: '昨天', - startDate: () => dayjs().subtract(1, 'day').format('YYYY-MM-DD'), - endDate: () => dayjs().subtract(1, 'day').format('YYYY-MM-DD'), - mode: '按日合并' as HistorySearchIn.mode, - }, - { - key: 'week', - label: '最近一周', - startDate: () => dayjs().subtract(7, 'day').format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按日合并' as HistorySearchIn.mode, - }, - { - key: 'month', - label: '最近一个月', - startDate: () => dayjs().subtract(1, 'month').format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按周合并' as HistorySearchIn.mode, - }, - { - key: 'twoMonths', - label: '最近两个月', - startDate: () => dayjs().subtract(2, 'month').format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按周合并' as HistorySearchIn.mode, - }, - { - key: 'threeMonths', - label: '最近三个月', - startDate: () => dayjs().subtract(3, 'month').format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按月合并' as HistorySearchIn.mode, - }, - { - key: 'halfYear', - label: '最近半年', - startDate: () => dayjs().subtract(6, 'month').format('YYYY-MM-DD'), - endDate: () => dayjs().format('YYYY-MM-DD'), - mode: '按月合并' as HistorySearchIn.mode, - }, + { key: 'today', label: '今天', startDate: () => dayjs().format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.DAILY }, + { key: 'yesterday', label: '昨天', startDate: () => dayjs().subtract(1, 'day').format('YYYY-MM-DD'), endDate: () => dayjs().subtract(1, 'day').format('YYYY-MM-DD'), mode: HistorySearchIn.mode.DAILY }, + { key: 'week', label: '最近一周', startDate: () => dayjs().subtract(7, 'day').format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.DAILY }, + { key: 'month', label: '最近一个月', startDate: () => dayjs().subtract(1, 'month').format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.WEEKLY }, + { key: 'twoMonths', label: '最近两个月', startDate: () => dayjs().subtract(2, 'month').format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.WEEKLY }, + { key: 'threeMonths', label: '最近三个月', startDate: () => dayjs().subtract(3, 'month').format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.MONTHLY }, + { key: 'halfYear', label: '最近半年', startDate: () => dayjs().subtract(6, 'month').format('YYYY-MM-DD'), endDate: () => dayjs().format('YYYY-MM-DD'), mode: HistorySearchIn.mode.MONTHLY }, ] -// 搜索表单 +// 搜索表单（默认按日合并） const searchForm = reactive({ - mode: '按日合并' as HistorySearchIn.mode, + mode: HistorySearchIn.mode.DAILY as HistorySearchIn.mode, startDate: dayjs().subtract(7, 'day').format('YYYY-MM-DD'), endDate: dayjs().format('YYYY-MM-DD'), }) @@ -426,37 +395,6 @@ interface HistoryDateGroup { const historyData = ref([]) -// 计算总览数据 -const totalOverview = computed(() => { - let totalRecruit = 0 - let totalDrop = 0 - - historyData.value.forEach(dateGroup => { - Object.values(dateGroup.users).forEach(userData => { - // 统计公招数据 - if (userData.recruit_statistics) { - Object.values(userData.recruit_statistics).forEach((count: any) => { - totalRecruit += count - }) - } - - // 统计掉落数据 - if (userData.drop_statistics) { - Object.values(userData.drop_statistics).forEach((stageDrops: any) => { - Object.values(stageDrops).forEach((count: any) => { - totalDrop += count - }) - }) - } - }) - }) - - return { - totalRecruit, - totalDrop, - } -}) - // 当前显示的统计数据（根据是否选中记录条目来决定显示用户总计还是单条记录的数据） const currentStatistics = computed(() => { if (selectedRecordIndex.value >= 0 && currentDetail.value) { @@ -523,7 +461,7 @@ const handleSearch = async () => { // 重置搜索条件 const handleReset = () => { - searchForm.mode = '按日合并' + searchForm.mode = HistorySearchIn.mode.DAILY searchForm.startDate = dayjs().subtract(7, 'day').format('YYYY-MM-DD') searchForm.endDate = dayjs().format('YYYY-MM-DD') historyData.value = [] @@ -546,12 +484,12 @@ const handleDateChange = () => { currentPreset.value = '' } -// ���择用户处理 +// 选择用户处理（修正乱码注释） const handleSelectUser = async (date: string, username: string, userData: HistoryData) => { selectedUser.value = `${date}-${username}` selectedUserData.value = userData - selectedRecordIndex.value = -1 // 重置记录选择 - currentDetail.value = null // 清空日志内容 + selectedRecordIndex.value = -1 + currentDetail.value = null currentJsonFile.value = '' } @@ -655,15 +593,14 @@ const handleOpenLogDirectory = async () => { } } -// 获取日期状态颜色 -const getDateStatusColor = (users: Record) => { - const hasError = Object.values(users).some( - user => - user.index?.some(item => item.status === '异常') || - (user.error_info && Object.keys(user.error_info).length > 0) - ) - return hasError ? 'error' : 'success' -} +// 日志字体大小（恢复） +const logFontSize = ref(14) +const logFontSizeOptions = [12, 13, 14, 16, 18, 20] + +// Tooltip 容器：避免挂载到 body 造成全局滚动条闪烁与布局抖动 +const tooltipContainer = (triggerNode: HTMLElement) => triggerNode?.parentElement || document.body +// 固定 button 尺寸，避免 hover/tooltip 状态导致宽度高度微调 +const buttonFixedStyle = { width: '28px', height: '28px', padding: 0 }