diff --git a/web/src/components/LogsTable.js b/web/src/components/LogsTable.js
index 2557c4b..072f2ad 100644
--- a/web/src/components/LogsTable.js
+++ b/web/src/components/LogsTable.js
@@ -1,11 +1,12 @@
import React, { useEffect, useState } from 'react';
import {
API,
- copy, getTodayStartTimestamp,
+ copy,
+ getTodayStartTimestamp,
isAdmin,
showError,
showSuccess,
- timestamp2string
+ timestamp2string,
} from '../helpers';
import {
@@ -29,7 +30,7 @@ import {
stringToColor,
} from '../helpers/render';
import Paragraph from '@douyinfe/semi-ui/lib/es/typography/paragraph';
-import {getLogOther} from "../helpers/other.js";
+import { getLogOther } from '../helpers/other.js';
const { Header } = Layout;
@@ -144,27 +145,27 @@ function renderUseTime(type) {
function renderFirstUseTime(type) {
let time = parseFloat(type) / 1000.0;
- time = time.toFixed(1)
+ time = time.toFixed(1);
if (time < 3) {
return (
-
- {' '}
- {time} s{' '}
-
+
+ {' '}
+ {time} s{' '}
+
);
} else if (time < 10) {
return (
-
- {' '}
- {time} s{' '}
-
+
+ {' '}
+ {time} s{' '}
+
);
} else {
return (
-
- {' '}
- {time} s{' '}
-
+
+ {' '}
+ {time} s{' '}
+
);
}
}
@@ -281,22 +282,22 @@ const LogsTable = () => {
if (record.is_stream) {
let other = getLogOther(record.other);
return (
-
-
- {renderUseTime(text)}
- {renderFirstUseTime(other.frt)}
- {renderIsStream(record.is_stream)}
-
-
+
+
+ {renderUseTime(text)}
+ {renderFirstUseTime(other.frt)}
+ {renderIsStream(record.is_stream)}
+
+
);
} else {
return (
-
-
- {renderUseTime(text)}
- {renderIsStream(record.is_stream)}
-
-
+
+
+ {renderUseTime(text)}
+ {renderIsStream(record.is_stream)}
+
+
);
}
},
@@ -344,7 +345,7 @@ const LogsTable = () => {
if (record.other !== '') {
let other = JSON.parse(record.other);
if (other === null) {
- return <>
+ return <>;
}
if (other.admin_info !== undefined) {
if (
@@ -414,8 +415,6 @@ const LogsTable = () => {
const [activePage, setActivePage] = useState(1);
const [logCount, setLogCount] = useState(ITEMS_PER_PAGE);
const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE);
- const [searchKeyword, setSearchKeyword] = useState('');
- const [searching, setSearching] = useState(false);
const [logType, setLogType] = useState(0);
const isAdminUser = isAdmin();
let now = new Date();
@@ -451,9 +450,7 @@ const LogsTable = () => {
let localEndTimestamp = Date.parse(end_timestamp) / 1000;
let url = `/api/log/self/stat?type=${logType}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}`;
url = encodeURI(url);
- let res = await API.get(
- url,
- );
+ let res = await API.get(url);
const { success, message, data } = res.data;
if (success) {
setStat(data);
@@ -467,9 +464,7 @@ const LogsTable = () => {
let localEndTimestamp = Date.parse(end_timestamp) / 1000;
let url = `/api/log/stat?type=${logType}&username=${username}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}&channel=${channel}`;
url = encodeURI(url);
- let res = await API.get(
- url,
- );
+ let res = await API.get(url);
const { success, message, data } = res.data;
if (success) {
setStat(data);
@@ -521,10 +516,7 @@ const LogsTable = () => {
logs[i].timestamp2string = timestamp2string(logs[i].created_at);
logs[i].key = '' + logs[i].id;
}
- // data.key = '' + data.id
setLogs(logs);
- setLogCount(logs.length + ITEMS_PER_PAGE);
- // console.log(logCount);
};
const loadLogs = async (startIdx, pageSize, logType = 0) => {
@@ -542,37 +534,28 @@ const LogsTable = () => {
const res = await API.get(url);
const { success, message, data } = res.data;
if (success) {
- if (startIdx === 0) {
- setLogsFormat(data);
- } else {
- let newLogs = [...logs];
- newLogs.splice(startIdx * pageSize, data.length, ...data);
- setLogsFormat(newLogs);
- }
+ const newPageData = data.items;
+ setActivePage(data.page);
+ setPageSize(data.page_size);
+ setLogCount(data.total);
+
+ setLogsFormat(newPageData);
} else {
showError(message);
}
setLoading(false);
};
- const pageData = logs.slice(
- (activePage - 1) * pageSize,
- activePage * pageSize,
- );
-
const handlePageChange = (page) => {
setActivePage(page);
- if (page === Math.ceil(logs.length / pageSize) + 1) {
- // In this case we have to load more data and then append them.
- loadLogs(page - 1, pageSize, logType).then((r) => {});
- }
+ loadLogs(page, pageSize, logType).then((r) => {});
};
const handlePageSizeChange = async (size) => {
localStorage.setItem('page-size', size + '');
setPageSize(size);
setActivePage(1);
- loadLogs(0, size)
+ loadLogs(activePage, size)
.then()
.catch((reason) => {
showError(reason);
@@ -580,27 +563,24 @@ const LogsTable = () => {
};
const refresh = async () => {
- // setLoading(true);
setActivePage(1);
handleEyeClick();
- await loadLogs(0, pageSize, logType);
+ await loadLogs(activePage, pageSize, logType);
};
const copyText = async (text) => {
if (await copy(text)) {
showSuccess('已复制：' + text);
} else {
- // setSearchKeyword(text);
Modal.error({ title: '无法复制到剪贴板，请手动复制', content: text });
}
};
useEffect(() => {
- // console.log('default effect')
const localPageSize =
parseInt(localStorage.getItem('page-size')) || ITEMS_PER_PAGE;
setPageSize(localPageSize);
- loadLogs(0, localPageSize)
+ loadLogs(activePage, localPageSize)
.then()
.catch((reason) => {
showError(reason);
@@ -608,25 +588,6 @@ const LogsTable = () => {
handleEyeClick();
}, []);
- const searchLogs = async () => {
- if (searchKeyword === '') {
- // if keyword is blank, load files instead.
- await loadLogs(0, pageSize);
- setActivePage(1);
- return;
- }
- setSearching(true);
- const res = await API.get(`/api/log/self/search?keyword=${searchKeyword}`);
- const { success, message, data } = res.data;
- if (success) {
- setLogs(data);
- setActivePage(1);
- } else {
- showError(message);
- }
- setSearching(false);
- };
-
return (
<>
@@ -719,15 +680,13 @@ const LogsTable = () => {
>
查询
-
-
-
+
{
pageSizeOpts: [10, 20, 50, 100],
showSizeChanger: true,
onPageSizeChange: (size) => {
- handlePageSizeChange(size).then();
+ handlePageSizeChange(size);
},
onPageChange: handlePageChange,
}}