fix: single sorted field, remove token

This commit is contained in:
jialin
2025-12-22 10:10:35 +08:00
parent db45c861e4
commit 45efda7f1d
10 changed files with 59 additions and 25 deletions
@@ -1,16 +1,17 @@
import { Col, Row } from 'antd'; import { Col, Row } from 'antd';
import React from 'react'; import React from 'react';
import { OnSortFn, SealColumnProps } from '../types'; import { OnSortFn, SealColumnProps, TableOrder } from '../types';
import TableHeader from './table-header'; import TableHeader from './table-header';
interface HeaderProps { interface HeaderProps {
columns: SealColumnProps[]; columns: SealColumnProps[];
sortDirections?: ('ascend' | 'descend' | null)[]; sortDirections?: ('ascend' | 'descend' | null)[];
sorterList: TableOrder | Array<TableOrder>;
onSort?: OnSortFn; onSort?: OnSortFn;
} }
const Header: React.FC<HeaderProps> = (props) => { const Header: React.FC<HeaderProps> = (props) => {
const { onSort, sortDirections } = props; const { onSort, sortDirections, sorterList } = props;
return ( return (
<Row className="row"> <Row className="row">
@@ -31,6 +32,7 @@ const Header: React.FC<HeaderProps> = (props) => {
<TableHeader <TableHeader
onSort={onSort} onSort={onSort}
sorter={sorter} sorter={sorter}
sorterList={sorterList}
dataIndex={dataIndex} dataIndex={dataIndex}
sortOrder={sortOrder} sortOrder={sortOrder}
sortDirections={sortDirections} sortDirections={sortDirections}
@@ -1,7 +1,7 @@
import AutoTooltip from '@/components/auto-tooltip'; import AutoTooltip from '@/components/auto-tooltip';
import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons'; import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
import classNames from 'classnames'; import classNames from 'classnames';
import React from 'react'; import React, { useEffect } from 'react';
import '../styles/header.less'; import '../styles/header.less';
import { TableHeaderProps } from '../types'; import { TableHeaderProps } from '../types';
@@ -17,6 +17,7 @@ const TableHeader: React.FC<TableHeaderProps> = (props) => {
sortDirections = ['ascend', 'descend', null], sortDirections = ['ascend', 'descend', null],
defaultSortOrder, defaultSortOrder,
onSort, onSort,
sorterList,
sorter = false, sorter = false,
width, width,
dataIndex dataIndex
@@ -47,6 +48,29 @@ const TableHeader: React.FC<TableHeaderProps> = (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 ( return (
<div <div
style={{ width, ...style }} style={{ width, ...style }}
+2 -1
View File
@@ -49,7 +49,7 @@ const SealTable: React.FC<SealTableProps & { pagination: PaginationProps }> = (
loadChildren, loadChildren,
loadChildrenAPI loadChildrenAPI
} = props; } = props;
const { handleOnTableSort } = useSorter({ const { handleOnTableSort, sorterList } = useSorter({
onTableSort, onTableSort,
columns columns
}); });
@@ -166,6 +166,7 @@ const SealTable: React.FC<SealTableProps & { pagination: PaginationProps }> = (
onSort={handleOnTableSort} onSort={handleOnTableSort}
columns={parsedColumns} columns={parsedColumns}
sortDirections={sortDirections} sortDirections={sortDirections}
sorterList={sorterList}
></Header> ></Header>
</div> </div>
<Spin spinning={loading}> <Spin spinning={loading}>
+1
View File
@@ -43,6 +43,7 @@ export interface SealColumnProps {
} }
export interface TableHeaderProps { export interface TableHeaderProps {
sorterList?: TableOrder | Array<TableOrder>;
sorter?: boolean | { multiple?: number }; sorter?: boolean | { multiple?: number };
sortDirections?: ('ascend' | 'descend' | null)[]; sortDirections?: ('ascend' | 'descend' | null)[];
defaultSortOrder?: 'ascend' | 'descend' | null; defaultSortOrder?: 'ascend' | 'descend' | null;
+7 -1
View File
@@ -1,5 +1,5 @@
import { isBoolean } from 'lodash'; import { isBoolean } from 'lodash';
import { useRef } from 'react'; import { useRef, useState } from 'react';
import { SealColumnProps, TableOrder } from './types'; import { SealColumnProps, TableOrder } from './types';
const initSorterList = (columns: SealColumnProps[]) => { const initSorterList = (columns: SealColumnProps[]) => {
@@ -23,6 +23,9 @@ export default function useSorter(options: {
const sorterListRef = useRef<TableOrder | Array<TableOrder>>( const sorterListRef = useRef<TableOrder | Array<TableOrder>>(
initSorterList(columns || []) initSorterList(columns || [])
); );
const [sorterList, setSorterList] = useState<TableOrder | Array<TableOrder>>(
initSorterList(columns || [])
);
const handleOnTableSort = ( const handleOnTableSort = (
order: TableOrder, order: TableOrder,
@@ -39,6 +42,7 @@ export default function useSorter(options: {
} }
// single column sort // single column sort
if (isBoolean(sorter)) { if (isBoolean(sorter)) {
setSorterList(currentOrder);
sorterListRef.current = currentOrder; sorterListRef.current = currentOrder;
onTableSort?.(sorterListRef.current); onTableSort?.(sorterListRef.current);
@@ -73,12 +77,14 @@ export default function useSorter(options: {
} }
} }
} }
setSorterList(sorterListRef.current);
onTableSort?.(sorterListRef.current); onTableSort?.(sorterListRef.current);
}; };
return { return {
sorterListRef, sorterListRef,
sorterList,
handleOnTableSort handleOnTableSort
}; };
} }
+11 -7
View File
@@ -15,14 +15,18 @@ type SortDirection = 'ascend' | 'descend' | null;
export const TABLE_SORT_DIRECTIONS: SortDirection[] = [ export const TABLE_SORT_DIRECTIONS: SortDirection[] = [
'ascend', 'ascend',
'descend', 'descend',
null 'ascend'
]; ];
export const tableSorter = (order: number | boolean) => { export const tableSorter = (order: number | boolean) => {
if (typeof order === 'number') { return true;
return {
multiple: order // mutiple sorting can be supported in future
};
} // if (typeof order === 'number') {
return order; // return {
// multiple: order
// };
// }
// return order;
}; };
@@ -4,7 +4,7 @@ import { PageActionType } from '@/config/types';
import { createAxiosToken } from '@/hooks/use-chunk-request'; import { createAxiosToken } from '@/hooks/use-chunk-request';
import { ClusterStatusValueMap } from '@/pages/cluster-management/config'; import { ClusterStatusValueMap } from '@/pages/cluster-management/config';
import { useIntl } from '@umijs/max'; import { useIntl } from '@umijs/max';
import { Button } from 'antd'; import { Button, message } from 'antd';
import _ from 'lodash'; import _ from 'lodash';
import React, { useEffect, useMemo, useRef, useState } from 'react'; import React, { useEffect, useMemo, useRef, useState } from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
@@ -96,13 +96,16 @@ const AddModal: React.FC<AddModalProps> = (props) => {
const selectSpecRef = useRef<CatalogSpec>({} as CatalogSpec); const selectSpecRef = useRef<CatalogSpec>({} as CatalogSpec);
const specListRef = useRef<any[]>([]); const specListRef = useRef<any[]>([]);
const noCompatibleGPUsRef = useRef<boolean>(false); const noCompatibleGPUsRef = useRef<boolean>(false);
const [noCompatibleGPUs, setNoCompatibleGPUs] = useState<boolean>(false);
const handleSumit = () => { const handleSumit = () => {
form.current?.submit?.(); form.current?.submit?.();
}; };
const handleSubmitAnyway = async () => { const handleSubmitAnyway = async () => {
if (noCompatibleGPUsRef.current) {
message.error(intl.formatMessage({ id: 'models.catalog.nogpus.tips' }));
return;
}
submitAnyway.current = true; submitAnyway.current = true;
form.current?.submit?.(); form.current?.submit?.();
}; };
@@ -266,7 +269,6 @@ const AddModal: React.FC<AddModalProps> = (props) => {
// If no avaliable gpus for the model, show warning message // If no avaliable gpus for the model, show warning message
if (!res.items.length) { if (!res.items.length) {
noCompatibleGPUsRef.current = true; noCompatibleGPUsRef.current = true;
setNoCompatibleGPUs(true);
setWarningStatus({ setWarningStatus({
show: true, show: true,
type: 'warning', type: 'warning',
@@ -275,7 +277,6 @@ const AddModal: React.FC<AddModalProps> = (props) => {
return; return;
} }
noCompatibleGPUsRef.current = false; noCompatibleGPUsRef.current = false;
setNoCompatibleGPUs(false);
handleCheckCompatibility(allValues); handleCheckCompatibility(allValues);
} catch (error) { } catch (error) {
// ignore // ignore
@@ -394,11 +395,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
showOkBtn={!showExtraButton} showOkBtn={!showExtraButton}
extra={ extra={
showExtraButton && ( showExtraButton && (
<Button <Button type="primary" onClick={handleSubmitAnyway}>
type="primary"
onClick={handleSubmitAnyway}
disabled={noCompatibleGPUs}
>
{intl.formatMessage({ {intl.formatMessage({
id: 'models.form.submit.anyway' id: 'models.form.submit.anyway'
})} })}
@@ -38,7 +38,7 @@ const useFilterStatus = (options: {
}, },
{ {
value: MyModelsStatusValueMap.Degrade, value: MyModelsStatusValueMap.Degrade,
color: 'var(--ant-color-error)', color: 'var(--ant-color-warning)',
label: intl.formatMessage({ label: intl.formatMessage({
id: 'models.mymodels.status.degrade' id: 'models.mymodels.status.degrade'
}) })
+1 -1
View File
@@ -81,7 +81,7 @@ const UserModels: React.FC = () => {
}, },
{ {
value: MyModelsStatusValueMap.Degrade, value: MyModelsStatusValueMap.Degrade,
color: 'var(--ant-color-error)', color: 'var(--ant-color-warning)',
label: intl.formatMessage({ label: intl.formatMessage({
id: 'models.mymodels.status.degrade' id: 'models.mymodels.status.degrade'
}) })
+1 -2
View File
@@ -176,8 +176,7 @@ const setWorkerIPArg = (params: any) => {
const setImageArgs = (params: any) => { const setImageArgs = (params: any) => {
return `${params.image} \\ return `${params.image} \\
--server-url ${params.server} \\ --server-url ${params.server} \\`;
--token ${params.token} \\`;
}; };
// avaliable for NVIDIA、MThreads // avaliable for NVIDIA、MThreads