feat: 选择模型添加版本描述

react-ui/src/components/ResourceSelectorModal/config.tsx

@@ -2,7 +2,7 @@ import datasetImg from '@/assets/img/modal-select-dataset.png';
 import mirrorImg from '@/assets/img/modal-select-mirror.png';
 import modelImg from '@/assets/img/modal-select-model.png';
 import { AvailableRange, CommonTabKeys, MirrorVersionStatus } from '@/enums';
-import { ResourceData, ResourceVersionData } from '@/pages/Dataset/config';
+import { DatasetData, ModelData, ResourceData, ResourceVersionData } from '@/pages/Dataset/config';
 import { MirrorVersionData } from '@/pages/Mirror/Info';
 import { MirrorData } from '@/pages/Mirror/List';
 import {
@@ -71,6 +71,7 @@ const convertMirrorVersionToTreeData = (
     key: `${parentId}-${item.id}`,
     isLeaf: true,
     checkable: true,
+    description: item.description,
   }));
 };
 
@@ -125,11 +126,16 @@ export class DatasetSelector implements SelectorTypeInfo {
     const params = pick(parentNode, ['owner', 'identifier', 'id', 'name', 'version', 'is_public']);
     const res = await getDatasetInfo(params);
     if (res && res.data) {
-      const path = res.data.relative_paths || '';
-      const list = res.data.dataset_version_vos || [];
+      const dataset = res.data as DatasetData;
+      const {
+        relative_paths: path = '',
+        dataset_version_vos: list = [],
+        version_desc: versionDesc = '',
+      } = dataset;
       return {
         path,
         content: list,
+        versionDesc,
       };
     } else {
       return Promise.reject('获取数据集文件列表失败');
@@ -177,11 +183,17 @@ export class ModelSelector implements SelectorTypeInfo {
     const params = pick(parentNode, ['owner', 'identifier', 'id', 'name', 'version', 'is_public']);
     const res = await getModelInfo(params);
     if (res && res.data) {
-      const path = res.data.relative_paths || '';
-      const list = res.data.model_version_vos || [];
+      const model = res.data as ModelData;
+      const {
+        relative_paths: path = '',
+        model_version_vos: list = [],
+        version_desc: versionDesc = '',
+      } = model;
+
       return {
         path,
         content: list,
+        versionDesc,
       };
     } else {
       return Promise.reject('获取模型文件列表失败');
@@ -235,7 +247,7 @@ export class MirrorSelector implements SelectorTypeInfo {
   }
 
   async getFiles(_parentKey: string, parentNode: MirrorVersionData) {
-    const { url } = parentNode;
+    const { url, description } = parentNode;
     return {
       path: url,
       content: [
@@ -244,6 +256,7 @@ export class MirrorSelector implements SelectorTypeInfo {
           file_name: `${url}`,
         },
       ],
+      versionDesc: description,
     };
   }
 }

react-ui/src/components/ResourceSelectorModal/index.less

@@ -65,7 +65,7 @@
       border-bottom: 1px solid rgba(22, 100, 255, 0.1);
     }
     &__files {
-      height: calc(100% - 75px);
+      height: calc(100% - 61px);
       overflow-y: auto;
 
       &__file {
@@ -76,7 +76,22 @@
         word-break: break-all;
         background: rgba(4, 3, 3, 0.06);
         border-radius: 4px;
+
+        &:last-child {
+          margin-bottom: 0;
+        }
       }
     }
+    &__desc {
+      margin-bottom: 10px;
+      padding: 10px;
+      overflow-y: auto;
+      color: @text-color-secondary;
+      font-size: 13px;
+      word-break: break-all;
+      background: rgba(4, 3, 3, 0.06);
+      border-radius: 4px;
+      max-height: calc(100% - 61px);
+    }
   }
 }

react-ui/src/components/ResourceSelectorModal/index.tsx

@@ -84,6 +84,7 @@ function ResourceSelectorModal({
   const [loadedKeys, setLoadedKeys] = useState<React.Key[]>([]);
   const [originTreeData, setOriginTreeData] = useState<TreeDataNode[]>([]);
   const [files, setFiles] = useState<ResourceFileData[]>([]);
+  const [versionDesc, setVersionDesc] = useState<string | undefined>(undefined);
   const [versionPath, setVersionPath] = useState('');
   const [searchText, setSearchText] = useState('');
   const [firstLoadList, setFirstLoadList] = useState(false);
@@ -119,6 +120,7 @@ function ResourceSelectorModal({
     setCheckedKeys([]);
     setLoadedKeys([]);
     setFiles([]);
+    setVersionDesc(undefined);
     setVersionPath('');
     setSearchText('');
     getTreeData();
@@ -169,9 +171,11 @@ function ResourceSelectorModal({
     if (res) {
       setVersionPath(res.path);
       setFiles(res.content);
+      setVersionDesc(res.versionDesc);
     } else {
       setVersionPath('');
       setFiles([]);
+      setVersionDesc(undefined);
     }
   };
 
@@ -201,6 +205,7 @@ function ResourceSelectorModal({
     } else {
       setVersionPath('');
       setFiles([]);
+      setVersionDesc(undefined);
     }
   };
 
@@ -253,8 +258,9 @@ function ResourceSelectorModal({
 
   const title = `选择${config.name}`;
   const palceholder = `请输入${config.name}名称`;
+  const fileLen = files.length > 0 ? `（${files.length}）` : '';
   const fileTitle =
-    type === ResourceSelectorType.Mirror ? '已选镜像' : `已选${config.name}文件（${files.length}）`;
+    type === ResourceSelectorType.Mirror ? '镜像地址' : `${config.name}版本文件${fileLen}`;
   const tabItems = config.tabItems;
   const titleImg = config.modalIcon;
 
@@ -312,14 +318,24 @@ function ResourceSelectorModal({
             />
           </div>
           <div className={styles['model-selector__right']}>
-            <div className={styles['model-selector__right__title']}>{fileTitle}</div>
-            <div className={styles['model-selector__right__files']}>
-              {files.map((v) => (
-                <div key={v.url} className={styles['model-selector__right__files__file']}>
-                  {v.file_name}
-                </div>
-              ))}
+            <div style={{ height: '50%' }}>
+              <div className={styles['model-selector__right__title']}>{fileTitle}</div>
+              <div className={styles['model-selector__right__files']}>
+                {files.map((v) => (
+                  <div key={v.url} className={styles['model-selector__right__files__file']}>
+                    {v.file_name}
+                  </div>
+                ))}
+              </div>
             </div>
+            {versionDesc && (
+              <div style={{ height: '50%' }}>
+                <div
+                  className={styles['model-selector__right__title']}
+                >{`${config.name}版本描述`}</div>
+                <div className={styles['model-selector__right__desc']}>{versionDesc}</div>
+              </div>
+            )}
           </div>
         </div>
       </div>

react-ui/src/pages/Mirror/Info/index.tsx

@@ -53,6 +53,7 @@ export type MirrorVersionData = {
   file_size: string;
   create_time: string;
   tag_name: string;
+  description: string;
 };
 
 function MirrorInfo() {