diff --git a/src/components/auto-image/index.tsx b/src/components/auto-image/index.tsx new file mode 100644 index 00000000..db8c21a2 --- /dev/null +++ b/src/components/auto-image/index.tsx @@ -0,0 +1,34 @@ +import { Image as AntImage, ImageProps } from 'antd'; +import { round } from 'lodash'; +import React, { useCallback, useEffect, useState } from 'react'; + +const AutoImage: React.FC = (props) => { + const { height = 100, ...rest } = props; + const [width, setWidth] = useState(0); + + const getImgRatio = useCallback((url: string): Promise<{ ratio: number }> => { + return new Promise((resolve) => { + const img = new Image(); + img.onload = () => { + resolve({ ratio: round(img.width / img.height, 2) }); + }; + img.onerror = () => { + resolve({ ratio: 1 }); + }; + img.src = url; + }); + }, []); + + const handleOnLoad = useCallback(async () => { + const { ratio } = await getImgRatio(props.src || ''); + setWidth(height * ratio); + }, [getImgRatio, height, props.src]); + + useEffect(() => { + handleOnLoad(); + }, [handleOnLoad]); + + return ; +}; + +export default AutoImage; diff --git a/src/pages/llmodels/components/table-list.tsx b/src/pages/llmodels/components/table-list.tsx index d1b2d33c..b922df47 100644 --- a/src/pages/llmodels/components/table-list.tsx +++ b/src/pages/llmodels/components/table-list.tsx @@ -199,11 +199,11 @@ const Models: React.FC = ({ key: 'chat', icon: }, - { - label: 'common.button.viewcode', - key: 'embedding', - icon: - }, + // { + // label: 'common.button.viewcode', + // key: 'embedding', + // icon: + // }, { label: 'common.button.delete', key: 'delete', @@ -220,7 +220,10 @@ const Models: React.FC = ({ return record.ready_replicas > 0 && !record.embedding_only; } if (action.key === 'embedding') { - return record.embedding_only && record.ready_replicas > 0; + return ( + (record.embedding_only || record.reranker) && + record.ready_replicas > 0 + ); } return true; }); @@ -523,27 +526,41 @@ const Models: React.FC = ({ - {text} + {text} {record.reranker && ( - - Reranker - + + Reranker + )} {record.embedding_only && !record.reranker && ( - - - Embedding Only - - + + Embedding Only + )} ); @@ -556,8 +573,8 @@ const Models: React.FC = ({ span={6} render={(text, record: ListItem) => { return ( - - {generateSource(record)} + + {generateSource(record)} ); }} @@ -574,7 +591,7 @@ const Models: React.FC = ({ }} render={(text, record: ListItem) => { return ( - + {record.ready_replicas} / {record.replicas} ); @@ -589,7 +606,11 @@ const Models: React.FC = ({ sortOrder={sortOrder} sorter={false} render={(text, row) => { - return dayjs(text).format('YYYY-MM-DD HH:mm:ss'); + return ( + + {dayjs(text).format('YYYY-MM-DD HH:mm:ss')} + + ); }} /> - }} diff --git a/src/pages/playground/components/upload-img.tsx b/src/pages/playground/components/upload-img.tsx index 97aa61ec..e80caaf2 100644 --- a/src/pages/playground/components/upload-img.tsx +++ b/src/pages/playground/components/upload-img.tsx @@ -3,12 +3,11 @@ import { useIntl } from '@umijs/max'; import { Button, Tooltip, Upload } from 'antd'; import type { UploadFile } from 'antd/es/upload'; import { RcFile } from 'antd/es/upload'; -import { debounce, round } from 'lodash'; +import { debounce } from 'lodash'; import React, { useCallback, useRef } from 'react'; interface UploadImgProps { size?: 'small' | 'middle' | 'large'; - height?: number; handleUpdateImgList: ( imgList: { dataUrl: string; uid: number | string }[] ) => void; @@ -16,7 +15,6 @@ interface UploadImgProps { const UploadImg: React.FC = ({ handleUpdateImgList, - height = 100, size = 'small' }) => { const intl = useIntl(); @@ -38,22 +36,6 @@ const UploadImg: React.FC = ({ [handleUpdateImgList, intl] ); - const getImgDimensions = useCallback( - (file: any): Promise<{ ratio: number }> => { - return new Promise((resolve) => { - const img = new Image(); - img.onload = () => { - resolve({ ratio: round(img.width / img.height, 2) }); - }; - img.onerror = () => { - resolve({ ratio: 1 }); - }; - img.src = URL.createObjectURL(file); - }); - }, - [] - ); - const handleChange = useCallback( async (info: any) => { const { fileList } = info; @@ -62,12 +44,8 @@ const UploadImg: React.FC = ({ fileList.map(async (item: UploadFile) => { if (item.originFileObj && !item.url) { const base64 = await getBase64(item.originFileObj as RcFile); - const { ratio } = await getImgDimensions( - item.originFileObj as RcFile - ); item.url = base64; - item.ratio = ratio; } return item; }) @@ -79,9 +57,7 @@ const UploadImg: React.FC = ({ .map((item: UploadFile) => { return { dataUrl: item.url as string, - uid: item.uid, - height: height, - width: height * item.ratio + uid: item.uid }; }); diff --git a/src/pages/playground/style/thumb-img.less b/src/pages/playground/style/thumb-img.less index ae2d9561..df331023 100644 --- a/src/pages/playground/style/thumb-img.less +++ b/src/pages/playground/style/thumb-img.less @@ -1,8 +1,6 @@ .thumb-img { position: relative; display: flex; - width: 56px; - height: 56px; .img { display: flex; diff --git a/src/pages/resources/index.tsx b/src/pages/resources/index.tsx index 139cd165..6b2b2680 100644 --- a/src/pages/resources/index.tsx +++ b/src/pages/resources/index.tsx @@ -36,7 +36,7 @@ const Resources = () => { }} extra={[]} > -
+