perf: image

admin/service/route/app.js

@@ -41,6 +41,7 @@ export const useAppRoute = (app) => {
           model: model.chat?.chatModel,
           relatedKbs: kbNames, // 将relatedKbs的id转换为相应的Kb名称
           systemPrompt: model.chat?.systemPrompt || '',
+          temperature: model.chat?.temperature || 0,
           'share.topNum': model.share?.topNum || 0,
           'share.isShare': model.share?.isShare || false,
           'share.intro': model.share?.intro,

admin/src/fields.ts

@@ -34,6 +34,7 @@ export const ModelFields = [
   createTextField('share.isShare', { label: '是否分享(true,false)' }),
   createTextField('share.intro', { label: '介绍', list: { width: 400 } }),
   createTextField('relatedKbs', { label: '引用的知识库', list: { hidden: true } }),
+  createTextField('temperature', { label: '温度' }),
   createTextField('systemPrompt', {
     label: '提示词',
     list: {

client/package.json

@@ -15,7 +15,7 @@
     "@chakra-ui/icons": "^2.0.17",
     "@chakra-ui/react": "^2.5.1",
     "@chakra-ui/system": "^2.5.5",
-    "@dqbd/tiktoken": "^1.0.6",
+    "@dqbd/tiktoken": "^1.0.7",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
     "@next/font": "13.1.6",

client/pnpm-lock.yaml

@@ -24,8 +24,8 @@ dependencies:
     specifier: ^2.5.5
     version: registry.npmmirror.com/@chakra-ui/system@2.5.8(@emotion/react@11.10.6)(@emotion/styled@11.10.6)(react@18.2.0)
   '@dqbd/tiktoken':
-    specifier: ^1.0.6
+    specifier: ^1.0.7
-    version: registry.npmmirror.com/@dqbd/tiktoken@1.0.6
+    version: registry.npmmirror.com/@dqbd/tiktoken@1.0.7
   '@emotion/react':
     specifier: ^11.10.6
     version: registry.npmmirror.com/@emotion/react@11.10.6(@types/react@18.0.28)(react@18.2.0)
@@ -4261,10 +4261,10 @@ packages:
       react: registry.npmmirror.com/react@18.2.0
     dev: false
 
-  registry.npmmirror.com/@dqbd/tiktoken@1.0.6:
+  registry.npmmirror.com/@dqbd/tiktoken@1.0.7:
-    resolution: {integrity: sha512-umSdeZTy/SbPPKVuZKV/XKyFPmXSN145CcM3iHjBbmhlohBJg7vaDp4cPCW+xNlWL6L2U1sp7T2BD+di2sUKdA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@dqbd/tiktoken/-/tiktoken-1.0.6.tgz}
+    resolution: {integrity: sha512-bhR5k5W+8GLzysjk8zTMVygQZsgvf7W1F0IlL4ZQ5ugjo5rCyiwGM5d8DYriXspytfu98tv59niang3/T+FoDw==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@dqbd/tiktoken/-/tiktoken-1.0.7.tgz}
     name: '@dqbd/tiktoken'
-    version: 1.0.6
+    version: 1.0.7
     dev: false
 
   registry.npmmirror.com/@emotion/babel-plugin@11.11.0:

client/src/components/Markdown/Image.tsx

@@ -3,17 +3,37 @@ import { Image, Skeleton } from '@chakra-ui/react';
 
 const MdImage = ({ src }: { src: string }) => {
   const [isLoading, setIsLoading] = useState(true);
+  const [succeed, setSucceed] = useState(false);
   return (
-    <Skeleton minH="60px" isLoaded={!isLoading} fadeDuration={2}>
+    <Skeleton
+      minH="100px"
+      isLoaded={!isLoading}
+      fadeDuration={2}
+      display={'flex'}
+      justifyContent={'center'}
+      my={1}
+    >
       <Image
+        display={'inline-block'}
+        borderRadius={'md'}
         src={src}
         alt={''}
         fallbackSrc={'/imgs/errImg.png'}
-        onLoad={() => setIsLoading(false)}
+        fallbackStrategy={'onError'}
+        cursor={succeed ? 'pointer' : 'default'}
+        loading="eager"
+        onLoad={() => {
+          setIsLoading(false);
+          setSucceed(true);
+        }}
         onError={() => setIsLoading(false)}
+        onClick={() => {
+          if (!succeed) return;
+          window.open(src, '_blank');
+        }}
       />
     </Skeleton>
   );
 };
 
-export default MdImage;
+export default React.memo(MdImage);

client/src/components/Markdown/Loading.tsx

@@ -1,17 +1,24 @@
 import React, { memo } from 'react';
 import { Box } from '@chakra-ui/react';
 
-const Loading = () => {
+const Loading = ({ text }: { text?: string }) => {
   return (
-    <Box
+    <Box>
-      minW={'100px'}
+      <Box
-      w={'100%'}
+        minW={'100px'}
-      h={'80px'}
+        w={'100%'}
-      backgroundImage={'url("/imgs/loading.gif")'}
+        h={'80px'}
-      backgroundSize={'contain'}
+        backgroundImage={'url("/imgs/loading.gif")'}
-      backgroundRepeat={'no-repeat'}
+        backgroundSize={'contain'}
-      backgroundPosition={'center'}
+        backgroundRepeat={'no-repeat'}
-    />
+        backgroundPosition={'center'}
+      />
+      {text && (
+        <Box mt={1} textAlign={'center'} fontSize={'sm'} color={'myGray.600'}>
+          {text}
+        </Box>
+      )}
+    </Box>
   );
 };
 

client/src/components/Markdown/index.tsx

@@ -35,13 +35,17 @@ const Markdown = ({
       components={{
         pre: 'div',
         img({ src = '' }) {
-          return <MdImage src={src} />;
+          return isChatting ? <Loading text="图片加载中..." /> : <MdImage src={src} />;
         },
         code({ node, inline, className, children, ...props }) {
           const match = /language-(\w+)/.exec(className || '');
 
           if (match?.[1] === 'mermaid') {
-            return isChatting ? <Loading /> : <MermaidCodeBlock code={String(children)} />;
+            return isChatting ? (
+              <Loading text="导图加载中..." />
+            ) : (
+              <MermaidCodeBlock code={String(children)} />
+            );
           }
 
           return (