Commit e9594451 by zhaochengxiang

bug fix

parent defa4eaa
import React, { useState } from 'react'; import React, { useEffect, useState } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons'; import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
import { ResizableBox } from 'react-resizable'; import { ResizableBox } from 'react-resizable';
...@@ -17,12 +17,29 @@ const AssetBrowse = (props) => { ...@@ -17,12 +17,29 @@ const AssetBrowse = (props) => {
const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' }); const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' });
const [ expandTree, setExpandTree ] = useState(true); const [ expandTree, setExpandTree ] = useState(true);
const [ expandRelation, setExpandRelation ] = useState(true); const [ expandRelation, setExpandRelation ] = useState(true);
const [ assetCount, setAssetCount ] = useState(0);
const [ resizeRelation, setResizeRelation ] = useState(false); const [ resizeRelation, setResizeRelation ] = useState(false);
const [ assetFullScreen, setAssetFullScreen ] = useState(false); const [ assetFullScreen, setAssetFullScreen ] = useState(false);
const [treeList, setTreeList] = useState();
const [node, setNode] = useState();
const { centerId, expandId } = nodeParams; const { centerId, expandId } = nodeParams;
useEffect(() => {
if ((treeList??[]).length > 0) {
if (expandId) {
const index = (treeList??[]).findIndex(item => item.nodeId === expandId)
if (index !== -1) {
setNode(treeList[index])
}
} else if (centerId) {
const index = (treeList??[]).findIndex(item => item.nodeId === centerId)
if (index !== -1) {
setNode(treeList[index])
}
}
}
}, [centerId, expandId, treeList])
const onTreeSelect = (value, type) => { const onTreeSelect = (value, type) => {
setNodeParams({ centerId: value||'', expandId: '', nodeType: type }); setNodeParams({ centerId: value||'', expandId: '', nodeType: type });
} }
...@@ -41,21 +58,10 @@ const AssetBrowse = (props) => { ...@@ -41,21 +58,10 @@ const AssetBrowse = (props) => {
setNodeParams(data); setNodeParams(data);
} }
const onAssetCountChange = (count) => {
setAssetCount(count);
}
const onFullScreenChange = (value) => { const onFullScreenChange = (value) => {
setAssetFullScreen(value); setAssetFullScreen(value);
} }
let nodeId = '';
if ((expandId||'') !== '') {
nodeId = expandId;
} else {
nodeId = centerId;
}
const classes = classNames('asset-browse', { const classes = classNames('asset-browse', {
'asset-browse-tree-collapse': !expandTree, 'asset-browse-tree-collapse': !expandTree,
'asset-browse-relation-collapse': !expandRelation, 'asset-browse-relation-collapse': !expandRelation,
...@@ -74,13 +80,26 @@ const AssetBrowse = (props) => { ...@@ -74,13 +80,26 @@ const AssetBrowse = (props) => {
axis='x' axis='x'
minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]} minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]}
> >
<AssetTree centerId={centerId} onSelect={onTreeSelect} reference={AssetBrowseReference} {...props} /> <AssetTree
centerId={centerId}
onSelect={onTreeSelect}
reference={AssetBrowseReference}
getList={(val) => {
setTreeList(val)
}}
{...props}
/>
</ResizableBox> </ResizableBox>
{ {
expandTree && <Separate width={15} /> expandTree && <Separate width={15} />
} }
<div className={rightClasses}> <div className={rightClasses}>
<AssetDirectory id={nodeId} assetCount={assetCount} reference={AssetBrowseReference} nodeType={nodeParams.nodeType} /> <AssetDirectory
id={node?.nodeId}
assetCount={node?.dataAssetAndSubDirCount}
reference={AssetBrowseReference}
nodeType={node?.type}
/>
<Separate height={15} /> <Separate height={15} />
<div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}> <div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
{ {
...@@ -92,7 +111,7 @@ const AssetBrowse = (props) => { ...@@ -92,7 +111,7 @@ const AssetBrowse = (props) => {
</React.Fragment> </React.Fragment>
} }
<div style={{ flex: 1, overflow: 'hidden' }}> <div style={{ flex: 1, overflow: 'hidden' }}>
<AssetTable node={{ nodeId, type: nodeParams.nodeType }} onFullScreenChange={onFullScreenChange} {...props} /> <AssetTable node={node} onFullScreenChange={onFullScreenChange} {...props} />
</div> </div>
</div> </div>
<div className='tree-toggle' onClick={treeToggleClick}> <div className='tree-toggle' onClick={treeToggleClick}>
......
...@@ -40,7 +40,7 @@ const AssetTree = (props) => { ...@@ -40,7 +40,7 @@ const AssetTree = (props) => {
id: MENU_ID, id: MENU_ID,
}); });
const { onSelect, onCheck, tableId, reference=AssetBrowseReference, centerId } = props; const { onSelect, onCheck, tableId, reference=AssetBrowseReference, centerId, getList } = props;
const [ keyword, setKeyword ] = useState(''); const [ keyword, setKeyword ] = useState('');
const [ loading, setLoading ] = useState(false); const [ loading, setLoading ] = useState(false);
const [ treeData, setTreeData ] = useState([]); const [ treeData, setTreeData ] = useState([]);
...@@ -185,6 +185,7 @@ const AssetTree = (props) => { ...@@ -185,6 +185,7 @@ const AssetTree = (props) => {
generateList(newData, _dataList); generateList(newData, _dataList);
generateGroupIds(newData, _groupIds); generateGroupIds(newData, _groupIds);
setDataList(_dataList); setDataList(_dataList);
getList?.(_dataList)
treeDataRef.current = newData; treeDataRef.current = newData;
dataListRef.current = _dataList; dataListRef.current = _dataList;
...@@ -294,7 +295,7 @@ const AssetTree = (props) => { ...@@ -294,7 +295,7 @@ const AssetTree = (props) => {
const { nodeId, text } = node; const { nodeId, text } = node;
const currentPath = path ? `${path}/${text}` : text; const currentPath = path ? `${path}/${text}` : text;
list.push({ key: nodeId , title: text, value: currentPath }); list.push({ ...node, key: nodeId , title: text, value: currentPath });
if (node.children) { if (node.children) {
generateList(node.children, list, currentPath); generateList(node.children, list, currentPath);
} }
......
import React, { useState } from 'react'; import React, { useState, useEffect } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons'; import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
import { ResizableBox } from 'react-resizable'; import { ResizableBox } from 'react-resizable';
...@@ -16,12 +16,29 @@ const FC = (props) => { ...@@ -16,12 +16,29 @@ const FC = (props) => {
const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' }); const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' });
const [ expandTree, setExpandTree ] = useState(true); const [ expandTree, setExpandTree ] = useState(true);
const [ expandRelation, setExpandRelation ] = useState(true); const [ expandRelation, setExpandRelation ] = useState(true);
const [ assetCount, setAssetCount ] = useState(0);
const [ resizeRelation, setResizeRelation ] = useState(false); const [ resizeRelation, setResizeRelation ] = useState(false);
const [ assetFullScreen, setAssetFullScreen ] = useState(false); const [ assetFullScreen, setAssetFullScreen ] = useState(false);
const [treeList, setTreeList] = useState();
const [node, setNode] = useState();
const { centerId, expandId } = nodeParams; const { centerId, expandId } = nodeParams;
useEffect(() => {
if ((treeList??[]).length > 0) {
if (expandId) {
const index = (treeList??[]).findIndex(item => item.nodeId === expandId)
if (index !== -1) {
setNode(treeList[index])
}
} else if (centerId) {
const index = (treeList??[]).findIndex(item => item.nodeId === centerId)
if (index !== -1) {
setNode(treeList[index])
}
}
}
}, [centerId, expandId, treeList])
const onTreeSelect = (value, type) => { const onTreeSelect = (value, type) => {
setNodeParams({ centerId: value||'', expandId: '', nodeType: type }); setNodeParams({ centerId: value||'', expandId: '', nodeType: type });
} }
...@@ -40,21 +57,10 @@ const FC = (props) => { ...@@ -40,21 +57,10 @@ const FC = (props) => {
setNodeParams(data); setNodeParams(data);
} }
const onAssetCountChange = (count) => {
setAssetCount(count);
}
const onFullScreenChange = (value) => { const onFullScreenChange = (value) => {
setAssetFullScreen(value); setAssetFullScreen(value);
} }
let nodeId = '';
if ((expandId||'') !== '') {
nodeId = expandId;
} else {
nodeId = centerId;
}
const classes = classNames('asset-browse', { const classes = classNames('asset-browse', {
'asset-browse-tree-collapse': !expandTree, 'asset-browse-tree-collapse': !expandTree,
'asset-browse-relation-collapse': !expandRelation, 'asset-browse-relation-collapse': !expandRelation,
...@@ -73,13 +79,26 @@ const FC = (props) => { ...@@ -73,13 +79,26 @@ const FC = (props) => {
axis='x' axis='x'
minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]} minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]}
> >
<AssetTree centerId={centerId} onSelect={onTreeSelect} reference={ResourceBrowseReference} {...props} /> <AssetTree
centerId={centerId}
onSelect={onTreeSelect}
reference={ResourceBrowseReference}
getList={(val) => {
setTreeList(val)
}}
{...props}
/>
</ResizableBox> </ResizableBox>
{ {
expandTree && <Separate width={15} /> expandTree && <Separate width={15} />
} }
<div className={rightClasses}> <div className={rightClasses}>
<AssetDirectory id={nodeId} assetCount={assetCount} reference={ResourceBrowseReference} nodeType={nodeParams.nodeType} /> <AssetDirectory
id={node?.nodeId}
assetCount={node?.dataAssetAndSubDirCount}
reference={ResourceBrowseReference}
nodeType={node?.type}
/>
<Separate height={15} /> <Separate height={15} />
<div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}> <div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
{ {
...@@ -91,7 +110,7 @@ const FC = (props) => { ...@@ -91,7 +110,7 @@ const FC = (props) => {
</React.Fragment> </React.Fragment>
} }
<div style={{ flex: 1, overflow: 'hidden' }}> <div style={{ flex: 1, overflow: 'hidden' }}>
<AssetTable node={{ nodeId, type: nodeParams.nodeType }} onFullScreenChange={onFullScreenChange} {...props} /> <AssetTable node={node} onFullScreenChange={onFullScreenChange} {...props} />
</div> </div>
</div> </div>
<div className='tree-toggle' onClick={treeToggleClick}> <div className='tree-toggle' onClick={treeToggleClick}>
......
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