diff --git a/src/components/seal-table/components/header.tsx b/src/components/seal-table/components/header.tsx index b4cd81a9..b216d2c0 100644 --- a/src/components/seal-table/components/header.tsx +++ b/src/components/seal-table/components/header.tsx @@ -1,16 +1,17 @@ import { Col, Row } from 'antd'; import React from 'react'; -import { OnSortFn, SealColumnProps } from '../types'; +import { OnSortFn, SealColumnProps, TableOrder } from '../types'; import TableHeader from './table-header'; interface HeaderProps { columns: SealColumnProps[]; sortDirections?: ('ascend' | 'descend' | null)[]; + sorterList: TableOrder | Array; onSort?: OnSortFn; } const Header: React.FC = (props) => { - const { onSort, sortDirections } = props; + const { onSort, sortDirections, sorterList } = props; return ( @@ -31,6 +32,7 @@ const Header: React.FC = (props) => { = (props) => { sortDirections = ['ascend', 'descend', null], defaultSortOrder, onSort, + sorterList, sorter = false, width, dataIndex @@ -47,6 +48,29 @@ const TableHeader: React.FC = (props) => { }); }; + useEffect(() => { + if (!sorterList) { + setCurrentSortOrder(null); + return; + } + + if (Array.isArray(sorterList)) { + const sortItem = sorterList.find( + (item) => item.columnKey === dataIndex || item.field === dataIndex + ); + setCurrentSortOrder(sortItem?.order || null); + } else { + if ( + sorterList.columnKey === dataIndex || + sorterList.field === dataIndex + ) { + setCurrentSortOrder(sorterList.order); + } else { + setCurrentSortOrder(null); + } + } + }, [sorterList]); + return (
= ( loadChildren, loadChildrenAPI } = props; - const { handleOnTableSort } = useSorter({ + const { handleOnTableSort, sorterList } = useSorter({ onTableSort, columns }); @@ -166,6 +166,7 @@ const SealTable: React.FC = ( onSort={handleOnTableSort} columns={parsedColumns} sortDirections={sortDirections} + sorterList={sorterList} >
diff --git a/src/components/seal-table/types.ts b/src/components/seal-table/types.ts index c8a91f0b..2c1ed27c 100644 --- a/src/components/seal-table/types.ts +++ b/src/components/seal-table/types.ts @@ -43,6 +43,7 @@ export interface SealColumnProps { } export interface TableHeaderProps { + sorterList?: TableOrder | Array; sorter?: boolean | { multiple?: number }; sortDirections?: ('ascend' | 'descend' | null)[]; defaultSortOrder?: 'ascend' | 'descend' | null; diff --git a/src/components/seal-table/use-sorter.ts b/src/components/seal-table/use-sorter.ts index 86b21dac..12642313 100644 --- a/src/components/seal-table/use-sorter.ts +++ b/src/components/seal-table/use-sorter.ts @@ -1,5 +1,5 @@ import { isBoolean } from 'lodash'; -import { useRef } from 'react'; +import { useRef, useState } from 'react'; import { SealColumnProps, TableOrder } from './types'; const initSorterList = (columns: SealColumnProps[]) => { @@ -23,6 +23,9 @@ export default function useSorter(options: { const sorterListRef = useRef>( initSorterList(columns || []) ); + const [sorterList, setSorterList] = useState>( + initSorterList(columns || []) + ); const handleOnTableSort = ( order: TableOrder, @@ -39,6 +42,7 @@ export default function useSorter(options: { } // single column sort if (isBoolean(sorter)) { + setSorterList(currentOrder); sorterListRef.current = currentOrder; onTableSort?.(sorterListRef.current); @@ -73,12 +77,14 @@ export default function useSorter(options: { } } } + setSorterList(sorterListRef.current); onTableSort?.(sorterListRef.current); }; return { sorterListRef, + sorterList, handleOnTableSort }; } diff --git a/src/config/settings.ts b/src/config/settings.ts index 4f859e19..661acbf3 100644 --- a/src/config/settings.ts +++ b/src/config/settings.ts @@ -15,14 +15,18 @@ type SortDirection = 'ascend' | 'descend' | null; export const TABLE_SORT_DIRECTIONS: SortDirection[] = [ 'ascend', 'descend', - null + 'ascend' ]; export const tableSorter = (order: number | boolean) => { - if (typeof order === 'number') { - return { - multiple: order - }; - } - return order; + return true; + + // mutiple sorting can be supported in future + + // if (typeof order === 'number') { + // return { + // multiple: order + // }; + // } + // return order; }; diff --git a/src/pages/llmodels/components/deploy-builtin-modal.tsx b/src/pages/llmodels/components/deploy-builtin-modal.tsx index f1ee1842..a7de8d05 100644 --- a/src/pages/llmodels/components/deploy-builtin-modal.tsx +++ b/src/pages/llmodels/components/deploy-builtin-modal.tsx @@ -4,7 +4,7 @@ import { PageActionType } from '@/config/types'; import { createAxiosToken } from '@/hooks/use-chunk-request'; import { ClusterStatusValueMap } from '@/pages/cluster-management/config'; import { useIntl } from '@umijs/max'; -import { Button } from 'antd'; +import { Button, message } from 'antd'; import _ from 'lodash'; import React, { useEffect, useMemo, useRef, useState } from 'react'; import styled from 'styled-components'; @@ -96,13 +96,16 @@ const AddModal: React.FC = (props) => { const selectSpecRef = useRef({} as CatalogSpec); const specListRef = useRef([]); const noCompatibleGPUsRef = useRef(false); - const [noCompatibleGPUs, setNoCompatibleGPUs] = useState(false); const handleSumit = () => { form.current?.submit?.(); }; const handleSubmitAnyway = async () => { + if (noCompatibleGPUsRef.current) { + message.error(intl.formatMessage({ id: 'models.catalog.nogpus.tips' })); + return; + } submitAnyway.current = true; form.current?.submit?.(); }; @@ -266,7 +269,6 @@ const AddModal: React.FC = (props) => { // If no avaliable gpus for the model, show warning message if (!res.items.length) { noCompatibleGPUsRef.current = true; - setNoCompatibleGPUs(true); setWarningStatus({ show: true, type: 'warning', @@ -275,7 +277,6 @@ const AddModal: React.FC = (props) => { return; } noCompatibleGPUsRef.current = false; - setNoCompatibleGPUs(false); handleCheckCompatibility(allValues); } catch (error) { // ignore @@ -394,11 +395,7 @@ const AddModal: React.FC = (props) => { showOkBtn={!showExtraButton} extra={ showExtraButton && ( -