diff --git a/config/routes.ts b/config/routes.ts index 0923eb0e..5840ae33 100644 --- a/config/routes.ts +++ b/config/routes.ts @@ -115,6 +115,16 @@ export default [ access: 'canSeeAdmin', component: './maas-provider/index' }, + { + name: 'accesses', + path: '/models/accesses', + key: 'accesses', + icon: 'icon-extension-outline', + selectedIcon: 'icon-extension-filled', + defaultIcon: 'icon-extension-outline', + access: 'canSeeAdmin', + component: './model-access/index' + }, { name: 'userModels', path: '/models/user-models', diff --git a/src/locales/en-US/accesses.ts b/src/locales/en-US/accesses.ts new file mode 100644 index 00000000..d3b26978 --- /dev/null +++ b/src/locales/en-US/accesses.ts @@ -0,0 +1,6 @@ +export default { + 'accesses.title': 'Accesses', + 'accesses.button.add': 'Add Access', + 'accesses.table.accessPoints': 'Access Points', + 'accesses.table.traffic': 'Traffic Share' +}; diff --git a/src/locales/en-US/menu.ts b/src/locales/en-US/menu.ts index 2aa7c1cd..a475624c 100644 --- a/src/locales/en-US/menu.ts +++ b/src/locales/en-US/menu.ts @@ -16,8 +16,8 @@ export default { 'menu.models.userModels': 'My Models', 'menu.models.benchmark': 'Benchmarks', 'menu.models.benchmarkDetail': 'Benchmark Details', - 'menu.models.provider': 'Provider', - 'menu.models.providers': 'Provider', + 'menu.models.providers': 'Providers', + 'menu.models.accesses': 'Accesses', 'menu.modelCatalog': 'Catalog', 'menu.resources': 'Resources', 'menu.apikeys': 'API Keys', diff --git a/src/locales/en-US/no-result.ts b/src/locales/en-US/no-result.ts index 404d70d1..3d6eccec 100644 --- a/src/locales/en-US/no-result.ts +++ b/src/locales/en-US/no-result.ts @@ -45,5 +45,8 @@ export default { 'noresult.benchmark.nofound': 'No matching benchmarks found.', 'noresult.provider.title': 'No Providers', 'noresult.provider.subTitle': 'No providers have been added yet.', - 'noresult.provider.nofound': 'No matching providers found.' + 'noresult.provider.nofound': 'No matching providers found.', + 'noresult.accesses.title': 'No Accesses', + 'noresult.accesses.subTitle': 'No accesses have been added yet.', + 'noresult.accesses.nofound': 'No matching accesses found.' }; diff --git a/src/locales/ja-JP/accesses.ts b/src/locales/ja-JP/accesses.ts new file mode 100644 index 00000000..d3b26978 --- /dev/null +++ b/src/locales/ja-JP/accesses.ts @@ -0,0 +1,6 @@ +export default { + 'accesses.title': 'Accesses', + 'accesses.button.add': 'Add Access', + 'accesses.table.accessPoints': 'Access Points', + 'accesses.table.traffic': 'Traffic Share' +}; diff --git a/src/locales/ja-JP/menu.ts b/src/locales/ja-JP/menu.ts index 0ed10a1f..c3e36436 100644 --- a/src/locales/ja-JP/menu.ts +++ b/src/locales/ja-JP/menu.ts @@ -16,7 +16,8 @@ export default { 'menu.models.benchmark': 'Benchmarks', 'menu.models.benchmarkDetail': 'Benchmark Details', 'menu.modelCatalog': 'カタログ', - 'menu.models.providers': 'Provider', + 'menu.models.providers': 'Providers', + 'menu.models.accesses': 'Accesses', 'menu.resources': 'リソース', 'menu.apikeys': 'APIキー', 'menu.users': 'ユーザー', diff --git a/src/locales/ja-JP/no-result.ts b/src/locales/ja-JP/no-result.ts index 404d70d1..3d6eccec 100644 --- a/src/locales/ja-JP/no-result.ts +++ b/src/locales/ja-JP/no-result.ts @@ -45,5 +45,8 @@ export default { 'noresult.benchmark.nofound': 'No matching benchmarks found.', 'noresult.provider.title': 'No Providers', 'noresult.provider.subTitle': 'No providers have been added yet.', - 'noresult.provider.nofound': 'No matching providers found.' + 'noresult.provider.nofound': 'No matching providers found.', + 'noresult.accesses.title': 'No Accesses', + 'noresult.accesses.subTitle': 'No accesses have been added yet.', + 'noresult.accesses.nofound': 'No matching accesses found.' }; diff --git a/src/locales/ru-RU/accesses.ts b/src/locales/ru-RU/accesses.ts new file mode 100644 index 00000000..d3b26978 --- /dev/null +++ b/src/locales/ru-RU/accesses.ts @@ -0,0 +1,6 @@ +export default { + 'accesses.title': 'Accesses', + 'accesses.button.add': 'Add Access', + 'accesses.table.accessPoints': 'Access Points', + 'accesses.table.traffic': 'Traffic Share' +}; diff --git a/src/locales/ru-RU/menu.ts b/src/locales/ru-RU/menu.ts index a710c6dd..f73ff306 100644 --- a/src/locales/ru-RU/menu.ts +++ b/src/locales/ru-RU/menu.ts @@ -16,7 +16,8 @@ export default { 'menu.models.benchmark': 'Benchmarks', 'menu.models.benchmarkDetail': 'Benchmark Details', 'menu.models.provider': 'Provider', - 'menu.models.providers': 'Provider', + 'menu.models.providers': 'Providers', + 'menu.models.accesses': 'Accesses', 'menu.modelCatalog': 'Каталог', 'menu.resources': 'Ресурсы', 'menu.apikeys': 'API-ключи', @@ -42,10 +43,15 @@ export default { // ========== To-Do: Translate Keys (Remove After Translation) ========== <<<<<<< HEAD +<<<<<<< HEAD // 1. 'menu.models.benchmark': 'Benchmarks', // 2. 'menu.models.benchmarkDetail': 'Benchmark Details', // 1. 'menu.models.provider': 'Provider', ======= // 1. 'menu.models.providers': 'Provider', >>>>>>> ddf1a270 (feat: provider lsit) +======= +// 1. 'menu.models.providers': 'Providers', +// 2. 'menu.models.accesses': 'Accesses', +>>>>>>> 11d2c02d (feat: add access list) // ========== End of To-Do List ========== diff --git a/src/locales/ru-RU/no-result.ts b/src/locales/ru-RU/no-result.ts index 8c4fb545..38182321 100644 --- a/src/locales/ru-RU/no-result.ts +++ b/src/locales/ru-RU/no-result.ts @@ -46,7 +46,10 @@ export default { 'noresult.benchmark.nofound': 'No matching benchmarks found.', 'noresult.provider.title': 'No Providers', 'noresult.provider.subTitle': 'No providers have been added yet.', - 'noresult.provider.nofound': 'No matching providers found.' + 'noresult.provider.nofound': 'No matching providers found.', + 'noresult.accesses.title': 'No Accesses', + 'noresult.accesses.subTitle': 'No accesses have been added yet.', + 'noresult.accesses.nofound': 'No matching accesses found.' }; // ========== To-Do: Translate Keys (Remove After Translation) ========== @@ -59,5 +62,8 @@ export default { // 7. 'noresult.benchmark.nofound': 'No matching benchmarks found.' // 5. 'noresult.provider.title': 'No Providers', // 6. 'noresult.provider.subTitle': 'No providers have been added yet.', -// 7. 'noresult.provider.nofound': 'No matching providers found.' +// 7. 'noresult.provider.nofound': 'No matching providers found.', +// 8. 'noresult.accesses.title': 'No Accesses', +// 9. 'noresult.accesses.subTitle': 'No accesses have been added yet.', +// 10. 'noresult.accesses.nofound': 'No matching accesses found.' // ======================================================================== diff --git a/src/locales/zh-CN/accesses.ts b/src/locales/zh-CN/accesses.ts new file mode 100644 index 00000000..84e2263f --- /dev/null +++ b/src/locales/zh-CN/accesses.ts @@ -0,0 +1,6 @@ +export default { + 'accesses.title': '接入', + 'accesses.button.add': '添加接入', + 'accesses.table.accessPoints': '接入点', + 'accesses.table.traffic': '流量' +}; diff --git a/src/locales/zh-CN/menu.ts b/src/locales/zh-CN/menu.ts index c3afc381..47346047 100644 --- a/src/locales/zh-CN/menu.ts +++ b/src/locales/zh-CN/menu.ts @@ -17,6 +17,7 @@ export default { 'menu.models.benchmarkDetail': '基准测试详情', 'menu.models.provider': '渠道', 'menu.models.providers': '渠道', + 'menu.models.accesses': '接入', 'menu.modelCatalog': '模型库', 'menu.models.catalog': '模型库', 'menu.resources': '资源', diff --git a/src/locales/zh-CN/no-result.ts b/src/locales/zh-CN/no-result.ts index c74d392d..0dccbc48 100644 --- a/src/locales/zh-CN/no-result.ts +++ b/src/locales/zh-CN/no-result.ts @@ -43,5 +43,8 @@ export default { 'noresult.benchmark.nofound': '未找到匹配的基准测试', 'noresult.provider.title': '暂无渠道', 'noresult.provider.subTitle': '尚未添加任何渠道。', - 'noresult.provider.nofound': '未找到匹配的渠道' + 'noresult.provider.nofound': '未找到匹配的渠道', + 'noresult.accesses.title': '暂无接入', + 'noresult.accesses.subTitle': '尚未添加任何接入。', + 'noresult.accesses.nofound': '未找到匹配的接入' }; diff --git a/src/pages/model-access/apis/index.ts b/src/pages/model-access/apis/index.ts new file mode 100644 index 00000000..95f78129 --- /dev/null +++ b/src/pages/model-access/apis/index.ts @@ -0,0 +1,47 @@ +import { request } from '@umijs/max'; +import { AccessItem, FormData } from '../config/types'; + +export const ACCESS_API = '/accesses'; + +export const ACCESS_POINTS_API = '/models'; + +export async function queryModelAccesses( + params: Global.SearchParams, + options?: any +) { + return request>(ACCESS_API, { + params, + method: 'GET', + cancelToken: options?.token + }); +} + +export async function createAccess(params: { data: FormData }) { + return request(`${ACCESS_API}`, { + method: 'POST', + data: params.data + }); +} + +export async function updateAccess(params: { id: number; data: FormData }) { + return request(`${ACCESS_API}/${params.id}`, { + method: 'PUT', + data: params.data + }); +} + +export async function deleteAccess(id: number) { + return request(`${ACCESS_API}/${id}`, { + method: 'DELETE' + }); +} + +export async function queryAccessPoints(params: { id: string }, options?: any) { + return request[]>( + `${ACCESS_API}/${params.id}/points`, + { + method: 'GET', + cancelToken: options?.token + } + ); +} diff --git a/src/pages/model-access/components/access-points.tsx b/src/pages/model-access/components/access-points.tsx new file mode 100644 index 00000000..8a428c1f --- /dev/null +++ b/src/pages/model-access/components/access-points.tsx @@ -0,0 +1,117 @@ +import AutoTooltip from '@/components/auto-tooltip'; +import DropdownButtons from '@/components/drop-down-buttons'; +import IconFont from '@/components/icon-font'; +import RowChildren from '@/components/seal-table/components/row-children'; +import StatusTag from '@/components/status-tag'; +import { DeleteOutlined } from '@ant-design/icons'; +import { Col, Row } from 'antd'; +import dayjs from 'dayjs'; +import React from 'react'; +import styled from 'styled-components'; + +const CellContent = styled.div` + display: flex; + align-items: center; + height: 100%; +`; + +interface ProviderModelProps { + dataList: any[]; + provider: string; + providerId: number; +} + +interface AccessItemProps { + onSelect: (val: any, record: any) => void; + data: any; +} + +export const childActionList = [ + { + key: 'viewlog', + label: 'common.button.viewlog', + icon: + }, + { + key: 'delete', + label: 'common.button.delete', + icon: , + props: { + danger: true + } + } +]; + +const AccessItem: React.FC = ({ onSelect, data }) => { + return ( +
+ + + + + qwen3-0.6b-zduxy + + + + + Traffic: 20% + + + + + + + + + + + + + {dayjs().format('YYYY-MM-DD HH:mm:ss')} + + + + + + + + + + +
+ ); +}; + +const AccessPoints: React.FC = ({ dataList }) => { + console.log('AccessPoints dataList:', dataList); + return ( +
+ {Array(2) + .fill(1) + .map((item, index) => ( + { + console.log('Selected action:', val, 'on record:', record); + }} + > + ))} +
+ ); +}; + +export default AccessPoints; diff --git a/src/pages/model-access/components/add-access-modal.tsx b/src/pages/model-access/components/add-access-modal.tsx new file mode 100644 index 00000000..5ba75afe --- /dev/null +++ b/src/pages/model-access/components/add-access-modal.tsx @@ -0,0 +1,62 @@ +import { PageActionType } from '@/config/types'; +import FormDrawer from '@/pages/_components/form-drawer'; +import React, { useRef } from 'react'; +import { FormData, AccessItem as ListItem } from '../config/types'; + +import { maasProviderType } from '../config'; +import ProviderForm from '../forms'; + +type AddModalProps = { + title: string; + action: PageActionType; + open: boolean; + currentData?: ListItem; // Used when action is EDIT + provider: maasProviderType | null; + onOk: (values: FormData) => void; + onCancel: () => void; +}; +const AddProvider: React.FC = ({ + title, + action, + open, + provider, + currentData, + onOk, + onCancel +}) => { + const form = useRef(null); + + const handleSubmit = () => { + form.current?.submit(); + }; + + const handleOk = async (data: FormData) => { + onOk({ + ...data + }); + }; + + const handleCancel = () => { + form.current?.resetFields(); + onCancel(); + }; + + return ( + + + + ); +}; + +export default AddProvider; diff --git a/src/pages/model-access/config/index.ts b/src/pages/model-access/config/index.ts new file mode 100644 index 00000000..a26b6a89 --- /dev/null +++ b/src/pages/model-access/config/index.ts @@ -0,0 +1,76 @@ +import icons from '@/components/icon-font/icons'; +import { StatusMaps } from '@/config'; +import { StatusType } from '@/config/types'; + +export type maasProviderType = + | 'doubao' + | 'qwen' + | 'openai' + | 'deepseek' + | 'anthropic'; + +export const maasProviderValueMap = { + Doubao: 'doubao', + Qwen: 'qwen', + OpenAI: 'openai', + Deepseek: 'deepseek', + Anthropic: 'anthropic' +}; + +export const maasProviderLabelMap = { + [maasProviderValueMap.Doubao]: 'Doubao', + [maasProviderValueMap.Qwen]: 'Qwen', + [maasProviderValueMap.OpenAI]: 'OpenAI', + [maasProviderValueMap.Deepseek]: 'Deepseek', + [maasProviderValueMap.Anthropic]: 'Anthropic' +}; + +export const providerIconsMap = { + [maasProviderValueMap.Doubao]: 'icon-doubao', + [maasProviderValueMap.Qwen]: 'icon-qwen', + [maasProviderValueMap.OpenAI]: 'icon-openai', + [maasProviderValueMap.Deepseek]: 'icon-deepseek', + [maasProviderValueMap.Anthropic]: 'icon-anthropic' +}; + +export const maasProviderOptions = Object.entries(maasProviderValueMap).map( + ([key, value]) => ({ + label: maasProviderLabelMap[value], + value: value, + key: value, + locale: false, + icon: providerIconsMap[value] + }) +); + +export const ProviderStatusValueMap: Record = { + Ready: 'Ready', + InActive: 'Inactive' +}; + +export const ProviderStatusLabelMap = { + [ProviderStatusValueMap.Ready]: 'Ready', + [ProviderStatusValueMap.InActive]: 'Inactive' +}; + +export const ProviderStatus: Record = { + [ProviderStatusValueMap.Ready]: StatusMaps.success, + [ProviderStatusValueMap.InActive]: StatusMaps.error +}; + +// actions for each row +export const rowActionList = [ + { + key: 'edit', + label: 'common.button.edit', + icon: icons.EditOutlined + }, + { + key: 'delete', + label: 'common.button.delete', + icon: icons.DeleteOutlined, + props: { + danger: true + } + } +]; diff --git a/src/pages/model-access/config/mock.ts b/src/pages/model-access/config/mock.ts new file mode 100644 index 00000000..2b237b3d --- /dev/null +++ b/src/pages/model-access/config/mock.ts @@ -0,0 +1,35 @@ +import { AccessItem } from './types'; + +// mock data for AccessItem 5 items +export const mockDataList: AccessItem[] = [ + { + id: 1, + name: 'Doubao Access', + source: 'Doubao', + accessPoints: 5 + }, + { + id: 2, + name: 'Qwen Access', + source: 'Qwen', + accessPoints: 3 + }, + { + id: 3, + name: 'OpenAI Access', + source: 'OpenAI', + accessPoints: 8 + }, + { + id: 4, + name: 'Deepseek Access', + source: 'Deepseek', + accessPoints: 2 + }, + { + id: 5, + name: 'Anthropic Access', + source: 'Anthropic', + accessPoints: 4 + } +]; diff --git a/src/pages/model-access/config/types.ts b/src/pages/model-access/config/types.ts new file mode 100644 index 00000000..b462d350 --- /dev/null +++ b/src/pages/model-access/config/types.ts @@ -0,0 +1,12 @@ +export interface AccessItem { + id: number; + name: string; + source: string; + accessPoints?: number; +} + +export interface FormData { + name: string; + category: string; + description: string; +} diff --git a/src/pages/model-access/forms/index.tsx b/src/pages/model-access/forms/index.tsx new file mode 100644 index 00000000..100988eb --- /dev/null +++ b/src/pages/model-access/forms/index.tsx @@ -0,0 +1,32 @@ +import { PageActionType } from '@/config/types'; +import { Form } from 'antd'; +import { forwardRef, useImperativeHandle } from 'react'; +import { MaasProviderItem as ListItem } from '../config/types'; + +interface ProviderFormProps { + ref?: any; + action: PageActionType; + currentData?: ListItem; // Used when action is EDIT + onFinish: (values: FormData) => void; +} + +const ProviderForm: React.FC = forwardRef((props, ref) => { + const [form] = Form.useForm(); + + useImperativeHandle(ref, () => ({ + submit: () => { + form.submit(); + }, + resetFields: () => { + form.resetFields(); + } + })); + + return ( +
+ {/* Form fields go here */} +
+ ); +}); + +export default ProviderForm; diff --git a/src/pages/model-access/hooks/use-access-columns.tsx b/src/pages/model-access/hooks/use-access-columns.tsx new file mode 100644 index 00000000..1b89113e --- /dev/null +++ b/src/pages/model-access/hooks/use-access-columns.tsx @@ -0,0 +1,92 @@ +// columns.ts +import AutoTooltip from '@/components/auto-tooltip'; +import DropdownButtons from '@/components/drop-down-buttons'; +import IconFont from '@/components/icon-font'; +import { SealColumnProps } from '@/components/seal-table/types'; +import { tableSorter } from '@/config/settings'; +import { useIntl } from '@umijs/max'; +import { Tag } from 'antd'; +import dayjs from 'dayjs'; +import { useMemo } from 'react'; +import { + maasProviderLabelMap, + providerIconsMap, + rowActionList +} from '../config'; +import { AccessItem } from '../config/types'; + +const useAccessColumns = ( + handleSelect: (val: string, record: AccessItem) => void, + onCellClick?: (record: AccessItem, dataIndex: string) => void +): SealColumnProps[] => { + const intl = useIntl(); + + return useMemo(() => { + return [ + { + title: intl.formatMessage({ id: 'common.table.name' }), + dataIndex: 'name', + sorter: tableSorter(1), + span: 5, + render: (text: string, record: AccessItem) => ( + <> + + {text} + + {record.builtIn && ( + + BuiltIn + + )} + + ) + }, + { + title: intl.formatMessage({ id: 'models.form.source' }), + dataIndex: 'source', + span: 5, + render: (value: string) => ( + <> + + + {maasProviderLabelMap[value]} + + + ) + }, + { + title: intl.formatMessage({ id: 'accesses.table.accessPoints' }), + dataIndex: 'accessPoints', + span: 5, + render: (value: number) => {value} + }, + { + title: intl.formatMessage({ id: 'common.table.createTime' }), + dataIndex: 'created_at', + sorter: tableSorter(6), + span: 5, + render: (value: string) => ( + + {dayjs(value).format('YYYY-MM-DD HH:mm:ss')} + + ) + }, + { + title: intl.formatMessage({ id: 'common.table.operation' }), + dataIndex: 'operations', + span: 4, + render: (value: string, record: AccessItem) => ( + handleSelect(val, record)} + > + ) + } + ]; + }, [handleSelect, onCellClick]); +}; + +export default useAccessColumns; diff --git a/src/pages/model-access/hooks/use-create-access.ts b/src/pages/model-access/hooks/use-create-access.ts new file mode 100644 index 00000000..67a43cb1 --- /dev/null +++ b/src/pages/model-access/hooks/use-create-access.ts @@ -0,0 +1,39 @@ +import { PageAction } from '@/config'; +import { PageActionType } from '@/config/types'; +import { useState } from 'react'; +import { maasProviderType } from '../config'; +import { AccessItem as ListItem } from '../config/types'; + +const useCreateAccess = (options: { refresh: () => void }) => { + const [openModalStatus, setOpenModalStatus] = useState<{ + open: boolean; + action: PageActionType; + currentData?: ListItem; + title: string; + provider: maasProviderType | null; + }>({ + open: false, + action: PageAction.CREATE, + currentData: undefined, + title: '', + provider: null + }); + + const openModal = () => { + setOpenModalStatus({ ...openModalStatus, open: true }); + }; + + const closeModal = () => { + setOpenModalStatus({ ...openModalStatus, open: false }); + options.refresh(); + }; + + return { + openAccessModalStatus: openModalStatus, + setOpenAccessModalStatus: setOpenModalStatus, + openAccessModal: openModal, + closeAccessModal: closeModal + }; +}; + +export default useCreateAccess; diff --git a/src/pages/model-access/index.tsx b/src/pages/model-access/index.tsx new file mode 100644 index 00000000..e0a8012b --- /dev/null +++ b/src/pages/model-access/index.tsx @@ -0,0 +1,259 @@ +import { expandKeysAtom } from '@/atoms/clusters'; +import DeleteModal from '@/components/delete-modal'; +import IconFont from '@/components/icon-font'; +import { FilterBar } from '@/components/page-tools'; +import SealTable from '@/components/seal-table'; +import TableContext from '@/components/seal-table/table-context'; +import { TableOrder } from '@/components/seal-table/types'; +import { PageAction } from '@/config'; +import { TABLE_SORT_DIRECTIONS } from '@/config/settings'; +import useExpandedRowKeys from '@/hooks/use-expanded-row-keys'; +import useTableFetch from '@/hooks/use-table-fetch'; +import useWatchList from '@/hooks/use-watch-list'; +import { useIntl } from '@umijs/max'; +import { useMemoizedFn } from 'ahooks'; +import { message } from 'antd'; +import { useAtom } from 'jotai'; +import _ from 'lodash'; +import NoResult from '../_components/no-result'; +import PageBox from '../_components/page-box'; +import { + ACCESS_API, + ACCESS_POINTS_API, + deleteAccess, + queryModelAccesses, + updateAccess +} from './apis'; +import AccessPoints from './components/access-points'; +import AddAccessModal from './components/add-access-modal'; +import { maasProviderOptions } from './config'; +import { mockDataList } from './config/mock'; +import { FormData, AccessItem as ListItem } from './config/types'; +import useAccessColumns from './hooks/use-access-columns'; +import useCreateAccess from './hooks/use-create-access'; + +const Accesses: React.FC = () => { + const { + dataSource, + rowSelection, + queryParams, + modalRef, + handleTableChange, + handleDelete, + handleDeleteBatch, + fetchData, + handlePageChange, + handleSearch, + handleNameChange + } = useTableFetch({ + fetchAPI: queryModelAccesses, + deleteAPI: deleteAccess, + watch: false, + API: ACCESS_API, + contentForDelete: 'menu.models.access' + }); + const { watchDataList: allAccessPoints } = useWatchList(ACCESS_POINTS_API); + const [expandAtom] = useAtom(expandKeysAtom); + const { handleExpandChange, handleExpandAll, expandedRowKeys } = + useExpandedRowKeys(expandAtom); + const intl = useIntl(); + const { + openAccessModalStatus, + setOpenAccessModalStatus, + openAccessModal, + closeAccessModal + } = useCreateAccess({ + refresh: handleSearch + }); + + const handleClickDropdown = () => { + openAccessModal(); + }; + + const handleModalOk = async (data: FormData) => { + const params = { + ...data + }; + try { + if (openAccessModalStatus.action === PageAction.EDIT) { + await updateAccess({ + data: params, + id: openAccessModalStatus.currentData!.id + }); + } + fetchData(); + setOpenAccessModalStatus({ + open: false, + action: PageAction.CREATE, + currentData: undefined, + title: '', + provider: null + }); + message.success(intl.formatMessage({ id: 'common.message.success' })); + } catch (error) {} + }; + + const handleModalCancel = () => { + console.log('handleModalCancel'); + setOpenAccessModalStatus({ + open: false, + action: PageAction.CREATE, + currentData: undefined, + title: '', + provider: null + }); + }; + + const handleEditProvider = (row: ListItem) => { + setOpenAccessModalStatus({ + open: true, + action: PageAction.EDIT, + currentData: row, + title: intl.formatMessage( + { id: 'clusters.edit.cluster' }, + { cluster: row.name } + ), + provider: row.provider + }); + }; + + const handleSelect = useMemoizedFn((val: any, row: ListItem) => { + if (val === 'edit') { + handleEditProvider(row); + } else if (val === 'delete') { + handleDelete({ ...row, name: row.name }); + } + }); + + const handleOnToggleExpandAll = () => { + // do nothing + }; + + const handleToggleExpandAll = useMemoizedFn((expanded: boolean) => { + const keys = dataSource.dataList?.map((item) => item.id); + handleExpandAll(expanded, keys); + if (expanded) { + handleOnToggleExpandAll(); + } + }); + + const loadChildrenData = useMemoizedFn( + async (row: ListItem, options?: any) => { + const params = { + cluster_id: row.id, + page: -1 + }; + // const data = await queryAccessPoints(params, { + // token: options?.token + // }); + return [1]; + } + ); + + const handleOnSortChange = (order: TableOrder | Array) => { + handleTableChange({}, {}, order, { action: 'sort' }); + }; + + const renderChildren = ( + list: any, + options: { parent?: any; [key: string]: any } + ) => { + return ( + + ); + }; + + const columns = useAccessColumns(handleSelect); + + return ( + <> + + ({ + ...option, + icon: ( + + ) + }))} + > + + } + filters={_.omit(queryParams, ['sort_by'])} + noFoundText={intl.formatMessage({ + id: 'noresult.accesses.nofound' + })} + title={intl.formatMessage({ id: 'noresult.accesses.title' })} + subTitle={intl.formatMessage({ + id: 'noresult.accesses.subTitle' + })} + onClick={handleClickDropdown} + buttonText={intl.formatMessage({ id: 'noresult.button.add' })} + > + } + pagination={{ + showSizeChanger: true, + pageSize: queryParams.perPage, + current: queryParams.page, + total: dataSource.total, + hideOnSinglePage: queryParams.perPage === 10, + onChange: handlePageChange + }} + > + + + + + + ); +}; + +export default Accesses;