未挂载资产

src/routes.js

@@ -37,7 +37,7 @@ export const routes = [
       },
       {
         name: 'asset-recycle',
-        text: '未分类资产',
+        text: '未挂载资产',
       }
     ]
   }

src/view/Manage/AssetManage/Component/AssetTable.jsx

@@ -100,7 +100,7 @@ const AssetTable = (props) => {
             onClick={() => { mountAsset(record); }}
             style={{ padding: 0 }}
           >
-          变更
+          { (nodeType==='RecycleBin')?'挂载':'变更' }
           </Button>
         </div>
       )
@@ -145,7 +145,7 @@ const AssetTable = (props) => {
   }, [timestamp])
 
   useEffect(() => {
-    if ((nodeId||'') !== '' ) {
+    if ((nodeId||'') !== '' || nodeType==='RecycleBin' ) {
       getFilterElementsGroupThenGetDataAssets();
     }
     //eslint-disable-next-line react-hooks/exhaustive-deps
@@ -282,7 +282,7 @@ const AssetTable = (props) => {
   const getDataAssets = (projectIndex = metadataIndex) => {
     setLoading(true);
     dispatchLatestHomepage({
-      type: 'assetmanage.listDataAssetsByPage',
+      type: (nodeType==='RecycleBin')?'assetmanage.listRecycleBinDataAssetsByPage':'assetmanage.listDataAssetsByPage',
       payload: {
         dirId: nodeId,
         pageNum,
@@ -556,15 +556,11 @@ const AssetTable = (props) => {
       title={
         <div className='d-flex' style={{ justifyContent: 'space-between' }}>
           <Space>
-            { !readOnly && <Tooltip title={(nodeType==='RecycleBin')?'回收站不允许直接新增资产':''}> 
-                <Button onClick={addAsset} disabled={nodeType==='RecycleBin'}>新增
-                </Button>
-              </Tooltip> 
+            { 
+              (!readOnly&&(nodeType!=='RecycleBin')) && <Button onClick={addAsset} disabled={nodeType==='RecycleBin'}>新增</Button>
             }
-            { !readOnly && <Tooltip title={(nodeType==='RecycleBin')?'回收站不允许直接导入资产':''}>  
-                <Button onClick={importAsset} disabled={nodeType==='RecycleBin'}>导入
-                </Button>
-              </Tooltip> 
+            { 
+              (!readOnly&&(nodeType!=='RecycleBin')) && <Button onClick={importAsset} disabled={nodeType==='RecycleBin'}>导入</Button>
             }
             <Tooltip title={(selectedKeys||[]).length===0?'请先选择资产':''}>
               <Button onClick={exportAsset} disabled={(selectedKeys||[]).length===0} >导出</Button>
@@ -643,6 +639,7 @@ const AssetTable = (props) => {
       />
       <AssetMount
         visible={ assetMountVisible }
+        nodeType={nodeType}
         ids={ batchCatalogChange?selectedKeys:[currentAssetId] }
         onCancel={ onAssetMountCancel }
         {...props}

src/view/Manage/AssetRecycle/Component/AssetMount.jsx

@@ -7,7 +7,7 @@ import { showMessage } from '../../../../util';
 
 const AssetMount = (props) => {
   
-  const { onCancel, visible, ids, refrence = 'asset-manage' } = props;
+  const { onCancel, visible, ids, refrence = 'asset-manage', nodeType } = props;
   const [ dirIds, setDirIds ] = useState([]);
   const [ confirmLoading, setConfirmLoading ] = useState(false);
 
@@ -48,7 +48,7 @@ const AssetMount = (props) => {
 
   return(
     <Modal
-      title='变更目录详情'
+      title={(nodeType==='RecycleBin')?'挂载目录详情':'变更目录详情'}
       visible={ visible }
       width={ 400 }
       confirmLoading={ confirmLoading }

src/view/Manage/AssetRecycle/index.jsx

-import React, { useEffect, useState } from 'react';
-import { Table, Pagination, Space, Tooltip, Button, Modal } from 'antd';
-import { ReconciliationOutlined, DeleteOutlined, UndoOutlined } from '@ant-design/icons';
+import React from 'react';
 
-import { dispatchLatest } from '../../../model';
-import AssetMount from './Component/AssetMount';
-import { showMessage } from '../../../util';
-
-import './index.less';
+import AssetTable from '../AssetManage/Component/AssetTable';
 
 const AssetRecycle = (props) => {
 
-  const [ loading, setLoading ] = useState(false);
-  const [ assets, setAssets ] = useState([]);
-  const [ total, setTotal ] = useState(0);
-  const [ pagination, setPagination ] = useState( { pageNum: 1, pageSize: 20 } );
-  const [ currentAssetId, setCurrentAssetId ] = useState('');
-  const [ assetMountVisible, setAssetMountVisible ] = useState(false);
-  const [ selectedRowKeys, setSelectedRowKeys ] = useState([]);
-  const [ batchMount, setBatchMount ] = useState(false);
-
-  const { pageNum, pageSize } = pagination;
-
-  const [modal, contextHolder] = Modal.useModal();
-
-  useEffect(() => {
-    
-    getAssets();
-    //eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ pagination ])
-
-  const columns = [
-    {
-      title: '序号',
-      dataIndex: 'key',
-      render: (text, record, index) => {
-        return (index+1).toString();
-      },
-      width:80
-    },
-    {
-      title: '中文名称',
-      dataIndex: 'cnName',
-      ellipsis: true,
-    },
-    {
-      title: '英文名称',
-      dataIndex: 'name',
-      ellipsis: true,
-    },
-    {
-      title: '操作',
-      key: 'action',
-      width: 120,
-      render: (text,record) => {
-        return (
-          <Space size='small'>
-            <Tooltip placement='bottom' title='详情'>
-              <Button icon={<ReconciliationOutlined />} size='small' onClick={() => { detailItem(record); }} />
-            </Tooltip>
-            <Tooltip placement='bottom' title='挂载'>
-              <Button icon={<UndoOutlined />} size='small' onClick={() => { mountItem(record); }} />
-            </Tooltip>
-            <Tooltip placement='bottom' title='删除'>
-              <Button icon={<DeleteOutlined />} size='small' onClick={() => { deleteItem(record); }} />
-            </Tooltip>
-          </Space>
-        )
-      }
-    }
-  ]
-
-  const getAssets = () => {
-    setLoading(true);
-    dispatchLatest({
-      type: 'assetmanage.listRecycleBinDataAssetsByPage',
-      payload: {
-        pageNum,
-        pageSize
-      },
-      callback: data => {
-        convertAssets(data.data||[]);
-        setTotal(data.total);
-        setLoading(false);
-      },
-      error: () => {
-        setLoading(false);
-      }
-    })
-  }
-
-  const convertAssets = data => {
-    (data||[]).forEach(item => {
-      (item.elements||[]).forEach(element => {
-        if (element.name === '中文名称') {
-          item.cnName = element.value;
-        } 
-        if (element.name === '英文名称') {
-          item.name = element.value;
-        }
-      })
-    })
-
-    setAssets(data||[]);
-  }
-
-  const detailItem = (record) => {
-    setCurrentAssetId(record.id);
-    window.open(`/center-home/asset-detail?id=${record.id}`);
-  }
-
-  const mountItem = (record) => {
-    setBatchMount(false);
-    setCurrentAssetId(record.id);
-    setAssetMountVisible(true);
-  }
-
-  const mountItems = () => {
-    if ((selectedRowKeys||[]).length === 0) {
-      showMessage('warn', '请先选择资产');
-      return;
-    }
-
-    setBatchMount(true);
-    setAssetMountVisible(true);
-  }
-
-  const deleteItems = () => {
-    if ((selectedRowKeys||[]).length === 0) {
-      showMessage('warn', '请先选择资产');
-      return;
-    }
-
-    modal.confirm({
-      title: '提示!',
-      content: '您确定要永久删除选中的资产吗?',
-      onOk: () => {
-        dispatchLatest({
-          type: 'assetmanage.deleteDataAssets',
-          payload: {
-            data: selectedRowKeys
-          },
-          callback: () => {
-            showMessage('success', '资产删除成功');
-            setSelectedRowKeys([]);
-            getAssets();
-          }
-        })
-      }
-    });
-  }
-
-  const deleteItem = (record) => {
-    modal.confirm({
-      title: '提示!',
-      content: '您确定要永久删除该资产吗?',
-      onOk: () => {
-        dispatchLatest({
-          type: 'assetmanage.deleteDataAssets',
-          payload: {
-            data: [ record.id ]
-          },
-          callback: () => {
-            showMessage('success', '资产删除成功');
-            getAssets();
-          }
-        })
-      }
-    });
-  }
-
-  const onAssetMountCancel = (refresh = false) => {
-    setAssetMountVisible(false);
-
-    if (refresh) {
-      batchMount && setSelectedRowKeys([]);
-      getAssets();
-    }
-    
-  }
-
-  const onSelectChange = keys => {
-    setSelectedRowKeys(keys);
-  };
-
-  const rowSelection = {
-    selectedRowKeys,
-    onChange: onSelectChange,
-  };
-
   return (
     <div className='asset-recycle' style={{ backgroundColor: '#fff' }}>
-      <div
-        className='d-flex p-3'
-        style={{
-          borderBottom: '1px solid #EFEFEF',
-        }}
-      >
-        <Button type="primary" onClick={mountItems} style={{ marginLeft: 'auto' }} >挂载</Button>
-        <Button type="danger" onClick={deleteItems} style={{ marginLeft: '5px' }} >删除</Button>
-      </div>
-      <div className='list p-3'>
-        <Table
-          loading={loading}
-          rowSelection={rowSelection} 
-          columns={columns} 
-          rowKey={'id'}
-          dataSource={assets||[]}
-          pagination={false} 
-        />
-        <Pagination
-          size="small"
-          className="text-center mt-3"
-          showSizeChanger
-          showQuickJumper
-          onChange={(_pageNum, _pageSize) => {
-            setPagination({ pageNum: _pageNum, pageSize: _pageSize || 10 });
-          }}
-          onShowSizeChange={(_pageNum, _pageSize) => {
-            setPagination({ pageNum: _pageNum || 1, pageSize: _pageSize });
-          }}
-          current={pageNum}
-          pageSize={pageSize}
-          defaultCurrent={1}
-          total={total}
-          showTotal={total => `共 ${total} 条`}
-        />
-      </div>
-      <AssetMount
-        refrence='asset-recycle'
-        visible={ assetMountVisible }
-        ids={ batchMount ? selectedRowKeys : [ currentAssetId ] }
-        onCancel={ onAssetMountCancel }
-        {...props}
-      />
-      {contextHolder}
+      <AssetTable nodeType='RecycleBin' {...props} />
     </div>
   );
 }

src/view/Manage/AssetRecycle/index.less

-@import '../../../variables.less';
-
-.asset-recycle {
-  .list {
-    height: calc(100vh - @header-height - @pm-4 - @pm-3 - 33px) !important;
-    overflow: auto !important;
-  }
-}
\ No newline at end of file