Skip to content

Commit

Permalink
fix
Browse files Browse the repository at this point in the history
  • Loading branch information
yang1666204 committed Jun 15, 2024
1 parent c7d0d9b commit 4ec1322
Show file tree
Hide file tree
Showing 10 changed files with 278 additions and 71 deletions.
10 changes: 7 additions & 3 deletions ui/src/components/CustomFormItem/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { intl } from '@/utils/intl';
import type { FormItemProps } from 'antd';
import { Form } from 'antd';

export const CustomFormItem = (prop: FormItemProps & { message: string }) => {
export const CustomFormItem = (prop: FormItemProps & { message?: string }) => {
const { label, message } = prop;
return (
<Form.Item
Expand All @@ -11,15 +11,19 @@ export const CustomFormItem = (prop: FormItemProps & { message: string }) => {
{
required: true,
message:
message || typeof label === 'string'
message ||
(typeof label === 'string'
? intl.formatMessage(
{
id: 'Dashboard.Cluster.New.Observer.EnterLabel',
defaultMessage: '请输入{{label}}',
},
{ label: label as string },
)
: '请输入',
: intl.formatMessage({
id: 'src.components.CustomFormItem.2C6315A1',
defaultMessage: '请输入',
})),
},
]}
>
Expand Down
38 changes: 37 additions & 1 deletion ui/src/i18n/strings/zh-CN.json
Original file line number Diff line number Diff line change
Expand Up @@ -985,5 +985,41 @@
"src.components.InputLabelComp.6C88A39D": "添加",
"src.components.AlertDrawer.95C6A631": "提交",
"src.components.AlertDrawer.9B7CD984": "取消",
"src.api.2CA64FC6": "登陆已过期"
"src.api.2CA64FC6": "登陆已过期",
"src.pages.OBProxy.New.49694AC5": "创建成功!",
"src.pages.OBProxy.New.7CAF48E9": "详细配置",
"src.pages.OBProxy.New.0C4EFBB0": "资源设置",
"src.pages.OBProxy.New.CCD9785D": "请选择服务类型",
"src.pages.OBProxy.New.88D0BC94": "服务类型",
"src.pages.OBProxy.New.2F497A97": "请选择",
"src.pages.OBProxy.New.A3E900B4": "副本数",
"src.pages.OBProxy.New.D4645164": "请输入",
"src.pages.OBProxy.New.6A1E93D2": "CPU 核数",
"src.pages.OBProxy.New.AEDDBA86": "请输入",
"src.pages.OBProxy.New.CE387455": "内存大小",
"src.pages.OBProxy.New.7C04AD55": "请输入",
"src.pages.OBProxy.New.134CD1CE": "参数设置",
"src.pages.OBProxy.New.D6D90ACC": "k8s中资源的名称",
"src.pages.OBProxy.New.803427AF": "资源名称",
"src.pages.OBProxy.New.F602E292": "请输入k8s资源名称",
"src.pages.OBProxy.New.37FA27BA": "资源名不能使用纯数字",
"src.pages.OBProxy.New.9B4BA02B": "请输入",
"src.pages.OBProxy.New.BB6BC872": "OBProxy 集群名",
"src.pages.OBProxy.New.CA42FD5D": "请输入集群名",
"src.pages.OBProxy.New.94339826": "请选择 OB 集群",
"src.pages.OBProxy.New.67DC144A": "请输入 OBProxy root 密码",
"src.pages.OBProxy.Detail.Overview.680A1826": "详细配置",
"src.pages.OBProxy.Detail.Overview.F9D66FC0": "资源设置",
"src.pages.OBProxy.Detail.Overview.DBE1B6C0": "服务类型",
"src.pages.OBProxy.Detail.Overview.E7B1B575": "请选择",
"src.pages.OBProxy.Detail.Overview.2DA6A0A7": "副本数",
"src.pages.OBProxy.Detail.Overview.52C1F09A": "请输入",
"src.pages.OBProxy.Detail.Overview.A4448DF2": "CPU 核数",
"src.pages.OBProxy.Detail.Overview.2FA13720": "请输入",
"src.pages.OBProxy.Detail.Overview.0075C2B3": "内存大小",
"src.pages.OBProxy.Detail.Overview.3F3066D5": "请输入",
"src.pages.OBProxy.Detail.Overview.D537DD35": "参数设置",
"src.pages.OBProxy.Detail.Overview.8A75D872": "请选择",
"src.pages.OBProxy.Detail.Overview.8E87D135": "添加",
"src.components.CustomFormItem.2C6315A1": "请输入"
}
2 changes: 1 addition & 1 deletion ui/src/pages/Layouts/DetailLayout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,7 @@ const DetailLayout: React.FC<DetailLayoutProps> = ({

useEffect(() => {
getAppInfoFromStorage().then((appInfo) => {
setVersion(appInfo.version);
setVersion(appInfo?.version);
});
}, []);

Expand Down
108 changes: 84 additions & 24 deletions ui/src/pages/OBProxy/Detail/Overview/ConfigDrawer.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import { obproxy } from '@/api';
import type { CommonKVPair, CommonResourceSpec } from '@/api/generated';
import type { CommonKVPair } from '@/api/generated';
import { ObproxyPatchOBProxyParam } from '@/api/generated';
import AlertDrawer from '@/components/AlertDrawer';
import { CustomFormItem } from '@/components/CustomFormItem';
import { SERVICE_TYPE, SUFFIX_UNIT } from '@/constants';
import { MIRROR_OBPROXY } from '@/constants/doc';
import { OBProxy } from '@/type/obproxy';
import { intl } from '@/utils/intl';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import { useRequest } from 'ahooks';
Expand All @@ -22,16 +23,10 @@ import {
import { useEffect, useRef } from 'react';
import { isDifferentParams } from '../../helper';

interface ConfigDrawerProps extends DrawerProps {
type ConfigDrawerProps = {
onClose: () => void;
name: string;
namespace: string;
image?: string;
parameters?: CommonKVPair[];
resource?: CommonResourceSpec;
serviceType?: string;
replicas?: number;
}
} & OBProxy.CommonProxyDetail &
DrawerProps;

type FormValue = {
parameters?: { key: string; value: string }[];
Expand Down Expand Up @@ -79,7 +74,10 @@ export default function ConfigDrawer({
}, [props.parameters]);
return (
<AlertDrawer
title="详细配置"
title={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.680A1826',
defaultMessage: '详细配置',
})}
onSubmit={() => form.submit()}
destroyOnClose={true}
onClose={() => onClose()}
Expand All @@ -92,7 +90,12 @@ export default function ConfigDrawer({
preserve={false}
layout="vertical"
>
<p style={titleStyle}>资源设置</p>
<p style={titleStyle}>
{intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.F9D66FC0',
defaultMessage: '资源设置',
})}
</p>
<CustomFormItem
label={
<>
Expand Down Expand Up @@ -121,19 +124,73 @@ export default function ConfigDrawer({
})}
/>
</CustomFormItem>
<CustomFormItem name="serviceType" label="服务类型">
<Select placeholder="请选择" options={SERVICE_TYPE} />
<CustomFormItem
name="serviceType"
label={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.DBE1B6C0',
defaultMessage: '服务类型',
})}
>
<Select
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.E7B1B575',
defaultMessage: '请选择',
})}
options={SERVICE_TYPE}
/>
</CustomFormItem>
<CustomFormItem name="replicas" label="副本数">
<InputNumber placeholder="请输入" min={1} />
<CustomFormItem
name="replicas"
label={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.2DA6A0A7',
defaultMessage: '副本数',
})}
>
<InputNumber
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.52C1F09A',
defaultMessage: '请输入',
})}
min={1}
/>
</CustomFormItem>
<CustomFormItem name={['resource', 'cpu']} label="CPU 核数">
<InputNumber placeholder="请输入" min={1} />
<CustomFormItem
name={['resource', 'cpu']}
label={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.A4448DF2',
defaultMessage: 'CPU 核数',
})}
>
<InputNumber
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.2FA13720',
defaultMessage: '请输入',
})}
min={1}
/>
</CustomFormItem>
<CustomFormItem name={['resource', 'memory']} label="内存大小">
<InputNumber placeholder="请输入" min={1} addonAfter={SUFFIX_UNIT} />
<CustomFormItem
name={['resource', 'memory']}
label={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.0075C2B3',
defaultMessage: '内存大小',
})}
>
<InputNumber
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.3F3066D5',
defaultMessage: '请输入',
})}
min={1}
addonAfter={SUFFIX_UNIT}
/>
</CustomFormItem>
<p style={titleStyle}>参数设置</p>
<p style={titleStyle}>
{intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.D537DD35',
defaultMessage: '参数设置',
})}
</p>
<Form.List name={'parameters'}>
{(fields, { add, remove }) => (
<>
Expand All @@ -142,7 +199,10 @@ export default function ConfigDrawer({
<Col span={12}>
<CustomFormItem name={[name, 'key']}>
<Select
placeholder="请选择"
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.Detail.Overview.8A75D872',
defaultMessage: '请选择',
})}
onChange={(val) => labelChange(val, name)}
optionLabelProp="selectLabel"
options={listParametersOptions?.map((item) => ({
Expand Down Expand Up @@ -192,8 +252,8 @@ export default function ConfigDrawer({
icon={<PlusOutlined />}
>
{intl.formatMessage({
id: 'OBDashboard.components.NodeSelector.AddNodeselector',
defaultMessage: '添加 nodeSelector',
id: 'src.pages.OBProxy.Detail.Overview.8E87D135',
defaultMessage: '添加',
})}
</Button>
</CustomFormItem>
Expand Down
19 changes: 8 additions & 11 deletions ui/src/pages/OBProxy/Detail/Overview/DetailConfig.tsx
Original file line number Diff line number Diff line change
@@ -1,23 +1,16 @@
import type { CommonKVPair, CommonResourceSpec } from '@/api/generated';
import InputLabelComp from '@/components/InputLabelComp';
import { OBProxy } from '@/type/obproxy';
import { intl } from '@/utils/intl';
import { Button, Card, Col, Row } from 'antd';
import { useState } from 'react';
import ConfigDrawer from './ConfigDrawer';

interface DetailConfigProps {
name?: string;
namespace?: string;
image?: string;
parameters?: CommonKVPair[];
resource?: CommonResourceSpec;
serviceType?: string;
replicas?: number;
interface DetailConfigProps extends OBProxy.CommonProxyDetail {
style?: React.CSSProperties;
}

export default function DetailConfig({ style, ...props }: DetailConfigProps) {
const { image, serviceType, replicas, resource, parameters } = props;

const [drawerOpen, setDrawerOpen] = useState(false);
return (
<Card
Expand Down Expand Up @@ -91,7 +84,11 @@ export default function DetailConfig({ style, ...props }: DetailConfigProps) {
defaultMessage: '参数设置',
})}
</h3>
<InputLabelComp allowDelete={false} disable={true} value={parameters || []} />
<InputLabelComp
allowDelete={false}
disable={true}
value={parameters || []}
/>
</div>
{props.name && props.namespace ? (
<ConfigDrawer
Expand Down
50 changes: 41 additions & 9 deletions ui/src/pages/OBProxy/New/BasicConfig.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,34 +35,60 @@ export default function BasicConfig({ form }: BasicConfigProps) {
>
<Row gutter={[16, 32]}>
<Col span={8}>
<TooltipPretty title={'k8s中资源的名称'}>
<TooltipPretty
title={intl.formatMessage({
id: 'src.pages.OBProxy.New.D6D90ACC',
defaultMessage: 'k8s中资源的名称',
})}
>
<Form.Item
label="资源名称"
label={intl.formatMessage({
id: 'src.pages.OBProxy.New.803427AF',
defaultMessage: '资源名称',
})}
validateFirst
name={'name'}
rules={[
{
required: true,
message: '请输入k8s资源名称',
message: intl.formatMessage({
id: 'src.pages.OBProxy.New.F602E292',
defaultMessage: '请输入k8s资源名称',
}),
},
{
pattern: /\D/,
message: '资源名不能使用纯数字',
message: intl.formatMessage({
id: 'src.pages.OBProxy.New.37FA27BA',
defaultMessage: '资源名不能使用纯数字',
}),
},
resourceNameRule,
]}
>
<Input placeholder="请输入" />
<Input
placeholder={intl.formatMessage({
id: 'src.pages.OBProxy.New.9B4BA02B',
defaultMessage: '请输入',
})}
/>
</Form.Item>
</TooltipPretty>
</Col>
<Col span={8}>
<Form.Item
label="OBProxy 集群名"
label={intl.formatMessage({
id: 'src.pages.OBProxy.New.BB6BC872',
defaultMessage: 'OBProxy 集群名',
})}
name={'proxyClusterName'}
rules={[
{
required: true,
message: '请输入集群名',
message: intl.formatMessage({
id: 'src.pages.OBProxy.New.CA42FD5D',
defaultMessage: '请输入集群名',
}),
},
]}
>
Expand All @@ -84,7 +110,10 @@ export default function BasicConfig({ form }: BasicConfigProps) {
rules={[
{
required: true,
message: '请选择 OB 集群',
message: intl.formatMessage({
id: 'src.pages.OBProxy.New.94339826',
defaultMessage: '请选择 OB 集群',
}),
},
]}
>
Expand All @@ -109,7 +138,10 @@ export default function BasicConfig({ form }: BasicConfigProps) {
rules={[
{
required: true,
message: '请输入 OBProxy root 密码',
message: intl.formatMessage({
id: 'src.pages.OBProxy.New.67DC144A',
defaultMessage: '请输入 OBProxy root 密码',
}),
},
]}
>
Expand Down
Loading

0 comments on commit 4ec1322

Please sign in to comment.