浏览

src/view/Manage/AssetBrowse/index.jsx

@@ -6,7 +6,7 @@ import { ResizableBox } from 'react-resizable';
 import AssetTree from '../AssetManage/Component/AssetTree';
 import AssetDirectory from '../AssetManage/Component/AssetDirectory';
 import RelationContainer from './Component/RelationContainer';
-import AssetTable from "../AssetManage/Component/AssetTable";
+import AssetTable from "./table";
 import Separate from '../AssetManage/Component/Separate';
 
 import { AssetBrowseReference } from '../../../util/constant';
@@ -14,9 +14,6 @@ import { AssetBrowseReference } from '../../../util/constant';
 import './index.less';
 
 const AssetBrowse = (props) => {
-
-  const { reference = AssetBrowseReference } = props;
-
   const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' });
   const [ expandTree, setExpandTree ] = useState(true);
   const [ expandRelation, setExpandRelation ] = useState(true);
@@ -77,25 +74,25 @@ const AssetBrowse = (props) => {
           axis='x'
           minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]}          
         >
-        <AssetTree centerId={centerId} onSelect={onTreeSelect} reference={reference} {...props} />
+        <AssetTree centerId={centerId} onSelect={onTreeSelect} reference={AssetBrowseReference} {...props} />
       </ResizableBox>
       {
         expandTree && <Separate width={15} />
       }
       <div className={rightClasses}>
-        <AssetDirectory id={nodeId} assetCount={assetCount} reference={reference} nodeType={nodeParams.nodeType} />
+        <AssetDirectory id={nodeId} assetCount={assetCount} reference={AssetBrowseReference} nodeType={nodeParams.nodeType} />
         <Separate height={15} />
         <div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
           {
             expandRelation && <React.Fragment>
               <div style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
-                <RelationContainer reference={reference} nodeParams={nodeParams} onChange={onRelationChange} resize={resizeRelation} />
+                <RelationContainer reference={AssetBrowseReference} nodeParams={nodeParams} onChange={onRelationChange} resize={resizeRelation} />
               </div>
               <Separate width={15} />
             </React.Fragment>
           }
           <div style={{ flex: 1, overflow: 'hidden' }}>
-            <AssetTable nodeId={nodeId} nodeType={nodeParams.nodeType} reference={reference} onCountChange={onAssetCountChange} onFullScreenChange={onFullScreenChange} {...props} />
+            <AssetTable node={{ nodeId }} onFullScreenChange={onFullScreenChange} {...props} />
           </div>          
         </div>
         <div className='tree-toggle' onClick={treeToggleClick}>

src/view/Manage/AssetManage/table.jsx

