Commit c546178a by zhaochengxiang

资产管理增加自定义目录

parent c071979a
...@@ -524,4 +524,8 @@ export function* compareDataAssetWithDescribeInfo(payload) { ...@@ -524,4 +524,8 @@ export function* compareDataAssetWithDescribeInfo(payload) {
export function* listDataAssetHistoryTimeline(payload) { export function* listDataAssetHistoryTimeline(payload) {
return yield call(service.listDataAssetHistoryTimeline, payload); return yield call(service.listDataAssetHistoryTimeline, payload);
}
export function* queryCustomTypeRootDirectory() {
return yield call(service.queryCustomTypeRootDirectory);
} }
\ No newline at end of file
...@@ -531,4 +531,8 @@ export function compareDataAssetWithDescribeInfo(payload) { ...@@ -531,4 +531,8 @@ export function compareDataAssetWithDescribeInfo(payload) {
export function listDataAssetHistoryTimeline(payload) { export function listDataAssetHistoryTimeline(payload) {
return GetJSON("/dataassetmanager/versionApi/listDataAssetHistoryTimeline", payload); return GetJSON("/dataassetmanager/versionApi/listDataAssetHistoryTimeline", payload);
}
export function queryCustomTypeRootDirectory() {
return GetJSON("/dataassetmanager/directoryApi/queryCustomTypeRootDirectory");
} }
\ No newline at end of file
import React, { useEffect, useState, useRef } from 'react'; import React, { useEffect, useState, useRef } from 'react';
import {Card, Spin, Tooltip, Tree, Dropdown, Menu, Modal, AutoComplete, Select, Descriptions} from 'antd'; import {Card, Spin, Tooltip, Tree, Dropdown, Menu, Modal, AutoComplete, Select, Descriptions} from 'antd';
import { PlusOutlined, ImportOutlined,ExportOutlined,ReloadOutlined, SettingOutlined } from '@ant-design/icons'; import { PlusOutlined, ImportOutlined,ExportOutlined,ReloadOutlined, SettingOutlined, UnorderedListOutlined } from '@ant-design/icons';
import classNames from 'classnames'; import classNames from 'classnames';
import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify"; import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify";
import LocalStorage from 'local-storage'; import LocalStorage from 'local-storage';
...@@ -21,6 +21,17 @@ import { getTemplateType } from '../../../../util/axios'; ...@@ -21,6 +21,17 @@ import { getTemplateType } from '../../../../util/axios';
const { Option } = AutoComplete; const { Option } = AutoComplete;
const viewModes = [
{
key: 'dir',
name: '目录视角'
},
{
key: 'custom',
name: '自定义目录视角'
}
];
function updateTreeData(list, key, children) { function updateTreeData(list, key, children) {
return list.map((node) => { return list.map((node) => {
if (node.nodeId === key) { if (node.nodeId === key) {
...@@ -70,6 +81,7 @@ const AssetManageTree = (props) => { ...@@ -70,6 +81,7 @@ const AssetManageTree = (props) => {
const [templates, setTemplates] = useState() const [templates, setTemplates] = useState()
const [currentTemplateType, setTemplateType] = useState() const [currentTemplateType, setTemplateType] = useState()
const [metadataRelatedTemplate, setMetadataRelatedTemplate] = useState() const [metadataRelatedTemplate, setMetadataRelatedTemplate] = useState()
const [ viewSelectedKey, setViewSelectedKey ] = useState(viewModes[0].key);
const [modal, contextHolder] = Modal.useModal(); const [modal, contextHolder] = Modal.useModal();
...@@ -79,6 +91,7 @@ const AssetManageTree = (props) => { ...@@ -79,6 +91,7 @@ const AssetManageTree = (props) => {
const treeDataRef = useRef([]); const treeDataRef = useRef([]);
const dataListRef = useRef([]); const dataListRef = useRef([]);
const viewSelectedKeyRef = useRef(viewModes[0].key)
useEffect(() => { useEffect(() => {
if (reference === AssetManageReference) { if (reference === AssetManageReference) {
...@@ -153,7 +166,7 @@ const AssetManageTree = (props) => { ...@@ -153,7 +166,7 @@ const AssetManageTree = (props) => {
} }
onSelect?.('', '', null, false) onSelect?.('', '', null, false)
getAllDirectoryAsTree(false) getAllDirectoryAsTree(true)
} }
}, },
error: () => { error: () => {
...@@ -227,10 +240,6 @@ const AssetManageTree = (props) => { ...@@ -227,10 +240,6 @@ const AssetManageTree = (props) => {
let newData = [...data]; let newData = [...data];
if (reference === AssetMountReference) {
newData = newData.filter(item => item.resourceType!=='custom');
}
setLoadedKeys([]); setLoadedKeys([]);
setTreeData(newData); setTreeData(newData);
...@@ -245,15 +254,6 @@ const AssetManageTree = (props) => { ...@@ -245,15 +254,6 @@ const AssetManageTree = (props) => {
dataListRef.current = _dataList; dataListRef.current = _dataList;
let defaultItem = null; let defaultItem = null;
if ((defaultSelectedId||'') === '') {
_dataList.forEach(item => {
if ((defaultSelectedId||'')==='') {
defaultSelectedId = item.key;
}
})
}
function recursion(subCatalogs) { function recursion(subCatalogs) {
if ((subCatalogs||[]).length===0) return; if ((subCatalogs||[]).length===0) return;
...@@ -270,10 +270,9 @@ const AssetManageTree = (props) => { ...@@ -270,10 +270,9 @@ const AssetManageTree = (props) => {
if ((defaultSelectedId||'') !== '') { if ((defaultSelectedId||'') !== '') {
recursion(newData); recursion(newData);
} }
if (resetCurrentDirId) { if (resetCurrentDirId) {
if (defaultItem) { if (defaultItem) {
const expandedKeys = _dataList const expandedKeys = _dataList
.map(item => { .map(item => {
...@@ -284,21 +283,42 @@ const AssetManageTree = (props) => { ...@@ -284,21 +283,42 @@ const AssetManageTree = (props) => {
}) })
.filter((item, i, self) => item && self.indexOf(item) === i); .filter((item, i, self) => item && self.indexOf(item) === i);
setExpandedKeys([...expandedKeys, defaultSelectedId]); setExpandedKeys(expandedKeys);
setAutoExpandParent(true); setAutoExpandParent(true);
setCurrentDirId(defaultItem.nodeId); setCurrentDirId(defaultItem.nodeId);
setCurrentDirType(defaultItem.type||''); setCurrentDirType(defaultItem.type||'');
setCurrentDir(defaultItem); setCurrentDir(defaultItem);
onSelect && onSelect(defaultItem.nodeId, defaultItem.type||'', defaultItem.level, defaultItem.allowdLoadDataAsset); onSelect && onSelect(defaultItem.nodeId, defaultItem.type||'', defaultItem.level, defaultItem.allowdLoadDataAsset);
}
} else if ((newData??[]).length > 0) {
defaultItem = newData[0]
setCurrentDirId(defaultItem.nodeId);
setCurrentDirType(defaultItem.type||'');
setCurrentDir(defaultItem);
onSelect && onSelect(defaultItem.nodeId, defaultItem.type||'', defaultItem.level, defaultItem.allowdLoadDataAsset);
}
} }
} }
let url = 'assetmanage.queryAllDirectoryAsTree';
if (viewSelectedKeyRef.current === 'custom') {
url = 'assetmanage.queryCustomTypeRootDirectory';
}
dispatch({ dispatch({
type: 'assetmanage.queryAllDirectoryAsTree', type: url,
callback: data => { callback: data => {
disposeData(data) let newData = [];
if (viewSelectedKeyRef.current==='dir') {
newData = [...data];
} else {
newData = (data||[]).map((item) => {
return {...item, text: item.name, nodeId: item.id, type: item.resourceType}
});
}
disposeData(newData)
}, },
error: () => { error: () => {
setLoading(false); setLoading(false);
...@@ -702,6 +722,7 @@ const AssetManageTree = (props) => { ...@@ -702,6 +722,7 @@ const AssetManageTree = (props) => {
type: 'assetmanage.getDirectoryChild', type: 'assetmanage.getDirectoryChild',
payload: { payload: {
parentId: key, parentId: key,
currentDirIsCustom: true,
}, },
callback: (data) => { callback: (data) => {
if (data && data.length>0) { if (data && data.length>0) {
...@@ -718,6 +739,32 @@ const AssetManageTree = (props) => { ...@@ -718,6 +739,32 @@ const AssetManageTree = (props) => {
}); });
}); });
const onViewClick = ({ key }) => {
if (viewSelectedKey && viewSelectedKey===key ) return;
viewSelectedKeyRef.current = key;
setViewSelectedKey(key);
setExpandedKeys([]);
getAllDirectoryAsTree();
}
const viewMenus = (
<Menu selectedKeys={[viewSelectedKey]} onClick={onViewClick}>
{
viewModes && viewModes.map(item => {
return (
<Menu.Item key={item.key} value={item.key} >
<div style={{ textAlign: 'center' }}>
{item.name}
</div>
</Menu.Item>
)
})
}
</Menu>
);
const exportMenu = ( const exportMenu = (
<Menu> <Menu>
<Menu.Item> <Menu.Item>
...@@ -746,8 +793,7 @@ const AssetManageTree = (props) => { ...@@ -746,8 +793,7 @@ const AssetManageTree = (props) => {
> >
{item.text} {item.text}
{ {
//自定义类型栏目不统计资产数 viewSelectedKeyRef.current === 'dir' && <span>{` (${item.dataAssetAndSubDirCount})`}</span>
(item.level!==1||(item.level===1&&item.resourceType!=='custom')) && <span>{` (${item.dataAssetAndSubDirCount})`}</span>
} }
</span> </span>
); );
...@@ -808,23 +854,33 @@ const AssetManageTree = (props) => { ...@@ -808,23 +854,33 @@ const AssetManageTree = (props) => {
(templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>) (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)
} }
</Select> </Select>
<Tooltip title="新增目录"> <Dropdown overlay={viewMenus} placement="bottomLeft">
<PlusOutlined className={(currentDir?.resourceType==='custom')?'disable': 'default'} onClick={addDir} style={{ fontSize:16,cursor: (currentDirType==='custom')?'not-allowed':'pointer' }}/> <Tooltip title="视角">
</Tooltip> <UnorderedListOutlined className='default' style={{ fontSize:16,cursor:'pointer' }} />
</Tooltip>
</Dropdown>
{
viewSelectedKeyRef.current === 'dir' && <Tooltip title="新增目录">
<PlusOutlined className={(currentDir?.resourceType==='custom')?'disable': 'default'} onClick={addDir} style={{ fontSize:16,cursor: (currentDirType==='custom')?'not-allowed':'pointer' }}/>
</Tooltip>
}
<Tooltip title="刷新目录"> <Tooltip title="刷新目录">
<ReloadOutlined className='default' onClick={refreshTree} style={{ fontSize:16,cursor:'pointer' }} /> <ReloadOutlined className='default' onClick={refreshTree} style={{ fontSize:16,cursor:'pointer' }} />
</Tooltip> </Tooltip>
<Tooltip title="导入目录"> {
<ImportOutlined className={(currentDirType==='custom')?'disable': 'default'} onClick={importDir} style={{ fontSize:16,cursor:(currentDirType==='custom')?'not-allowed':'pointer' }} /> viewSelectedKeyRef.current === 'dir' ? <>
</Tooltip> <Tooltip title="导入目录">
<Dropdown overlay={exportMenu} placement="bottomCenter" > <ImportOutlined className={(currentDirType==='custom')?'disable': 'default'} onClick={importDir} style={{ fontSize:16,cursor:(currentDirType==='custom')?'not-allowed':'pointer' }} />
<Tooltip title="导出目录"> </Tooltip>
<ExportOutlined className='default' style={{ fontSize:16,cursor:'pointer' }} /> <Dropdown overlay={exportMenu} placement="bottomCenter" >
<Tooltip title="导出目录">
<ExportOutlined className='default' style={{ fontSize:16,cursor:'pointer' }} />
</Tooltip>
</Dropdown>
</> : <Tooltip title="自定义目录">
<SettingOutlined className='default' onClick={customDir} style={{ fontSize:16,cursor:'pointer' }} />
</Tooltip> </Tooltip>
</Dropdown> }
{/* <Tooltip title="自定义目录">
<SettingOutlined className='default' onClick={customDir} style={{ fontSize:16,cursor:'pointer' }} />
</Tooltip> */}
</div> </div>
)} )}
bordered={false} bordered={false}
...@@ -858,28 +914,30 @@ const AssetManageTree = (props) => { ...@@ -858,28 +914,30 @@ const AssetManageTree = (props) => {
} }
<Spin spinning={loading}> <Spin spinning={loading}>
<AutoComplete
allowClear
value={keyword}
style={{ marginBottom: 10, width: '100%' }}
placeholder='搜索目录'
onSelect={onAutoCompleteSelect}
onSearch={onAutoCompleteSearch}
onClear={() => { setKeyword(''); }}
notFoundContent={keyword?<span>暂无数据</span>:null}
>
{ {
(options||[]).map((item, index) => { viewSelectedKeyRef.current !== 'custom' && <AutoComplete
return ( allowClear
<Option key={item.key} value={item.value}> value={keyword}
<div style={{ whiteSpace: 'normal' }}> style={{ marginBottom: 10, width: '100%' }}
{highlightSearchContentByTerms(item.value, [keyword])} placeholder='搜索目录'
</div> onSelect={onAutoCompleteSelect}
</Option> onSearch={onAutoCompleteSearch}
); onClear={() => { setKeyword(''); }}
}) notFoundContent={keyword?<span>暂无数据</span>:null}
>
{
(options||[]).map((item, index) => {
return (
<Option key={item.key} value={item.value}>
<div style={{ whiteSpace: 'normal' }}>
{highlightSearchContentByTerms(item.value, [keyword])}
</div>
</Option>
);
})
}
</AutoComplete>
} }
</AutoComplete>
<Tree <Tree
className='tree-contextmenu' className='tree-contextmenu'
checkable={checkable} checkable={checkable}
...@@ -926,26 +984,21 @@ const AssetManageTree = (props) => { ...@@ -926,26 +984,21 @@ const AssetManageTree = (props) => {
{ {
(reference!==AssetMountReference) && <RcMenu id={MENU_ID}> (reference!==AssetMountReference) && <RcMenu id={MENU_ID}>
{ {
currentRightClickDir && (currentRightClickDir.type!=='custom') && <RcItem id="detail" onClick={onDetailClick}> viewSelectedKeyRef.current==='dir' && <React.Fragment>
{ (currentRightClickDir.level===1)?'栏目详情':'目录详情' } <RcItem id="edit" onClick={editDir}>
</RcItem> 修改目录
</RcItem>
<RcItem id="up" onClick={() => { moveNode(1); }}>
上移目录
</RcItem>
<RcItem id="down" onClick={() => { moveNode(-1); }}>
下移目录
</RcItem>
</React.Fragment>
} }
{ <RcItem id="delete" onClick={deleteDir}>
currentRightClickDir && (currentRightClickDir.type!=='custom') && <RcItem id="edit" onClick={editDir}> 删除目录
{ (currentRightClickDir.level===1)?'修改栏目':'修改目录' }
</RcItem>
}
<RcItem id="up" onClick={() => { moveNode(1); }}>
{ (currentRightClickDir.level===1)?'上移栏目':'上移目录' }
</RcItem>
<RcItem id="down" onClick={() => { moveNode(-1); }}>
{ (currentRightClickDir.level===1)?'下移栏目':'下移目录' }
</RcItem> </RcItem>
{
currentRightClickDir && (currentRightClickDir.type!=='custom'||(currentRightClickDir.type==='custom'&&currentRightClickDir.level===2)) && <RcItem id="delete" onClick={deleteDir}>
{ (currentRightClickDir.level===1)?'删除栏目':'删除目录' }
</RcItem>
}
</RcMenu> </RcMenu>
} }
{contextHolder} {contextHolder}
......
...@@ -554,6 +554,7 @@ const AssetTable = (props) => { ...@@ -554,6 +554,7 @@ const AssetTable = (props) => {
let params = { let params = {
queryElementId: currentElementId, queryElementId: currentElementId,
dirId: nodeId, dirId: nodeId,
currentDirIsCustom: nodeType==='custom',
pageNum, pageNum,
pageSize, pageSize,
keyword: encodeURIComponent(keyword) keyword: encodeURIComponent(keyword)
......
...@@ -303,20 +303,6 @@ const CustomDirectoryModal = (props) => { ...@@ -303,20 +303,6 @@ const CustomDirectoryModal = (props) => {
> >
<Input /> <Input />
</Form.Item> </Form.Item>
{
reference===AssetManageReference && <Form.Item
label='数据范围'
name='resourceTypes'
>
<Select mode="multiple" allowClear>
{
resourceTypes.map((item,index) => {
return <Select.Option key={item.key}>{item.name}</Select.Option>
})
}
</Select>
</Form.Item>
}
<Form.Item <Form.Item
label='描述或原因' label='描述或原因'
name='desc' name='desc'
......
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