From 8507b1b358d76dff78d0464f83ac05b989ce0681 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=8B=E6=9D=B0?= Date: Mon, 18 Aug 2025 14:50:03 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E5=8E=86=E5=8F=B2=E8=AE=B0?= =?UTF-8?q?=E5=BD=95=E5=8D=A1=E9=A1=BF=E9=97=AE=E9=A2=98=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/components/HistoryRecord.vue | 108 ++++++++++++++++----------------- 1 file changed, 51 insertions(+), 57 deletions(-) diff --git a/src/views/components/HistoryRecord.vue b/src/views/components/HistoryRecord.vue index bb71497..e29cd46 100644 --- a/src/views/components/HistoryRecord.vue +++ b/src/views/components/HistoryRecord.vue @@ -458,10 +458,22 @@ const historyRecords = ref([]); const categoryHistory = ref([]); let chatFirstFlag = true; let emotionTirstFlag = true; +// 添加缓存机制 +let cachedCategoryHistory = null; +let lastDataHash = null; const getHistoryList = async (params) => { try { const result = await getHistoryListAPI(params); historyRecords.value = result.data; + + // 检查数据是否有变化，使用简单的哈希值比较 + const currentDataHash = JSON.stringify(result.data.map(r => ({ id: r.id, isTop: r.isTop, createdTime: r.createdTime }))); + if (cachedCategoryHistory && lastDataHash === currentDataHash) { + // 使用缓存的分类结果 + categoryHistory.value = cachedCategoryHistory; + return; + } + let remainingRecords = result.data; // 复制原数组 // console.log( // "params", @@ -505,60 +517,37 @@ const getHistoryList = async (params) => { } // 非首次调用时保持当前折叠状态不变 - // 1. 筛选置顶记录 - let topList = remainingRecords.filter((record) => record.isTop === 1); - remainingRecords = remainingRecords.filter((record) => record.isTop !== 1); - - // 2. 筛选今日记录 - let todayList = remainingRecords.filter((record) => { - const today = moment().format("YYYY-MM-DD"); - const recordDate = moment(record.createdTime).format("YYYY-MM-DD"); - return recordDate === today; - }); - remainingRecords = remainingRecords.filter((record) => { - const today = moment().format("YYYY-MM-DD"); - const recordDate = moment(record.createdTime).format("YYYY-MM-DD"); - return recordDate !== today; - }); - - // 3. 筛选近3日记录（不包括今日） - let recent3DaysList = remainingRecords.filter((record) => { - const threeDaysAgo = moment().subtract(3, "days").startOf("day"); - const yesterday = moment().subtract(1, "days").endOf("day"); - const recordDate = moment(record.createdTime); - return recordDate.isAfter(threeDaysAgo) && recordDate.isBefore(yesterday); - }); - remainingRecords = remainingRecords.filter((record) => { - const threeDaysAgo = moment().subtract(3, "days").startOf("day"); - const yesterday = moment().subtract(1, "days").endOf("day"); - const recordDate = moment(record.createdTime); - return !( - recordDate.isAfter(threeDaysAgo) && recordDate.isBefore(yesterday) - ); - }); - - // 4. 筛选近7日记录（不包括今日和近3日） - let recent7DaysList = remainingRecords.filter((record) => { - const sevenDaysAgo = moment().subtract(7, "days").startOf("day"); - const recordDate = moment(record.createdTime); - return recordDate.isAfter(sevenDaysAgo); - }); - remainingRecords = remainingRecords.filter((record) => { - const sevenDaysAgo = moment().subtract(7, "days").startOf("day"); - const recordDate = moment(record.createdTime); - return !recordDate.isAfter(sevenDaysAgo); - }); - - // 5. 筛选近30日记录（不包括前面已筛选的） - let recent30DaysList = remainingRecords.filter((record) => { - const thirtyDaysAgo = moment().subtract(30, "days").startOf("day"); - const recordDate = moment(record.createdTime); - return recordDate.isAfter(thirtyDaysAgo); - }); - remainingRecords = remainingRecords.filter((record) => { - const thirtyDaysAgo = moment().subtract(30, "days").startOf("day"); + // 优化：一次遍历完成所有分类，避免重复计算日期 + const today = moment().format("YYYY-MM-DD"); + const threeDaysAgo = moment().subtract(3, "days").startOf("day"); + const yesterday = moment().subtract(1, "days").endOf("day"); + const sevenDaysAgo = moment().subtract(7, "days").startOf("day"); + const thirtyDaysAgo = moment().subtract(30, "days").startOf("day"); + + const topList = []; + const todayList = []; + const recent3DaysList = []; + const recent7DaysList = []; + const recent30DaysList = []; + + remainingRecords.forEach((record) => { + if (record.isTop === 1) { + topList.push(record); + return; + } + const recordDate = moment(record.createdTime); - return !recordDate.isAfter(thirtyDaysAgo); + const recordDateStr = recordDate.format("YYYY-MM-DD"); + + if (recordDateStr === today) { + todayList.push(record); + } else if (recordDate.isAfter(threeDaysAgo) && recordDate.isBefore(yesterday)) { + recent3DaysList.push(record); + } else if (recordDate.isAfter(sevenDaysAgo)) { + recent7DaysList.push(record); + } else if (recordDate.isAfter(thirtyDaysAgo)) { + recent30DaysList.push(record); + } }); historyRecords.value = result.data; @@ -585,6 +574,11 @@ const getHistoryList = async (params) => { list: recent30DaysList, }, ]; + + // 更新缓存 + cachedCategoryHistory = categoryHistory.value; + lastDataHash = currentDataHash; + // console.log("historyRecords", historyRecords.value); // console.log("categoryHistory", categoryHistory.value); } catch (e) { @@ -807,7 +801,7 @@ onMounted(() => { border-right: 1px solid rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); z-index: 1000; - transition: width 0.3s ease; + transition: width 0.2s ease-out; display: flex; flex-direction: column; align-items: center; @@ -824,7 +818,7 @@ onMounted(() => { border-right: 1px solid rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); z-index: 1000; - transition: width 0.3s ease; + transition: width 0.2s ease-out; display: flex; flex-direction: column; align-items: center; @@ -849,7 +843,7 @@ onMounted(() => { display: flex; align-items: center; justify-content: center; - transition: all 0.3s ease; + transition: background-color 0.2s ease-out, border-color 0.2s ease-out; z-index: 10; } @@ -862,7 +856,7 @@ onMounted(() => { display: flex; align-items: center; justify-content: center; - transition: all 0.3s ease; + transition: background-color 0.2s ease-out, border-color 0.2s ease-out; z-index: 10; }