Commit 34e44919 by zhaochengxiang

删除模版配置

parent cfeecea2
import React, { useState, useEffect } from 'react';
import TemplateActionHeader from './TemplateActionHeader';
import ImportActionTable from './ImportActionTable';
import { dispatchLatest, dispatch } from '../../../../model';
const TemplateAction = (props) => {
const { action, onChange, form, id } = props;
const [ templateData, setTemplateData ] = useState(null);
const [ supportedDatatypes, setSupportedDatatypes ] = useState([]);
useEffect(() =>{
//初始化form状态
if (action==='add'||action==='edit') {
form.setFieldsValue({
cnName: '',
name: '',
remark: '',
});
}
if (action === 'add') {
getSupportedDatatypes();
} else if ((action === 'edit'||action === 'detail') && id ) {
getCurrentTemplate();
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [action, id ]);
const getCurrentTemplate = () => {
dispatchLatest({
type: 'datamodel.getTemplate',
payload: {
params: {
id
}
},
callback: data => {
setTemplateData(data||{});
onChange && onChange(data||{});
getSupportedDatatypes();
if (action === 'edit') {
form.setFieldsValue({
cnName: data.cnName||'',
name: data.name||'',
remark: data.remark||'',
});
}
}
})
}
const getSupportedDatatypes = () => {
dispatch({
type: 'datamodel.getSupportedDatatypes',
callback: data => {
setSupportedDatatypes(data||[]);
}
});
}
//模版不需要对字段进行校验
const onTableChange = (data) => {
let newTemplateData = {...templateData, ...{easyDataModelerDataModelAttributes: data}};
setTemplateData(newTemplateData);
onChange && onChange(newTemplateData);
}
return (
<React.Fragment>
<TemplateActionHeader
form={form}
editable={action!=='detail'}
templateData={templateData||{}}
/>
<ImportActionTable
type='template'
modelerData={templateData||{}}
supportedDatatypes={supportedDatatypes}
onChange={onTableChange}
editable={action!=='detail'}
/>
</React.Fragment>
);
};
export default TemplateAction;
\ No newline at end of file
import React from 'react';
import { Form, Input, Row, Col, Descriptions } from 'antd';
const TemplateActionHeader = (props) => {
const { editable, form, templateData } = props;
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 19 },
},
};
return (
editable ? (
<Form
form={form}
{...formItemLayout}
>
<Row gutter={10}>
<Col span={12}>
<Form.Item
label="中文名称"
name="cnName"
labelAlign="left"
rules={[{ required: true, message: '请输入中文名称!' }]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="英文名称"
name="name"
labelAlign="left"
rules={[{ required: true, message: '请输入英文名称!' }]}
>
<Input />
</Form.Item>
</Col>
</Row>
<Row gutter={10}>
<Col span={12}>
<Form.Item
label="描述"
name="remark"
labelAlign="left"
rules={[{ required: true, message: '请输入描述!' }]}
>
<Input />
</Form.Item>
</Col>
</Row>
</Form>
) : (
<Descriptions>
<Descriptions.Item label="中文名称">{templateData.cnName||''}</Descriptions.Item>
<Descriptions.Item label="英文名称">{templateData.name||''}</Descriptions.Item>
<Descriptions.Item label="描述">{templateData.remark||''}</Descriptions.Item>
</Descriptions>
)
)
}
export default TemplateActionHeader;
\ No newline at end of file
import React, { useEffect, useState } from 'react';
import { Table, Space, Button, Tooltip, Modal, Form, Drawer } from 'antd';
import { EditOutlined, ReconciliationOutlined, DeleteOutlined } from '@ant-design/icons';
import TemplateAction from './TemplateAction';
import { dispatch, dispatchLatest } from '../../../../model';
import { showMessage } from '../../../../util';
const TemplateCURDDrawer = (props) => {
const { visible, onCancel } = props;
const [ templates, setTemplates ] = useState([]);
const [ loading, setLoading ] = useState(false);
const [ action, setAction ] = useState('');
const [ currentTemplate, setCurrentTemplate ] = useState('');
const [ step, setStep ] = useState(0);
const [ confirmLoading, setConfirmLoading ] = useState(false);
const [modal, contextHolder] = Modal.useModal();
const [form] = Form.useForm();
useEffect(() => {
if (visible) {
getTemplates();
}
}, [ visible ])
const columns = [
{
title: '序号',
dataIndex: 'key',
editable: false,
render: (text, record, index) => {
return (index+1).toString();
},
width: 60,
},
{
title: '模版名称',
dataIndex: 'name',
width: 180,
ellipsis: true,
},
{
title: '中文名称',
dataIndex: 'cnName',
width: 180,
ellipsis: true,
},
{
title: '模版描述',
dataIndex: 'remark',
ellipsis: true,
},
{
title: '更新时间',
dataIndex: 'modifiedTs',
width: 120,
ellipsis: true,
},
{
title: '操作',
key: 'action',
width: 120,
render: (text,record) => {
return (
<Space size='small'>
<Tooltip placement='bottom' title={'修改'}>
<Button icon={<EditOutlined />} size='small' onClick={() => { editItem(record); }} />
</Tooltip>
<Tooltip placement='bottom' title={'详情'}>
<Button icon={<ReconciliationOutlined />} size='small' onClick={() => { detailItem(record); }} />
</Tooltip>
<Tooltip placement='bottom' title={'删除'}>
<Button icon={<DeleteOutlined />} size='small' onClick={() => { deleteItem(record); }} />
</Tooltip>
</Space>
)
}
}
];
const getTemplates = () => {
setLoading(true);
dispatch({
type: 'datamodel.getAllTemplates',
callback: data => {
setTemplates(data||[]);
setLoading(false);
},
error: () => {
setLoading(false);
}
})
}
const editItem = (record) => {
setStep(1);
setAction('edit');
setCurrentTemplate(record);
}
const detailItem = (record) => {
setStep(1);
setAction('detail');
setCurrentTemplate(record);
}
const deleteItem = (record) => {
modal.confirm({
title: '提示!',
content: '您确定要删除该模版吗?',
onOk: () => {
dispatch({
type: 'datamodel.deleteTemplate',
payload: {
params: {
id: record.id
}
},
callback: () => {
showMessage('success', '模版删除成功');
getTemplates();
}
})
}
});
}
const onAddClick = () => {
setStep(1);
setAction('add');
}
const cancel = () => {
console.log('cancel');
reset();
onCancel && onCancel(false);
}
const reset = () => {
setStep(0);
setCurrentTemplate({});
setConfirmLoading(false);
}
const onActionChange = (data) => {
setCurrentTemplate(data);
}
const prev = () => {
setStep(step-1);
}
const save = async () => {
try {
const row = await form.validateFields();
const newTemplateData = {...currentTemplate, ...row};
setConfirmLoading(true);
dispatchLatest({
type: 'datamodel.saveTemplate',
payload: {
data: newTemplateData
},
callback: () => {
setConfirmLoading(false);
reset();
onCancel && onCancel(true);
},
error: () => {
setConfirmLoading(false);
}
})
} catch (errInfo) {
console.log('Validate Failed:', errInfo);
}
}
let title = '';
if (step === 0) {
title = '模版配置';
}
if (step === 1) {
if (action === 'add') {
title = '新增模版';
} else if (action === 'edit') {
title = '模版编辑';
} else if (action === 'detail') {
title = '模版详情';
}
}
let actionComponent = null;
if (step === 0) {
actionComponent = (
<Button
type="primary"
onClick={onAddClick}
style={{ marginLeft: 'auto' }}
>
新增模版
</Button>
)
} else if (step === 1) {
if (action === 'detail') {
actionComponent = (
<Button
key="0"
onClick={prev}
style={{ marginLeft: 'auto' }}
>
返回
</Button>
)
} else {
actionComponent = (
<Space
style={{ marginLeft: 'auto' }}
>
<Button
key="0"
onClick={prev}
>
返回
</Button>,
<Button
key="1"
type="primary"
loading={confirmLoading}
onClick={save}
>
保存
</Button>
</Space>
)
}
}
return (
<Drawer
title={title}
visible={visible}
width={1200}
closable={true}
onClose={() => {
cancel();
}}
>
{
step === 0 && <React.Fragment>
<div className='d-flex mb-3' style={{ alignItems: 'center' }}>
{actionComponent}
</div>
<Table
loading={loading}
columns={columns}
rowKey={'id'}
dataSource={templates||[]}
pagination={false}
sticky
/>
</React.Fragment>
}
{
step === 1 && <React.Fragment>
<div className='d-flex mb-3' style={{ alignItems: 'center' }}>
{actionComponent}
</div>
<TemplateAction
onChange={onActionChange}
action={action}
id={currentTemplate.id}
form={form}
/>
</React.Fragment>
}
{ contextHolder }
</Drawer>
);
}
export default TemplateCURDDrawer;
\ No newline at end of file
......@@ -6,7 +6,6 @@ import classNames from 'classnames';
import ModelTree from './Component/ModelTree';
import ModelTable from './Component/ModelTable';
import TemplateCURDDrawer from './Component/TemplateCURDDrawer';
import ImportModal from './Component/ImportModal';
import ImportStockWordDrawer from './Component/ImportStockWordDrawer';
import ExportDDLModal from './Component/ExportDDLModal';
......@@ -28,7 +27,6 @@ class Model extends React.Component {
constructor() {
super();
this.state = {
templateCURDDrawerVisible: false,
importModalVisible: false,
importStockWordDrawerVisible: false,
exportDDLModalVisible: false,
......@@ -181,10 +179,6 @@ class Model extends React.Component {
});
}
onTemplateCURDClick = () => {
this.setState({ templateCURDDrawerVisible: true });
}
onImportUnconditionBtnClick = () => {
const { catalogId, currentView } = this.state;
......@@ -247,11 +241,6 @@ class Model extends React.Component {
this.setState({ importExcelVisible: visible });
}
onTemplateCURDDrawerCancel = (refresh = false) => {
this.setState({ templateCURDDrawerVisible: false });
refresh && this.onTableChange();
}
onImportModalCancel = (refresh = false, hints = [], wordData = {}) => {
const { catalogId, currentView } = this.state;
......@@ -368,7 +357,7 @@ class Model extends React.Component {
}
render() {
const { importModalVisible, catalogId, loadingTableData, selectModelerIds, keyword, filterTableData, selectModelerNames, exportDDLModalVisible, exportOtherModalVisible, templateCURDDrawerVisible, importStockWordDrawerVisible , loadingStates, modelStates, currentModelState, currentView, recatalogModalVisible, exportDDLModalReference, currentModel, offset, historyAndVersionDrawerVisible, modelerId, startFlowModalVisible, expandTree } = this.state;
const { importModalVisible, catalogId, loadingTableData, selectModelerIds, keyword, filterTableData, selectModelerNames, exportDDLModalVisible, exportOtherModalVisible, importStockWordDrawerVisible , loadingStates, modelStates, currentModelState, currentView, recatalogModalVisible, exportDDLModalReference, currentModel, offset, historyAndVersionDrawerVisible, modelerId, startFlowModalVisible, expandTree } = this.state;
const content = (
<ModelTable
......@@ -500,11 +489,6 @@ class Model extends React.Component {
</div>
</div>
<TemplateCURDDrawer
visible={templateCURDDrawerVisible}
onCancel={this.onTemplateCURDDrawerCancel}
/>
<ImportModal
view={currentView}
catalogId={catalogId}
......
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