fix(prefetch-logs): 优化预拉取订单日志的分页和加载逻辑
- 修改预拉取日志的查询逻辑,首次查询保存实际开始时间 - 实现基于首次查询时间往前递减1分钟分页加载 - 限制最大查询范围为1小时,避免重复加载过多数据 - 优化日志列表倒序显示和追加数据方式 - 修复加载失败时偏移量回滚,保证数据正确性 - 更新环境变量中的API基础URL地址
This commit is contained in:
@@ -1,2 +1,2 @@
|
||||
VITE_API_BASE_URL= 'http://127.0.0.1:12401'
|
||||
VITE_API_BASE_URL= 'http://49.233.216.171:12310'
|
||||
# VITE_API_BASE_URL='https://partial.kkknametrans.buzz'
|
||||
|
||||
@@ -135,8 +135,9 @@ const logsRenderData = ref<KamiApiCamelOilV1PrefetchOrderLogItem[]>([]);
|
||||
const hasMore = ref(true);
|
||||
const logContentRef = ref<HTMLElement>();
|
||||
const loadingMore = ref(false);
|
||||
const currentStartTime = ref<string | null>(null); // 当前查询的开始时间
|
||||
const currentEndTime = ref<string | null>(null); // 当前查询的结束时间
|
||||
const actualQueryStartTime = ref<string | null>(null); // 首次查询返回的实际开始时间
|
||||
const queryOffsetMinutes = ref(0); // 查询偏移量,表示已经往前查询了多少个1分钟段
|
||||
const maxQueryMinutes = 60; // 最大查询1小时(60分钟)
|
||||
|
||||
const generateFormModel = () => {
|
||||
const now = dayjs();
|
||||
@@ -155,14 +156,7 @@ const formatDateTime = (dateTime: string | undefined): string => {
|
||||
return dayjs(dateTime).format('YYYY-MM-DD HH:mm:ss');
|
||||
};
|
||||
|
||||
const fetchLogs = async (
|
||||
reset = true,
|
||||
startTimeOverride?: string,
|
||||
endTimeOverride?: string
|
||||
) => {
|
||||
let queryStartTime: string;
|
||||
let queryEndTime: string;
|
||||
|
||||
const fetchLogs = async (reset = true) => {
|
||||
if (reset) {
|
||||
// 初始查询或搜索,使用表单时间
|
||||
if (!formModel.startTime || !formModel.endTime) {
|
||||
@@ -173,19 +167,15 @@ const fetchLogs = async (
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
queryStartTime = dayjs(formModel.startTime).format('YYYY-MM-DD HH:mm:ss');
|
||||
queryEndTime = dayjs(formModel.endTime).format('YYYY-MM-DD HH:mm:ss');
|
||||
|
||||
setLoading(true);
|
||||
} else {
|
||||
// 继续查询,使用传入的时间覆盖或当前时间往前倒1分钟
|
||||
queryStartTime =
|
||||
startTimeOverride ||
|
||||
dayjs(currentStartTime.value)
|
||||
.subtract(1, 'minute')
|
||||
|
||||
const queryStartTime = dayjs(formModel.startTime)
|
||||
.startOf('minute')
|
||||
.format('YYYY-MM-DD HH:mm:ss');
|
||||
const queryEndTime = dayjs(formModel.endTime)
|
||||
.endOf('minute')
|
||||
.format('YYYY-MM-DD HH:mm:ss');
|
||||
queryEndTime = endTimeOverride || currentStartTime.value!; // 从当前最早时间开始
|
||||
loadingMore.value = true;
|
||||
}
|
||||
|
||||
try {
|
||||
const { data } = await jdV2PrefetchClient.apiJdV2PrefetchLogsGet({
|
||||
@@ -194,22 +184,16 @@ const fetchLogs = async (
|
||||
});
|
||||
|
||||
const newLogs = data.logs || [];
|
||||
const actualStartTime = data.actualStartTime;
|
||||
const actualEndTime = data.actualEndTime;
|
||||
|
||||
if (reset) {
|
||||
// 初始查询
|
||||
logsRenderData.value = newLogs.reverse(); // 倒序显示,最新的在前面
|
||||
currentStartTime.value = actualStartTime || queryStartTime;
|
||||
currentEndTime.value = actualEndTime || queryEndTime;
|
||||
hasMore.value = newLogs.length > 0 && actualStartTime !== null;
|
||||
} else {
|
||||
// 继续查询
|
||||
logsRenderData.value.push(...newLogs.reverse()); // 倒序显示,追加在后面
|
||||
currentStartTime.value = actualStartTime || queryStartTime;
|
||||
// 如果没有返回更多数据或者实际查询时间没有变化,说明没有更多数据了
|
||||
hasMore.value = newLogs.length > 0 && actualStartTime !== null;
|
||||
}
|
||||
// 初始查询,保存实际查询开始时间和重置偏移量
|
||||
actualQueryStartTime.value = data.actualStartTime || queryStartTime;
|
||||
queryOffsetMinutes.value = 0;
|
||||
|
||||
// 倒序显示,最新的在前面
|
||||
logsRenderData.value = newLogs.reverse();
|
||||
|
||||
// 如果有数据就设置有更多数据可加载
|
||||
hasMore.value = newLogs.length > 0;
|
||||
} catch (err) {
|
||||
console.error('获取预拉取订单日志失败:', err);
|
||||
Message.error({
|
||||
@@ -218,8 +202,63 @@ const fetchLogs = async (
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
} else {
|
||||
// 继续查询:基于首次查询的实际开始时间往前递减
|
||||
if (!actualQueryStartTime.value) {
|
||||
hasMore.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// 检查是否已经查询了最大时间范围
|
||||
if (queryOffsetMinutes.value >= maxQueryMinutes) {
|
||||
hasMore.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
loadingMore.value = true;
|
||||
queryOffsetMinutes.value++; // 增加偏移量
|
||||
|
||||
// 计算查询时间段:每次只查询1分钟的数据
|
||||
// 第N次查询:实际开始时间 - N分钟 这一整分钟的数据
|
||||
const queryMinute = dayjs(actualQueryStartTime.value).subtract(
|
||||
queryOffsetMinutes.value,
|
||||
'minute'
|
||||
);
|
||||
|
||||
const queryStartTime = queryMinute
|
||||
.startOf('minute')
|
||||
.format('YYYY-MM-DD HH:mm:ss');
|
||||
|
||||
const queryEndTime = queryMinute
|
||||
.endOf('minute')
|
||||
.format('YYYY-MM-DD HH:mm:ss');
|
||||
|
||||
try {
|
||||
const { data } = await jdV2PrefetchClient.apiJdV2PrefetchLogsGet({
|
||||
startTime: queryStartTime,
|
||||
endTime: queryEndTime
|
||||
});
|
||||
|
||||
const newLogs = data.logs || [];
|
||||
|
||||
// 将新日志倒序显示,追加到现有日志后面
|
||||
logsRenderData.value.push(...newLogs.reverse());
|
||||
|
||||
// 检查是否达到最大查询范围,决定是否还有更多数据
|
||||
hasMore.value = queryOffsetMinutes.value < maxQueryMinutes;
|
||||
} catch (err) {
|
||||
console.error('获取预拉取订单日志失败:', err);
|
||||
Message.error({
|
||||
content: '获取预拉取订单日志失败',
|
||||
closable: true
|
||||
});
|
||||
// 出错时回滚偏移量
|
||||
queryOffsetMinutes.value--;
|
||||
} finally {
|
||||
loadingMore.value = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const loadMoreLogs = async () => {
|
||||
|
||||
Reference in New Issue
Block a user