Commit 9cd1c070 by zhaochengxiang

模型tab页取消,改单页滚动,基本信息显示必填部分,其他收缩可下拉查看 提Bug

parent c495655d
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
} }
.edit-container-card { .edit-container-card {
padding: 20px 20px 0; padding: 20px;
background: #fff; background: #fff;
} }
......
...@@ -437,8 +437,6 @@ const ImportAction = (props) => { ...@@ -437,8 +437,6 @@ const ImportAction = (props) => {
return ( return (
<Spin spinning={loading}> <Spin spinning={loading}>
<Tabs activeKey={tabKey} onChange={onTabChange}>
<TabPane tab='基本信息' key='1'>
<ImportActionHeader <ImportActionHeader
form={form} form={form}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'} editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'}
...@@ -451,22 +449,6 @@ const ImportAction = (props) => { ...@@ -451,22 +449,6 @@ const ImportAction = (props) => {
onChange={onHeaderChange} onChange={onHeaderChange}
terms={terms} terms={terms}
/> />
</TabPane>
<TabPane
tab={
<span>
<span>数据表结构</span>
{
(action!=='detail'&&action!=='flow'&&action!=='detail-version') && (
<Popover content='表格可以通过拖拽来排序'>
<QuestionCircleOutlined className='ml-1 pointer' />
</Popover>
)
}
</span>
}
key='2'
>
<ImportActionTable <ImportActionTable
modelerData={modelerData||{}} modelerData={modelerData||{}}
constraint={constraint} constraint={constraint}
...@@ -478,22 +460,6 @@ const ImportAction = (props) => { ...@@ -478,22 +460,6 @@ const ImportAction = (props) => {
action={action} action={action}
terms={terms} terms={terms}
/> />
</TabPane>
<TabPane
tab={
<span>
<span>数据表索引</span>
{
(action!=='detail'&&action!=='flow'&&action!=='detail-version') && (
<Popover content='表格可以通过拖拽来排序'>
<QuestionCircleOutlined className='ml-1 pointer' />
</Popover>
)
}
</span>
}
key='3'
>
<ImportActionIndex <ImportActionIndex
modelerData={modelerData||{}} modelerData={modelerData||{}}
constraint={constraint} constraint={constraint}
...@@ -503,11 +469,6 @@ const ImportAction = (props) => { ...@@ -503,11 +469,6 @@ const ImportAction = (props) => {
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'} editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'}
terms={terms} terms={terms}
/> />
</TabPane>
<TabPane
tab='数据表分区'
key='4'
>
<ImportActionPartition <ImportActionPartition
modelerData={modelerData||{}} modelerData={modelerData||{}}
constraint={constraint} constraint={constraint}
...@@ -518,21 +479,6 @@ const ImportAction = (props) => { ...@@ -518,21 +479,6 @@ const ImportAction = (props) => {
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'} editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'}
terms={terms} terms={terms}
/> />
</TabPane>
</Tabs>
{
action!=='detail'&&action!=='flow'&&action!=='detail-version'&&(
<React.Fragment>
<Divider style={{ margin: 0 }} />
<div className='flex' style={{ justifyContent: 'flex-end', height: 64, alignItems: 'center' }}>
<Space size='small'>
<Button type='primary' onClick={prevStep} disabled={tabKey==='1'} danger>上一步</Button>
<Button type='primary' onClick={nextStep} disabled={tabKey==='4'} danger>下一步</Button>
</Space>
</div>
</React.Fragment>
)
}
</Spin> </Spin>
); );
}; };
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Input, Row, Col, Descriptions, Select, AutoComplete } from 'antd'; import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Checkbox } from 'antd';
import { highlightSearchContentByTerms } from '../../../../util'; import { highlightSearchContentByTerms } from '../../../../util';
import { dispatchLatest } from '../../../../model'; import { dispatchLatest } from '../../../../model';
...@@ -57,6 +57,7 @@ const ImportActionHeader = (props) => { ...@@ -57,6 +57,7 @@ const ImportActionHeader = (props) => {
const [ options, setOptions ] = useState([]); const [ options, setOptions ] = useState([]);
const [ autoTranslate, setAutoTranslate ] = useState(false); const [ autoTranslate, setAutoTranslate ] = useState(false);
const [ onlyShowRequireChange, setOnlyShowRequireChange ] = useState(true);
useEffect(() => { useEffect(() => {
...@@ -168,8 +169,21 @@ const ImportActionHeader = (props) => { ...@@ -168,8 +169,21 @@ const ImportActionHeader = (props) => {
} }
} }
const onOnlyShowRequireChange = (e) => {
setOnlyShowRequireChange(e.target.checked);
}
return ( return (
<div className='model-import-action-header'> <div className='model-import-action-header'>
<div
style={{
display: 'flex',
justifyContent: 'space-between',
}}
>
<h2>基本信息</h2>
<Checkbox onChange={onOnlyShowRequireChange} defaultChecked={onlyShowRequireChange} value={onlyShowRequireChange}>仅显示必填项</Checkbox>
</div>
{ {
editable ? ( editable ? (
<Form <Form
...@@ -198,8 +212,6 @@ const ImportActionHeader = (props) => { ...@@ -198,8 +212,6 @@ const ImportActionHeader = (props) => {
<AutoComplete options={options} onSearch={onSearch} style={{ width: 300 }} /> <AutoComplete options={options} onSearch={onSearch} style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row >
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="规范" label="规范"
...@@ -214,11 +226,24 @@ const ImportActionHeader = (props) => { ...@@ -214,11 +226,24 @@ const ImportActionHeader = (props) => {
/> />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row >
<Col span={8}>
<Form.Item
label="数据内容"
name="remark"
labelAlign="left"
rules={[{ required: true, message: '请输入数据内容!' }]}
>
<TextArea row={4} style={{ width: 300 }} />
</Form.Item>
</Col>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="生成表类型" label="生成表类型"
name="easyDataModelerModelingTemplate" name="easyDataModelerModelingTemplate"
labelAlign="left" labelAlign="left"
hidden={onlyShowRequireChange}
rules={[{ required: false, message: '请选择生成表类型!' }]} rules={[{ required: false, message: '请选择生成表类型!' }]}
> >
<TemplateSelect <TemplateSelect
...@@ -228,17 +253,18 @@ const ImportActionHeader = (props) => { ...@@ -228,17 +253,18 @@ const ImportActionHeader = (props) => {
/> />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="数据表类型" label="数据表类型"
name="tableType" name="tableType"
labelAlign="left" labelAlign="left"
hidden={onlyShowRequireChange}
> >
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row hidden={onlyShowRequireChange}>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="数据平台" label="数据平台"
...@@ -248,13 +274,12 @@ const ImportActionHeader = (props) => { ...@@ -248,13 +274,12 @@ const ImportActionHeader = (props) => {
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="数据情况" label="数据情况"
name="dataCircumstances" name="dataCircumstances"
labelAlign="left" labelAlign="left"
hidden={onlyShowRequireChange}
> >
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
...@@ -269,7 +294,7 @@ const ImportActionHeader = (props) => { ...@@ -269,7 +294,7 @@ const ImportActionHeader = (props) => {
</Form.Item> </Form.Item>
</Col> </Col>
</Row> </Row>
<Row> <Row hidden={onlyShowRequireChange}>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="分区键" label="分区键"
...@@ -288,8 +313,6 @@ const ImportActionHeader = (props) => { ...@@ -288,8 +313,6 @@ const ImportActionHeader = (props) => {
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="类主键" label="类主键"
...@@ -299,6 +322,8 @@ const ImportActionHeader = (props) => { ...@@ -299,6 +322,8 @@ const ImportActionHeader = (props) => {
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row hidden={onlyShowRequireChange}>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="加载方式" label="加载方式"
...@@ -308,8 +333,6 @@ const ImportActionHeader = (props) => { ...@@ -308,8 +333,6 @@ const ImportActionHeader = (props) => {
<Input style={{ width: 300 }} /> <Input style={{ width: 300 }} />
</Form.Item> </Form.Item>
</Col> </Col>
</Row>
<Row>
<Col span={8}> <Col span={8}>
<Form.Item <Form.Item
label="更新时间" label="更新时间"
...@@ -329,21 +352,9 @@ const ImportActionHeader = (props) => { ...@@ -329,21 +352,9 @@ const ImportActionHeader = (props) => {
</Form.Item> </Form.Item>
</Col> </Col>
</Row> </Row>
<Row>
<Col span={8}>
<Form.Item
label="数据内容"
name="remark"
labelAlign="left"
rules={[{ required: true, message: '请输入数据内容!' }]}
>
<TextArea row={4} style={{ width: 300 }} />
</Form.Item>
</Col>
</Row>
</Form> </Form>
) : ( ) : (
<Descriptions column={2}> <Descriptions column={3}>
<Descriptions.Item label="中文名称">{highlightSearchContentByTerms(modelerData.cnName||'', terms)}</Descriptions.Item> <Descriptions.Item label="中文名称">{highlightSearchContentByTerms(modelerData.cnName||'', terms)}</Descriptions.Item>
<Descriptions.Item label="英文名称"> <Descriptions.Item label="英文名称">
{ {
...@@ -362,6 +373,9 @@ const ImportActionHeader = (props) => { ...@@ -362,6 +373,9 @@ const ImportActionHeader = (props) => {
} }
</Descriptions.Item> </Descriptions.Item>
<Descriptions.Item label="规范">{modelerData.easyDataModelerModelingConstraint?(modelerData.easyDataModelerModelingConstraint.cnName||''):''}</Descriptions.Item> <Descriptions.Item label="规范">{modelerData.easyDataModelerModelingConstraint?(modelerData.easyDataModelerModelingConstraint.cnName||''):''}</Descriptions.Item>
<Descriptions.Item label="数据内容">{highlightSearchContentByTerms(modelerData.remark||'', terms)}</Descriptions.Item>
{
!onlyShowRequireChange && <React.Fragment>
<Descriptions.Item label="生成表类型">{modelerData.easyDataModelerModelingTemplate?(modelerData.easyDataModelerModelingTemplate.cnName||''):''}</Descriptions.Item> <Descriptions.Item label="生成表类型">{modelerData.easyDataModelerModelingTemplate?(modelerData.easyDataModelerModelingTemplate.cnName||''):''}</Descriptions.Item>
<Descriptions.Item label="数据表类型">{highlightSearchContentByTerms(modelerData.tableType||'', terms)}</Descriptions.Item> <Descriptions.Item label="数据表类型">{highlightSearchContentByTerms(modelerData.tableType||'', terms)}</Descriptions.Item>
<Descriptions.Item label="数据平台">{highlightSearchContentByTerms(modelerData.dataResidence||'', terms)}</Descriptions.Item> <Descriptions.Item label="数据平台">{highlightSearchContentByTerms(modelerData.dataResidence||'', terms)}</Descriptions.Item>
...@@ -373,7 +387,8 @@ const ImportActionHeader = (props) => { ...@@ -373,7 +387,8 @@ const ImportActionHeader = (props) => {
<Descriptions.Item label="加载方式">{highlightSearchContentByTerms(modelerData.dataLoadingStrategy||'', terms)}</Descriptions.Item> <Descriptions.Item label="加载方式">{highlightSearchContentByTerms(modelerData.dataLoadingStrategy||'', terms)}</Descriptions.Item>
<Descriptions.Item label="更新时间">{highlightSearchContentByTerms(modelerData.dataUpdatingTiming||'', terms)}</Descriptions.Item> <Descriptions.Item label="更新时间">{highlightSearchContentByTerms(modelerData.dataUpdatingTiming||'', terms)}</Descriptions.Item>
<Descriptions.Item label="维护历史">{highlightSearchContentByTerms(modelerData.maintenanceRecords||'', terms)}</Descriptions.Item> <Descriptions.Item label="维护历史">{highlightSearchContentByTerms(modelerData.maintenanceRecords||'', terms)}</Descriptions.Item>
<Descriptions.Item label="数据内容">{highlightSearchContentByTerms(modelerData.remark||'', terms)}</Descriptions.Item> </React.Fragment>
}
</Descriptions> </Descriptions>
) )
} }
......
...@@ -650,6 +650,7 @@ const ImportActionIndex = (props) => { ...@@ -650,6 +650,7 @@ const ImportActionIndex = (props) => {
return ( return (
<div className='model-import-action-index'> <div className='model-import-action-index'>
<h2>数据表结构</h2>
<div className='d-flex mb-3' style={{ justifyContent: editable?'space-between':'flex-end' }}> <div className='d-flex mb-3' style={{ justifyContent: editable?'space-between':'flex-end' }}>
{ {
editable && <Tooltip title={addTip}> editable && <Tooltip title={addTip}>
......
...@@ -405,6 +405,7 @@ const ImportActionPartition = (props) => { ...@@ -405,6 +405,7 @@ const ImportActionPartition = (props) => {
return ( return (
<div className='model-import-action-index'> <div className='model-import-action-index'>
<h2>数据表分区</h2>
{ {
editable && <div className='d-flex mb-3'> editable && <div className='d-flex mb-3'>
<Tooltip title={addTip}> <Tooltip title={addTip}>
......
...@@ -957,6 +957,7 @@ const ImportActionTable = (props) => { ...@@ -957,6 +957,7 @@ const ImportActionTable = (props) => {
return ( return (
<div className='model-import-action-table'> <div className='model-import-action-table'>
<h2>数据表结构</h2>
<div className='d-flex mb-3' style={{ justifyContent: editable?'space-between':'flex-end' }}> <div className='d-flex mb-3' style={{ justifyContent: editable?'space-between':'flex-end' }}>
{ {
editable && <Tooltip title={addTip}> editable && <Tooltip title={addTip}>
......
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