初始化3.0.0版本

This commit is contained in:
zengqiao
2022-08-18 17:04:05 +08:00
parent 462303fca0
commit 51832385b1
2446 changed files with 93177 additions and 127211 deletions

View File

@@ -0,0 +1,396 @@
import { QuestionCircleOutlined } from '@ant-design/icons';
import { IconFont, Switch, Tooltip } from 'knowdesign';
import { FormItemType, IFormItem } from 'knowdesign/lib/extend/x-form';
import moment from 'moment';
import React from 'react';
import { timeFormat } from '../../constants/common';
import { getRandomStr } from '../../lib/utils';
import { ControlStatusMap } from '../CommonRoute';
export const filterList = [
{
label: 'none',
value: 'none',
},
{
label: 'contains',
value: 'contains',
},
{
label: 'does not contains',
value: 'does not contains',
},
{
label: 'equals',
value: 'equals',
},
{
label: 'Above Size',
value: 'aboveSize',
},
{
label: 'Under Size',
value: 'underSize',
},
];
export const untilList = [
{
label: 'Forever',
value: 'forever',
},
{
label: 'number of messages',
value: 'number of messages',
},
{
label: 'number of messages per partition',
value: 'number of messages per partition',
},
{
label: 'max size',
value: 'max size',
},
{
label: 'max size per partition',
value: 'max size per partition',
},
{
label: 'timestamp',
value: 'timestamp',
},
];
export const tabsConfig = [
{ name: 'Data', control: '' },
{ name: 'Flow', control: '' },
{ name: 'Header', control: ControlStatusMap.TESTING_PRODUCER_HEADER },
{ name: 'Options', control: '' },
];
const getComplexLabel = (key: string, label: string, form: any, onSwitchChange?: any, needSwitch = false) => (
<div className="complex-label">
<span>
<span>{label}</span>
<Tooltip title="暂支持string格式">
<QuestionCircleOutlined size={12} style={{ marginLeft: 2 }} />
</Tooltip>
:
{needSwitch ? (
<span>
<Switch onClick={onSwitchChange} size="small" defaultChecked className="switch" />
</span>
) : null}
</span>
<span>
<Tooltip title={'生成随机内容'}>
<IconFont
type="icon-shengchengdaima"
className="random-icon"
onClick={() => {
const randomStr = getRandomStr(key === 'key' ? 30 : 128);
form && form.setFieldsValue({ [key]: randomStr });
}}
/>
</Tooltip>
</span>
</div>
);
export const getFormConfig = (params: any) => {
const { topicMetaData, activeKey: type, configInfo: info, form, onKeySwitchChange, isKeyOn, isShowControl } = params;
const formConfig = [
{
key: 'topicName',
label: 'Topic',
type: FormItemType.select,
invisible: type !== 'Data',
rules: [{ required: true, message: '请选择Topic' }],
options: topicMetaData,
attrs: {
showSearch: true,
},
},
{
key: 'key',
label: getComplexLabel('key', 'Key', form, onKeySwitchChange, true),
type: FormItemType.textArea,
invisible: type !== 'Data',
rules: [
{
required: false,
message: '请输入Key',
},
],
attrs: {
disabled: !isKeyOn,
rows: 5,
placeholder: '暂支持string类型',
},
},
{
key: 'value',
label: getComplexLabel('value', 'Value', form),
type: FormItemType.textArea,
invisible: type !== 'Data',
rules: [
{
required: true,
message: '请输入Value',
},
],
attrs: {
rows: 5,
placeholder: '暂支持string类型',
},
},
{
key: 'chunks',
label: '单次发送消息数',
type: FormItemType.inputNumber,
invisible: type !== 'Flow',
defaultValue: 1,
rules: [{ required: true, message: '请输入' }],
attrs: {
min: 0,
style: { width: 232 },
},
},
{
key: 'producerMode',
label: '生产模式',
type: FormItemType.radioGroup,
invisible: type !== 'Flow',
defaultValue: 'manual',
options: [
{
label: '手动',
value: 'manual',
},
{
label: '周期',
value: 'timed',
},
],
rules: [
{
required: true,
message: '请选择生产模式',
},
],
},
// {
// key: 'timeOptions',
// label: 'Timer options',
// type: FormItemType.text,
// invisible: type !== 'Flow' || !info?.needTimeOption,
// customFormItem: null,
// rules: [
// {
// required: false,
// message: '请选择Producer Mode',
// },
// ],
// },
{
key: 'elapsed',
label: '运行总时间min',
type: FormItemType.inputNumber,
invisible: type !== 'Flow' || !info?.needTimeOption,
rules: [
{
required: info?.needTimeOption,
message: '请输入',
},
],
attrs: {
min: 0,
max: 300,
style: { width: '100%' },
},
},
{
key: 'interval',
label: '时间间隔ms',
type: FormItemType.inputNumber,
invisible: type !== 'Flow' || !info?.needTimeOption,
rules: [
{
required: info?.needTimeOption,
message: '请输入',
},
],
attrs: {
min: 300, // 300ms间隔保证请求不太频繁
style: { width: '100%' },
},
},
// {
// key: 'jitter',
// label: 'Max jitterms',
// type: FormItemType.inputNumber,
// invisible: type !== 'Flow' || !info?.needTimeOption,
// rules: [
// {
// required: info?.needTimeOption,
// message: '请输入Max jitter',
// },
// ],
// attrs: {
// max: info.maxJitter || 0,
// size: 'small',
// style: { width: 216 },
// },
// formAttrs: {
// className: 'inner-item',
// },
// },
// {
// key: 'lifecycle',
// label: (
// <>
// Lifecycle options
// <Tooltip title="Shutdown the producer automatically">
// <QuestionCircleOutlined style={{ marginLeft: 8 }} />
// </Tooltip>
// </>
// ),
// type: FormItemType.text,
// invisible: type !== 'Flow' || !info?.needTimeOption,
// customFormItem: null,
// rules: [
// {
// required: false,
// message: '',
// },
// ],
// },
// {
// key: 'messageProduced',
// label: 'Number of message produced',
// type: FormItemType.inputNumber,
// invisible: type !== 'Flow' || !info?.needTimeOption,
// rules: [
// {
// required: info?.needTimeOption,
// message: '请输入Number of message produced',
// },
// ],
// attrs: {
// min: 0,
// size: 'small',
// style: { width: 216 },
// },
// formAttrs: {
// className: 'inner-item',
// },
// },
{
key: 'frocePartition',
label: 'Froce Partition',
invisible: type !== 'Options',
type: FormItemType.select,
attrs: {
mode: 'multiple',
},
options: info.partitionIdList || [],
rules: [{ required: false, message: '请选择' }],
},
{
key: 'compressionType',
label: 'Compression Type',
type: FormItemType.radioGroup,
defaultValue: 'none',
invisible: type !== 'Options',
options: (() => {
const options = [
{
label: 'none',
value: 'none',
},
{
label: 'gzip',
value: 'gzip',
},
{
label: 'snappy',
value: 'snappy',
},
{
label: 'lz4',
value: 'lz4',
},
];
if (isShowControl && isShowControl(ControlStatusMap.TESTING_PRODUCER_COMPRESSION_TYPE_ZSTD)) {
options.push({
label: 'zstd',
value: 'zstd',
});
}
return options;
})(),
rules: [
{
required: false,
message: '请选择Compression Type',
},
],
},
{
key: 'acks',
label: 'Acks',
type: FormItemType.radioGroup,
defaultValue: '0',
invisible: type !== 'Options',
options: [
{
label: 'none',
value: '0',
},
{
label: 'leader',
value: '1',
},
{
label: 'all',
value: 'all',
},
],
rules: [
{
required: false,
message: '请选择Acks',
},
],
},
] as unknown as IFormItem[];
return formConfig;
};
export const getTableColumns = () => {
return [
{
title: 'Partition',
dataIndex: 'partitionId',
},
{
title: 'offset',
dataIndex: 'offset',
},
{
title: 'Timestamp',
dataIndex: 'timestampUnitMs',
render: (text: number) => {
return moment(text).format(timeFormat);
},
},
{
title: 'time',
dataIndex: 'costTimeUnitMs',
width: 60,
},
];
};