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

style: command viewer scroller

Browse Source
This commit is contained in:
jialin
2026-01-07 15:55:26 +08:00
parent 8f9fae9210
commit bbf09c2ea9
21 changed files with 136 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/highlight-code/code-viewer-dark.tsx
+4 -1
View File
@@ -10,6 +10,7 @@ interface CodeViewerProps {
copyable?: boolean;
height?: string | number;
style?: React.CSSProperties;
xScrollable?: boolean;
}
const DarkViewer: React.FC<CodeViewerProps> = (props) => {
const {
@@ -19,7 +20,8 @@ const DarkViewer: React.FC<CodeViewerProps> = (props) => {
autodetect,
ignoreIllegals,
copyable,
height = 'auto'
height = 'auto',
xScrollable = false
} = props || {};
return (
@@ -33,6 +35,7 @@ const DarkViewer: React.FC<CodeViewerProps> = (props) => {
autodetect={autodetect}
ignoreIllegals={ignoreIllegals}
copyable={copyable}
xScrollable={xScrollable}
></CodeViewer>
);
};
src/components/highlight-code/code-viewer-light.tsx
+4 -1
View File
@@ -10,6 +10,7 @@ interface CodeViewerProps {
copyable?: boolean;
height?: string | number;
style?: React.CSSProperties;
xScrollable?: boolean;
}
const LightViewer: React.FC<CodeViewerProps> = (props) => {
const {
@@ -20,7 +21,8 @@ const LightViewer: React.FC<CodeViewerProps> = (props) => {
ignoreIllegals,
copyable,
style,
height = 'auto'
height = 'auto',
xScrollable = false
} = props || {};
return (
@@ -34,6 +36,7 @@ const LightViewer: React.FC<CodeViewerProps> = (props) => {
autodetect={autodetect}
ignoreIllegals={ignoreIllegals}
copyable={copyable}
xScrollable={xScrollable}
></CodeViewer>
);
};
src/components/highlight-code/code-viewer.tsx
+17 -3
View File
@@ -15,6 +15,7 @@ interface CodeViewerProps {
height?: string | number;
theme?: 'light' | 'dark';
style?: React.CSSProperties;
xScrollable?: boolean;
}
interface CodeHeaderProps {
@@ -43,6 +44,14 @@ const CodeHeaderWrapper = styled.div`
const Wrapper = styled.div`
border-radius: var(--border-radius-mini);
&:hover {
.custome-scrollbar {
&::-webkit-scrollbar-thumb {
background-color: var(--color-scrollbar-thumb);
border-radius: 4px;
}
}
}
`;
const CodeHeader: React.FC<CodeHeaderProps> = ({
@@ -80,7 +89,8 @@ const CodeViewer: React.FC<CodeViewerProps> = (props) => {
ignoreIllegals = true,
copyable = true,
height = 'auto',
style
style,
xScrollable = false
} = props || {};
const highlightedCode = useMemo(() => {
@@ -131,7 +141,8 @@ const CodeViewer: React.FC<CodeViewerProps> = (props) => {
'code-pre custome-scrollbar custom-scrollbar-horizontal ',
{
dark: props.theme === 'dark',
light: props.theme === 'light'
light: props.theme === 'light',
'x-scrollable': xScrollable
}
)}
style={{
@@ -141,7 +152,10 @@ const CodeViewer: React.FC<CodeViewerProps> = (props) => {
}}
>
<code
style={{ minHeight: height }}
style={{
minHeight: height,
...(xScrollable ? { width: 'max-content' } : {})
}}
className={classNames(highlightedCode.className, {
dark: props.theme === 'dark',
light: props.theme === 'light'
src/components/highlight-code/index.tsx
+5 -1
View File
@@ -10,6 +10,7 @@ const HighlightCode: React.FC<{
copyable?: boolean;
theme?: 'light' | 'dark';
fixedTheme?: 'light' | 'dark';
xScrollable?: boolean;
height?: string | number;
style?: React.CSSProperties;
copyValue?: string;
@@ -21,7 +22,8 @@ const HighlightCode: React.FC<{
lang = 'bash',
copyable = true,
theme,
height = 'auto'
height = 'auto',
xScrollable = false
} = props;
const { userSettings } = useUserSettings();
@@ -40,6 +42,7 @@ const HighlightCode: React.FC<{
copyValue={copyValue}
copyable={copyable}
height={height}
xScrollable={xScrollable}
style={style}
/>
) : (
@@ -50,6 +53,7 @@ const HighlightCode: React.FC<{
copyValue={copyValue}
copyable={copyable}
height={height}
xScrollable={xScrollable}
/>
)}
</div>
src/components/icon-font/index.tsx
+1 -1
View File
@@ -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_jo5x7z2z718.js'
scriptUrl: '//at.alicdn.com/t/c/font_4613488_rajpu0blzkp.js'
});
export default IconFont;
src/components/tags-wrapper/index.tsx
+2 -1
View File
@@ -120,6 +120,7 @@ const TagsWrapper: React.FC<TagsWrapperProps> = (props) => {
>
<Tag
className="more"
variant="outlined"
style={{ marginInline: hiddenIndices.end < 1 ? 0 : `${gap}px 0` }}
ref={moreBtnRef}
>
@@ -132,4 +133,4 @@ const TagsWrapper: React.FC<TagsWrapperProps> = (props) => {
);
};
export default React.memo(TagsWrapper);
export default TagsWrapper;
src/layouts/extraRender.tsx
+3 -5
View File
@@ -10,9 +10,7 @@ import {
DiscordOutlined,
GithubOutlined,
HomeOutlined,
LogoutOutlined,
ReadOutlined,
SettingOutlined
ReadOutlined
} from '@ant-design/icons';
import { history, useIntl, useNavigate } from '@umijs/max';
import { Avatar, Button, Divider, Modal } from 'antd';
@@ -235,7 +233,7 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
key: 'settings',
label: (
<span className="flex flex-center">
<SettingOutlined />
<IconFont type="icon-settings-02" />
<span className="m-l-8" style={{ marginLeft: 8 }}>
{intl?.formatMessage?.({ id: 'common.button.settings' })}
</span>
@@ -270,7 +268,7 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
{originNode}
<Divider style={{ marginBlock: 4 }} />
<CustomItem onClick={handleLogout} className="border-top">
<LogoutOutlined rotate={180} />
<IconFont type="icon-logout" style={{ fontSize: 17 }} />
<span>{intl?.formatMessage?.({ id: 'common.button.logout' })}</span>
</CustomItem>
</DropdownWrapper>
src/locales/en-US/clusters.ts
+4 -3
View File
@@ -28,7 +28,7 @@ export default {
'clusters.workerpool.volumes.add': 'Add Volume',
'clusters.create.provider.self': 'Self-Hosted',
'clusters.create.provider.cloud': 'Cloud Provider',
'clusters.create.selectProvider': 'Select Provider',
'clusters.create.steps.selectProvider': 'Select Provider',
'clusters.create.configBasic': 'Basic Configuration',
'clusters.create.execCommand': 'Execute Command',
'clusters.create.supportedGpu': 'Supported GPUs',
@@ -117,8 +117,9 @@ export default {
'clusters.form.setDefault': 'Set as Default',
'clusters.form.setDefault.tips': 'Default for deployment.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.create.complete.tips': 'Cluster created successfully!',
'clusters.create.complete': 'Completed',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
'clusters.create.dockerTips2':
'You can also skip this step and add them later from the cluster list.',
src/locales/ja-JP/clusters.ts
+9 -7
View File
@@ -28,7 +28,7 @@ export default {
'clusters.workerpool.volumes.add': 'Add Volume',
'clusters.create.provider.self': 'Self-Hosted',
'clusters.create.provider.cloud': 'Cloud Provider',
'clusters.create.selectProvider': 'Select Provider',
'clusters.create.steps.selectProvider': 'Select Provider',
'clusters.create.configBasic': 'Basic Configuration',
'clusters.create.execCommand': 'Execute Command',
'clusters.create.supportedGpu': 'Supported GPUs',
@@ -117,8 +117,9 @@ export default {
'clusters.form.setDefault': 'Set as Default',
'clusters.form.setDefault.tips': 'Default for deployment.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.create.complete.tips': 'Cluster created successfully!',
'clusters.create.complete': 'Completed',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
'clusters.create.dockerTips2':
'You can also skip this step and add them later from the cluster list.',
@@ -157,7 +158,7 @@ export default {
// 27. 'clusters.workerpool.volumes.add': 'Add Volume'
// 28. 'clusters.create.provider.self': 'Self-Hosted',
// 29. 'clusters.create.provider.cloud': 'Cloud Provider',
// 30. 'clusters.create.selectProvider': 'Select Provider',
// 30. 'clusters.create.steps.selectProvider': 'Select Provider',
// 31. 'clusters.create.configBasic': 'Basic Configuration',
// 32. 'clusters.create.execCommand': 'Execute Command',
// 33. 'clusters.create.supportedGpu': 'Supported GPUs',
@@ -219,10 +220,11 @@ export default {
// 85. 'clusters.addworker.enterWorkerAddress': 'Enter worker external address',
// 86. 'clusters.addworker.enterWorkerAddress.error': 'Please enter the worker external address.',
// 87. 'clusters.addworker.noClusters': 'No available clusters',
// 88. 'clusters.create.complete.tips': 'Cluster created successfully!',
// 89. 'clusters.create.complete': 'Completed',
// 88. 'clusters.create.steps.complete.tips': 'Cluster created successfully!',
// 89. 'clusters.create.steps.complete': 'Complete',
// 90. 'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
// 91. 'clusters.create.dockerTips2': 'You can also skip this step and add them later from the cluster list.',
// 92. 'clusters.create.k8sTips1': 'Next, register existing Kubernetes cluster.',
// 93. 'clusters.create.k8sTips2': 'You can also skip this step and register it later from the cluster list.'
// 93. 'clusters.create.k8sTips2': 'You can also skip this step and register it later from the cluster list.',
// 94. 'clusters.create.steps.configure': 'Configure',
// ========== End of To-Do List ==========
src/locales/ru-RU/clusters.ts
+8 -6
View File
@@ -28,7 +28,7 @@ export default {
'clusters.workerpool.volumes.add': 'Добавить том',
'clusters.create.provider.self': 'Самостоятельное размещение',
'clusters.create.provider.cloud': 'Облачный провайдер',
'clusters.create.selectProvider': 'Выберите провайдера',
'clusters.create.steps.selectProvider': 'Выберите провайдера',
'clusters.create.configBasic': 'Базовая конфигурация',
'clusters.create.execCommand': 'Выполнить команду',
'clusters.create.supportedGpu': 'Поддерживаемые GPU',
@@ -118,8 +118,9 @@ export default {
'clusters.form.setDefault.tips':
'Использовать по умолчанию для развертывания.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.create.complete.tips': 'Cluster created successfully!',
'clusters.create.complete': 'Completed',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
'clusters.create.dockerTips2':
'You can also skip this step and add them later from the cluster list.',
@@ -131,10 +132,11 @@ export default {
// ========== To-Do: Translate Keys (Remove After Translation) ==========
// 1. 'clusters.addworker.hygonNotes': `If <span class="bold-text">/opt/hyhal</span> or <span class="bold-text">/opt/dtk</span> does not exist, create symbolic links pointing to the corresponding Hygon installation paths, for example: <span class="desc-fill">ln -s /path/to/hyhal /opt/hyhal</span> <span class="desc-fill">ln -s /path/to/dtk /opt/dtk</span>.`,
// 2. 'clusters.addworker.noClusters': 'No available clusters',
// 3. 'clusters.create.complete.tips': 'Cluster created successfully!',
// 4. 'clusters.create.complete': 'Completed',
// 3. 'clusters.create.steps.complete.tips': 'Cluster created successfully!',
// 4. 'clusters.create.steps.complete': 'Complete',
// 5. 'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
// 6. 'clusters.create.dockerTips2': 'You can also skip this step and add them later from the cluster list.',
// 7. 'clusters.create.k8sTips1': 'Next, register existing Kubernetes cluster.',
// 8. 'clusters.create.k8sTips2': 'You can also skip this step and register it later from the cluster list.'
// 8. 'clusters.create.k8sTips2': 'You can also skip this step and register it later from the cluster list.',
// 9. 'clusters.create.steps.configure': 'Configure',
// ================================================================
src/locales/zh-CN/clusters.ts
+4 -3
View File
@@ -28,7 +28,7 @@ export default {
'clusters.workerpool.volumes.add': '添加存储卷',
'clusters.create.provider.self': '自建环境',
'clusters.create.provider.cloud': '云环境',
'clusters.create.selectProvider': '选择环境',
'clusters.create.steps.selectProvider': '选择环境',
'clusters.create.configBasic': '基本配置',
'clusters.create.execCommand': '执行命令',
'clusters.create.supportedGpu': '支持的 GPU',
@@ -114,8 +114,9 @@ export default {
'clusters.form.setDefault': '设为默认',
'clusters.form.setDefault.tips': '部署时的默认集群。',
'clusters.addworker.noClusters': '无可用集群',
'clusters.create.complete.tips': '集群创建成功！',
'clusters.create.complete': '完成',
'clusters.create.steps.complete.tips': '集群创建成功！',
'clusters.create.steps.complete': '完成',
'clusters.create.steps.configure': '配置',
'clusters.create.dockerTips1': '接下来，为该集群添加节点。',
'clusters.create.dockerTips2': '你也可以跳过此步骤，稍后在集群列表中添加。',
'clusters.create.k8sTips1': '接下来，注册已有的 Kubernetes 集群。',
src/pages/_components/collapse-panel/index.tsx
+11 -2
View File
@@ -13,7 +13,9 @@ const CollapseInner = styled(Collapse)`
border-radius: var(--border-radius-base) !important;
font-size: 14px !important;
font-weight: 600 !important;
background-color: var(--ant-color-fill-tertiary) !important;
&:hover {
background-color: var(--ant-color-fill-tertiary) !important;
}
}
.ant-collapse-body {
@@ -32,7 +34,8 @@ const CollapsePanel: React.FC<{
activeKey: string | string[];
accordion?: boolean;
onChange?: (key: string | string[]) => void;
}> = ({ items, activeKey, accordion, onChange }) => {
styles?: Record<string, React.CSSProperties>;
}> = ({ items, activeKey, accordion, onChange, styles }) => {
return (
<CollapseInner
expandIconPlacement="start"
@@ -42,6 +45,12 @@ const CollapsePanel: React.FC<{
activeKey={activeKey}
onChange={onChange}
destroyOnHidden={false}
styles={{
...styles,
header: {
backgroundColor: 'var(--ant-collapse-header-bg)'
}
}}
expandIcon={({ isActive }) => (
<IconFont
type="icon-down"
src/pages/_components/yaml-editor/index.tsx
+1 -1
View File
@@ -48,7 +48,7 @@ const Header = styled.div`
padding-inline: 10px;
font-size: 14px;
border-bottom: 1px solid var(--ant-color-border);
background-color: var(--ant-color-fill-tertiary);
background-color: var(--ant-color-fill-quaternary);
`;
interface ViewerProps {
src/pages/cluster-management/cluster-create.tsx
+6 -30
View File
@@ -1,9 +1,7 @@
import { clusterSessionAtom } from '@/atoms/clusters';
import { PageAction } from '@/config';
import { PageActionType } from '@/config/types';
import ColumnWrapper from '@/pages/_components/column-wrapper';
import { useIntl, useSearchParams } from '@umijs/max';
import { useAtom } from 'jotai';
import { useIntl } from '@umijs/max';
import _ from 'lodash';
import React, { useEffect, useMemo, useRef, useState } from 'react';
import styled from 'styled-components';
@@ -40,29 +38,20 @@ const Content = styled.div`
width: 100%;
`;
const StepsWrapper = styled.div`
width: 220px;
padding-inline: 24px;
padding-block: 16px;
border-right: 1px solid var(--ant-color-split);
`;
const MainWrapper = styled.div`
display: flex;
height: 100%;
`;
const ClusterCreate: React.FC<{
action: PageActionType;
setCurrentTitle?: (title: string) => void;
onClose?: () => void;
}> = ({ onClose }) => {
const intl = useIntl();
}> = ({ onClose, action, setCurrentTitle }) => {
const startStep = 0;
const stepList = useStepList();
const { systemConfig } = useSystemConfig();
const [searchParams] = useSearchParams();
const action =
(searchParams.get('action') as PageActionType) || PageAction.CREATE;
const [clusterSession, setClusterSession] = useAtom(clusterSessionAtom);
const intl = useIntl();
const [credentialList, setCredentialList] = useState<
Global.BaseOption<number, { provider: ProviderType }>[]
>([]);
@@ -85,7 +74,6 @@ const ClusterCreate: React.FC<{
const [formValues, setFormValues] = useState<Record<string, any>>({});
const [submitLoading, setSubmitLoading] = useState<boolean>(false);
const [isAddWorkerStep, setIsAddWorkerStep] = useState<boolean>(false);
const [isComplete, setIsComplete] = useState<boolean>(false);
const formRefs: Record<string, any> = {
[moduleMap.BasicForm]: useRef<any>(null),
@@ -240,6 +228,7 @@ const ClusterCreate: React.FC<{
// add worker or cluster registration step
const handleAddWorker = () => {
setIsAddWorkerStep(true);
setCurrentTitle?.(intl.formatMessage({ id: 'resources.button.create' }));
onNext();
};
@@ -301,7 +290,6 @@ const ClusterCreate: React.FC<{
const res = await createCluster({ data });
const info = await queryClusterToken({ id: res.id });
setSubmitLoading(false);
setIsComplete(true);
setRegistrationInfo({
...info,
cluster_id: res.id
@@ -320,11 +308,6 @@ const ClusterCreate: React.FC<{
return (
<MainWrapper>
{/* {!isAddWorkerStep && (
<StepsWrapper>
<ClusterSteps steps={steps} currentStep={currentStep}></ClusterSteps>
</StepsWrapper>
)} */}
<ColumnWrapper
styles={{
container: { paddingTop: 16, paddingBottom: 16 }
@@ -341,13 +324,6 @@ const ClusterCreate: React.FC<{
/>
}
>
{/* {!isComplete && (
<div style={{ marginBottom: 24 }}>
<Title level={5} style={{ marginBottom: 8, fontSize: 14 }}>
{steps[currentStep]?.subTitle || steps[currentStep]?.title}
</Title>
</div>
)} */}
{!isAddWorkerStep && (
<div style={{ marginBottom: 32 }}>
<ClusterSteps
src/pages/cluster-management/cluster-modal.tsx
+8 -2
View File
@@ -1,4 +1,5 @@
import GSDrawer from '@/components/scroller-modal/gs-drawer';
import { PageAction } from '@/config';
import React from 'react';
import ClusterCreate from './cluster-create';
@@ -13,13 +14,14 @@ const ClusterModal: React.FC<ClusterModalProps> = ({
onClose,
title
}) => {
const [currentTitle, setCurrentTitle] = React.useState<string>(title);
const handleCancel = () => {
onClose();
};
return (
<GSDrawer
title={title}
title={currentTitle}
open={open}
onClose={handleCancel}
destroyOnHidden={true}
@@ -34,7 +36,11 @@ const ClusterModal: React.FC<ClusterModalProps> = ({
}}
footer={false}
>
<ClusterCreate onClose={handleCancel}></ClusterCreate>
<ClusterCreate
onClose={handleCancel}
action={PageAction.CREATE}
setCurrentTitle={setCurrentTitle}
></ClusterCreate>
</GSDrawer>
);
};
src/pages/cluster-management/components/add-worker-command.tsx
+1
View File
@@ -65,6 +65,7 @@ const AddWorkerCommand: React.FC<ViewModalProps> = ({
code={code}
copyValue={code}
lang="bash"
xScrollable={true}
></HighlightCode>
);
};
src/pages/cluster-management/components/add-worker/index.tsx
+1 -1
View File
@@ -131,7 +131,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
body: {
paddingBlock: 0
},
wrapper: { width: 865 }
wrapper: { width: 700 }
}}
footer={false}
>
src/pages/cluster-management/components/cluster-steps.tsx
+37 -78
View File
@@ -1,4 +1,3 @@
import { CheckCircleFilled, CheckCircleOutlined } from '@ant-design/icons';
import { Steps } from 'antd';
import React from 'react';
import styled from 'styled-components';
@@ -9,6 +8,9 @@ const Wrapper = styled.div`
gap: 24px;
`;
/**
* --steps-item-base-width: 20px; type="panel"
*/
const Box = styled.div`
.indicates {
color: var(--ant-color-text-tertiary);
@@ -16,76 +18,20 @@ const Box = styled.div`
margin-bottom: 24px;
}
.ant-steps {
--steps-title-font-size: 14px;
.ant-steps-item {
--steps-item-base-width: 20px;
}
}
`;
const StepItemWrapper = styled.div`
display: flex;
align-items: flex-start;
gap: 12px;
padding-bottom: 16px;
// border-bottom: 1px solid var(--ant-color-split);
.description {
display: flex;
flex-direction: column;
gap: 4px;
.title {
font-weight: 500;
line-height: 20px;
color: var(--ant-color-text-tertiary);
.ant-steps-item-rail-wait {
--steps-item-solid-line-color: var(--ant-color-split);
}
.content {
line-height: 22px;
font-size: 14px;
color: var(--ant-color-text-tertiary);
}
}
&.active {
.description {
.title {
color: var(--ant-color-text);
font-weight: 600;
}
.content {
color: var(--ant-color-text);
&:not(.ant-steps-panel) {
.ant-steps-item-finish {
--steps-item-icon-bg-color: var(--ant-color-primary);
}
}
}
`;
const StepsItem: React.FC<{
active: boolean;
item: {
title: string;
content: string;
};
}> = ({ active, item }) => {
return (
<StepItemWrapper className={active ? 'active' : ''}>
<div className="icon">
{active ? (
<CheckCircleFilled
style={{ color: 'var(--ant-color-primary)', fontSize: 20 }}
/>
) : (
<CheckCircleOutlined
style={{ color: 'var(--ant-color-text-disabled)', fontSize: 20 }}
/>
)}
</div>
<div className="description">
<div className="title">{item.title}</div>
<div className="content">{item.content}</div>
</div>
</StepItemWrapper>
);
};
const ClusterSteps: React.FC<{
currentStep: number;
onChange?: (step: number) => void;
@@ -94,28 +40,41 @@ const ClusterSteps: React.FC<{
const { steps, currentStep = 0, onChange } = props;
const visibleSteps = steps.filter((step) => !step.hideInSteps);
const styles: Record<string, any> = {
root: {
'--ant-steps-description-max-width': 'auto'
},
item: {
paddingBlock: 0
},
itemIcon: {
fontSize: 0,
width: 8,
height: 8,
marginInlineStart: 0
},
itemWrapper: {
alignItems: 'center'
},
itemRail: {
borderWidth: 1.5,
borderRadius: 1,
insetInlineStart: 10,
insetInlineEnd: 2,
'--steps-horizontal-rail-margin': '12px'
}
};
return (
<Box>
<Wrapper>
{/* {visibleSteps.map((item, index) => (
<StepsItem
key={index}
active={currentStep === index}
item={item}
></StepsItem>
))} */}
<Steps
current={currentStep}
items={visibleSteps}
type="panel"
styles={{
item: {
paddingBlock: 0
},
itemRail: {
borderColor: 'var(--ant-color-split)'
}
}}
variant="filled"
size="small"
styles={styles}
></Steps>
</Wrapper>
</Box>
src/pages/cluster-management/components/success-result.tsx
+2 -2
View File
@@ -35,11 +35,11 @@ const SuccessResult: React.FC<{
}}
icon={
<CheckCircleFilled
style={{ color: 'var(--ant-color-success)', fontSize: 42 }}
style={{ color: 'var(--ant-color-success)', fontSize: 36 }}
/>
}
status="success"
title={intl.formatMessage({ id: 'clusters.create.complete.tips' })}
title={intl.formatMessage({ id: 'clusters.create.steps.complete.tips' })}
subTitle={provider === ProviderValueMap.Kubernetes ? k8sTips : dockerTips}
extra={[
<Flex gap={16} justify="center" key="buttons">
src/pages/cluster-management/step-forms/use-step-list.tsx
+5 -3
View File
@@ -15,7 +15,9 @@ export default function useStepList() {
return useMemo(
() => [
{
title: intl.formatMessage({ id: 'clusters.create.selectProvider' }),
title: intl.formatMessage({
id: 'clusters.create.steps.selectProvider'
}),
content: '',
subTitle: '',
description:
@@ -35,7 +37,7 @@ export default function useStepList() {
providers: []
},
{
title: intl.formatMessage({ id: 'common.title.config' }),
title: intl.formatMessage({ id: 'clusters.create.steps.configure' }),
content: '',
description:
'Set the cluster name, description, or other essential parameters in advanced settings.',
@@ -72,7 +74,7 @@ export default function useStepList() {
beforeNext: handleBack
},
{
title: intl.formatMessage({ id: 'clusters.create.complete' }),
title: intl.formatMessage({ id: 'clusters.create.steps.complete' }),
content: '',
description: '',
showButtons: (provider?: ProviderType) => {
src/pages/llmodels/forms/advance-config.tsx
+3 -2
View File
@@ -77,9 +77,10 @@ const AdvanceConfig = () => {
included={true}
max={modelContextData?.scaled || 163840}
tooltip={{}}
step={1024}
marks={{
[modelContextData?.native]: 'native',
[modelContextData?.scaled]: 'scaled'
[modelContextData?.scaled]: 'scaled',
[modelContextData?.native]: 'native'
}}
></SealSlider>
</Form.Item>