Skip to content

S
szse
Commit 6e32fc0e by zhaochengxiang
Options

右键操作

parent ac5119e4
Showing with 93 additions and 137 deletions
package.json
......@@ -22,6 +22,7 @@
"less-loader": "^8.0.0",
"local-storage": "^2.0.0",
"react": "^17.0.1",
"react-contexify": "^5.0.0",
"react-dnd": "^14.0.2",
"react-dnd-html5-backend": "^14.0.0",
"react-dom": "^17.0.1",
......
src/view/Manage/Model/Component/ImportAction.jsx
import React, { useState, useEffect } from 'react';
import { Spin, Tabs, Popover, Divider, Button, Space } from 'antd';
import { Spin } from 'antd';
import LocalStorage from 'local-storage';
import { QuestionCircleOutlined } from '@ant-design/icons';
import ImportActionHeader from './ImportActionHeader';
import ImportActionTable from './ImportActionTable';
......@@ -12,10 +11,8 @@ import { Action } from '../../../../util/constant';
import { dispatch } from '../../../../model';
const { TabPane } = Tabs;
const ImportAction = (props) => {
const { action, hints, onChange, form, modelerId, terms, ddl, roughModelerData, versionId, permitCheckOut, autoTabKey } = props;
const { action, hints, onChange, form, modelerId, terms, ddl, roughModelerData, versionId, permitCheckOut } = props;
const [ constraints, setConstraints ] = useState([]);
const [ constraint, setConstraint ] = useState({});
......@@ -25,7 +22,6 @@ const ImportAction = (props) => {
const [ supportedDatatypes, setSupportedDatatypes ] = useState([]);
const [ supportedPartitionTypes, setSupportedPartitionTypes ] = useState([]);
const [ validateReports, setValidateReports ] = useState([]);
const [ tabKey, setTabKey ] = useState('1');
const [ loading, setLoading ] = useState(false);
useEffect(() =>{
......@@ -70,12 +66,6 @@ const ImportAction = (props) => {
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [action, hints, modelerId, ddl ]);
useEffect(() => {
if (autoTabKey) {
setTabKey(autoTabKey);
}
}, [autoTabKey])
const getDraft = (_constraint, _template, _hints) => {
dispatch({
type: 'datamodel.getDraft',
......@@ -423,18 +413,6 @@ const ImportAction = (props) => {
}
const onTabChange = (key) => {
setTabKey(key);
}
const prevStep = () => {
setTabKey(`${Number(tabKey)-1}`);
}
const nextStep = () => {
setTabKey(`${Number(tabKey)+1}`);
}
return (
<Spin spinning={loading}>
<ImportActionHeader
......
src/view/Manage/Model/Component/ImportModal.jsx
......@@ -6,7 +6,6 @@ import ImportExcel from './ImportExcel';
import ImportExcelCopy from './ImportExcelCopy';
import { dispatchLatest } from '../../../../model';
import { showMessage } from '../../../../util';
const importModes = [
{ name: 'Word导入', key: 'word' },
......
src/view/Manage/Model/Component/ModelTable.jsx
import React, { useState, useEffect, useRef } from "react";
import { Button, Tooltip, Modal, Pagination, Table, Dropdown, Menu, Divider, Descriptions } from 'antd';
import { Tooltip, Modal, Pagination, Table, Descriptions } from 'antd';
import { DownOutlined, UpOutlined } from '@ant-design/icons';
import SmoothScroll from 'smooth-scroll';
import classnames from 'classnames';
import { Resizable } from 'react-resizable';
import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify";
import { dispatch } from '../../../../model';
import { showMessage, getQueryParam, paginate, isSzseEnv, getTextLength, getTextWidth } from '../../../../util';
......@@ -11,6 +12,7 @@ import { AnchorId, AnchorTimestamp, Action, CatalogId, ModelerId } from '../../.
// import Tag from "../../Tag";
import './ModelTable.less';
import 'react-contexify/dist/ReactContexify.css';
const ModelNameColumn = (props) => {
const { text, record, detailItem } = props;
......@@ -112,6 +114,12 @@ const ResizeableHeaderCell = props => {
const ModelTable = (props) => {
const { data, onChange, onItemAction, onSelect, onHistory, catalogId, keyword, onAutoCreateTable, offset = null, modelId = null, view, selectModelerIds, onSubSelect } = props;
const MENU_ID = (((modelId||'') !== '') ? `model-table-contextmenu-${modelId}` : 'model-table-contextmenu');
const { show } = useContextMenu({
id: MENU_ID,
});
const [ selectedRowKeys, setSelectedRowKeys ] = useState([]);
const [ subSelectedRowKeys, setSubSelectedRowKeys ] = useState([]);
......@@ -119,31 +127,6 @@ const ModelTable = (props) => {
const [ sortRule, setSortRule ] = useState(null);
const [ filterData, setFilterData ] = useState([]);
const [ subData, setSubData ] = useState([]);
const moreMenu = (record) => {
return <Menu onClick={(e) => { onMoreMenuClick(e, record); }}>
<Menu.Item key='history'>
历史版本
</Menu.Item>
<Menu.Item key='copy'>
复制模型
</Menu.Item>
{
(record?.state?.supportedActions||[]).length>0 && record?.state?.supportedActions.map((item, index) => {
return (
<Menu.Item key={`action-${index}`}>
{item.cnName||''}
</Menu.Item>
);
})
}
{
record?.deployable && <Menu.Item key='createTable'>
建表
</Menu.Item>
}
</Menu>
}
const commonColumns = [
{
......@@ -182,21 +165,6 @@ const ModelTable = (props) => {
}
},
{
title: '模型描述',
dataIndex: 'remark',
ellipsis: true,
sorter: true,
sortDirections: ['ascend', 'descend'],
width: 200,
render: (text, _, __) => {
return (
<Tooltip title={text||''}>
<span>{text||''}</span>
</Tooltip>
);
}
},
{
title: '状态',
dataIndex: 'state',
width: 80,
......@@ -247,74 +215,17 @@ const ModelTable = (props) => {
// }
// },
{
title: '操作',
key: 'action',
// width: 180,
title: '模型描述',
dataIndex: 'remark',
ellipsis: true,
render: (_,record) => {
let disableEdit = false, disableDelete = false, editTip = '', deleteTip = '';
if (!record?.editable&&!record?.permitCheckOut) {
disableEdit = true;
if (record?.state?.id === '2') {
editTip = '待发布的模型不允许编辑';
} else if (record?.state?.id === '4') {
editTip = `${record.holder||''}正在编辑中, 不允许再编辑`;
}
}
if (!record?.deletable) {
disableDelete = true;
if (record?.state?.id === '2') {
deleteTip = '待发布的模型不允许删除';
} else if (record?.state?.id === '4') {
deleteTip = '已发布的模型不允许删除';
}
}
return (
<div style={{ display: 'flex', alignItems: 'center' }}>
<Tooltip title={editTip}>
<Button
type='link'
size='small'
disabled={disableEdit}
onClick={() => { editItem(record); }}
style={{ padding: 0 }}
>
编辑
</Button>
</Tooltip>
<div style={{ margin: '0 5px' }}>
<Divider type='vertical' />
</div>
<Tooltip title={deleteTip} >
<Button
type='link'
size='small'
disabled={disableDelete}
onClick={() => { deleteItem(record); }}
style={{ padding: 0 }}
>
删除
</Button>
</Tooltip>
<div style={{ margin: '0 5px' }}>
<Divider type='vertical' />
</div>
<Dropdown overlay={moreMenu(record)} trigger={['click']} placement="bottomLeft">
<Button
type='link'
size='small'
style={{ padding: 0 }}
>
更多<DownOutlined />
</Button>
</Dropdown>
</div>
)
sorter: true,
sortDirections: ['ascend', 'descend'],
render: (text, _, __) => {
return (
<Tooltip title={text||''}>
<span>{text||''}</span>
</Tooltip>
);
}
},
];
......@@ -335,6 +246,7 @@ const ModelTable = (props) => {
const [ columns, setColumns ] = useState(commonColumns);
const [ pagination, setPagination ] = useState( { pageNum: 1, pageSize: 20 } );
const [ currentItem, setCurrentItem ] = useState(null);
const { pageNum, pageSize } = pagination;
const [modal, contextHolder] = Modal.useModal();
......@@ -677,6 +589,50 @@ const ModelTable = (props) => {
}
}
const displayMenu = (e) => {
show(e);
}
const handleItemClick = ({ event, props, data, triggerEvent }) => {
switch (event.currentTarget.id) {
case "edit":
editItem(currentItem);
break;
case "delete":
deleteItem(currentItem);
break;
case "history":
historyItem(currentItem);
break;
case "copy":
window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(view==='dir')?(catalogId||''):''}&${ModelerId}=${currentItem.id}`);
break;
default:
break;
}
}
let disableEdit = false, disableDelete = false, editTip = '', deleteTip = '';
if (!currentItem?.editable&&!currentItem?.permitCheckOut) {
disableEdit = true;
if (currentItem?.state?.id === '2') {
editTip = '待发布的模型不允许编辑';
} else if (currentItem?.state?.id === '4') {
editTip = `${currentItem.holder||''}正在编辑中, 不允许再编辑`;
}
}
if (!currentItem?.deletable) {
disableDelete = true;
if (currentItem?.state?.id === '2') {
deleteTip = '待发布的模型不允许删除';
} else if (currentItem?.state?.id === '4') {
deleteTip = '已发布的模型不允许删除';
}
}
return (
<div className={classes}>
<Table
......@@ -703,6 +659,10 @@ const ModelTable = (props) => {
return {
id: `data-model-${record?.id}`,
style: { backgroundColor: (record?.id===anchorId)?'#e7f7ff':'transparent' },
onContextMenu: event => {
setCurrentItem(record);
displayMenu(event);
},
}
}}
onChange={onTableChange}
......@@ -728,6 +688,24 @@ const ModelTable = (props) => {
showTotal={total => `共 ${total} 条`}
/>
}
<RcMenu id={MENU_ID}>
<RcItem id="edit" disabled={disableEdit} onClick={handleItemClick}>
<Tooltip title={editTip}>
编辑
</Tooltip>
</RcItem>
<RcItem id="delete" disabled={disableDelete} onClick={handleItemClick}>
<Tooltip title={deleteTip}>
删除
</Tooltip>
</RcItem>
<RcItem id="history" onClick={handleItemClick}>
历史版本
</RcItem>
<RcItem id="copy" onClick={handleItemClick}>
复制模型
</RcItem>
</RcMenu>
{ contextHolder }
</div>
);
......
src/view/Manage/Model/Component/UpdateTreeItemModal.jsx
import React, { useState, useEffect } from 'react';
import { Modal, Form, Input, Radio, InputNumber } from 'antd';
import { Modal, Form, Input, Radio } from 'antd';
import { dispatchLatest } from '../../../../model';
......
src/view/Manage/Model/index.jsx
import React from 'react';
import { Button, Space, Spin, Dropdown, Menu, Input, Select, Tooltip } from 'antd';
import { Button, Space, Spin, Input, Select, Tooltip } from 'antd';
import copy from "copy-to-clipboard";
import { DownOutlined, CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
import classNames from 'classnames';
import ModelTree from './Component/ModelTree';
......@@ -285,7 +285,7 @@ class Model extends React.Component {
}
onImportModalCancelByWord = (refresh = false, wordData = {}) => {
const { catalogId, currentView } = this.state;
const { catalogId } = this.state;
this.setState({ importModalVisible: false }, () => {
refresh && this.onTableChange();
......
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