merge upstream

Signed-off-by: wozulong <>

web/src/components/LogsTable.js

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import {
   API,
   copy,
+  getTodayStartTimestamp,
   isAdmin,
   showError,
   showSuccess,
@@ -412,19 +413,19 @@ const LogsTable = () => {
   const [loading, setLoading] = useState(false);
   const [loadingStat, setLoadingStat] = useState(false);
   const [activePage, setActivePage] = useState(1);
-  const [logCount, setLogCount] = useState(0);
+  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();
-  // 初始化start_timestamp为前一天
+  // 初始化start_timestamp为今天0点
   const [inputs, setInputs] = useState({
     username: '',
     token_name: '',
     model_name: '',
-    start_timestamp: timestamp2string(now.getTime() / 1000 - 86400),
+    start_timestamp: timestamp2string(getTodayStartTimestamp()),
     end_timestamp: timestamp2string(now.getTime() / 1000 + 3600),
     channel: '',
   });
@@ -449,9 +450,9 @@ const LogsTable = () => {
   const getLogSelfStat = async () => {
     let localStartTimestamp = Date.parse(start_timestamp) / 1000;
     let localEndTimestamp = Date.parse(end_timestamp) / 1000;
-    let res = await API.get(
-      `/api/log/self/stat?type=${logType}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}`,
-    );
+    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);
     const { success, message, data } = res.data;
     if (success) {
       setStat(data);
@@ -463,9 +464,9 @@ const LogsTable = () => {
   const getLogStat = async () => {
     let localStartTimestamp = Date.parse(start_timestamp) / 1000;
     let localEndTimestamp = Date.parse(end_timestamp) / 1000;
-    let res = await API.get(
-      `/api/log/stat?type=${logType}&username=${username}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}&channel=${channel}`,
-    );
+    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);
     const { success, message, data } = res.data;
     if (success) {
       setStat(data);
@@ -475,6 +476,9 @@ const LogsTable = () => {
   };
 
   const handleEyeClick = async () => {
+    if (loadingStat) {
+      return;
+    }
     setLoadingStat(true);
     if (isAdminUser) {
       await getLogStat();
@@ -509,14 +513,14 @@ const LogsTable = () => {
     }
   };
 
-  const setLogsFormat = (logs, total) => {
+  const setLogsFormat = (logs) => {
     for (let i = 0; i < logs.length; i++) {
       logs[i].timestamp2string = timestamp2string(logs[i].created_at);
       logs[i].key = '' + logs[i].id;
     }
     // data.key = '' + data.id
     setLogs(logs);
-    setLogCount(total);
+    setLogCount(logs.length + ITEMS_PER_PAGE);
     // console.log(logCount);
   };
 
@@ -531,15 +535,16 @@ const LogsTable = () => {
     } else {
       url = `/api/log/self/?p=${startIdx}&page_size=${pageSize}&type=${logType}&token_name=${token_name}&model_name=${model_name}&start_timestamp=${localStartTimestamp}&end_timestamp=${localEndTimestamp}`;
     }
+    url = encodeURI(url);
     const res = await API.get(url);
-    const { success, message, total, data } = res.data;
+    const { success, message, data } = res.data;
     if (success) {
       if (startIdx === 0) {
-        setLogsFormat(data, total);
+        setLogsFormat(data);
       } else {
         let newLogs = [...logs];
         newLogs.splice(startIdx * pageSize, data.length, ...data);
-        setLogsFormat(newLogs, total);
+        setLogsFormat(newLogs);
       }
     } else {
       showError(message);
@@ -574,6 +579,7 @@ const LogsTable = () => {
   const refresh = async () => {
     // setLoading(true);
     setActivePage(1);
+    handleEyeClick();
     await loadLogs(0, pageSize, logType);
   };
 
@@ -596,6 +602,7 @@ const LogsTable = () => {
       .catch((reason) => {
         showError(reason);
       });
+    handleEyeClick();
   }, []);
 
   const searchLogs = async () => {
@@ -622,19 +629,17 @@ const LogsTable = () => {
       <Layout>
         <Header>
           <Spin spinning={loadingStat}>
-            <h3>
-              使用明细（总消耗额度：
-              <span
-                onClick={handleEyeClick}
-                style={{
-                  cursor: 'pointer',
-                  color: 'gray',
-                }}
-              >
-                {showStat ? renderQuota(stat.quota) : '点击查看'}
-              </span>
-              ）
-            </h3>
+            <Space>
+              <Tag color='green' size='large' style={{ padding: 15 }}>
+                总消耗额度: {renderQuota(stat.quota)}
+              </Tag>
+              <Tag color='blue' size='large' style={{ padding: 15 }}>
+                RPM: {stat.rpm}
+              </Tag>
+              <Tag color='purple' size='large' style={{ padding: 15 }}>
+                TPM: {stat.tpm}
+              </Tag>
+            </Space>
           </Spin>
         </Header>
         <Form layout='horizontal' style={{ marginTop: 10 }}>
@@ -700,20 +705,18 @@ const LogsTable = () => {
                 />
               </>
             )}
-            <Form.Section>
-              <Button
-                label='查询'
-                type='primary'
-                htmlType='submit'
-                className='btn-margin-right'
-                onClick={() => {
-                  refresh(logType).then();
-                }}
-                loading={loading}
-              >
-                查询
-              </Button>
-            </Form.Section>
+            <Button
+              label='查询'
+              type='primary'
+              htmlType='submit'
+              className='btn-margin-right'
+              onClick={refresh}
+              loading={loading}
+              style={{ marginTop: 24 }}
+            >
+              查询
+            </Button>
+            <Form.Section></Form.Section>
           </>
         </Form>
         <Table

web/src/components/MjLogsTable.js

@@ -90,6 +90,12 @@ function renderType(type) {
           图混合
         </Tag>
       );
+    case 'UPLOAD':
+      return (
+        <Tag color='blue' size='large'>
+          上传文件
+        </Tag>
+      );
     case 'SHORTEN':
       return (
         <Tag color='pink' size='large'>

web/src/helpers/utils.js

@@ -144,6 +144,12 @@ export function removeTrailingSlash(url) {
   }
 }
 
+export function getTodayStartTimestamp() {
+  var now = new Date();
+  now.setHours(0, 0, 0, 0);
+  return Math.floor(now.getTime() / 1000);
+}
+
 export function timestamp2string(timestamp) {
   let date = new Date(timestamp * 1000);
   let year = date.getFullYear().toString();