Skip to content

S
szse
Commit eb41407f by zhaochengxiang
Options

模型详情抽屉风格

parent 680cef7a
Showing with 141 additions and 20 deletions
src/view/Manage/Model/Component/EditModel.jsx
...@@ -294,7 +294,7 @@ const EditModel = (props) => { ...@@ -294,7 +294,7 @@ const EditModel = (props) => {
actionsBtn = ( actionsBtn = (
<Space> <Space>
<Button type='primary' onClick={onHistory} danger >版本历史</Button> {/* <Button type='primary' onClick={onHistory} danger >版本历史</Button> */}
<Tooltip title={editTip}> <Tooltip title={editTip}>
<Button type='primary' onClick={edit} disabled={(stateId==='4')?!permitCheckOut:!editable} danger > <Button type='primary' onClick={edit} disabled={(stateId==='4')?!permitCheckOut:!editable} danger >
编辑 编辑
...@@ -308,9 +308,9 @@ const EditModel = (props) => { ...@@ -308,9 +308,9 @@ const EditModel = (props) => {
<Button onClick={cancelEdit} > <Button onClick={cancelEdit} >
取消 取消
</Button> </Button>
<Button type='primary' onClick={onHistory} danger > {/* <Button type='primary' onClick={onHistory} danger >
版本历史 版本历史
</Button> </Button> */}
<Button <Button
type='primary' type='primary'
onClick={save} onClick={save}
...@@ -324,9 +324,9 @@ const EditModel = (props) => { ...@@ -324,9 +324,9 @@ const EditModel = (props) => {
} else if (action === 'flow') { } else if (action === 'flow') {
actionsBtn = ( actionsBtn = (
<Space> <Space>
<Button type='primary' onClick={onHistory} danger> {/* <Button type='primary' onClick={onHistory} danger>
版本历史 版本历史
</Button> </Button> */}
{ {
editable && <Button type='primary' onClick={edit} danger > editable && <Button type='primary' onClick={edit} danger >
编辑 编辑
...@@ -338,9 +338,9 @@ const EditModel = (props) => { ...@@ -338,9 +338,9 @@ const EditModel = (props) => {
return ( return (
<div className='edit-model position-relative'> <div className='edit-model position-relative'>
<div className='edit-header'> {/* <div className='edit-header'>
<span style={{ fontSize: 16, fontWeight: 'bold', color: '#fff' }}>{title}</span> <span style={{ fontSize: 16, fontWeight: 'bold', color: '#fff' }}>{title}</span>
</div> </div> */}
<div className='edit-container'> <div className='edit-container'>
<div className='edit-container-card'> <div className='edit-container-card'>
<ImportAction hints={hints} onChange={onActionChange} action={action} modelerId={modelerId} ddl={ddl} form={form} terms={terms} roughModelerData={roughModelerData} permitCheckOut={permitCheckOut} stateId={stateId} versionId={versionId} autoTabKey={autoTabKey} {...props} /> <ImportAction hints={hints} onChange={onActionChange} action={action} modelerId={modelerId} ddl={ddl} form={form} terms={terms} roughModelerData={roughModelerData} permitCheckOut={permitCheckOut} stateId={stateId} versionId={versionId} autoTabKey={autoTabKey} {...props} />
......
src/view/Manage/Model/Component/ModelTable.jsx
...@@ -11,6 +11,7 @@ import { dispatch } from '../../../../model'; ...@@ -11,6 +11,7 @@ import { dispatch } from '../../../../model';
import { showMessage, getQueryParam, paginate, isSzseEnv, formatDate } from '../../../../util'; import { showMessage, getQueryParam, paginate, isSzseEnv, formatDate } from '../../../../util';
import { AnchorId, AnchorTimestamp, Action, CatalogId, ModelerId } from '../../../../util/constant'; import { AnchorId, AnchorTimestamp, Action, CatalogId, ModelerId } from '../../../../util/constant';
// import Tag from "../../Tag"; // import Tag from "../../Tag";
import IframeDrawer from '../../ModelConfig/Component/IframeDrawer' ;
import './ModelTable.less'; import './ModelTable.less';
import 'react-contexify/dist/ReactContexify.css'; import 'react-contexify/dist/ReactContexify.css';
...@@ -140,6 +141,11 @@ const ModelTable = (props) => { ...@@ -140,6 +141,11 @@ const ModelTable = (props) => {
const [ sortRule, setSortRule ] = useState(null); const [ sortRule, setSortRule ] = useState(null);
const [ filterData, setFilterData ] = useState([]); const [ filterData, setFilterData ] = useState([]);
const [ subData, setSubData ] = useState([]); const [ subData, setSubData ] = useState([]);
const [ iframeDrawerParams, setIframeDrawerParams ] = useState({
visible: false,
title: undefined,
url: undefined,
})
const cols = [ const cols = [
{ {
...@@ -669,7 +675,11 @@ const ModelTable = (props) => { ...@@ -669,7 +675,11 @@ const ModelTable = (props) => {
} else if (key === 'history') { } else if (key === 'history') {
historyItem(currentItem); historyItem(currentItem);
} else if (key === 'copy') { } else if (key === 'copy') {
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(view==='dir')?(catalogId||''):''}&${ModelerId}=${currentItem.id}`); setIframeDrawerParams({
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${(view==='dir')?(catalogId||''):''}&${ModelerId}=${currentItem.id}`
})
} else if (key === 'createTable') { } else if (key === 'createTable') {
deployAction(currentItem); deployAction(currentItem);
} else if (key.indexOf('action') !== -1) { } else if (key.indexOf('action') !== -1) {
...@@ -808,6 +818,17 @@ const ModelTable = (props) => { ...@@ -808,6 +818,17 @@ const ModelTable = (props) => {
} }
</RcMenu> </RcMenu>
<IframeDrawer
{...iframeDrawerParams}
onCancel={() => {
setIframeDrawerParams({
visible: false,
title: undefined,
url: undefined,
})
}}
/>
{ contextHolder } { contextHolder }
</div> </div>
); );
......
src/view/Manage/Model/Component/VersionHistory.jsx
...@@ -4,12 +4,18 @@ import { Timeline, Spin } from 'antd'; ...@@ -4,12 +4,18 @@ import { Timeline, Spin } from 'antd';
import { dispatch } from '../../../../model'; import { dispatch } from '../../../../model';
import { formatVersionHistoryDate } from '../../../../util'; import { formatVersionHistoryDate } from '../../../../util';
import { Action, ModelerId, VersionId } from '../../../../util/constant'; import { Action, ModelerId, VersionId } from '../../../../util/constant';
import IframeDrawer from '../../ModelConfig/Component/IframeDrawer' ;
const VersionHistory = (props) => { const VersionHistory = (props) => {
const { id } = props; const { id } = props;
const [ versions, setVersions ] = useState([]); const [ versions, setVersions ] = useState([]);
const [ loading, setLoading ] = useState(false); const [ loading, setLoading ] = useState(false);
const [ iframeDrawerParams, setIframeDrawerParams ] = useState({
visible: false,
title: undefined,
url: undefined,
})
useEffect(() => { useEffect(() => {
if ((id||'') !== '') { if ((id||'') !== '') {
...@@ -39,7 +45,11 @@ const VersionHistory = (props) => { ...@@ -39,7 +45,11 @@ const VersionHistory = (props) => {
} }
const onVersionItemClick = (version) => { const onVersionItemClick = (version) => {
window.open(`/data-govern/data-model-action?${Action}=detail-version&${ModelerId}=${version.dataModelId||''}&${VersionId}=${version.id||''}`); setIframeDrawerParams({
visible: true,
title: '模型版本详情',
url: `/data-govern/data-model-action?${Action}=detail-version&${ModelerId}=${version.dataModelId||''}&${VersionId}=${version.id||''}`
})
} }
return ( return (
...@@ -83,6 +93,16 @@ const VersionHistory = (props) => { ...@@ -83,6 +93,16 @@ const VersionHistory = (props) => {
}) })
} }
</Timeline> </Timeline>
<IframeDrawer
{...iframeDrawerParams}
onCancel={() => {
setIframeDrawerParams({
visible: false,
title: undefined,
url: undefined,
})
}}
/>
</Spin> </Spin>
); );
} }
......
src/view/Manage/Model/index.jsx
...@@ -20,6 +20,7 @@ import { AppContext } from '../../../App'; ...@@ -20,6 +20,7 @@ import { AppContext } from '../../../App';
import DebounceInput from './Component/DebounceInput'; import DebounceInput from './Component/DebounceInput';
import MetadataAnalysis from '../../QianKun/MetadataAnalysis'; import MetadataAnalysis from '../../QianKun/MetadataAnalysis';
import BatchModeler from './Component/BatchModeler'; import BatchModeler from './Component/BatchModeler';
import IframeDrawer from '../ModelConfig/Component/IframeDrawer'
import './index.less'; import './index.less';
...@@ -60,6 +61,11 @@ class Model extends React.Component { ...@@ -60,6 +61,11 @@ class Model extends React.Component {
showUnbindTip: false, showUnbindTip: false,
showMode: 'list', showMode: 'list',
showBatchModeler: false, showBatchModeler: false,
iframeDrawerParams: {
visible: false,
title: undefined,
url: undefined,
}
} }
} }
...@@ -201,8 +207,13 @@ class Model extends React.Component { ...@@ -201,8 +207,13 @@ class Model extends React.Component {
onTableItemAction = (record, action) => { onTableItemAction = (record, action) => {
this.setState({ importModalAction: action, modelerId: record.id }, () => { this.setState({ importModalAction: action, modelerId: record.id }, () => {
const { catalogId, importModalAction, modelerId } = this.state; const { catalogId, importModalAction, modelerId } = this.state;
this.setState({
window.open(`/data-govern/data-model-action?${Action}=${importModalAction}&${CatalogId}=${catalogId}&${ModelerId}=${modelerId}&${PermitCheckOut}=${record.permitCheckOut||false}&${Editable}=${record.editable||false}&${StateId}=${record.state?.id||''}&${Holder}=${record.holder||''}`); iframeDrawerParams: {
visible: true,
title: (importModalAction==='detail')?'模型详情':'模型编辑',
url: `/data-govern/data-model-action?${Action}=${importModalAction}&${CatalogId}=${catalogId}&${ModelerId}=${modelerId}&${PermitCheckOut}=${record.permitCheckOut||false}&${Editable}=${record.editable||false}&${StateId}=${record.state?.id||''}&${Holder}=${record.holder||''}`
}
})
}); });
} }
...@@ -221,7 +232,13 @@ class Model extends React.Component { ...@@ -221,7 +232,13 @@ class Model extends React.Component {
onImportUnconditionBtnClick = () => { onImportUnconditionBtnClick = () => {
const { catalogId, currentView } = this.state; const { catalogId, currentView } = this.state;
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}`); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}`
}
})
} }
onExportDDLBtnClick = () => { onExportDDLBtnClick = () => {
...@@ -315,21 +332,45 @@ class Model extends React.Component { ...@@ -315,21 +332,45 @@ class Model extends React.Component {
if ((hints||[]).length > 0) { if ((hints||[]).length > 0) {
if (currentView === 'requirement') { if (currentView === 'requirement') {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId||''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId||''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`
}
})
}, 1000); }, 1000);
} else { } else {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`
}
})
}, 1000); }, 1000);
} }
} else { } else {
if (currentView === 'requirement') { if (currentView === 'requirement') {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId||''}`); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId||''}`
}
})
}, 1000); }, 1000);
} else { } else {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}`); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}`
}
})
}, 1000); }, 1000);
} }
} }
...@@ -355,13 +396,25 @@ class Model extends React.Component { ...@@ -355,13 +396,25 @@ class Model extends React.Component {
if (currentView === 'requirement') { if (currentView === 'requirement') {
setTimeout(() => { setTimeout(() => {
wordData.content.slice(0, 5).forEach(data => { wordData.content.slice(0, 5).forEach(data => {
window.open(`/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId}&${ModelerData}=${encodeURIComponent(JSON.stringify(data))}`, '_blank'); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId}&${ModelerData}=${encodeURIComponent(JSON.stringify(data))}`
}
})
}) })
}, 2000); }, 2000);
} else { } else {
setTimeout(() => { setTimeout(() => {
wordData.content.slice(0, 5).forEach(data => { wordData.content.slice(0, 5).forEach(data => {
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}&${ModelerData}=${encodeURIComponent(JSON.stringify(data))}`, '_blank'); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}&${ModelerData}=${encodeURIComponent(JSON.stringify(data))}`
}
})
}) })
}, 2000); }, 2000);
} }
...@@ -377,11 +430,23 @@ class Model extends React.Component { ...@@ -377,11 +430,23 @@ class Model extends React.Component {
if (confirm && (ddl||'') !== '') { if (confirm && (ddl||'') !== '') {
if (currentView === 'requirement') { if (currentView === 'requirement') {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId}&${DDL}=${encodeURIComponent(ddl)}`, '_blank'); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${RequireId}=${catalogId}&${DDL}=${encodeURIComponent(ddl)}`
}
})
}, 1000); }, 1000);
} else { } else {
setTimeout(() => { setTimeout(() => {
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}&${DDL}=${encodeURIComponent(ddl)}`, '_blank'); this.setState({
iframeDrawerParams: {
visible: true,
title: '新增模型',
url: `/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}&${DDL}=${encodeURIComponent(ddl)}`
}
})
}, 1000); }, 1000);
} }
...@@ -743,6 +808,21 @@ class Model extends React.Component { ...@@ -743,6 +808,21 @@ class Model extends React.Component {
tip='您确定要解绑这些模型吗?' tip='您确定要解绑这些模型吗?'
onCancel={this.onUnbindTipModalCancel} onCancel={this.onUnbindTipModalCancel}
/> />
<IframeDrawer
{...this.state.iframeDrawerParams}
onCancel={() => {
this.setState({
iframeDrawerParams: {
visible: false,
title: undefined,
url: undefined
}
})
}}
/>
</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