Skip to content

S
szse
Commit ac54c3ff by zhaochengxiang
Options

调整

parent 641a5c77
Showing with 517 additions and 517 deletions
src/view/Manage/Model/Component/ImportActionHeader.jsx
...@@ -45,566 +45,268 @@ const updateOptions = [ ...@@ -45,566 +45,268 @@ const updateOptions = [
const dataTypeRemark = '描述ETL框架中目标表的数据类型'; const dataTypeRemark = '描述ETL框架中目标表的数据类型';
const bindingLoadRemark = '描述ETL框架绑定加载列表，如chain、daily、current等'; const bindingLoadRemark = '描述ETL框架绑定加载列表，如chain、daily、current等';
const ConstraintSelect = ({ value = {}, constraints = [], onChange, ...restProps }) => { const ImportActionHeader = (props) => {
const { editable, form, modelerData, constraints, templates, onConstraintChange, onTemplateChange, validateReports, onChange, terms, supportedPartitionTypes } = props;
return ( const [ causes, setCauses ] = useState([]);
<Select const [ options, setOptions ] = useState([]);
onChange={onChange}
value={value?.name || ''}
placeholder='请选择规范'
{...restProps}
>
{
(constraints||[]) && constraints.map((constraint, index) => {
return (
<Option key={index} value={constraint.name||''} >{constraint.cnName||''}</Option>
);
})
}
</Select>
)
}
const TemplateSelect = ({ value = '', modelerData = undefined, templates = [], onChange, ...restProps }) => { const [ autoTranslate, setAutoTranslate ] = useState(false);
const mountRef = useRef(true); const [ onlyShowRequireChange, setOnlyShowRequireChange ] = useState(true);
const [isCustom, setIsCustom] = useState(false); const [ maintenanceRecords, setMaintenanceRecords ] = useState(null);
const [ dataTypeList, setDataTypeList ] = useState(null);
const [ bindingLoadRangeList, setBindingLoadRangeList ] = useState(null);
const [ dataCircumstances, setDataCircumstances ] = useState(null);
useEffect(() => { useEffect(() => {
if (mountRef.current && modelerData && Object.keys(modelerData).length > 0) { getDataTypeList();
if (modelerData?.tableType && !modelerData?.easyDataModelerModelingTemplate?.name) { }, [])
setIsCustom(true);
} else {
setIsCustom(false);
}
mountRef.current = false; useEffect(() => {
} if (modelerData?.dataType) {
}, [modelerData]) getBindingLoadRangeList(modelerData?.dataType);
} else {
setBindingLoadRangeList([]);
}
}, [modelerData?.dataType])
return ( useEffect(() => {
<span style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
{
isCustom ? <InputDebounce
placeholder='请输入数据表类型'
allowClear
value={modelerData?.tableType}
onChange={(val) => {
onChange?.(val, true);
}}
style={{ flex: 1 }}
/> : <Select
onChange={(val) => {
onChange?.(val);
}}
value={value || undefined}
placeholder='请选择数据表类型'
allowClear
style={{ flex: 1 }}
{...restProps}
>
{
(templates||[]) && templates.map((template, index) => {
return (
<Option key={index} value={template.cnName||''} >
<Tooltip title={template.remark}>
{template.cnName}
</Tooltip>
</Option>
);
})
}
</Select>
}
<Checkbox className='ml-3' checked={isCustom} onChange={(e) => {
setIsCustom(e.target.checked);
onChange?.('');
}}>自定义</Checkbox>
</span>
)
}
const AttributesSelect = ({ value = [], modelerData, onChange, mode = 'multiple', ...restProps }) => { const causes = [];
(validateReports||[]).forEach(report => {
if (report.type === 'DataModel') {
(report.reportItems||[]).forEach((item) => {
causes.push(item.cause||'');
})
}
});
const onAttributeChange = (value) => { if (editable) {
let currentAttributes = []; form?.setFields([{ name: 'name', errors: causes }]);
if (mode === 'multiple') {
currentAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(attribute => (value||[]).indexOf(attribute.iid)!==-1);
} else { } else {
(value||[]).forEach(item => { setCauses(causes);
}
const filterAttributes = (newAttributes||[]).filter(attribute => item ===attribute.iid); //eslint-disable-next-line react-hooks/exhaustive-deps
}, [validateReports])
if (filterAttributes.length !== 0) { useEffect(() => {
currentAttributes = [...currentAttributes, ...filterAttributes];
} else {
currentAttributes = [...currentAttributes, { name: item, iid: generateUUID() }];
}
})
}
triggerChange(currentAttributes); setAutoTranslate((modelerData.name||'')==='');
} if (modelerData) {
form?.setFieldsValue(modelerData);
setDataCircumstances(modelerData.dataCircumstances);
const triggerChange = (changedValue) => { if ((modelerData.id||'')!=='' && maintenanceRecords===null) {
onChange?.(changedValue); getMaintenanceRecords();
}; }
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [modelerData])
//value有可能为空 useEffect(() => {
value = value ? value: []; if ((maintenanceRecords||[]).length>0) {
let maintenanceDescription = '';
let attributeIds = []; maintenanceRecords.forEach((record, index) => {
let newAttributes = [...(modelerData?.easyDataModelerDataModelAttributes||[])]; if (index !== 0) {
maintenanceDescription += '/';
value.forEach(attribute => { }
attributeIds.push(attribute.iid); maintenanceDescription += record;
})
if (mode === 'tags') { form?.setFieldsValue({ maintenanceRecords: maintenanceDescription });
const filterAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(_attribute => attribute.iid ===_attribute.iid); }
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [maintenanceRecords, editable])
//分布
const distributionDescription = useMemo(() => {
let newDistributionDescription = ''
if (!editable && modelerData) {
if (modelerData?.easyDataModelerDistributionKey) {
(modelerData?.easyDataModelerDistributionKey||[]).forEach((item, index) => {
if (index > 0) {
newDistributionDescription += ',';
}
if (filterAttributes.length === 0) { newDistributionDescription += item.name||'';
newAttributes = [...newAttributes, attribute]; });
}
} }
})
return (
<Select
onChange={(value) => { onAttributeChange && onAttributeChange(value) }}
value={attributeIds}
placeholder='请选择字段名称'
mode={mode}
allowClear={true}
>
{
(newAttributes||[]).map((attribute, index) => {
return (
<Option key={index} value={attribute.iid?attribute.iid:(attribute.name||'')}>{attribute.name||''}</Option>
);
})
} }
</Select> return newDistributionDescription;
); }, [editable, modelerData])
}
const PartitionSelect = ({ value = {}, modelerData, partitionTypes = [], onChange, ...restProps }) => { //主键
const primaryDescription = useMemo(() => {
let newPrimaryDescription = ''
if (modelerData?.easyDataModelerPrimaryKey) {
(modelerData?.easyDataModelerPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
newPrimaryDescription += ',';
}
const onPartitionTypeChange = (value) => { newPrimaryDescription += item.name||'';
})
}
return newPrimaryDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
let currentPartitionType = {}; //分区
(partitionTypes||[]).forEach((partitionType, index) => { const partitionsDescription = useMemo(() => {
if (value === partitionType.name) { let newPartitionsDescription = ''
currentPartitionType = partitionType; if (modelerData?.partition?.keys) {
} (modelerData?.partition?.keys||[]).forEach((item, index) => {
}) if (index > 0) {
newPartitionsDescription += ',';
}
triggerChange({ partitionType: currentPartitionType }); newPartitionsDescription += item.name||'';
} })
}
if (modelerData?.partition?.partitionType?.cnName) {
newPartitionsDescription += '/' + modelerData?.partition?.partitionType?.cnName||'';
}
return newPartitionsDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
const onAttributeChange = (value) => { //类主键
const currentAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(attribute => (value||[]).indexOf(attribute.iid)!==-1); const semiPrimaryDescription = useMemo(() => {
let newSemiPrimaryDescription = ''
if (modelerData?.easyDataModelerSemiPrimaryKey) {
(modelerData?.easyDataModelerSemiPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
newSemiPrimaryDescription += ',';
}
triggerChange({ keys: currentAttributes }); newSemiPrimaryDescription += item.name||'';
} })
}
return newSemiPrimaryDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
const triggerChange = (changedValue) => { const formItemLayout = {
onChange?.({ labelCol: {
...value, xs: { span: 24 },
...changedValue, sm: { span: 6 },
}); },
wrapperCol: {
xs: { span: 24 },
sm: { span: 18 },
},
}; };
//value有可能为空 const getMaintenanceRecords = () => {
value = value ? value: {}; dispatch({
type: 'datamodel.getMaintenanceRecords',
let attributeIds = []; payload: {
(value?.keys||[]).forEach(attribute => { params: {
attributeIds.push(attribute.iid); id: modelerData.id
})
return (
<Row gutter={10}>
<Col span={10}>
<Select
onChange={onPartitionTypeChange}
value={value?.partitionType?.name}
placeholder='请选择分区类型'
allowClear={true}
>
{
(partitionTypes||[]).map((partitionType, index) => {
return (
<Option key={partitionType.name||''}>{partitionType.cnName||''}</Option>
);
})
}
</Select>
</Col>
<Col span={14}>
<Select
onChange={(value) => { onAttributeChange && onAttributeChange(value) }}
value={attributeIds}
placeholder='请选择字段名称'
mode='multiple'
allowClear={true}
>
{
(modelerData?.easyDataModelerDataModelAttributes||[]).map((attribute, index) => {
return (
<Option key={index} value={attribute.iid||''}>{attribute.name||''}</Option>
);
})
} }
</Select> },
</Col> callback: data => {
</Row> setMaintenanceRecords(data);
); }
}
const LoadSelect = ({ value = '', onChange, ...restProps }) => {
const onLoadChange = (value) => {
triggerChange(value.join('/'));
}
const triggerChange = (changedValue) => {
onChange?.(changedValue);
};
//value有可能为空
value = value ? value: '';
let loadNames = [];
if (value !== '') {
value.split('/').forEach(item => {
loadNames.push(item);
}) })
} }
return ( const getDataTypeList = () => {
<Select dispatch({
mode="tags" type: 'datamodel.dataTypeList',
tokenSeparators={['/', ' ']} callback: data => {
onChange={(value) => { onLoadChange && onLoadChange(value) }} setDataTypeList(data);
value={loadNames} }
placeholder='请选择或者手动输入加载方式' })
allowClear={true}
>
{
loadOptions.map((item, index) => {
return (
<Option key={index} value={item}>{item}</Option>
);
})
}
</Select>
);
}
const UpdateSelect = ({ value = '', onChange, ...restProps }) => {
const onUpdateChange = (value) => {
triggerChange(value.join('/'));
} }
const triggerChange = (changedValue) => { const getBindingLoadRangeList = (dataTypeName) => {
onChange?.(changedValue); dispatch({
}; type: 'datamodel.bindingLoadRangeList',
payload: {
//value有可能为空 dataTypeName
value = value ? value: ''; },
callback: data => {
let updateNames = []; setBindingLoadRangeList(data);
if (value !== '') { }
value.split('/').forEach(item => {
updateNames.push(item);
}) })
} }
return ( const onSearch = (searchText) => {
<Select
mode="tags"
tokenSeparators={['/', ' ']}
onChange={(value) => { onUpdateChange && onUpdateChange(value) }}
value={updateNames}
allowClear={true}
{...restProps}
>
{
updateOptions.map((item, index) => {
return (
<Option key={index} value={item}>{item}</Option>
);
})
}
</Select>
);
}
const ImportActionHeader = (props) => {
const { editable, form, modelerData, constraints, templates, onConstraintChange, onTemplateChange, validateReports, onChange, terms, supportedPartitionTypes } = props;
const [ causes, setCauses ] = useState([]);
const [ options, setOptions ] = useState([]);
const [ autoTranslate, setAutoTranslate ] = useState(false);
const [ onlyShowRequireChange, setOnlyShowRequireChange ] = useState(true);
const [ maintenanceRecords, setMaintenanceRecords ] = useState(null);
const [ dataTypeList, setDataTypeList ] = useState(null);
const [ bindingLoadRangeList, setBindingLoadRangeList ] = useState(null);
const [ dataCircumstances, setDataCircumstances ] = useState(null);
useEffect(() => { const _searchText = searchText.replace(/ /g,'');
getDataTypeList(); if (_searchText !== '') {
}, []) dispatchLatest({
type: 'datamodel.autocomplete',
payload: {
params: {
word: _searchText,
isEasyDataModelerDataModelAttribute: false,
}
},
callback: data => {
const _options = [];
(data||[]).forEach(item => {
_options.push({ value: item });
})
useEffect(() => { setOptions(_options);
if (modelerData?.dataType) { }
getBindingLoadRangeList(modelerData?.dataType); })
} else { } else {
setBindingLoadRangeList([]); dispatchLatest({
type: 'datamodel.recommandEnglishWords',
payload: {
params: {
chineseWord: modelerData.cnName,
}
},
callback: data => {
const _options = [];
(data||[]).forEach(item => {
_options.push({ value: item });
})
setOptions(_options);
}
})
} }
}, [modelerData?.dataType]) }
useEffect(() => { const onValuesChange = (changedValues, allValues) => {
onChange && onChange(changedValues, allValues);
const causes = []; //有手动编辑过英文名称并且有内容的情况下, 不能通过编辑中文名称自动翻译
(validateReports||[]).forEach(report => { if (changedValues.hasOwnProperty('name')) {
setAutoTranslate(changedValues.name==='');
if (report.type === 'DataModel') { } else if (changedValues.hasOwnProperty('cnName')) {
(report.reportItems||[]).forEach((item) => { if (autoTranslate) {
causes.push(item.cause||''); dispatchLatest({
type: 'datamodel.translatePhase',
payload: {
params: {
phaseInChinese: changedValues.cnName,
}
},
callback: data => {
if ((data?.translated||'') !== '') {
form?.setFieldsValue({ name: data?.translated||'' });
onChange && onChange({...changedValues, ...{name: data?.translated||''}}, {...allValues, ...{name: data?.translated||''}});
}
}
}) })
} }
}); } else if (changedValues.hasOwnProperty('dataType')) {
if (changedValues.dataType) {
if (editable) { onChange?.({...changedValues, bindingLoadRange: ''}, {...allValues, bindingLoadRange: ''});
form?.setFields([{ name: 'name', errors: causes }]); } else {
} else { onChange?.({...changedValues, bindingLoadRange: ''}, {...allValues, bindingLoadRange: ''});
setCauses(causes); }
} }
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [validateReports])
useEffect(() => {
setAutoTranslate((modelerData.name||'')==='');
if (modelerData) {
form?.setFieldsValue(modelerData);
setDataCircumstances(modelerData.dataCircumstances);
if ((modelerData.id||'')!=='' && maintenanceRecords===null) {
getMaintenanceRecords();
}
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [modelerData])
useEffect(() => {
if ((maintenanceRecords||[]).length>0) {
let maintenanceDescription = '';
maintenanceRecords.forEach((record, index) => {
if (index !== 0) {
maintenanceDescription += '/';
}
maintenanceDescription += record;
})
form?.setFieldsValue({ maintenanceRecords: maintenanceDescription });
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [maintenanceRecords, editable])
//分布
const distributionDescription = useMemo(() => {
let newDistributionDescription = ''
if (!editable && modelerData) {
if (modelerData?.easyDataModelerDistributionKey) {
(modelerData?.easyDataModelerDistributionKey||[]).forEach((item, index) => {
if (index > 0) {
newDistributionDescription += ',';
}
newDistributionDescription += item.name||'';
});
}
}
return newDistributionDescription;
}, [editable, modelerData])
//主键
const primaryDescription = useMemo(() => {
let newPrimaryDescription = ''
if (modelerData?.easyDataModelerPrimaryKey) {
(modelerData?.easyDataModelerPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
newPrimaryDescription += ',';
}
newPrimaryDescription += item.name||'';
})
}
return newPrimaryDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
//分区
const partitionsDescription = useMemo(() => {
let newPartitionsDescription = ''
if (modelerData?.partition?.keys) {
(modelerData?.partition?.keys||[]).forEach((item, index) => {
if (index > 0) {
newPartitionsDescription += ',';
}
newPartitionsDescription += item.name||'';
})
}
if (modelerData?.partition?.partitionType?.cnName) {
newPartitionsDescription += '/' + modelerData?.partition?.partitionType?.cnName||'';
}
return newPartitionsDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
//类主键
const semiPrimaryDescription = useMemo(() => {
let newSemiPrimaryDescription = ''
if (modelerData?.easyDataModelerSemiPrimaryKey) {
(modelerData?.easyDataModelerSemiPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
newSemiPrimaryDescription += ',';
}
newSemiPrimaryDescription += item.name||'';
})
}
return newSemiPrimaryDescription;
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [editable, modelerData])
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 6 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 18 },
},
};
const getMaintenanceRecords = () => {
dispatch({
type: 'datamodel.getMaintenanceRecords',
payload: {
params: {
id: modelerData.id
}
},
callback: data => {
setMaintenanceRecords(data);
}
})
}
const getDataTypeList = () => {
dispatch({
type: 'datamodel.dataTypeList',
callback: data => {
setDataTypeList(data);
}
})
}
const getBindingLoadRangeList = (dataTypeName) => {
dispatch({
type: 'datamodel.bindingLoadRangeList',
payload: {
dataTypeName
},
callback: data => {
setBindingLoadRangeList(data);
}
})
}
const onSearch = (searchText) => {
const _searchText = searchText.replace(/ /g,'');
if (_searchText !== '') {
dispatchLatest({
type: 'datamodel.autocomplete',
payload: {
params: {
word: _searchText,
isEasyDataModelerDataModelAttribute: false,
}
},
callback: data => {
const _options = [];
(data||[]).forEach(item => {
_options.push({ value: item });
})
setOptions(_options);
}
})
} else {
dispatchLatest({
type: 'datamodel.recommandEnglishWords',
payload: {
params: {
chineseWord: modelerData.cnName,
}
},
callback: data => {
const _options = [];
(data||[]).forEach(item => {
_options.push({ value: item });
})
setOptions(_options);
}
})
}
}
const onValuesChange = (changedValues, allValues) => {
onChange && onChange(changedValues, allValues);
//有手动编辑过英文名称并且有内容的情况下, 不能通过编辑中文名称自动翻译
if (changedValues.hasOwnProperty('name')) {
setAutoTranslate(changedValues.name==='');
} else if (changedValues.hasOwnProperty('cnName')) {
if (autoTranslate) {
dispatchLatest({
type: 'datamodel.translatePhase',
payload: {
params: {
phaseInChinese: changedValues.cnName,
}
},
callback: data => {
if ((data?.translated||'') !== '') {
form?.setFieldsValue({ name: data?.translated||'' });
onChange && onChange({...changedValues, ...{name: data?.translated||''}}, {...allValues, ...{name: data?.translated||''}});
}
}
})
}
} else if (changedValues.hasOwnProperty('dataType')) {
if (changedValues.dataType) {
onChange?.({...changedValues, bindingLoadRange: ''}, {...allValues, bindingLoadRange: ''});
} else {
onChange?.({...changedValues, bindingLoadRange: ''}, {...allValues, bindingLoadRange: ''});
}
}
}
const onOnlyShowRequireChange = () => { const onOnlyShowRequireChange = () => {
setOnlyShowRequireChange(!onlyShowRequireChange); setOnlyShowRequireChange(!onlyShowRequireChange);
...@@ -855,4 +557,302 @@ const ImportActionHeader = (props) => { ...@@ -855,4 +557,302 @@ const ImportActionHeader = (props) => {
) )
} }
export default ImportActionHeader; export default ImportActionHeader;
\ No newline at end of file
const ConstraintSelect = ({ value = {}, constraints = [], onChange, ...restProps }) => {
return (
<Select
onChange={onChange}
value={value?.name || ''}
placeholder='请选择规范'
{...restProps}
>
{
(constraints||[]) && constraints.map((constraint, index) => {
return (
<Option key={index} value={constraint.name||''} >{constraint.cnName||''}</Option>
);
})
}
</Select>
)
}
const TemplateSelect = ({ value = '', modelerData = undefined, templates = [], onChange, ...restProps }) => {
const mountRef = useRef(true);
const [isCustom, setIsCustom] = useState(false);
useEffect(() => {
if (mountRef.current && modelerData && Object.keys(modelerData).length > 0) {
if (modelerData?.tableType && !modelerData?.easyDataModelerModelingTemplate?.name) {
setIsCustom(true);
} else {
setIsCustom(false);
}
mountRef.current = false;
}
}, [modelerData])
return (
<span style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
{
isCustom ? <InputDebounce
placeholder='请输入数据表类型'
allowClear
value={modelerData?.tableType}
onChange={(val) => {
onChange?.(val, true);
}}
style={{ flex: 1 }}
/> : <Select
onChange={(val) => {
onChange?.(val);
}}
value={value || undefined}
placeholder='请选择数据表类型'
allowClear
style={{ flex: 1 }}
{...restProps}
>
{
(templates||[]) && templates.map((template, index) => {
return (
<Option key={index} value={template.cnName||''} >
<Tooltip title={template.remark}>
{template.cnName}
</Tooltip>
</Option>
);
})
}
</Select>
}
<Checkbox className='ml-3' checked={isCustom} onChange={(e) => {
setIsCustom(e.target.checked);
onChange?.('');
}}>自定义</Checkbox>
</span>
)
}
const AttributesSelect = ({ value = [], modelerData, onChange, mode = 'multiple', ...restProps }) => {
const onAttributeChange = (value) => {
let currentAttributes = [];
if (mode === 'multiple') {
currentAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(attribute => (value||[]).indexOf(attribute.iid)!==-1);
} else {
(value||[]).forEach(item => {
const filterAttributes = (newAttributes||[]).filter(attribute => item ===attribute.iid);
if (filterAttributes.length !== 0) {
currentAttributes = [...currentAttributes, ...filterAttributes];
} else {
currentAttributes = [...currentAttributes, { name: item, iid: generateUUID() }];
}
})
}
triggerChange(currentAttributes);
}
const triggerChange = (changedValue) => {
onChange?.(changedValue);
};
//value有可能为空
value = value ? value: [];
let attributeIds = [];
let newAttributes = [...(modelerData?.easyDataModelerDataModelAttributes||[])];
value.forEach(attribute => {
attributeIds.push(attribute.iid);
if (mode === 'tags') {
const filterAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(_attribute => attribute.iid ===_attribute.iid);
if (filterAttributes.length === 0) {
newAttributes = [...newAttributes, attribute];
}
}
})
return (
<Select
onChange={(value) => { onAttributeChange && onAttributeChange(value) }}
value={attributeIds}
placeholder='请选择字段名称'
mode={mode}
allowClear={true}
>
{
(newAttributes||[]).map((attribute, index) => {
return (
<Option key={index} value={attribute.iid?attribute.iid:(attribute.name||'')}>{attribute.name||''}</Option>
);
})
}
</Select>
);
}
const PartitionSelect = ({ value = {}, modelerData, partitionTypes = [], onChange, ...restProps }) => {
const onPartitionTypeChange = (value) => {
let currentPartitionType = {};
(partitionTypes||[]).forEach((partitionType, index) => {
if (value === partitionType.name) {
currentPartitionType = partitionType;
}
})
triggerChange({ partitionType: currentPartitionType });
}
const onAttributeChange = (value) => {
const currentAttributes = (modelerData?.easyDataModelerDataModelAttributes||[]).filter(attribute => (value||[]).indexOf(attribute.iid)!==-1);
triggerChange({ keys: currentAttributes });
}
const triggerChange = (changedValue) => {
onChange?.({
...value,
...changedValue,
});
};
//value有可能为空
value = value ? value: {};
let attributeIds = [];
(value?.keys||[]).forEach(attribute => {
attributeIds.push(attribute.iid);
})
return (
<Row gutter={10}>
<Col span={10}>
<Select
onChange={onPartitionTypeChange}
value={value?.partitionType?.name}
placeholder='请选择分区类型'
allowClear={true}
>
{
(partitionTypes||[]).map((partitionType, index) => {
return (
<Option key={partitionType.name||''}>{partitionType.cnName||''}</Option>
);
})
}
</Select>
</Col>
<Col span={14}>
<Select
onChange={(value) => { onAttributeChange && onAttributeChange(value) }}
value={attributeIds}
placeholder='请选择字段名称'
mode='multiple'
allowClear={true}
>
{
(modelerData?.easyDataModelerDataModelAttributes||[]).map((attribute, index) => {
return (
<Option key={index} value={attribute.iid||''}>{attribute.name||''}</Option>
);
})
}
</Select>
</Col>
</Row>
);
}
const LoadSelect = ({ value = '', onChange, ...restProps }) => {
const onLoadChange = (value) => {
triggerChange(value.join('/'));
}
const triggerChange = (changedValue) => {
onChange?.(changedValue);
};
//value有可能为空
value = value ? value: '';
let loadNames = [];
if (value !== '') {
value.split('/').forEach(item => {
loadNames.push(item);
})
}
return (
<Select
mode="tags"
tokenSeparators={['/', ' ']}
onChange={(value) => { onLoadChange && onLoadChange(value) }}
value={loadNames}
placeholder='请选择或者手动输入加载方式'
allowClear={true}
>
{
loadOptions.map((item, index) => {
return (
<Option key={index} value={item}>{item}</Option>
);
})
}
</Select>
);
}
const UpdateSelect = ({ value = '', onChange, ...restProps }) => {
const onUpdateChange = (value) => {
triggerChange(value.join('/'));
}
const triggerChange = (changedValue) => {
onChange?.(changedValue);
};
//value有可能为空
value = value ? value: '';
let updateNames = [];
if (value !== '') {
value.split('/').forEach(item => {
updateNames.push(item);
})
}
return (
<Select
mode="tags"
tokenSeparators={['/', ' ']}
onChange={(value) => { onUpdateChange && onUpdateChange(value) }}
value={updateNames}
allowClear={true}
{...restProps}
>
{
updateOptions.map((item, index) => {
return (
<Option key={index} value={item}>{item}</Option>
);
})
}
</Select>
);
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment