From 35918d2a008dc3572c2a2fab664e87d1640c3420 Mon Sep 17 00:00:00 2001 From: jialin Date: Thu, 22 Jan 2026 16:46:50 +0800 Subject: [PATCH] chore: access meta --- src/components/auto-image/single-image.less | 4 +- src/components/auto-image/single-image.tsx | 9 +- src/components/icon-font/index.tsx | 2 +- src/locales/en-US/accesses.ts | 20 +- src/locales/ja-JP/accesses.ts | 20 +- src/locales/ru-RU/accesses.ts | 20 +- src/locales/zh-CN/accesses.ts | 20 +- .../model-access/components/access-points.tsx | 35 ++- src/pages/model-access/forms/basic.tsx | 15 +- src/pages/model-access/forms/endpoints.tsx | 48 ++-- .../model-access/forms/fallback-settings.tsx | 49 ---- src/pages/model-access/forms/index.tsx | 23 +- src/pages/model-access/forms/meta-data.tsx | 210 +++++++++++++----- .../hooks/use-fallback-settings.ts | 49 ---- 14 files changed, 318 insertions(+), 206 deletions(-) delete mode 100644 src/pages/model-access/forms/fallback-settings.tsx delete mode 100644 src/pages/model-access/hooks/use-fallback-settings.ts diff --git a/src/components/auto-image/single-image.less b/src/components/auto-image/single-image.less index 1b3d4df2..28b32101 100644 --- a/src/components/auto-image/single-image.less +++ b/src/components/auto-image/single-image.less @@ -59,8 +59,8 @@ .del { position: absolute; - top: -4px; - right: -2px; + top: 2px; + right: 2px; font-size: var(--font-size-middle); cursor: pointer; background-color: var(--color-white-1); diff --git a/src/components/auto-image/single-image.tsx b/src/components/auto-image/single-image.tsx index d215fff3..c8eea73b 100644 --- a/src/components/auto-image/single-image.tsx +++ b/src/components/auto-image/single-image.tsx @@ -32,7 +32,7 @@ interface SingleImageProps { const SingleImage: React.FC = (props) => { const { editable, - onDelete: handleOnDelete, + onDelete, onClick, autoSize, uid, @@ -94,6 +94,11 @@ const SingleImage: React.FC = (props) => { const handleOnLoad = React.useCallback(async () => {}, []); + const handleOnDelete = (uid: number, e: any) => { + e.stopPropagation(); + onDelete(uid); + }; + const renderProgress = () => { = (props) => { {editable && ( - handleOnDelete(uid)}> + handleOnDelete(uid, e)}> )} diff --git a/src/components/icon-font/index.tsx b/src/components/icon-font/index.tsx index 7f9d7cd4..707caef1 100644 --- a/src/components/icon-font/index.tsx +++ b/src/components/icon-font/index.tsx @@ -2,7 +2,7 @@ import { createFromIconfontCN } from '@ant-design/icons'; // import './iconfont/iconfont.js'; const IconFont = createFromIconfontCN({ - scriptUrl: '//at.alicdn.com/t/c/font_4613488_vh4wbvsrmif.js' + scriptUrl: '//at.alicdn.com/t/c/font_4613488_ifwyia863k.js' }); export default IconFont; diff --git a/src/locales/en-US/accesses.ts b/src/locales/en-US/accesses.ts index a5a21787..18c5f876 100644 --- a/src/locales/en-US/accesses.ts +++ b/src/locales/en-US/accesses.ts @@ -3,5 +3,23 @@ export default { 'accesses.button.add': 'Add Access', 'accesses.table.accessPoints': 'Access Points', 'accesses.table.traffic': 'Traffic Share', - 'accesses.table.setAsFallback': 'Set as Fallback' + 'accesses.table.setAsFallback': 'Set as Fallback', + 'accesses.form.endpoint.title': 'Endpoints', + 'accesses.form.endpoint.add': 'Add Endpoint', + 'accesses.form.endpoint.fallback': 'Fallback Endpoint', + 'accesses.form.endpoint.weight': 'Weight', + 'accesses.form.endpoint.model': 'Model', + 'accesses.form.metadata.title': 'Metadata', + 'accesses.form.metadata.add': 'Add Metadata', + 'accesses.table.label.fallback': 'Fallback', + 'accesses.form.metadata.size': 'Size', + 'accesses.form.metadata.activeSize': 'Active Size', + 'accesses.form.metadata.tags': 'Tags', + 'accesses.form.metadata.maxTokens': 'Max Tokens', + 'accesses.form.metadata.dimension': 'Dimensions', + 'accesses.form.metadata.license': 'Licenses', + 'accesses.form.metadata.releaseDate': 'Release Date', + 'accesses.form.metadata.languages': 'Languages', + 'accesses.form.metadata.icons': 'Icon', + 'accesses.form.metadata.uploadIcon': 'Upload Icon' }; diff --git a/src/locales/ja-JP/accesses.ts b/src/locales/ja-JP/accesses.ts index a5a21787..18c5f876 100644 --- a/src/locales/ja-JP/accesses.ts +++ b/src/locales/ja-JP/accesses.ts @@ -3,5 +3,23 @@ export default { 'accesses.button.add': 'Add Access', 'accesses.table.accessPoints': 'Access Points', 'accesses.table.traffic': 'Traffic Share', - 'accesses.table.setAsFallback': 'Set as Fallback' + 'accesses.table.setAsFallback': 'Set as Fallback', + 'accesses.form.endpoint.title': 'Endpoints', + 'accesses.form.endpoint.add': 'Add Endpoint', + 'accesses.form.endpoint.fallback': 'Fallback Endpoint', + 'accesses.form.endpoint.weight': 'Weight', + 'accesses.form.endpoint.model': 'Model', + 'accesses.form.metadata.title': 'Metadata', + 'accesses.form.metadata.add': 'Add Metadata', + 'accesses.table.label.fallback': 'Fallback', + 'accesses.form.metadata.size': 'Size', + 'accesses.form.metadata.activeSize': 'Active Size', + 'accesses.form.metadata.tags': 'Tags', + 'accesses.form.metadata.maxTokens': 'Max Tokens', + 'accesses.form.metadata.dimension': 'Dimensions', + 'accesses.form.metadata.license': 'Licenses', + 'accesses.form.metadata.releaseDate': 'Release Date', + 'accesses.form.metadata.languages': 'Languages', + 'accesses.form.metadata.icons': 'Icon', + 'accesses.form.metadata.uploadIcon': 'Upload Icon' }; diff --git a/src/locales/ru-RU/accesses.ts b/src/locales/ru-RU/accesses.ts index a5a21787..18c5f876 100644 --- a/src/locales/ru-RU/accesses.ts +++ b/src/locales/ru-RU/accesses.ts @@ -3,5 +3,23 @@ export default { 'accesses.button.add': 'Add Access', 'accesses.table.accessPoints': 'Access Points', 'accesses.table.traffic': 'Traffic Share', - 'accesses.table.setAsFallback': 'Set as Fallback' + 'accesses.table.setAsFallback': 'Set as Fallback', + 'accesses.form.endpoint.title': 'Endpoints', + 'accesses.form.endpoint.add': 'Add Endpoint', + 'accesses.form.endpoint.fallback': 'Fallback Endpoint', + 'accesses.form.endpoint.weight': 'Weight', + 'accesses.form.endpoint.model': 'Model', + 'accesses.form.metadata.title': 'Metadata', + 'accesses.form.metadata.add': 'Add Metadata', + 'accesses.table.label.fallback': 'Fallback', + 'accesses.form.metadata.size': 'Size', + 'accesses.form.metadata.activeSize': 'Active Size', + 'accesses.form.metadata.tags': 'Tags', + 'accesses.form.metadata.maxTokens': 'Max Tokens', + 'accesses.form.metadata.dimension': 'Dimensions', + 'accesses.form.metadata.license': 'Licenses', + 'accesses.form.metadata.releaseDate': 'Release Date', + 'accesses.form.metadata.languages': 'Languages', + 'accesses.form.metadata.icons': 'Icon', + 'accesses.form.metadata.uploadIcon': 'Upload Icon' }; diff --git a/src/locales/zh-CN/accesses.ts b/src/locales/zh-CN/accesses.ts index 7ea3a4a0..4e67a05d 100644 --- a/src/locales/zh-CN/accesses.ts +++ b/src/locales/zh-CN/accesses.ts @@ -3,5 +3,23 @@ export default { 'accesses.button.add': '添加接入', 'accesses.table.accessPoints': '接入点', 'accesses.table.traffic': '流量', - 'accesses.table.setAsFallback': '降级' + 'accesses.table.setAsFallback': '降级', + 'accesses.form.endpoint.title': '接入点', + 'accesses.form.endpoint.add': '添加接入点', + 'accesses.form.endpoint.fallback': '降级接入点', + 'accesses.form.endpoint.weight': '权重', + 'accesses.form.endpoint.model': '模型', + 'accesses.form.metadata.title': '元数据', + 'accesses.form.metadata.add': '添加元数据', + 'accesses.table.label.fallback': '降级', + 'accesses.form.metadata.size': '参数量', + 'accesses.form.metadata.activeSize': '激活参数量', + 'accesses.form.metadata.tags': '标签', + 'accesses.form.metadata.maxTokens': '最大上下文长度', + 'accesses.form.metadata.dimension': '维度', + 'accesses.form.metadata.license': '许可证', + 'accesses.form.metadata.releaseDate': '发布日期', + 'accesses.form.metadata.languages': '语言', + 'accesses.form.metadata.icons': '图标', + 'accesses.form.metadata.uploadIcon': '上传图标' }; diff --git a/src/pages/model-access/components/access-points.tsx b/src/pages/model-access/components/access-points.tsx index 6d5cb023..02d155c2 100644 --- a/src/pages/model-access/components/access-points.tsx +++ b/src/pages/model-access/components/access-points.tsx @@ -4,12 +4,12 @@ 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, Tag } from 'antd'; +import { useIntl } from '@umijs/max'; +import { Col, Row } from 'antd'; import dayjs from 'dayjs'; import React from 'react'; import styled from 'styled-components'; import { mockAccessPointList } from '../config/mock'; - const CellContent = styled.div` display: flex; align-items: center; @@ -50,6 +50,7 @@ export const childActionList = [ ]; const AccessItem: React.FC = ({ onSelect, data }) => { + const intl = useIntl(); return (
@@ -64,25 +65,19 @@ const AccessItem: React.FC = ({ onSelect, data }) => { - - Weight: 20 + + {data.weight && ( + + {intl.formatMessage({ id: 'accesses.form.endpoint.weight' })}: + 20 / + + )} {data.is_fallback && ( - - Fallback - + + {intl.formatMessage({ + id: 'accesses.table.label.fallback' + })} + )} diff --git a/src/pages/model-access/forms/basic.tsx b/src/pages/model-access/forms/basic.tsx index 434f3e6c..261083c7 100644 --- a/src/pages/model-access/forms/basic.tsx +++ b/src/pages/model-access/forms/basic.tsx @@ -11,12 +11,21 @@ const Basic = () => { return ( <> - + - + (value ? [value] : [])} + getValueProps={(value) => ({ + value: Array.isArray(value) ? value[0] : value + })} + > diff --git a/src/pages/model-access/forms/endpoints.tsx b/src/pages/model-access/forms/endpoints.tsx index d4e72445..4d6afffc 100644 --- a/src/pages/model-access/forms/endpoints.tsx +++ b/src/pages/model-access/forms/endpoints.tsx @@ -3,8 +3,7 @@ import MetadataList from '@/components/metadata-list'; import SealCascader from '@/components/seal-form/seal-cascader'; import SealInput from '@/components/seal-form/seal-input'; import { useIntl } from '@umijs/max'; -import { Checkbox, Form } from 'antd'; -import { Tooltip } from 'antd/lib'; +import { Form } from 'antd'; import _ from 'lodash'; import { useState } from 'react'; import { FormData } from '../config/types'; @@ -151,9 +150,14 @@ const Endpoints = () => { ]} > @@ -170,27 +174,43 @@ const Endpoints = () => { } }} maxTagCount={1} - placeholder="provider/model" + placeholder={intl.formatMessage({ + id: 'accesses.form.endpoint.model' + })} options={providerModelList} showCheckedStrategy="SHOW_CHILD" getPopupContainer={(triggerNode) => triggerNode.parentNode} > : - - handleFallbackChange(e, index)} - style={{ marginLeft: 12, marginRight: 4 }} - > - )} + + triggerNode.parentNode} + > + ); diff --git a/src/pages/model-access/forms/fallback-settings.tsx b/src/pages/model-access/forms/fallback-settings.tsx deleted file mode 100644 index d2ecdce1..00000000 --- a/src/pages/model-access/forms/fallback-settings.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import SealInput from '@/components/seal-form/seal-input'; -import { Checkbox, Form, Typography } from 'antd'; - -const FallbackSettings: React.FC<{ - currentData?: any; - onFinish: (data: any) => void; -}> = ({ currentData, onFinish }) => { - const [form] = Form.useForm(); - - return ( -
- - - - - - - - - - - - Fallback Status - - - -
- ); -}; -export default FallbackSettings; diff --git a/src/pages/model-access/forms/index.tsx b/src/pages/model-access/forms/index.tsx index fa0f5463..681ab337 100644 --- a/src/pages/model-access/forms/index.tsx +++ b/src/pages/model-access/forms/index.tsx @@ -36,20 +36,20 @@ const AccessForm: React.FC = forwardRef((props, ref) => { const segmentOptions = [ { value: TABKeysMap.BASIC, - label: 'Basic', + label: intl.formatMessage({ id: 'common.title.basicInfo' }), icon: , field: 'name' }, { value: TABKeysMap.METADATA, - label: 'Metadata', - icon: , - field: 'metadata' + label: intl.formatMessage({ id: 'accesses.form.metadata.title' }), + icon: , + field: 'metaSize' }, { value: TABKeysMap.ENDPOINTS, - label: 'Endpoints', - icon: , + label: intl.formatMessage({ id: 'accesses.form.endpoint.title' }), + icon: , field: 'endpoints' } ]; @@ -88,7 +88,12 @@ const AccessForm: React.FC = forwardRef((props, ref) => { form={form} onFinish={onFinish} initialValues={{ - categories: [] + categories: [], + meta: { + size: null, + activated_size: null, + dimensions: null + } }} > @@ -99,13 +104,13 @@ const AccessForm: React.FC = forwardRef((props, ref) => { items={[ { key: TABKeysMap.METADATA, - label: 'Metadata', + label: intl.formatMessage({ id: 'accesses.form.metadata.title' }), forceRender: true, children: }, { key: TABKeysMap.ENDPOINTS, - label: 'Endpoints', + label: intl.formatMessage({ id: 'accesses.form.endpoint.title' }), forceRender: true, children: } diff --git a/src/pages/model-access/forms/meta-data.tsx b/src/pages/model-access/forms/meta-data.tsx index 0c711743..1048b0c3 100644 --- a/src/pages/model-access/forms/meta-data.tsx +++ b/src/pages/model-access/forms/meta-data.tsx @@ -1,71 +1,175 @@ -import LabelSelector from '@/components/label-selector'; -import { LabelSelectorContext } from '@/components/label-selector/context'; +import SingleImage from '@/components/auto-image/single-image'; +import ListInput from '@/components/list-input'; +import SealInputNumber from '@/components/seal-form/input-number'; +import SealInput from '@/components/seal-form/seal-input'; +import UploadImg from '@/pages/playground/components/upload-img'; import { useIntl } from '@umijs/max'; -import { Form } from 'antd'; -import _ from 'lodash'; +import { Button, Form } from 'antd'; +import styled from 'styled-components'; import { FormData } from '../config/types'; +const SizeWrapper = styled.div` + display: grid; + grid-template-columns: repeat(2, 1fr); + column-gap: 16px; +`; + +const UploadWrapper = styled.div` + display: flex; + align-items: center; + justify-content: center; +`; + +const IconBox = styled.div` + display: flex; + flex-direction: column; + gap: 8px; + padding: 14px; + border: 1px solid var(--ant-color-border); + border-radius: var(--ant-border-radius); + .icon { + color: var(--ant-color-text-tertiary); + font-size: 14px; + line-height: 1; + } +`; + const MetaData = () => { const intl = useIntl(); const form = Form.useFormInstance(); - const metadata = Form.useWatch('meta', form); + const icon = Form.useWatch(['meta', 'icon'], form); const handleMetadataChange = (labels: Record) => { form.setFieldValue('meta', labels); }; + const handleUpdateImageList = (fileList: any[]) => { + console.log('fileList', fileList); + if (fileList.length === 0) { + return; + } + form.setFieldValue(['meta', 'icon'], fileList[0]?.dataUrl || null); + }; + + const handleDeleteIcon = () => { + form.setFieldValue(['meta', 'icon'], null); + }; + return ( <> - - ({ - validator(rule, value) { - if (_.keys(value).length > 0) { - if (_.some(_.keys(value), (k: string) => !value[k])) { - return Promise.reject( - intl.formatMessage( - { - id: 'common.validate.value' - }, - { - name: intl.formatMessage({ - id: 'models.form.selector' - }) - } - ) - ); - } - } - return Promise.resolve(); - } - }) - ]} + + + data-field="metaSize" + name={['meta', 'size']} + normalize={(v) => (v === 0 ? null : v)} > - + - + + name={['meta', 'activated_size']} + normalize={(v) => (v === 0 ? null : v)} + > + + + + + name={['meta', 'max_tokens']}> + + + + name={['meta', 'dimensions']} + normalize={(v) => (v === 0 ? null : v)} + > + + + + name={['meta', 'release_date']}> + + + name={['meta', 'tags']} data-field="metadata"> + + + name={['meta', 'licenses']} data-field="metadata"> + + + name={['meta', 'languages']} data-field="metadata"> + + + name={['meta', 'icon']} data-field="metadata"> + + + {intl.formatMessage({ id: 'accesses.form.metadata.icons' })} + + + + {icon ? ( + + ) : ( + + )} + + + + ); }; diff --git a/src/pages/model-access/hooks/use-fallback-settings.ts b/src/pages/model-access/hooks/use-fallback-settings.ts deleted file mode 100644 index f4b45292..00000000 --- a/src/pages/model-access/hooks/use-fallback-settings.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { PageAction } from '@/config'; -import { PageActionType } from '@/config/types'; -import { useState } from 'react'; -import { AccessItem as ListItem } from '../config/types'; - -const useFallbackSettings = (options?: { refresh: () => void }) => { - const [openModalStatus, setOpenModalStatus] = useState<{ - open: boolean; - action: PageActionType; - currentData?: ListItem; - title: string; - }>({ - open: false, - action: PageAction.CREATE, - currentData: undefined, - title: '' - }); - - const openModal = ( - action: PageActionType, - title: string, - currentData?: ListItem - ) => { - setOpenModalStatus({ - open: true, - action, - currentData, - title: title - }); - }; - - const closeModal = () => { - setOpenModalStatus({ - open: false, - action: PageAction.CREATE, - currentData: undefined, - title: '' - }); - }; - - return { - openFallbackSettingsModalStatus: openModalStatus, - setOpenFallbackSettingsModalStatus: setOpenModalStatus, - openFallbackSettingsModal: openModal, - closeFallbackSettingsModal: closeModal - }; -}; - -export default useFallbackSettings;