Skip to content

S
szse
Commit ce68e3de by zhaochengxiang
Options

模型校验规范

parent 666a8e31
Showing with 42 additions and 167 deletions
src/view/Manage/Model/Component/ImportActionHeader.jsx
import React, { useState, useEffect, useMemo, useRef } from 'react';
import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Button, Divider, Tooltip, Checkbox, Space } from 'antd';
import { DownOutlined, UpOutlined, ExclamationCircleOutlined, WarningOutlined } from '@ant-design/icons';
import { DownOutlined, UpOutlined, ExclamationCircleFilled, WarningFilled } from '@ant-design/icons';
import { Subject } from 'rxjs';
import { highlightSearchContentByTerms, generateUUID, IsArr } from '../../../../util';
......@@ -868,9 +868,11 @@ const ItemTitle = ({ name, cnName, validateReports }) => {
)
}
export const ValidateTip = ({ validateReports, type, propertyName }) => {
export const ValidateTip = ({ validateReports, type, propertyName, iid }) => {
const reports = useMemo(() => {
const index = (validateReports??[]).findIndex(item => item.type === type)
const index = (validateReports??[]).findIndex(item => (
(item.type === type) && (!item.iid || item.iid === iid)
))
if (index !== -1) {
const items = (validateReports[index].reportItems??[]).filter(item => item.checkRule?.ruleTemplate?.checkProperty?.originalPropertyEnName === propertyName)
......@@ -916,7 +918,7 @@ export const ValidateTip = ({ validateReports, type, propertyName }) => {
(reports??[]).map((item, index) => (
<Row key={index}>
<Space>
{ (item.alertTypeId === 'enforced') ? <WarningOutlined style={{ color: '#E94848' }} /> : <ExclamationCircleOutlined style={{ color: '#F7AB00' }} /> }
{ (item.alertTypeId === 'enforced') ? <WarningFilled style={{ color: '#E94848' }} /> : <ExclamationCircleFilled style={{ color: '#F7AB00' }} /> }
<span>{item.tip}</span>
</Space>
</Row>
......@@ -925,7 +927,7 @@ export const ValidateTip = ({ validateReports, type, propertyName }) => {
</div>
}>
{
(reports??[]).findIndex(item => item.alertTypeId === 'enforced') !== -1 ? <WarningOutlined style={{ color: '#E94848' }} /> : <ExclamationCircleOutlined style={{ color: '#F7AB00' }} />
(reports??[]).findIndex(item => item.alertTypeId === 'enforced') !== -1 ? <WarningFilled style={{ color: '#E94848' }} /> : <ExclamationCircleFilled style={{ color: '#F7AB00' }} />
}
</Tooltip>
}
......
src/view/Manage/Model/Component/ImportActionIndex.jsx
......@@ -11,6 +11,7 @@ import DebounceInput from './DebounceInput';
import { addEventListenerForSidebar, removeEventListenerForSidebar } from './Help';
import { showMessage, highlightSearchContentByTerms, inputWidth } from '../../../../util';
import { EditModelContext } from './ContextManage';
import { ValidateTip } from './ImportActionHeader';
const { Option } = Select;
......@@ -666,9 +667,12 @@ const ImportActionIndex = (props) => {
ellipsis: true,
render: (text, record, index) => {
return (
<React.Fragment>
<ValidateTip type='Index' propertyName='name' validateReports={validateReports} iid={record.name} />
<Tooltip title={text||''}>
<span style={{ fontWeight: 'bold' }} >{highlightSearchContentByTerms(text, termsRef.current)}</span>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -772,79 +776,10 @@ const ImportActionIndex = (props) => {
},
]
const validateColumn = {
title: '规范',
dataIndex: 'validate',
width: 180,
ellipsis: true,
render: (text, record, index) => {
let shortCauses = [];
let causes = [];
(validateReports||[]).forEach((report) => {
if (report.type==='Index' && report.iid === record.name) {
(report.reportItems||[]).forEach((item) => {
shortCauses.push(item.shortCause||'');
causes.push(item.cause||'');
})
}
});
return (
<div className='d-flex' key={index} style={{ alignItems: 'center', justifyContent: 'space-between' }}>
<div>
{
shortCauses && shortCauses.map((shortCause, index) => {
return (
<Tooltip key={index} title={shortCause}>
<div className='textOverflow' style={{ width: 130, color: '#f5222d' }} title={shortCause} key={index}>
<span>{shortCause||''}</span>
</div>
</Tooltip>
);
})
}
</div>
{
(causes||[]).length>0 && <Popover
content={
<div style={{ maxWidth: 200, maxHeight: 200, wordWrap: 'break-word', overflow: 'auto' }}>
{
causes && causes.map((cause, index) => {
return (
<Typography.Paragraph key={index} >
{cause||''}
</Typography.Paragraph>
)
})
}
</div>
}
title="规则详情"
>
<a href="#">详情</a>
</Popover>
}
</div>
)
}
};
const includeValidateColumn = [
...columns,
validateColumn
]
const includeValidateEditableColumn = [
...editableColumn,
validateColumn
]
const mergedColumns = () => {
const hasValidateReports = (validateReports||[]).filter(report => report.type==='Index').length>0;
if (editable) {
let _columns = hasValidateReports ? includeValidateEditableColumn: editableColumn;
let _columns = editableColumn;
return _columns.map((col) => {
if (!col.editable) {
......@@ -866,7 +801,7 @@ const ImportActionIndex = (props) => {
});
}
return hasValidateReports ? includeValidateColumn : columns;
return columns;
}
const moveRow = useCallback(
......
src/view/Manage/Model/Component/ImportActionTable.jsx
......@@ -17,6 +17,7 @@ import DebounceInput from './DebounceInput';
import SuggestTable from './SuggestTable';
import { AttentionSvg, UnAttentionSvg } from './ModelSvg';
import { EditModelContext } from './ContextManage';
import { ValidateTip } from './ImportActionHeader';
import './ImportActionTable.less';
import 'react-contexify/dist/ReactContexify.css';
......@@ -312,13 +313,14 @@ export const ImportActionTable = (props) => {
ellipsis: true,
require: true,
fixed: 'left',
render: (text, _, __) => {
render: (text, record, __) => {
return (
<React.Fragment>
<ValidateTip type='DataModelAttribute' propertyName='cnName' validateReports={validateReports} iid={record.iid} />
<Tooltip title={text||''}>
<span>
{highlightSearchContentByTerms(text, termsRef.current)}
</span>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -331,9 +333,12 @@ export const ImportActionTable = (props) => {
require: true,
render: (text, record, index) => {
return (
<React.Fragment>
<ValidateTip type='DataModelAttribute' propertyName='name' validateReports={validateReports} iid={record.iid} />
<Tooltip title={text||''}>
<span style={{ fontWeight: 'bold' }} >{highlightSearchContentByTerms(text, termsRef.current)}</span>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -436,13 +441,14 @@ export const ImportActionTable = (props) => {
ellipsis: true,
require: true,
width: 200,
render: (text, _, __) => {
render: (text, record, __) => {
return (
<React.Fragment>
<ValidateTip type='DataModelAttribute' propertyName='remark' validateReports={validateReports} iid={record.iid} />
<Tooltip title={text||''}>
<Typography.Text ellipsis={true}>
{highlightSearchContentByTerms(text, termsRef.current)}
</Typography.Text>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -468,13 +474,14 @@ export const ImportActionTable = (props) => {
editable: true,
ellipsis: true,
width: 200,
render: (text, _, __) => {
render: (text, record, __) => {
return (
<React.Fragment>
<ValidateTip type='DataModelAttribute' propertyName='definition' validateReports={validateReports} iid={record.iid} />
<Tooltip title={text||''}>
<Typography.Text ellipsis={true}>
{highlightSearchContentByTerms(text, termsRef.current)}
</Typography.Text>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -484,13 +491,14 @@ export const ImportActionTable = (props) => {
editable: true,
ellipsis: true,
width: 100,
render: (text, _, __) => {
render: (text, record, __) => {
return (
<React.Fragment>
<ValidateTip type='DataModelAttribute' propertyName='valueRange' validateReports={validateReports} iid={record.iid} />
<Tooltip title={text||''}>
<Typography.Text ellipsis={true}>
{highlightSearchContentByTerms(text, termsRef.current)}
</Typography.Text>
<span>{highlightSearchContentByTerms(text, termsRef.current)}</span>
</Tooltip>
</React.Fragment>
)
}
},
......@@ -1026,79 +1034,9 @@ export const ImportActionTable = (props) => {
},
]
const validateColumn = {
title: '规范',
dataIndex: 'validate',
//小屏幕下隐藏规范, 给编辑多点空间
width: (tableWidth<1300 && editable)?0:200,
fixed: 'right',
render: (text, record, index) => {
let shortCauses = [];
let causes = [];
(validateReports||[]).forEach((report) => {
if (report.type==='DataModelAttribute' && report.iid === record.iid) {
(report.reportItems||[]).forEach((item) => {
shortCauses.push(item.shortCause||'');
causes.push(item.cause||'');
})
}
});
return (
<div className='d-flex' key={index} style={{ alignItems: 'center', justifyContent: 'space-between' }}>
<div>
{
shortCauses && shortCauses.map((shortCause, index) => {
return (
<Tooltip title={shortCause}>
<div className='textOverflow' style={{ width: 130, color: '#f5222d' }} key={index}>
<span>{shortCause||''}</span>
</div>
</Tooltip>
);
})
}
</div>
{
(causes||[]).length>0 && <Popover
content={
<div style={{ maxWidth: 200, maxHeight: 200, wordWrap: 'break-word', overflow: 'auto' }}>
{
causes && causes.map((cause, index) => {
return (
<Typography.Paragraph key={index} >
{cause||''}
</Typography.Paragraph>
)
})
}
</div>
}
title="规则详情"
>
<a href="#">详情</a>
</Popover>
}
</div>
)
}
};
const includeValidateColumn = [
...cols,
validateColumn
]
const includeValidateEditableColumn = [
...editableColumn,
validateColumn
]
const mergedColumns = () => {
const hasValidateReports = (validateReports||[]).filter(report => report.type==='DataModelAttribute').length>0;
if (editable) {
let _columns = hasValidateReports ? includeValidateEditableColumn: editableColumn;
let _columns = editableColumn;
_columns = _columns.map((col) => {
if (!col.editable) {
......@@ -1140,10 +1078,10 @@ export const ImportActionTable = (props) => {
setColumns(_columns);
} else {
let _columns = hasValidateReports ? includeValidateColumn: cols;
let _columns = cols;
if (action === 'flow') {
_columns = hasValidateReports ? includeValidateEditableColumn: editableColumn;
_columns = editableColumn;
}
// _columns = _columns.filter((col) => col.dataIndex!=='needAttention');
......
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