Skip to content

Commit b16b725

Browse files
author
Taois
committed
feat:搜索结果页再次重新搜索逻辑
1 parent d284618 commit b16b725

File tree

2 files changed

+105
-6
lines changed

2 files changed

+105
-6
lines changed

‎dashboard/src/components/Header.vue‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -249,22 +249,33 @@ export default defineComponent({
249249
window.location.reload();
250250
},
251251
onSearch(value) {
252+
console.log('🔍 [Header] onSearch被触发:', { value, isSearchPage: this.isSearchAggregationPage });
253+
252254
if (!value || !value.trim()) {
253255
Message.warning('请输入搜索内容');
254256
return;
255257
}
256258
259+
const keyword = value.trim();
260+
console.log('🔍 [Header] 准备执行搜索:', { keyword, currentRoute: this.$route.name });
261+
257262
if (this.isSearchAggregationPage) {
258263
// 如果已经在搜索页面，直接更新查询参数
264+
console.log('🔍 [Header] 在搜索页面，更新查询参数');
265+
// 添加时间戳参数强制触发路由变化，确保即使相同关键词也能重新搜索
259266
this.$router.push({
260267
name: 'SearchAggregation',
261-
query: { keyword: value.trim() }
268+
query: {
269+
keyword,
270+
_t: Date.now() // 时间戳参数强制路由更新
271+
}
262272
});
263273
} else {
264274
// 如果不在搜索页面，跳转到聚合搜索页面并执行搜索
275+
console.log('🔍 [Header] 不在搜索页面，跳转到搜索页面');
265276
this.$router.push({
266277
name: 'SearchAggregation',
267-
query: { keyword: value.trim() }
278+
query: { keyword }
268279
});
269280
}
270281
},

‎dashboard/src/views/SearchAggregation.vue‎

Lines changed: 92 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -485,15 +485,26 @@ export default defineComponent({
485485
};
486486
487487
const performSearch = async (keyword) => {
488+
console.log('🔍 [performSearch] 方法被调用:', {
489+
keyword,
490+
currentKeyword: searchKeyword.value,
491+
hasSearched: hasSearched.value,
492+
currentResults: Object.keys(searchResults.value).length
493+
});
494+
488495
if (!keyword || !keyword.trim()) {
489496
Message.warning('请输入搜索关键词');
490497
return;
491498
}
492499
493-
searchKeyword.value = keyword.trim();
500+
const trimmedKeyword = keyword.trim();
501+
console.log('🔍 [performSearch] 开始执行搜索:', { trimmedKeyword });
502+
503+
searchKeyword.value = trimmedKeyword;
494504
hasSearched.value = true;
495505
496506
// 重置状态
507+
console.log('🔍 [performSearch] 重置搜索状态...');
497508
searchResults.value = {};
498509
loadingStates.value = {};
499510
errorStates.value = {};
@@ -502,6 +513,12 @@ export default defineComponent({
502513
searchCompletedTimes.value = {}; // 清空搜索完成时间戳
503514
displayedCount.value = pageSize.value;
504515
516+
console.log('🔍 [performSearch] 状态重置完成:', {
517+
searchResults: Object.keys(searchResults.value).length,
518+
loadingStates: Object.keys(loadingStates.value).length,
519+
hasSearched: hasSearched.value
520+
});
521+
505522
// 重置活跃源，让自动激活逻辑来处理
506523
activeSource.value = '';
507524
@@ -578,6 +595,10 @@ export default defineComponent({
578595
if (page === 1) {
579596
searchCompletedTimes.value[source.key] = Date.now();
580597
console.log(`搜索源 ${source.name} 完成搜索，时间戳: ${searchCompletedTimes.value[source.key]}`);
598+
599+
// 搜索完成后实时保存状态
600+
debouncedSavePageState();
601+
console.log('🔄 [状态保存] 搜索完成，触发状态保存:', source.name);
581602
}
582603
583604
delete errorStates.value[source.key];
@@ -599,8 +620,15 @@ export default defineComponent({
599620
displayedCount.value = pageSize.value; // 重置显示数量
600621
updateScrollAreaHeight();
601622
updateGlobalStats();
623+
624+
// 切换搜索源后实时保存状态
625+
debouncedSavePageState();
626+
console.log('🔄 [状态保存] 切换搜索源，触发状态保存:', sourceKey);
602627
};
603628
629+
// 滚动位置保存的防抖定时器
630+
let scrollSaveTimer = null;
631+
604632
// 滚动事件处理
605633
const handleScroll = (e) => {
606634
// 获取真正的滚动容器（arco-scrollbar内部容器）
@@ -614,6 +642,17 @@ export default defineComponent({
614642
// 实时更新滚动位置
615643
scrollPosition.value = scrollTop;
616644
645+
// 防抖保存滚动位置（使用更长的延迟避免过于频繁）
646+
if (scrollSaveTimer) {
647+
clearTimeout(scrollSaveTimer);
648+
}
649+
scrollSaveTimer = setTimeout(() => {
650+
if (hasSearched.value && searchKeyword.value) {
651+
debouncedSavePageState();
652+
console.log('🔄 [状态保存] 滚动位置变化，触发状态保存:', scrollTop);
653+
}
654+
}, 1000); // 1秒防抖延迟，避免滚动时过于频繁保存
655+
617656
// 当滚动到距离底部50px以内时触发加载
618657
if (scrollHeight - scrollTop < 50 && hasMoreData.value && !loadingMore.value) {
619658
loadMore();
@@ -646,6 +685,10 @@ export default defineComponent({
646685
// 增加显示数量
647686
displayedCount.value += pageSize.value;
648687
updateGlobalStats();
688+
689+
// 加载更多后实时保存状态
690+
debouncedSavePageState();
691+
console.log('🔄 [状态保存] 加载更多数据，触发状态保存');
649692
} catch (error) {
650693
console.error('加载更多数据失败:', error);
651694
Message.error('加载更多数据失败');
@@ -933,20 +976,38 @@ export default defineComponent({
933976
Message.success('已清空最近搜索记录');
934977
};
935978
936-
// 监听路由参数
937-
watch(() => route.query.keyword, (keyword) => {
979+
// 监听路由参数 - 监听整个query对象以确保时间戳参数变化时也能触发
980+
watch(() => route.query, (newQuery, oldQuery) => {
981+
const keyword = newQuery.keyword;
982+
const oldKeyword = oldQuery?.keyword;
983+
984+
console.log('🔄 [路由监听] query变化:', {
985+
newQuery,
986+
oldQuery,
987+
keyword,
988+
oldKeyword,
989+
currentKeyword: searchKeyword.value
990+
});
991+
console.log('🔄 [路由监听] keyword类型:', typeof keyword, '值:', keyword);
992+
console.log('🔄 [路由监听] 条件判断 keyword存在:', !!keyword);
993+
938994
if (keyword) {
995+
// 只要有keyword参数，就执行搜索（用户点击搜索按钮时应该重新搜索）
996+
console.log('🔄 [路由监听] 准备执行搜索:', keyword);
939997
searchKeyword.value = keyword;
998+
console.log('🔄 [路由监听] 即将调用performSearch');
940999
performSearch(keyword);
1000+
console.log('🔄 [路由监听] performSearch调用完成');
9411001
} else {
9421002
// 当没有keyword参数时，重置搜索状态
1003+
console.log('🔄 [路由监听] 清空搜索状态');
9431004
hasSearched.value = false;
9441005
searchKeyword.value = '';
9451006
searchResults.value = {};
9461007
activeSource.value = '';
9471008
displayedCount.value = pageSize.value;
9481009
}
949-
}, { immediate: true });
1010+
}, { immediate: true, deep: true });
9501011
// 监听输入草稿用于生成建议
9511012
watch(() => route.query.keywordDraft, (draft) => {
9521013
const val = typeof draft === 'string' ? draft : '';
@@ -1043,6 +1104,9 @@ export default defineComponent({
10431104
}
10441105
};
10451106
1107+
// 防抖保存状态的定时器
1108+
let saveStateTimer = null;
1109+
10461110
// 状态保存和恢复
10471111
const savePageState = () => {
10481112
if (hasSearched.value && searchKeyword.value) {
@@ -1069,6 +1133,16 @@ export default defineComponent({
10691133
console.log('🔄 [状态保存] 保存聚合搜索页面状态:', state);
10701134
}
10711135
};
1136+
1137+
// 防抖保存状态，避免过于频繁的保存操作
1138+
const debouncedSavePageState = () => {
1139+
if (saveStateTimer) {
1140+
clearTimeout(saveStateTimer);
1141+
}
1142+
saveStateTimer = setTimeout(() => {
1143+
savePageState();
1144+
}, 500); // 500ms防抖延迟
1145+
};
10721146
10731147
// 清除页面状态
10741148
const clearPageState = () => {
@@ -1154,6 +1228,9 @@ export default defineComponent({
11541228
11551229
// 检查URL中是否有关键词参数
11561230
const urlKeyword = route.query.keyword;
1231+
console.log('🔄 [状态恢复] URL关键词参数:', urlKeyword);
1232+
console.log('🔄 [状态恢复] 当前搜索关键词:', searchKeyword.value);
1233+
console.log('🔄 [状态恢复] 当前搜索结果:', Object.keys(searchResults.value).length > 0 ? '有结果' : '无结果');
11571234
11581235
// 尝试恢复页面状态
11591236
const restored = restorePageState();
@@ -1178,6 +1255,7 @@ export default defineComponent({
11781255
} else if (urlKeyword && urlKeyword === stateKeyword) {
11791256
// URL关键词与恢复状态匹配，使用恢复的状态
11801257
console.log('🔄 [状态恢复] URL关键词与恢复状态匹配，使用恢复的状态');
1258+
console.log('🔄 [状态恢复] 恢复的搜索结果数量:', Object.keys(searchResults.value).length);
11811259
} else if (urlKeyword && urlKeyword !== stateKeyword) {
11821260
// URL关键词与恢复状态不匹配，执行新搜索
11831261
console.log('🔄 [状态恢复] URL关键词与恢复状态不匹配，执行新搜索:', urlKeyword);
@@ -1204,6 +1282,16 @@ export default defineComponent({
12041282
onBeforeUnmount(() => {
12051283
// 页面离开前保存状态
12061284
savePageState();
1285+
1286+
// 清理定时器
1287+
if (saveStateTimer) {
1288+
clearTimeout(saveStateTimer);
1289+
saveStateTimer = null;
1290+
}
1291+
if (scrollSaveTimer) {
1292+
clearTimeout(scrollSaveTimer);
1293+
scrollSaveTimer = null;
1294+
}
12071295
});
12081296
12091297
onUnmounted(() => {

0 commit comments

Comments
 (0)