chore: batch start/stop models

src/components/icon-font/index.tsx

@@ -1,8 +1,8 @@
 import { createFromIconfontCN } from '@ant-design/icons';
-import './iconfont/iconfont.js';
+// import './iconfont/iconfont.js';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: ''
+  scriptUrl: '//at.alicdn.com/t/c/font_4613488_djdkmiu9k3b.js'
 });
 
 export default IconFont;

src/components/seal-table/components/table-row.tsx

@@ -174,12 +174,16 @@ const TableRow: React.FC<
     if (e.target.checked) {
       // update selectedRowKeys
       rowSelection?.onChange(
-        _.uniq([...rowSelection?.selectedRowKeys, record[rowKey]])
+        _.uniq([...rowSelection?.selectedRowKeys, record[rowKey]]),
+        _.uniqBy([...rowSelection?.selectedRows, record], rowKey)
       );
     } else {
       // update selectedRowKeys
       rowSelection?.onChange(
-        rowSelection?.selectedRowKeys.filter((key) => key !== record[rowKey])
+        rowSelection?.selectedRowKeys.filter((key) => key !== record[rowKey]),
+        rowSelection?.selectedRows.filter(
+          (row) => row[rowKey] !== record[rowKey]
+        )
       );
     }
   };

src/components/seal-table/index.tsx

