Skip to content

S
szse
Commit 81b1ba61 by zhaochengxiang
Options

模型基本信息调整

parent 20762b73
Showing with 178 additions and 109 deletions
src/view/Manage/DataMaster/Define/Component/UpdateBasicInfo.jsx
......@@ -37,7 +37,7 @@ const UpdateBasicInfo = (props) => {
</Col>
<Col xs={24} sm={24} lg={12}>
<Form.Item label='模版描述' name='comment'>
<TextArea row={4} />
<TextArea rows={4} />
</Form.Item>
</Col>
</Row>
......
src/view/Manage/Model/Component/ImportActionHeader.jsx
import React, { useState, useEffect } from 'react';
import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Button, Divider } from 'antd';
import React, { useState, useEffect, useMemo } from 'react';
import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Button, Divider, Tooltip } from 'antd';
import { DownOutlined, UpOutlined } from '@ant-design/icons';
import { highlightSearchContentByTerms, generateUUID } from '../../../../util';
......@@ -42,6 +42,24 @@ const updateOptions = [
'作业提交',
'脚本加载',
];
const tableTypeOptions = [
{ title: '实时表', remark: '实时加载的数据表' },
{ title: '手工配置表', remark: '手工维护的配置表、定义表、类别表、对照表等' },
{ title: '配置参数表', remark: '自动更新的配置表、定义表、类别表、对照表等' },
{ title: '原始数据表', remark: '经过规范化处理的与贴源数据类似的数据表' },
{ title: '基础数据表', remark: '按照特定业务主体进行融合的基础数据' },
{ title: '明细数据表', remark: '系统内不可细分的数据表，一般用于业务流水类的数据' },
{ title: '汇总统计表', remark: '基于常用共性的维度组合的数据表' },
{ title: '集市表', remark: '数仓提供的、面向特定应用领域组织的数据表，通常是大宽表' },
{ title: '分析表', remark: '面向应用的标签、画像、关系图谱表' },
{ title: '应用表', remark: '应用平台自身产生、使用和通过应用平台维护的数据' },
];
const etlTableTypeData = {
full: ['chain', 'daily', 'current', 'chain,current', 'daily,current', 'chain,daily,current'],
change: ['chain', 'current', 'chain,current', 'daily,current', 'chain,daily,current'],
};
const etlTableTypeRemark = '描述ETL框架中目标表的数据类型';
const etlLoadRemark = '描述ETL框架绑定加载列表，如chain、daily、current等';
const ConstraintSelect = ({ value = {}, constraints = [], onChange, ...restProps }) => {
......@@ -186,10 +204,10 @@ const PartitionSelect = ({ value = {}, modelerData, partitionTypes = [], onChang
return (
<Row gutter={10}>
<Col span={8}>
<Col span={10}>
<Select
onChange={onPartitionTypeChange}
value={value?.partitionType?.name || ''}
value={value?.partitionType?.name}
placeholder='请选择分区类型'
allowClear={true}
>
......@@ -202,7 +220,7 @@ const PartitionSelect = ({ value = {}, modelerData, partitionTypes = [], onChang
}
</Select>
</Col>
<Col span={16}>
<Col span={14}>
<Select
onChange={(value) => { onAttributeChange && onAttributeChange(value) }}
value={attributeIds}
......@@ -251,7 +269,7 @@ const LoadSelect = ({ value = '', onChange, ...restProps }) => {
tokenSeparators={['/', ' ']}
onChange={(value) => { onLoadChange && onLoadChange(value) }}
value={loadNames}
placeholder='请选择选择或者手动输入加载方式'
placeholder='请选择或者手动输入加载方式'
allowClear={true}
>
{
......@@ -292,8 +310,8 @@ const UpdateSelect = ({ value = '', onChange, ...restProps }) => {
tokenSeparators={['/', ' ']}
onChange={(value) => { onUpdateChange && onUpdateChange(value) }}
value={updateNames}
placeholder='请选择选择或者手动输入更新时间'
allowClear={true}
{...restProps}
>
{
updateOptions.map((item, index) => {
......@@ -351,6 +369,86 @@ const ImportActionHeader = (props) => {
//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;
}, [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;
}, [editable, modelerData])
//类主键
const semiPrimaryDescription = useMemo(() => {
let newSemiPrimaryDescription = ''
if (modelerData?.easyDataModelerSemiPrimaryKey) {
(modelerData?.easyDataModelerSemiPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
newSemiPrimaryDescription += ',';
}
newSemiPrimaryDescription += item.name||'';
})
}
return newSemiPrimaryDescription;
}, [editable, modelerData])
const formItemLayout = {
labelCol: {
xs: { span: 24 },
......@@ -448,70 +546,6 @@ const ImportActionHeader = (props) => {
setOnlyShowRequireChange(!onlyShowRequireChange);
}
let distributionDescription = '', primaryDescription = '', partitionsDescription = '', semiPrimaryDescription = '', maintenanceDescription = '';
if (!editable && modelerData) {
//分布
if (modelerData?.easyDataModelerDistributionKey) {
(modelerData?.easyDataModelerDistributionKey||[]).forEach((item, index) => {
if (index > 0) {
distributionDescription += ',';
}
distributionDescription += item.name||'';
});
}
//主键
if (modelerData?.easyDataModelerPrimaryKey) {
(modelerData?.easyDataModelerPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
primaryDescription += ',';
}
primaryDescription += item.name||'';
})
}
//分区
if (modelerData?.partition?.keys) {
(modelerData?.partition?.keys||[]).forEach((item, index) => {
if (index > 0) {
partitionsDescription += ',';
}
partitionsDescription += item.name||'';
})
}
if (modelerData?.partition?.partitionType?.cnName) {
partitionsDescription += '/' + modelerData?.partition?.partitionType?.cnName||'';
}
//类主键
if (modelerData?.easyDataModelerSemiPrimaryKey) {
(modelerData?.easyDataModelerSemiPrimaryKey||[]).forEach((item, index) => {
if (index > 0) {
semiPrimaryDescription += ',';
}
semiPrimaryDescription += item.name||'';
})
}
}
if ((maintenanceRecords||[]).length>0) {
maintenanceRecords.forEach((record, index) => {
if (index !== 0) {
maintenanceDescription += '/';
}
maintenanceDescription += record;
})
form?.setFieldsValue({ maintenanceRecords: maintenanceDescription });
}
return (
<div className='model-import-action-header'>
<div
......@@ -571,15 +605,27 @@ const ImportActionHeader = (props) => {
rules={[{ required: true, message: '请输入数据内容!' }]}
style={{ marginBottom: 15 }}
>
<TextArea row={4} />
<TextArea rows={4} placeholder='描述数据表包含的业务数据，包括数据内容业务描述、表的适用范围、数据粒度、数据统计口径、数据来源等。对于原始数据表，可以说明加载的源接口信息。' />
</Form.Item>
</Col>
</Row>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据表类型"
name="tableType"
rules={[{ required: true, message: '请选择数据表类型!' }]}
>
<Select allowClear placeholder='请选择数据表类型'>
{
!onlyShowRequireChange && <Divider style={{ margin: '0 0 15px' }} />
tableTypeOptions.map((item, index) => <Option key={index} value={item.title}>
<Tooltip title={item.remark}>
{item.title}
</Tooltip>
</Option>)
}
{
!onlyShowRequireChange && <Row gutter={10}>
</Select>
</Form.Item>
</Col>
<Row gutter={10}>
{/* <Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="生成表类型"
......@@ -594,10 +640,10 @@ const ImportActionHeader = (props) => {
</Col> */}
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据表类型"
name="tableType"
label="技术主键"
name="easyDataModelerPrimaryKey"
>
<Input />
<AttributesSelect modelerData={modelerData} mode='tags' />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
......@@ -605,7 +651,7 @@ const ImportActionHeader = (props) => {
label="数据平台"
name="dataResidence"
>
<Input disabled={true} />
<Input disabled={true} placeholder='描述数据表落地的数据平台及数据库' />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
......@@ -613,7 +659,7 @@ const ImportActionHeader = (props) => {
label="数据情况"
name="dataCircumstances"
>
<Input />
<Input placeholder='描述数据表中数据的更新频率、每日增量情况、数据量级和历史数据' />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
......@@ -624,6 +670,29 @@ const ImportActionHeader = (props) => {
<AttributesSelect modelerData={modelerData} />
</Form.Item>
</Col>
{/* <Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据类型"
name=""
tooltip={etlTableTypeRemark}
>
<Select allowClear placeholder='请选择数据类型'>
{
Object.keys(etlTableTypeData).map((item, index) => <Option key={index} value={item}>
{item}
</Option>)
}
</Select>
</Form.Item>
</Col> */}
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="更新时间"
name="dataUpdatingTiming"
>
<UpdateSelect placeholder='描述数据表的更新时间点'/>
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="分区键"
......@@ -632,12 +701,27 @@ const ImportActionHeader = (props) => {
<PartitionSelect modelerData={modelerData} partitionTypes={supportedPartitionTypes} />
</Form.Item>
</Col>
{/* <Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="绑定加载范围"
name=""
tooltip={etlLoadRemark}
>
<Select allowClear placeholder='请选择绑定加载范围'>
{
// Object.keys(etlTableTypeData).map((item, index) => <Option key={index} value={item}>
// {item}
// </Option>)
}
</Select>
</Form.Item>
</Col> */}
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="技术主键"
name="easyDataModelerPrimaryKey"
label="维护历史"
name="maintenanceRecords"
>
<AttributesSelect modelerData={modelerData} mode='tags' />
<TextArea rows={3} disabled={true} />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
......@@ -656,24 +740,8 @@ const ImportActionHeader = (props) => {
<LoadSelect />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="更新时间"
name="dataUpdatingTiming"
>
<UpdateSelect />
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="维护历史"
name="maintenanceRecords"
>
<TextArea rows={3} disabled={true} />
</Form.Item>
</Col>
</Row>
}
</Row>
</Form>
) : (
<React.Fragment>
......@@ -697,6 +765,7 @@ const ImportActionHeader = (props) => {
</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>规范</div>} >{modelerData.easyDataModelerModelingConstraint?(modelerData.easyDataModelerModelingConstraint.cnName||''):''}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据内容</div>}>{highlightSearchContentByTerms(modelerData.remark||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据表类型</div>} >{highlightSearchContentByTerms(modelerData.tableType||'', terms)}</Descriptions.Item>
</Descriptions>
{
!onlyShowRequireChange && <Divider style={{ margin: '0 0 15px' }} />
......@@ -704,15 +773,14 @@ const ImportActionHeader = (props) => {
{
!onlyShowRequireChange && <Descriptions column={3}>
{/* <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>生成表类型</div>} >{modelerData.easyDataModelerModelingTemplate?(modelerData.easyDataModelerModelingTemplate.cnName||''):''}</Descriptions.Item> */}
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据表类型</div>} >{highlightSearchContentByTerms(modelerData.tableType||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>技术主键</div>} >{highlightSearchContentByTerms(primaryDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据平台</div>} >{highlightSearchContentByTerms(modelerData.dataResidence||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据情况</div>} >{highlightSearchContentByTerms(modelerData.dataCircumstances||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>分布键</div>} >{highlightSearchContentByTerms(distributionDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>分区键</div>} >{highlightSearchContentByTerms(partitionsDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>技术主键</div>} >{highlightSearchContentByTerms(primaryDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>类主键</div>} >{highlightSearchContentByTerms(semiPrimaryDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>加载方式</div>} >{highlightSearchContentByTerms(modelerData.dataLoadingStrategy||'', terms)}</Descriptions.Item>
{/* <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>数据类型</div>} ></Descriptions.Item> */}
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>更新时间</div>} >{highlightSearchContentByTerms(modelerData.dataUpdatingTiming||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>分区键</div>} >{highlightSearchContentByTerms(partitionsDescription||'', terms)}</Descriptions.Item>
{/* <Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>绑定加载范围</div>} ></Descriptions.Item> */}
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>维护历史</div>} >
<div>
{
......@@ -722,6 +790,8 @@ const ImportActionHeader = (props) => {
}
</div>
</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>类主键</div>} >{highlightSearchContentByTerms(semiPrimaryDescription||'', terms)}</Descriptions.Item>
<Descriptions.Item label={<div style={{ textAlign: 'right', width: 85 }}>加载方式</div>} >{highlightSearchContentByTerms(modelerData.dataLoadingStrategy||'', terms)}</Descriptions.Item>
</Descriptions>
}
</React.Fragment>
......
src/view/Manage/Model/Component/ImportActionTable.jsx
......@@ -196,7 +196,6 @@ export const EditableCell = ({
);
}
return (
<td {...restProps}>
{editing ? (
......
src/view/Manage/ModelConfig/Component/TemplateActionHeader.jsx
......@@ -53,7 +53,7 @@ const TemplateActionHeader = (props) => {
labelAlign="left"
rules={[{ required: true, message: '请输入描述!' }]}
>
<TextArea row={4} />
<TextArea rows={4} />
</Form.Item>
</Col>
</Row>
......
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