root/gpustack-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(style): adjust ui

Browse Source
This commit is contained in:
jialin
2026-02-10 17:29:57 +08:00
parent 15d635322b
commit 35ae7b9643
19 changed files with 115 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/locales/en-US/models.ts
+2 -2
View File
@@ -90,11 +90,11 @@ export default {
'models.form.backend.llamabox':
'For GGUF format models, supports Linux, macOS, and Windows.',
'models.form.backend.vllm':
'Built-in support for NVIDIA, AMD, Ascend, Hygon, Iluvatar, and MetaX devices.',
'Built-in support for NVIDIA, AMD, Ascend, Hygon, Moore Threads, Iluvatar, MetaX, T-Head PPU devices.',
'models.form.backend.voxbox': 'Only supports NVIDIA GPUs and CPUs.',
'models.form.backend.mindie': 'Only supports Ascend NPUs.',
'models.form.backend.sglang':
'Built-in support for NVIDIA/AMD GPUs and Ascend NPUs.',
'Built-in support for NVIDIA, AMD, Ascend, Moore Threads, MetaX, T-Head PPU devices.',
'models.form.search.gguftips':
'If using macOS or Windows as a worker, check GGUF (uncheck for audio models).',
'models.form.button.addlabel': 'Add Label',
src/locales/en-US/routes.ts
+3 -1
View File
@@ -23,5 +23,7 @@ export default {
'routes.form.metadata.icons': 'Icon',
'routes.form.metadata.uploadIcon': 'Upload Icon',
'routes.form.fallback.warning':
'Changes to fallback route target take effect after one minute.'
'Changes to fallback route target take effect after one minute.',
'routes.form.weight.tips':
'Default weight is 100. A higher value means higher priority.'
};
src/locales/ja-JP/models.ts
+4 -4
View File
@@ -91,11 +91,11 @@ export default {
'models.form.backend.llamabox':
'GGUF形式のモデル用（Linux、macOS、Windowsをサポート）。',
'models.form.backend.vllm':
'Built-in support for NVIDIA, AMD, Ascend, Hygon, Iluvatar, and MetaX devices.',
'Built-in support for NVIDIA, AMD, Ascend, Hygon, Moore Threads, Iluvatar, MetaX, T-Head PPU devices.',
'models.form.backend.voxbox': 'Only supports NVIDIA GPUs and CPUs.',
'models.form.backend.mindie': 'Only supports Ascend NPUs.',
'models.form.backend.sglang':
'Built-in support for NVIDIA/AMD GPUs and Ascend NPUs.',
'Built-in support for NVIDIA, AMD, Ascend, Moore Threads, MetaX, T-Head PPU devices.',
'models.form.search.gguftips':
'macOSまたはWindowsをワーカーとして使用する場合、GGUFをチェックしてください（音声モデルの場合はオフにしてください）。',
'models.form.button.addlabel': 'ラベルを追加',
@@ -357,10 +357,10 @@ export default {
// 55. 'models.form.generic_proxy.button': 'Generic Proxy',
// 56. 'models.accessControlModal.includeusers': 'Include Users',
// 57. 'models.table.genericProxy': 'Use the following path prefix, and set the model name in either the <span class="bold-text">X-GPUStack-Model</span> request header or the model field in the request body. All requests under this path prefix will be forwarded to the inference backend.'
// 58. 'models.form.backend.vllm': 'Built-in support for NVIDIA, AMD, Ascend, Hygon, Iluvatar, and MetaX devices.',
// 58. 'models.form.backend.vllm': 'Built-in support for NVIDIA, AMD, Ascend, Hygon, Moore Threads, Iluvatar, MetaX, T-Head PPU devices.',
// 59. 'models.form.backend.voxbox': 'Only supports NVIDIA GPUs and CPUs.',
// 60. models.form.backend.mindie': 'Only supports Ascend NPUs.',
// 61. 'models.form.backend.sglang': 'Built-in support for NVIDIA/AMD GPUs and Ascend NPUs.',
// 61. 'models.form.backend.sglang': 'Built-in support for NVIDIA, AMD, Ascend, Moore Threads, MetaX, T-Head PPU devices.',
// 62. 'models.form.backend_parameters.vllm.tips': 'For more details about {backend} parameters, see <a href={link} target="_blank">here</a>.',
// 63. 'models.button.accessSettings.tips': 'Changes to access settings take effect after one minute.',
// 64. 'models.table.userSelection.tips': 'Admin users can access all models by default.',
src/locales/ja-JP/routes.ts
+3 -1
View File
@@ -23,5 +23,7 @@ export default {
'routes.form.metadata.icons': 'Icon',
'routes.form.metadata.uploadIcon': 'Upload Icon',
'routes.form.fallback.warning':
'Changes to fallback route target take effect after one minute.'
'Changes to fallback route target take effect after one minute.',
'routes.form.weight.tips':
'Default weight is 100. A higher value means higher priority.'
};
src/locales/ru-RU/models.ts
+4 -2
View File
@@ -92,11 +92,11 @@ export default {
'models.form.backend.llamabox':
'Для моделей формата GGUF. Поддержка Linux, macOS и Windows.',
'models.form.backend.vllm':
'Встроенная поддержка устройств NVIDIA, AMD, Ascend, Hygon, Iluvatar и MetaX.',
'Built-in support for NVIDIA, AMD, Ascend, Hygon, Moore Threads, Iluvatar, MetaX, T-Head PPU devices.',
'models.form.backend.voxbox': 'Поддерживает только GPU NVIDIA и CPU.',
'models.form.backend.mindie': 'Поддерживает только Ascend NPU.',
'models.form.backend.sglang':
'Встроенная поддержка GPU NVIDIA/AMD и Ascend NPU.',
'Built-in support for NVIDIA, AMD, Ascend, Moore Threads, MetaX, T-Head PPU devices.',
'models.form.search.gguftips':
'Для воркеров на macOS/Windows отметьте GGUF (для аудиомоделей снимите).',
'models.form.button.addlabel': 'Добавить метку',
@@ -292,4 +292,6 @@ export default {
// 3. 'models.table.instance.benchmark': 'Run Benchmark'
// 2. 'models.form.enableModelRoute': 'Enable Model Route',
// 3. 'models.form.enableModelRoute.tips': 'Enable Model Route',
// 4. 'models.form.backend.vllm': 'Built-in support for NVIDIA, AMD, Ascend, Hygon, Moore Threads, Iluvatar, MetaX, T-Head PPU devices.',
// 5. 'models.form.backend.sglang': 'Built-in support for NVIDIA, AMD, Ascend, Moore Threads, MetaX, T-Head PPU devices.',
// ========== End of To-Do List ==========
src/locales/ru-RU/routes.ts
+3 -1
View File
@@ -23,5 +23,7 @@ export default {
'routes.form.metadata.icons': 'Icon',
'routes.form.metadata.uploadIcon': 'Upload Icon',
'routes.form.fallback.warning':
'Changes to fallback route target take effect after one minute.'
'Changes to fallback route target take effect after one minute.',
'routes.form.weight.tips':
'Default weight is 100. A higher value means higher priority.'
};
src/locales/zh-CN/models.ts
+3 -2
View File
@@ -89,10 +89,11 @@ export default {
'models.form.backend.llamabox':
'用于 GGUF 格式模型，支持 Linux, macOS 和 Windows。',
'models.form.backend.vllm':
'内置支持 NVIDIA、AMD、昇腾、海光、天数智芯和沐曦设备。',
'内置支持 NVIDIA、AMD、昇腾、海光、摩尔线程、天数智芯、沐曦和平头哥 PPU 设备。',
'models.form.backend.voxbox': '仅支持 NVIDIA GPU 和 CPU。',
'models.form.backend.mindie': '仅支持昇腾 NPU。',
'models.form.backend.sglang': '内置支持 NVIDIA/AMD GPU 和昇腾 NPU。',
'models.form.backend.sglang':
'内置支持 NVIDIA、AMD、昇腾、摩尔线程、沐曦和平头哥 PPU 设备。',
'models.form.search.gguftips':
'当 macOS 或 Windows 作节点时勾选 GGUF（搜索语音模型时取消勾选）',
'models.form.button.addlabel': '添加标签',
src/locales/zh-CN/routes.ts
+2 -1
View File
@@ -22,5 +22,6 @@ export default {
'routes.form.metadata.languages': '语言',
'routes.form.metadata.icons': '图标',
'routes.form.metadata.uploadIcon': '上传图标',
'routes.form.fallback.warning': 'Fallback 路由目标的更改将在一分钟后生效。'
'routes.form.fallback.warning': 'Fallback 路由目标的更改将在一分钟后生效。',
'routes.form.weight.tips': '权重默认值为 100，数值越大，优先级越高。'
};
src/pages/_components/doc-link.tsx
+38
View File
@@ -0,0 +1,38 @@
import IconFont from '@/components/icon-font';
import { useIntl } from '@umijs/max';
import { Button } from 'antd';
import React from 'react';
import styled from 'styled-components';
const Wrapper = styled.div`
display: flex;
align-items: center;
flex-wrap: wrap;
.title {
margin-right: 8px;
}
`;
const DocLink: React.FC<{
link: string;
title?: React.ReactNode;
}> = ({ link, title }) => {
const intl = useIntl();
return (
<Wrapper>
{title && <span className="title">{title}</span>}
<Button
size="small"
type="link"
target="_blank"
href={link}
style={{ padding: 0 }}
>
{intl.formatMessage({ id: 'playground.audio.enablemic.doc' })}
<IconFont type="icon-external-link" className="font-size-14"></IconFont>
</Button>
</Wrapper>
);
};
export default DocLink;
src/pages/llmodels/config/index.ts
+1 -1
View File
@@ -418,7 +418,7 @@ export const getBackendParamsTips = (backend: string) => {
return {
backend: 'Ascend MindIE',
releases: '',
link: 'http://docs.gpustack.ai/latest/user-guide/inference-backends/#parameters-reference_2',
link: 'https://docs.gpustack.ai/latest/user-guide/built-in-inference-backends/?h=parameters+reference#parameters-reference_2',
version: '1.0.0'
};
}
src/pages/llmodels/forms/advance-config.tsx
+10 -3
View File
@@ -2,6 +2,8 @@ import LabelSelector from '@/components/label-selector';
import CheckboxField from '@/components/seal-form/checkbox-field';
import SealSelect from '@/components/seal-form/seal-select';
import { PageAction } from '@/config';
import DocLink from '@/pages/_components/doc-link';
import { genericReferLink } from '@/pages/model-routes/config';
import { useIntl } from '@umijs/max';
import { Form } from 'antd';
import _ from 'lodash';
@@ -156,9 +158,14 @@ const AdvanceConfig = () => {
style={{ marginBottom: 8 }}
>
<CheckboxField
description={intl.formatMessage({
id: 'models.form.generic_proxy.tips'
})}
description={
<DocLink
title={intl.formatMessage({
id: 'models.form.generic_proxy.tips'
})}
link={genericReferLink}
></DocLink>
}
label={intl.formatMessage({
id: 'models.form.generic_proxy'
})}
src/pages/llmodels/forms/backend-parameters-list.tsx
-5
View File
@@ -59,11 +59,6 @@ const BackendParametersList: React.FC = () => {
description={
backendParamsTips.link && (
<span>
{backend === backendOptionsMap.ascendMindie && (
<span>
{intl.formatMessage({ id: 'models.backend.mindie.310p' })}
</span>
)}
<span
style={{
marginLeft: backend === backendOptionsMap.ascendMindie ? 4 : 0
src/pages/llmodels/forms/basic.tsx
+2 -2
View File
@@ -2,7 +2,7 @@ import AutoTooltip from '@/components/auto-tooltip';
import SealInput from '@/components/seal-form/seal-input';
import SealSelect from '@/components/seal-form/seal-select';
import { modelNameReg, PageAction } from '@/config';
import { GPUSTACK_API_BASE_URL } from '@/config/settings';
import { OPENAI_COMPATIBLE } from '@/config/settings';
import useAppUtils from '@/hooks/use-app-utils';
import {
ClusterStatusLabelMap,
@@ -248,7 +248,7 @@ const BasicForm: React.FC<BasicFormProps> = (props) => {
required
description={intl.formatMessage(
{ id: 'models.form.replicas.tips' },
{ api: `${window.location.origin}/${GPUSTACK_API_BASE_URL}` }
{ api: `${window.location.origin}/${OPENAI_COMPATIBLE}` }
)}
min={0}
></SealInput.Number>
src/pages/maas-provider/config/index.ts
+3
View File
@@ -44,3 +44,6 @@ export const rowActionList = [
}
}
];
export const referLinkZh = `https://higress.cn/docs/latest/plugins/ai/api-provider/ai-proxy/?spm=36971b57.3562eb7c.0.0.31764f5f7uLs2F#%E6%8F%90%E4%BE%9B%E5%95%86%E7%89%B9%E6%9C%89%E9%85%8D%E7%BD%AE`;
export const referLinkEn = `https://higress.cn/en/docs/latest/plugins/ai/api-provider/ai-proxy/?spm=36971b57.4a688c53.0.0.64ac436ewz1xGA`;
src/pages/maas-provider/forms/advance-config.tsx
+1 -3
View File
@@ -5,12 +5,10 @@ import YamlEditor from '@/pages/_components/yaml-editor';
import { useIntl } from '@umijs/max';
import { Button, Form } from 'antd';
import React, { forwardRef, useImperativeHandle } from 'react';
import { referLinkEn, referLinkZh } from '../config';
import APIKeys from './api-keys';
import ProxyConfig from './proxy-config';
const referLinkZh = `https://higress.cn/docs/latest/plugins/ai/api-provider/ai-proxy/?spm=36971b57.3562eb7c.0.0.31764f5f7uLs2F#%E6%8F%90%E4%BE%9B%E5%95%86%E7%89%B9%E6%9C%89%E9%85%8D%E7%BD%AE`;
const referLinkEn = `https://higress.cn/en/docs/latest/plugins/ai/api-provider/ai-proxy/?spm=36971b57.4a688c53.0.0.64ac436ewz1xGA`;
const AdvanceConfig: React.FC<{
action: PageActionType;
ref?: any;
src/pages/model-routes/config/index.ts
+2
View File
@@ -48,3 +48,5 @@ export const rowActionList = [
}
}
];
export const genericReferLink = `https://docs.gpustack.ai/latest/user-guide/model-deployment-management/#enable-generic-proxy`;
src/pages/model-routes/forms/basic.tsx
+10 -3
View File
@@ -2,9 +2,11 @@ import CheckboxField from '@/components/seal-form/checkbox-field';
import SealInput from '@/components/seal-form/seal-input';
import useAppUtils from '@/hooks/use-app-utils';
import CategorySelect from '@/pages/_components/category-select';
import DocLink from '@/pages/_components/doc-link';
import { categoryOptions } from '@/pages/llmodels/config';
import { useIntl } from '@umijs/max';
import { Form } from 'antd';
import { genericReferLink } from '../config';
import { FormData } from '../config/types';
const Basic = () => {
@@ -61,9 +63,14 @@ const Basic = () => {
style={{ marginBottom: 8 }}
>
<CheckboxField
description={intl.formatMessage({
id: 'models.form.generic_proxy.tips'
})}
description={
<DocLink
title={intl.formatMessage({
id: 'models.form.generic_proxy.tips'
})}
link={genericReferLink}
></DocLink>
}
label={intl.formatMessage({
id: 'models.form.generic_proxy'
})}
src/pages/model-routes/forms/index.tsx
+14 -2
View File
@@ -4,8 +4,9 @@ import { PageActionType } from '@/config/types';
import CollapsePanel from '@/pages/_components/collapse-panel';
import { useWrapperContext } from '@/pages/_components/column-wrapper/use-wrapper-context';
import ScrollSpyTabs from '@/pages/_components/scroll-spy-tabs';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Form } from 'antd';
import { Flex, Form, Tooltip } from 'antd';
import _ from 'lodash';
import {
forwardRef,
@@ -194,7 +195,18 @@ const AccessForm: React.FC<ProviderFormProps> = forwardRef((props, ref) => {
items={[
{
key: TABKeysMap.TARGETS,
label: intl.formatMessage({ id: 'routes.form.target.title' }),
label: (
<Flex gap={4} align="center">
{intl.formatMessage({ id: 'routes.form.target.title' })}
<Tooltip
title={intl.formatMessage({
id: 'routes.form.weight.tips'
})}
>
<QuestionCircleOutlined />
</Tooltip>
</Flex>
),
forceRender: true,
children: <Targets ref={targetsRef}></Targets>
}
src/pages/model-routes/forms/targets.tsx
+10 -10
View File
@@ -216,22 +216,22 @@ const TargetsForm = forwardRef((props, ref) => {
if (data.providerType === 'deployments') {
return (
<AutoTooltip ghost maxWidth={140}>
<OptionWrapper>
<ProviderLogo provider={data.providerType as string} />
<OptionWrapper>
<ProviderLogo provider={data.providerType as string} />
<AutoTooltip ghost maxWidth={105}>
{intl.formatMessage({ id: 'menu.models.deployment' })}
</OptionWrapper>
</AutoTooltip>
</AutoTooltip>
</OptionWrapper>
);
}
return (
<AutoTooltip ghost maxWidth={140}>
<OptionWrapper>
<ProviderLogo provider={data.providerType as string} />
<OptionWrapper>
<ProviderLogo provider={data.providerType as string} />
<AutoTooltip ghost maxWidth={105}>
<span>{data.label}</span>
</OptionWrapper>
</AutoTooltip>
</AutoTooltip>
</OptionWrapper>
);
};