|
|
|
|
@ -1,6 +1,7 @@
|
|
|
|
|
import React, { useState, useEffect } from 'react';
|
|
|
|
|
import { Input, Select, Table, Button } from '@arco-design/web-react';
|
|
|
|
|
import { IconDelete } from '@arco-design/web-react/icon';
|
|
|
|
|
import { useSelector } from 'react-redux';
|
|
|
|
|
|
|
|
|
|
interface TableDataItem {
|
|
|
|
|
key: number | string;
|
|
|
|
|
@ -23,6 +24,7 @@ const ParamsTable: React.FC<ParamsTableProps> = ({
|
|
|
|
|
onUpdateData
|
|
|
|
|
}) => {
|
|
|
|
|
const [data, setData] = useState<TableDataItem[]>([]);
|
|
|
|
|
const { gloBalVarList } = useSelector((state: any) => state.ideContainer);
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
// 为现有数据添加key属性(如果不存在)
|
|
|
|
|
@ -40,23 +42,30 @@ const ParamsTable: React.FC<ParamsTableProps> = ({
|
|
|
|
|
{ label: 'ARRAY', value: 'ARRAY' },
|
|
|
|
|
{ label: 'OBJECT', value: 'OBJECT' },
|
|
|
|
|
{ label: 'JSON', value: 'JSON' },
|
|
|
|
|
{ label: 'DOUBLE', value: 'DOUBLE' },
|
|
|
|
|
{ label: 'DATE', value: 'DATE' },
|
|
|
|
|
{ label: 'DATETIME', value: 'DATETIME' },
|
|
|
|
|
{ label: 'TIMESTAMP', value: 'TIMESTAMP' },
|
|
|
|
|
{ label: 'DATABASE', value: 'DATABASE' }
|
|
|
|
|
{ label: 'DOUBLE', value: 'DOUBLE' }
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
const arrayTypeOptions = [
|
|
|
|
|
{ label: 'STRING', value: 'STRING' },
|
|
|
|
|
{ label: 'INTEGER', value: 'INTEGER' },
|
|
|
|
|
// { label: 'DOUBLE', value: 'DOUBLE' },
|
|
|
|
|
{ label: 'BOOLEAN', value: 'BOOLEAN' }
|
|
|
|
|
// { label: 'DATE', value: 'DATE' },
|
|
|
|
|
// { label: 'DATETIME', value: 'DATETIME' },
|
|
|
|
|
// { label: 'TIMESTAMP', value: 'TIMESTAMP' }
|
|
|
|
|
{ label: 'DOUBLE', value: 'DOUBLE' },
|
|
|
|
|
{ label: 'BOOLEAN', value: 'BOOLEAN' },
|
|
|
|
|
{ label: 'JSON', value: 'JSON' },
|
|
|
|
|
{ label: 'OBJECT', value: 'OBJECT' }
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
// 根据数据类型获取对应的选项列表
|
|
|
|
|
const getOptionsByDataType = (dataType: string) => {
|
|
|
|
|
// 这里可以根据数据类型从gloBalVarList中筛选出对应的选项
|
|
|
|
|
if (gloBalVarList[dataType]) {
|
|
|
|
|
return gloBalVarList[dataType].map((item: any) => ({
|
|
|
|
|
label: item.name,
|
|
|
|
|
value: item.id
|
|
|
|
|
}));
|
|
|
|
|
}
|
|
|
|
|
return [];
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const columns = [
|
|
|
|
|
{
|
|
|
|
|
title: '标识',
|
|
|
|
|
@ -123,22 +132,58 @@ const ParamsTable: React.FC<ParamsTableProps> = ({
|
|
|
|
|
{
|
|
|
|
|
title: '默认值',
|
|
|
|
|
dataIndex: 'defaultValue',
|
|
|
|
|
render: (_: any, record: TableDataItem) => (
|
|
|
|
|
record.id === 'maxTime' ? (
|
|
|
|
|
<Input
|
|
|
|
|
type="number"
|
|
|
|
|
min="1"
|
|
|
|
|
step="1"
|
|
|
|
|
value={record.defaultValue}
|
|
|
|
|
onChange={(value) => handleSave({ ...record, defaultValue: value })}
|
|
|
|
|
/>
|
|
|
|
|
) : (
|
|
|
|
|
<Input
|
|
|
|
|
value={record.defaultValue}
|
|
|
|
|
onChange={(value) => handleSave({ ...record, defaultValue: value })}
|
|
|
|
|
/>
|
|
|
|
|
)
|
|
|
|
|
)
|
|
|
|
|
render: (_: any, record: TableDataItem) => {
|
|
|
|
|
// 获取当前数据类型对应的选项
|
|
|
|
|
const options = getOptionsByDataType(record.dataType);
|
|
|
|
|
|
|
|
|
|
// 如果有选项则显示下拉选择框,否则显示输入框
|
|
|
|
|
if (options.length > 0) {
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<Select
|
|
|
|
|
value={record.refValue}
|
|
|
|
|
onChange={(value) => {
|
|
|
|
|
const refValue = options.find((option) => option.value === value)?.label || null;
|
|
|
|
|
handleSave({ ...record, refId: value, refValue });
|
|
|
|
|
}}
|
|
|
|
|
placeholder="请选择默认值"
|
|
|
|
|
// showSearch
|
|
|
|
|
allowClear
|
|
|
|
|
options={options}
|
|
|
|
|
style={{ width: '100%', minWidth: 100 }}
|
|
|
|
|
/>
|
|
|
|
|
<Input
|
|
|
|
|
style={{ width: '100%', minWidth: 100, marginTop: 10 }}
|
|
|
|
|
value={record.defaultValue}
|
|
|
|
|
onChange={(value) => handleSave({ ...record, defaultValue: value })}
|
|
|
|
|
placeholder="请输入默认值"
|
|
|
|
|
/>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
// 特殊处理maxTime的情况
|
|
|
|
|
if (record.id === 'maxTime') {
|
|
|
|
|
return (
|
|
|
|
|
<Input
|
|
|
|
|
type="number"
|
|
|
|
|
min="1"
|
|
|
|
|
step="1"
|
|
|
|
|
value={record.defaultValue}
|
|
|
|
|
onChange={(value) => handleSave({ ...record, defaultValue: value })}
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<Input
|
|
|
|
|
value={record.defaultValue}
|
|
|
|
|
onChange={(value) => handleSave({ ...record, defaultValue: value })}
|
|
|
|
|
placeholder="请输入默认值"
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '操作',
|
|
|
|
|
|