merge upstream

Signed-off-by: wozulong <>

web/src/components/LogsTable.js

@@ -29,6 +29,7 @@ import {
   stringToColor,
 } from '../helpers/render';
 import Paragraph from '@douyinfe/semi-ui/lib/es/typography/paragraph';
+import { getLogOther } from '../helpers/other.js';
 
 const { Header } = Layout;
 
@@ -141,6 +142,33 @@ function renderUseTime(type) {
   }
 }
 
+function renderFirstUseTime(type) {
+  let time = parseFloat(type) / 1000.0;
+  time = time.toFixed(1);
+  if (time < 3) {
+    return (
+      <Tag color='green' size='large'>
+        {' '}
+        {time} s{' '}
+      </Tag>
+    );
+  } else if (time < 10) {
+    return (
+      <Tag color='orange' size='large'>
+        {' '}
+        {time} s{' '}
+      </Tag>
+    );
+  } else {
+    return (
+      <Tag color='red' size='large'>
+        {' '}
+        {time} s{' '}
+      </Tag>
+    );
+  }
+}
+
 const LogsTable = () => {
   const columns = [
     {
@@ -247,17 +275,30 @@ const LogsTable = () => {
       },
     },
     {
-      title: '用时',
+      title: '用时/首字',
       dataIndex: 'use_time',
       render: (text, record, index) => {
-        return (
-          <div>
-            <Space>
-              {renderUseTime(text)}
-              {renderIsStream(record.is_stream)}
-            </Space>
-          </div>
-        );
+        if (record.is_stream) {
+          let other = getLogOther(record.other);
+          return (
+            <div>
+              <Space>
+                {renderUseTime(text)}
+                {renderFirstUseTime(other.frt)}
+                {renderIsStream(record.is_stream)}
+              </Space>
+            </div>
+          );
+        } else {
+          return (
+            <div>
+              <Space>
+                {renderUseTime(text)}
+                {renderIsStream(record.is_stream)}
+              </Space>
+            </div>
+          );
+        }
       },
     },
     {
@@ -325,10 +366,7 @@ const LogsTable = () => {
       title: '详情',
       dataIndex: 'content',
       render: (text, record, index) => {
-        if (record.other === '') {
-          record.other = '{}';
-        }
-        let other = JSON.parse(record.other);
+        let other = getLogOther(record.other);
         if (other == null) {
           return (
             <Paragraph

web/src/helpers/other.js

@@ -0,0 +1,7 @@
+export function getLogOther(otherStr) {
+  if (otherStr === undefined || otherStr === '') {
+    otherStr = '{}';
+  }
+  let other = JSON.parse(otherStr);
+  return other;
+}

web/src/helpers/render.js

@@ -144,28 +144,42 @@ export function renderModelPrice(
 ) {
   // 1 ratio = $0.002 / 1K tokens
   if (modelPrice !== -1) {
-    return '模型价格：$' + modelPrice * groupRatio;
+    return (
+      '模型价格：$' +
+      modelPrice +
+      ' * 分组倍率：' +
+      groupRatio +
+      ' = $' +
+      modelPrice * groupRatio
+    );
   } else {
     if (completionRatio === undefined) {
       completionRatio = 0;
     }
     // 这里的 *2 是因为 1倍率=0.002刀，请勿删除
-    let inputRatioPrice = modelRatio * 2.0 * groupRatio;
-    let completionRatioPrice = modelRatio * 2.0 * completionRatio * groupRatio;
+    let inputRatioPrice = modelRatio * 2.0;
+    let completionRatioPrice = modelRatio * 2.0 * completionRatio;
     let price =
       (inputTokens / 1000000) * inputRatioPrice +
       (completionTokens / 1000000) * completionRatioPrice;
     return (
       <>
         <article>
-          <p>提示 ${inputRatioPrice} / 1M tokens</p>
-          <p>补全 ${completionRatioPrice} / 1M tokens</p>
+          <p>
+            提示：${inputRatioPrice} * {groupRatio} = $
+            {inputRatioPrice * groupRatio} / 1M tokens
+          </p>
+          <p>
+            补全：${completionRatioPrice} * {groupRatio} = $
+            {completionRatioPrice * groupRatio} / 1M tokens
+          </p>
           <p></p>
           <p>
             提示 {inputTokens} tokens / 1M tokens * ${inputRatioPrice} + 补全{' '}
-            {completionTokens} tokens / 1M tokens * ${completionRatioPrice} = $
-            {price.toFixed(6)}
+            {completionTokens} tokens / 1M tokens * ${completionRatioPrice} *
+            分组 {groupRatio} = ${price.toFixed(6)}
           </p>
+          <p>仅供参考，以实际扣费为准</p>
         </article>
       </>
     );