mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-10-09 23:17:21 +08:00
fix: resolve log loss in certain scenarios (#10111)
This commit is contained in:
parent
4fcf845934
commit
c7d603e142
3 changed files with 48 additions and 18 deletions
|
@ -149,24 +149,42 @@ const totalHeight = computed(() => logHeight * logCount.value);
|
||||||
const containerHeight = ref(500);
|
const containerHeight = ref(500);
|
||||||
const visibleCount = computed(() => Math.ceil(containerHeight.value / logHeight));
|
const visibleCount = computed(() => Math.ceil(containerHeight.value / logHeight));
|
||||||
const startIndex = ref(0);
|
const startIndex = ref(0);
|
||||||
|
const lastScrollTop = ref(0);
|
||||||
|
|
||||||
const visibleLogs = computed(() => {
|
const visibleLogs = computed(() => {
|
||||||
return logs.value.slice(startIndex.value, startIndex.value + visibleCount.value);
|
return logs.value.slice(startIndex.value, startIndex.value + visibleCount.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
let scrollTimer: ReturnType<typeof setTimeout> | null = null;
|
||||||
|
|
||||||
const onScroll = () => {
|
const onScroll = () => {
|
||||||
if (logContainer.value) {
|
if (!logContainer.value || isLoading.value) return;
|
||||||
|
|
||||||
const scrollTop = logContainer.value.scrollTop;
|
const scrollTop = logContainer.value.scrollTop;
|
||||||
if (scrollTop == 0) {
|
const newStartIndex = Math.max(0, Math.floor(scrollTop / logHeight));
|
||||||
readReq.page = minPage.value - 1;
|
|
||||||
if (readReq.page < 1) {
|
if (scrollTimer) {
|
||||||
return;
|
clearTimeout(scrollTimer);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
startIndex.value = newStartIndex;
|
||||||
|
|
||||||
|
scrollTimer = setTimeout(() => {
|
||||||
|
if (scrollTop <= logHeight && minPage.value > 1) {
|
||||||
|
const currentScrollTop = scrollTop;
|
||||||
|
readReq.page = minPage.value - 1;
|
||||||
|
if (readReq.page >= 1) {
|
||||||
minPage.value = readReq.page;
|
minPage.value = readReq.page;
|
||||||
|
lastScrollTop.value = currentScrollTop;
|
||||||
getContent(true);
|
getContent(true);
|
||||||
}
|
}
|
||||||
startIndex.value = Math.floor(scrollTop / logHeight);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!tailLog.value && scrollTop + containerHeight.value >= totalHeight.value - logHeight && maxPage.value > 1) {
|
||||||
|
readReq.page = maxPage.value;
|
||||||
|
getContent(false);
|
||||||
|
}
|
||||||
|
}, 50);
|
||||||
};
|
};
|
||||||
|
|
||||||
const changeLoading = () => {
|
const changeLoading = () => {
|
||||||
|
@ -276,11 +294,19 @@ const getContent = async (pre: boolean) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
|
if (logContainer.value) {
|
||||||
if (pre) {
|
if (pre) {
|
||||||
logContainer.value.scrollTop = 2000;
|
if (!end.value) {
|
||||||
|
const addedLines = newLogs.length;
|
||||||
|
const newScrollPosition = lastScrollTop.value + addedLines * logHeight;
|
||||||
|
logContainer.value.scrollTop = newScrollPosition;
|
||||||
|
startIndex.value = Math.max(0, Math.floor(newScrollPosition / logHeight));
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
logContainer.value.scrollTop = totalHeight.value;
|
logContainer.value.scrollTop = totalHeight.value;
|
||||||
containerHeight.value = logContainer.value.getBoundingClientRect().height;
|
containerHeight.value = logContainer.value.getBoundingClientRect().height;
|
||||||
|
startIndex.value = Math.max(0, logs.value.length - visibleCount.value);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -170,7 +170,12 @@
|
||||||
:key="currentRecord?.taskID"
|
:key="currentRecord?.taskID"
|
||||||
@stop-reading="search(false)"
|
@stop-reading="search(false)"
|
||||||
:heightDiff="410"
|
:heightDiff="410"
|
||||||
:config="{ type: 'task', taskID: currentRecord?.taskID, tail: true }"
|
:config="{
|
||||||
|
type: 'task',
|
||||||
|
colorMode: 'task',
|
||||||
|
taskID: currentRecord?.taskID,
|
||||||
|
tail: true,
|
||||||
|
}"
|
||||||
/>
|
/>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
|
@ -101,7 +101,6 @@ const search = () => {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
getWebsite(req.websiteID)
|
getWebsite(req.websiteID)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
console.log(res.data);
|
|
||||||
req.dir = res.data.sitePath + '/index';
|
req.dir = res.data.sitePath + '/index';
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
|
|
Loading…
Add table
Reference in a new issue