@@ -61,8 +61,6 @@ const FC = (props) => {
   const [permissions, setPermissions] = React.useState([])
   const [loadingPublishStatus, setLoadingPublishStatus] = React.useState(false)
   const [publishStatus, setPublishStatus] = React.useState()
-  const [loadingRelatedMetadataStatus, setLoadingRelatedMetadataStatus] = React.useState(false)
-  const [relatedMetadataStatus, setRelatedMetadataStatus] = React.useState()
   const $keyword = React.useMemo(() => new Subject(), [])
   const [keyword, setKeyword] = React.useState()
   const [searchType, setSearchType] = React.useState('keyword')
@@ -146,7 +144,6 @@ const FC = (props) => {
   React.useEffect(() => {
     getElements()
     getPublishStatus()
-    getResourceRelatedMetadataStatus()
 
     const $$keyword = $keyword.pipe(debounceTime(1000)).subscribe((keyword) => {
       setArgsAndPage({ keyword })
@@ -379,20 +376,6 @@ const FC = (props) => {
     })
   }
 
-  const getResourceRelatedMetadataStatus = () => {
-    setLoadingRelatedMetadataStatus(true)
-    dispatch({
-      type: 'assetmanage.getResourceRelatedMetadataStatus',
-      callback: data => {
-        setLoadingRelatedMetadataStatus(false)
-        setRelatedMetadataStatus(data)
-      },
-      error: () => {
-        setLoadingRelatedMetadataStatus(false)
-      }
-    })
-  }
-
   const getElements = () => {
     setLoadingElements(true)
     dispatch({

src/view/Manage/AssetResourceBrowse/index.jsx

-import React from 'react';
+import React, { useState } from 'react';
+import classNames from 'classnames';
+import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
+import { ResizableBox } from 'react-resizable';
 
-import AssetBrowse from '../AssetBrowse';
+import AssetTree from '../AssetManage/Component/AssetTree';
+import AssetDirectory from '../AssetManage/Component/AssetDirectory';
+import RelationContainer from '../AssetBrowse/Component/RelationContainer';
+import AssetTable from "./table";
+import Separate from '../AssetManage/Component/Separate';
 import { ResourceBrowseReference } from '../../../util/constant';
 
-const AssetResourceBrowse = (props) => {
+import '../AssetBrowse/index.less';
+
+const FC = (props) => {
+  const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' });
+  const [ expandTree, setExpandTree ] = useState(true);
+  const [ expandRelation, setExpandRelation ] = useState(true);
+  const [ assetCount, setAssetCount ] = useState(0);
+  const [ resizeRelation, setResizeRelation ] = useState(false);
+  const [ assetFullScreen, setAssetFullScreen ] = useState(false);
+
+  const { centerId, expandId } = nodeParams;
+
+  const onTreeSelect = (value, type) => {
+    setNodeParams({ centerId: value||'', expandId: '', nodeType: type });
+  }
+
+  const treeToggleClick = () => {
+    setExpandTree(!expandTree);
+    setResizeRelation(!resizeRelation);
+  }
+
+  const relationToggleClick = () => {
+    setExpandRelation(!expandRelation);
+    setResizeRelation(!resizeRelation);
+  }
+
+  const onRelationChange = (data) => {
+    setNodeParams(data);
+  }
+
+  const onAssetCountChange = (count) => {
+    setAssetCount(count);
+  }
+
+  const onFullScreenChange = (value) => {
+    setAssetFullScreen(value);
+  }
+
+  let nodeId = '';
+  if ((expandId||'') !== '') {
+    nodeId = expandId;
+  } else {
+    nodeId = centerId;
+  }
+
+  const classes = classNames('asset-browse', {
+    'asset-browse-tree-collapse': !expandTree,
+    'asset-browse-relation-collapse': !expandRelation,
+  }); 
+  
+  const rightClasses = classNames('right', {
+    'right-fullscreen': assetFullScreen
+  }); 
+
   return (
-    <AssetBrowse reference={ResourceBrowseReference} {...props} />
+    <div className={classes}>
+      <ResizableBox 
+          className='left' 
+          width={230} 
+          height={Infinity}
+          axis='x'
+          minConstraints={[230, Infinity]} maxConstraints={[Infinity, Infinity]}          
+        >
+        <AssetTree centerId={centerId} onSelect={onTreeSelect} reference={ResourceBrowseReference} {...props} />
+      </ResizableBox>
+      {
+        expandTree && <Separate width={15} />
+      }
+      <div className={rightClasses}>
+        <AssetDirectory id={nodeId} assetCount={assetCount} reference={ResourceBrowseReference} nodeType={nodeParams.nodeType} />
+        <Separate height={15} />
+        <div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
+          {
+            expandRelation && <React.Fragment>
+              <div style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
+                <RelationContainer reference={ResourceBrowseReference} nodeParams={nodeParams} onChange={onRelationChange} resize={resizeRelation} />
+              </div>
+              <Separate width={15} />
+            </React.Fragment>
+          }
+          <div style={{ flex: 1, overflow: 'hidden' }}>
+            <AssetTable node={{ nodeId }} onFullScreenChange={onFullScreenChange} {...props} />
+          </div>          
+        </div>
+        <div className='tree-toggle' onClick={treeToggleClick}>
+        { expandTree ? <CaretLeftOutlined /> : <CaretRightOutlined /> }
+        </div>
+        <div className='relation-toggle' onClick={relationToggleClick}>
+          { expandRelation ? <CaretLeftOutlined /> : <CaretRightOutlined /> }
+        </div>
+      </div>
+    </div>
   )
 }
 
-export default AssetResourceBrowse;
\ No newline at end of file
+export default FC;
\ No newline at end of file

src/view/Manage/AssetResourceManage/add-to-asset.jsx

@@ -240,7 +240,7 @@ export const Basic = React.forwardRef(function ({ items, defaultValue }, ref) {
             label='资产信息'
             rules={[{ required: true, message: '请填写资产信息!' }]}
           >
-            <AssetInfoItem />
+            <AssetInfoItem elements={defaultValue} />
           </Form.Item>
         </React.Fragment> : <React.Fragment>
           <Form.Item
@@ -264,9 +264,8 @@ export const Basic = React.forwardRef(function ({ items, defaultValue }, ref) {
   )
 })
 
-const AssetInfoItem = ({ value, onChange }) => {
+const AssetInfoItem = ({ value, elements, onChange }) => {
   const [loading, setLoading] = React.useState(false)
-  const [elements, setElements] = React.useState()
   const [groups, setGroups] = React.useState()
 
   const [form] = Form.useForm()
@@ -280,29 +279,8 @@ const AssetInfoItem = ({ value, onChange }) => {
   }, [value])
 
   React.useEffect(() => {
-    getElements()
-  }, [])
-  
-  const getElements = () => {
-    setLoading(true)
-    dispatch({
-      type: 'assetmanage.listElements',
-      payload: {
-        params: {
-          range: getAssetRange(ResourceManageReference),
-          dataAssetType: getAssetType(ResourceManageReference),
-        }
-      },
-      callback: data => {
-        setLoading(false)
-        setElements(data)
-        setGroups(Array.from(new Set((data??[]).map(item => item.type))))
-      },
-      error: () => {
-        setLoading(false)
-      }
-    })
-  }
+    setGroups(Array.from(new Set((elements??[]).map(item => item.type))))
+  }, [elements])
 
   const onValuesChange = (changedValues, allValues) => {
     const newElements = [...elements]