@@ -62,11 +62,14 @@ const SealTable: React.FC<SealTableProps & { pagination: PaginationProps }> = (
 
   const handleSelectAllChange = (e: any) => {
     if (e.target.checked) {
-      rowSelection?.onChange(props.dataSource.map((record) => record[rowKey]));
+      rowSelection?.onChange(
+        props.dataSource.map((record) => record[rowKey]),
+        props.dataSource
+      );
       setSelectAll(true);
       setIndeterminate(false);
     } else {
-      rowSelection?.onChange([]);
+      rowSelection?.onChange([], []);
       setSelectAll(false);
       setIndeterminate(false);
     }

src/components/seal-table/types.ts

@@ -36,7 +36,8 @@ export interface TableHeaderProps {
 
 export interface RowSelectionProps {
   selectedRowKeys: React.Key[];
-  onChange: (selectedRowKeys: React.Key[]) => void;
+  selectedRows: any[];
+  onChange: (selectedRowKeys: React.Key[], selectedRows: any[]) => void;
 }
 export interface SealTableProps {
   childParentKey?: string;

src/hooks/use-table-row-selection.ts

@@ -2,29 +2,39 @@ import { useState } from 'react';
 
 export default function useTableRowSelection() {
   const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
+  const [selectedRows, setSelectedRows] = useState<any[]>([]);
 
-  const onSelectChange = (selectedRowKeys: React.Key[]) => {
+  const onSelectChange = (
+    selectedRowKeys: React.Key[],
+    selectedRows: any[]
+  ) => {
     setSelectedRowKeys(selectedRowKeys);
+    setSelectedRows(selectedRows);
   };
 
   const clearSelections = () => {
     setSelectedRowKeys([]);
+    setSelectedRows([]);
   };
 
   const removeSelectedKey = (rowKey: React.Key | React.Key[]) => {
     if (Array.isArray(rowKey)) {
       setSelectedRowKeys((keys) => keys.filter((key) => !rowKey.includes(key)));
+      setSelectedRows((rows) => rows.filter((row) => !rowKey.includes(row.id)));
       return;
     }
     setSelectedRowKeys((keys) => keys.filter((key) => key !== rowKey));
+    setSelectedRows((rows) => rows.filter((row) => row.id !== rowKey));
   };
 
   const removeSelectedKeys = (rowKeys: React.Key[]) => {
     setSelectedRowKeys((keys) => keys.filter((key) => !rowKeys.includes(key)));
+    setSelectedRows((rows) => rows.filter((row) => !rowKeys.includes(row.id)));
   };
 
   const rowSelection = {
     selectedRowKeys,
+    selectedRows,
     clearSelections,
     onChange: onSelectChange,
     removeSelectedKeys,

src/locales/en-US/common.ts

@@ -197,6 +197,9 @@ export default {
   'common.stop.confirm': 'Are you sure you want to stop the selected {type}?',
   'common.stop.single.confirm':
     'Are you sure you want to stop <span style="font-size: 13px;font-weight: 700">{name}</span>?',
+  'common.start.confirm': 'Are you sure you want to start the selected {type}?',
+  'common.start.single.confirm':
+    'Are you sure you want to start <span style="font-size: 13px;font-weight: 700">{name}</span>?',
   'common.filter.name': 'Filter by name',
   'common.form.password': 'Password',
   'common.form.username': 'Username',
@@ -208,6 +211,7 @@ export default {
   'common.button.version': 'Version',
   'common.title.delete.confirm': 'Confirm delete',
   'common.title.stop.confirm': 'Confirm stop',
+  'common.title.start.confirm': 'Confirm start',
   'common.title.recreate.confirm': 'Confirm recreate',
   'common.button.addLabel': 'Add Labels',
   'common.button.addSelector': 'Add Selectors',

src/locales/zh-CN/common.ts

@@ -190,6 +190,9 @@ export default {
   'common.stop.confirm': '停止选中的{type}，确定吗？',
   'common.stop.single.confirm':
     '停止 <span style="font-size: 13px;font-weight: 700">{name}</span>，确定吗？',
+  'common.start.confirm': '启动选中的{type}，确定吗？',
+  'common.start.single.confirm':
+    '启动 <span style="font-size: 13px;font-weight: 700">{name}</span>，确定吗？',
   'common.filter.name': '名称查询',
   'common.form.password': '密码',
   'common.form.username': '用户名',
@@ -200,7 +203,8 @@ export default {
   'common.button.docs': '文档',
   'common.button.version': '版本',
   'common.title.delete.confirm': '确认删除',
-  'common.title.stop.confirm': '确认',
+  'common.title.stop.confirm': '确认停止',
+  'common.title.start.confirm': '确认启动',
   'common.title.recreate.confirm': '确认重新创建',
   'common.button.addLabel': '添加标签',
   'common.button.addSelector': '添加选择器',

src/pages/llmodels/components/table-list.tsx

@@ -45,7 +45,7 @@ import {
   updateModel
 } from '../apis';
 import {
-  InstanceRealLogStatus,
+  InstanceRealtimeLogStatus,
   getSourceRepoConfigValue,
   modelCategories,
   modelCategoriesMap,
@@ -472,7 +472,9 @@ const Models: React.FC<ModelsProps> = ({
           status: row.state,
           id: row.id,
           modelId: row.model_id,
-          tail: InstanceRealLogStatus.includes(row.state) ? undefined : PageSize
+          tail: InstanceRealtimeLogStatus.includes(row.state)
+            ? undefined
+            : PageSize
         });
         setOpenLogModal(true);
         onViewLogs();
@@ -739,6 +741,32 @@ const Models: React.FC<ModelsProps> = ({
     }
   };
 
+  const handleStartBatch = async () => {
+    modalRef.current.show({
+      content: 'models.table.models',
+      title: 'common.title.start.confirm',
+      okText: 'common.button.start',
+      operation: 'common.start.confirm',
+      async onOk() {
+        await handleBatchRequest(rowSelection.selectedRows, handleStartModel);
+        rowSelection.clearSelections();
+      }
+    });
+  };
+
+  const handleStopBatch = async () => {
+    modalRef.current.show({
+      content: 'models.table.models',
+      title: 'common.title.stop.confirm',
+      okText: 'common.button.stop',
+      operation: 'common.stop.confirm',
+      async onOk() {
+        await handleBatchRequest(rowSelection.selectedRows, handleStopModel);
+        rowSelection.clearSelections();
+      }
+    });
+  };
+
   return (
     <>
       <PageContainer
@@ -820,6 +848,30 @@ const Models: React.FC<ModelsProps> = ({
                   </span>
                 </Button>
               </Access>
+              <Button
+                icon={<IconFont type="icon-outline-play"></IconFont>}
+                onClick={handleStartBatch}
+                disabled={!rowSelection.selectedRows.length}
+              >
+                <span>
+                  {intl?.formatMessage?.({ id: 'common.button.start' })}
+                  {rowSelection.selectedRows.length > 0 && (
+                    <span>({rowSelection.selectedRows?.length})</span>
+                  )}
+                </span>
+              </Button>
+              <Button
+                icon={<IconFont type="icon-stop1"></IconFont>}
+                onClick={handleStopBatch}
+                disabled={!rowSelection.selectedRows.length}
+              >
+                <span>
+                  {intl?.formatMessage?.({ id: 'common.button.stop' })}
+                  {rowSelection.selectedRows.length > 0 && (
+                    <span>({rowSelection.selectedRows?.length})</span>
+                  )}
+                </span>
+              </Button>
             </Space>
           }
         ></PageTools>

src/pages/llmodels/components/view-logs-modal.tsx

@@ -4,7 +4,7 @@ import { useIntl } from '@umijs/max';
 import { Modal } from 'antd';
 import React, { useCallback, useEffect, useState } from 'react';
 import { MODELS_API } from '../apis';
-import { InstanceRealLogStatus } from '../config';
+import { InstanceRealtimeLogStatus } from '../config';
 
 type ViewModalProps = {
   open: boolean;
@@ -35,10 +35,10 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
 
   const updateHandler = (list: any) => {
     const data = list?.find((item: any) => item.data?.id === props.id);
-    // state in InstanceRealLogStatus will not enable scorll load, because it is in the trasisition state
+    // state in InstanceRealtimeLogStatus will not enable scorll load, because it is in the trasisition state
     if (data) {
       setEnableScorllLoad(
-        () => !InstanceRealLogStatus.includes(data?.data?.state)
+        () => !InstanceRealtimeLogStatus.includes(data?.data?.state)
       );
     }
   };

src/pages/llmodels/config/index.ts

@@ -196,7 +196,7 @@ export const InstanceStatusMap = {
   Unreachable: 'unreachable'
 };
 
-export const InstanceRealLogStatus = [
+export const InstanceRealtimeLogStatus = [
   InstanceStatusMap.Downloading,
   InstanceStatusMap.Initializing
 ];