Skip to content

S
szse
Commit ded4c524 by zhaochengxiang
Options

模型规范

parent 4b48455b
Showing with 247 additions and 16 deletions
src/model/datamodel.js
......@@ -77,6 +77,10 @@ export function* getAllConstraintsAndTemplates() {
return { constraints, templates };
}
export function* getAllConstraints() {
return yield call(datamodelerService.constraints);
}
export function* getAllTemplates() {
return yield call(datamodelerService.templates);
}
......
src/view/Manage/Model/Component/ConstraintDetail.jsx 0 → 100644
import React, { useEffect, useState } from 'react';
import { Table } from 'antd';
import { dispatch } from '../../../../model';
const ConstraintDetail = () => {
const [ constraints, setConstraints ] = useState([]);
const [ expandedRowKeys, setExpandedRowKeys ] = useState([]);
useEffect(() => {
dispatch({
type: 'datamodel.getAllConstraints',
callback: data => {
setConstraints(data||[]);
if ((data||[]).length > 0) {
setExpandedRowKeys([data[0].id||'']);
}
}
})
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [])
const columns = [
{
title: '中文名称',
dataIndex: 'cnName',
ellipsis: true,
width: 150,
},
{
title: '英文名称',
dataIndex: 'name',
ellipsis: true,
width: 150,
},
{
title: '描述',
dataIndex: 'description',
ellipsis: true,
}
];
return (
<div style={{ width: 600, maxHeight: 600, wordWrap: 'break-word', overflow: 'auto' }}>
<Table
columns={columns}
dataSource={constraints||[]}
rowKey='id'
size='small'
expandable={{
expandedRowRender: record => {
return (
<>
{
record.allRules && record.allRules.map((rule, index) => {
return (
<div key={index}>
{`中文名称: ${rule.name||''} 描述: ${rule.desc||''}`}
</div>
)
})
}
</>
)
},
rowExpandable: record => ((record.allRules||[]).length>0),
expandedRowKeys,
onExpand: (expanded, record) => {
const newExpandedKeys = [...expandedRowKeys];
if (expanded) {
newExpandedKeys.push(record.id||'');
} else {
const index = newExpandedKeys.indexOf(record.id||'');
newExpandedKeys.splice(index, 1);
}
setExpandedRowKeys([...newExpandedKeys]);
}
}}
pagination={false}
/>
</div>
)
}
export default ConstraintDetail;
\ No newline at end of file
src/view/Manage/Model/Component/ImportAction.jsx
......@@ -30,7 +30,7 @@ const ImportAction = (props) => {
cnName: '',
name: '',
remark: '',
easyDataModelerModelingTemplate: {}
easyDataModelerModelingTemplate: ''
});
}
......@@ -87,6 +87,7 @@ const ImportAction = (props) => {
setModelerData(newModelerData)
onChange && onChange(newModelerData);
validateDataModel(newModelerData);
}
})
}
......@@ -196,11 +197,15 @@ const ImportAction = (props) => {
})
}
const onIndexChange = (data) => {
const onIndexChange = (data, validate=false) => {
const newModelerData = {...modelerData, easyDataModelerIndices: data};
setModelerData(newModelerData);
onChange && onChange(newModelerData);
if (validate) {
validateDataModel(newModelerData);
}
}
const getIndicesAfterTableChange = (newModelerData) => {
......@@ -228,8 +233,9 @@ const ImportAction = (props) => {
return (
<>
{
<div className='d-flex mb-5'>
<Select value={constraint.name?constraint.name:null} placeholder='请选择规则' style={{ marginLeft: 'auto', minWidth: 100 }} onChange={onConstraintChange} disabled={ action==='detail' } >
<div className='d-flex mb-5' style={{ alignItems: 'center' }}>
<span style={{ marginLeft: 'auto' }}>规范:</span>
<Select className='ml-3' value={constraint.name?constraint.name:null} placeholder='请选择规范' style={{ minWidth: 100 }} onChange={onConstraintChange} disabled={ action==='detail' } >
{
(constraints||[]).map((constraint, index) => {
return (
......@@ -245,6 +251,7 @@ const ImportAction = (props) => {
editable={action!=='detail'}
modelerData={modelerData||{}}
templates={templates}
validateReports={validateReports}
onTemplateChange={onTemplateChange}
/>
<ImportActionTable
......@@ -260,6 +267,7 @@ const ImportAction = (props) => {
modelerData={modelerData||{}}
constraint={constraint}
template={template}
validateReports={validateReports}
onChange={onIndexChange}
editable={action!=='detail'}
/>
......
src/view/Manage/Model/Component/ImportActionHeader.jsx
import React, { useState } from 'react';
import React, { useState, useEffect } from 'react';
import { Form, Input, Row, Col, Descriptions, Select, AutoComplete } from 'antd';
import { dispatchLatest } from '../../../../model';
......@@ -26,10 +26,32 @@ const TemplateSelect = ({ value = {}, templates = [], onChange, ...restProps })
}
const ImportActionHeader = (props) => {
const { editable, form, modelerData, templates, onTemplateChange } = props;
const { editable, form, modelerData, templates, onTemplateChange, validateReports } = props;
const [ causes, setCauses ] = useState([]);
const [ options, setOptions ] = useState([]);
useEffect(() => {
const causes = [];
(validateReports||[]).forEach(report => {
if (report.type === 'DataModel') {
(report.reportItems||[]).forEach((item) => {
causes.push(item.cause||'');
})
}
});
if (editable) {
form.setFields([{ name: 'name', errors: causes }]);
} else {
setCauses(causes);
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [validateReports])
const formItemLayout = {
labelCol: {
xs: { span: 24 },
......@@ -141,7 +163,23 @@ const ImportActionHeader = (props) => {
) : (
<Descriptions>
<Descriptions.Item label="中文名称">{modelerData.cnName||''}</Descriptions.Item>
<Descriptions.Item label="英文名称">{modelerData.name||''}</Descriptions.Item>
<Descriptions.Item label="英文名称">
{
<div>
<div>{modelerData.name||''}</div>
{
(causes||[]).map((cause, index) => {
return (
<div key={index} style={{ color: '#ff4d4f' }}>
{cause}
</div>
)
})
}
</div>
}
</Descriptions.Item>
<Descriptions.Item label="数据表类型">{modelerData.easyDataModelerModelingTemplate?(modelerData.easyDataModelerModelingTemplate.cnName||''):''}</Descriptions.Item>
<Descriptions.Item label="描述">{modelerData.remark||''}</Descriptions.Item>
</Descriptions>
......
src/view/Manage/Model/Component/ImportActionIndex.jsx
......@@ -259,7 +259,7 @@ const DragableBodyRow = ({ index, moveRow, className, style, ...restProps }) =>
};
const ImportActionIndex = (props) => {
const { modelerData, onChange, editable, constraint, template } = props;
const { modelerData, onChange, editable, constraint, template, validateReports } = props;
const [ attributes, setAttributes ] = useState([]);
const [ data, setData ] = useState([]);
......@@ -503,10 +503,77 @@ const ImportActionIndex = (props) => {
},
]
const validateColumn = {
title: '规范',
dataIndex: 'validate',
width: 180,
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 (
<div className='textOverflow' style={{ width: 130, color: '#f5222d' }} title={shortCause} key={index}>
<span>{shortCause||''}</span>
</div>
);
})
}
</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="规则详情"
trigger="click"
>
<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 = editableColumn;
let _columns = hasValidateReports ? includeValidateEditableColumn: editableColumn;
return _columns.map((col) => {
if (!col.editable) {
......@@ -527,7 +594,7 @@ const ImportActionIndex = (props) => {
});
}
return columns;
return hasValidateReports ? includeValidateColumn : columns;
}
const moveRow = useCallback(
......@@ -577,7 +644,7 @@ const ImportActionIndex = (props) => {
/>
</div>
{
editable && <Button className='ml-3' type="primary" onClick={onAddClick} disabled={ editingKey!==null || keyword!=='' } >新增行</Button>
editable && <Button className='ml-3' type="primary" onClick={onAddClick} disabled={ editingKey!==null || keyword!=='' } >新增索引</Button>
}
</div>
<DndProvider backend={HTML5Backend} >
......
src/view/Manage/Model/Component/ImportActionTable.jsx
......@@ -305,8 +305,24 @@ const ImportActionTable = (props) => {
})
const newData = [...data];
const index = newData.findIndex((item) => editingKey === item.iid);
//判断字段名称是否唯一
let _index;
if (index === -1) {
_index = (data||[]).findIndex(item => item.name === row.name);
} else {
const newDataExcludeSelf = [...data];
newDataExcludeSelf.splice(index, 1);
_index = (newDataExcludeSelf||[]).findIndex(item => item.name === row.name);
}
if (_index !== -1) {
form.setFields([{ name: 'name', errors: ['字段名称不能重复'] }]);
return;
}
if (index === -1) {
newData.splice(0, 0, row);
......@@ -527,7 +543,7 @@ const ImportActionTable = (props) => {
let shortCauses = [];
let causes = [];
(validateReports||[]).forEach((report) => {
if (report.iid === record.iid) {
if (report.type==='DataModelAttribute' && report.iid === record.iid) {
(report.reportItems||[]).forEach((item) => {
shortCauses.push(item.shortCause||'');
causes.push(item.cause||'');
......@@ -585,9 +601,11 @@ const ImportActionTable = (props) => {
]
const mergedColumns = () => {
const hasValidateReports = (validateReports||[]).filter(report => report.type==='DataModelAttribute').length>0;
if (editable) {
let _columns = (validateReports||[]).length>0 ? includeValidateEditableColumn: editableColumn;
let _columns = hasValidateReports ? includeValidateEditableColumn: editableColumn;
return _columns.map((col) => {
if (!col.editable) {
......@@ -608,7 +626,7 @@ const ImportActionTable = (props) => {
});
}
return (validateReports||[]).length>0 ? includeValidateColumn : columns;
return hasValidateReports ? includeValidateColumn : columns;
}
const moveRow = useCallback(
......@@ -658,7 +676,7 @@ const ImportActionTable = (props) => {
/>
</div>
{
editable && <Button className='ml-3' type="primary" onClick={onAddClick} disabled={ editingKey!=='' || keyword!=='' } >新增行</Button>
editable && <Button className='ml-3' type="primary" onClick={onAddClick} disabled={ editingKey!=='' || keyword!=='' } >新增字段</Button>
}
</div>
<DndProvider backend={HTML5Backend} >
......
src/view/Manage/Model/index.jsx
import React from 'react';
import { Row, Col, Button, Input, Space } from 'antd';
import { Row, Col, Button, Input, Space, Popover } from 'antd';
import copy from "copy-to-clipboard";
import ModelTree from './Component/ModelTree';
import ModelTable from './Component/ModelTable';
import WordTemplateModal from './Component/WordTemplateModal';
import TemplateCURDModal from './Component/TemplateCURDModal';
import ConstraintDetail from './Component/ConstraintDetail';
import ImportModal from './Component/ImportModal';
import ExportDDLModal from './Component/ExportDDLModal';
import { showMessage, showNotifaction } from '../../../util';
......@@ -234,6 +235,13 @@ class Model extends React.Component {
<Space>
<Button type="primary" onClick={this.onWordTemplateCURDClick}>Word模版配置</Button>
<Button type="primary" onClick={this.onTemplateCURDClick}>字段追加配置</Button>
<Popover
placement="bottomRight"
content={<ConstraintDetail />}
title='规范详情'
trigger="hover">
<Button type="primary">规范详情</Button>
</Popover>
</Space>
</div>
<div
......
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