资产管理 浏览多模版

src/model/assetmanage.js

@@ -322,4 +322,8 @@ export function* importIndicatorLog(payload) {
 
 export function* getPermission(payload) {
   return yield call(service.getPermission, payload);
+}
+
+export function* getTemplates() {
+  return yield call(service.getTemplates)
 }
\ No newline at end of file

src/service/dataassetmanager.js

@@ -306,4 +306,8 @@ export function importIndicatorLog(payload) {
 
 export function getPermission(payload) {
   return GetJSON("/dataassetmanager/permissionApi/getPermissionDetail", payload);
+}
+
+export function getTemplates() {
+  return GetJSON("/dataassetmanager/elementTemplateApi/listSupportTemplates")
 }
\ No newline at end of file

src/util/axios.js

 
 import axios from 'axios';
 import qs from 'qs';
+import LocalStorage from 'local-storage';
 
 import { IsArr, showMessage, isSzseEnv } from './index';
 
@@ -115,8 +116,10 @@ const callback = resp => {
 
 export function Get(url, params) {
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
+
   return textplain.get(url, {
-    params, cancelToken
+    params: {...params, templateType}, cancelToken
   }).then(
     callback
   )
@@ -124,8 +127,10 @@ export function Get(url, params) {
 
 export function GetJSON(url, params) {
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
+
   return instance.get(url, {
-    params, cancelToken,
+    params: {...params, templateType}, cancelToken,
     validateStatus: false
   }).then(
     callback
@@ -134,8 +139,10 @@ export function GetJSON(url, params) {
 
 export const GetJSONRaw = (url, params) => {
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
+
   return instanceRow.get(url, {
-    params, cancelToken,
+    params: {...params, templateType}, cancelToken,
     validateStatus: false
   }).then(
     callback
@@ -144,8 +151,10 @@ export const GetJSONRaw = (url, params) => {
 
 export function Delete(url, params) {
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
+
   return instance.delete(url, {
-    params, cancelToken,
+    params: {...params, templateType}, cancelToken,
   }).then(
     callback
   )
@@ -154,13 +163,14 @@ export function Delete(url, params) {
 export function PostJSON(url, payload) {
   const { params = null, data = null } = payload||{};
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
 
   return IsArr(data) ? instance.post(url, data, {
-    params, cancelToken
+    params: {...params, templateType}, cancelToken
   }).then(
     callback
   ) : instance.post(url, null, {
-    params, data, cancelToken
+    params: {...params, templateType}, data, cancelToken
   }).then(
     callback
   )
@@ -169,8 +179,10 @@ export function PostJSON(url, payload) {
 export function Post(url, payload) {
   const { params = null, data = null } = payload||{};
   const cancelToken = __source ? __source.token : null;
+  const templateType = LocalStorage.get('templateType');
+
   return textplain.post(url, null, {
-    params, data, cancelToken
+    params: {...params, templateType}, data, cancelToken
   }).then(
     callback
   )
@@ -178,12 +190,14 @@ export function Post(url, payload) {
 
 export function PostFile(url, payload) {
   const { fileList = null, params = null } = payload||{};
+  const templateType = LocalStorage.get('templateType');
+
   let formData = new FormData();
   (fileList||[]).forEach(file=> {
     formData.append('file', file);
   });
 
-  return fileplain.post(url, formData, { params }  ).then(
+  return fileplain.post(url, formData, { params: {...params, templateType} }  ).then(
     callback
   )
 }
@@ -198,10 +212,13 @@ let config = {
 
 export const callFetchRaw = (method, url, options) => {
   const { params, ...reqConfig } = options;
+  const templateType = LocalStorage.get('templateType');
+
   var bodyFormData = new FormData();
   Object.keys(params||[]).forEach(key => {
     bodyFormData.append(key, params[key]);
   });
+  bodyFormData.append('templateType', templateType);
 
   return axios.request({
     method,

src/view/Manage/AssetBrowse/index.jsx

@@ -17,7 +17,7 @@ const AssetBrowse = (props) => {
 
   const { reference = AssetBrowseReference } = props;
 
-  const [ nodeParams, setNodeParams ] = useState({ centerId: '', expandId: '', nodeType: '' });
+  const [ nodeParams, setNodeParams ] = useState({ centerId: null, expandId: '', nodeType: '' });
   const [ expandTree, setExpandTree ] = useState(true);
   const [ expandRelation, setExpandRelation ] = useState(true);
   const [ assetCount, setAssetCount ] = useState(0);
@@ -52,13 +52,6 @@ const AssetBrowse = (props) => {
     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,
@@ -83,7 +76,7 @@ const AssetBrowse = (props) => {
         expandTree && <Separate width={15} />
       }
       <div className={rightClasses}>
-        <AssetDirectory id={nodeId} assetCount={assetCount} reference={reference} nodeType={nodeParams.nodeType} />
+        <AssetDirectory id={centerId} assetCount={assetCount} reference={reference} nodeType={nodeParams.nodeType} />
         <Separate height={15} />
         <div className='flex' style={{ flex: 1, height: '100%', overflow: 'hidden' }}>
           {
@@ -95,7 +88,7 @@ const AssetBrowse = (props) => {
             // </React.Fragment>
           }
           <div style={{ flex: 1, overflow: 'hidden' }}>
-            <AssetTable nodeId={nodeId} nodeType={nodeParams.nodeType} reference={reference} onCountChange={onAssetCountChange} onFullScreenChange={onFullScreenChange} {...props} />
+            <AssetTable nodeId={centerId} nodeType={nodeParams.nodeType} reference={reference} onCountChange={onAssetCountChange} onFullScreenChange={onFullScreenChange} {...props} />
           </div>          
         </div>
         <div className='tree-toggle' onClick={treeToggleClick}>

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

@@ -584,7 +584,7 @@ const AssetAction = (props) => {
     if (item.resourceType==='innerSource'||item.resourceType==='outerSource') {
       window.open(`/center-home/menu/asset-resource-browse?${AnchorId}=${item?.dataAssetId}&${AnchorDirId}=${item?.dirId}&timestamp=${timestamp}`);
     } else if (item.resourceType==='dataAsset') {
-      window.open(`/center-home/menu/asset-browse?${AnchorId}=${item?.dataAssetId}&${AnchorDirId}=${item?.dirId}&timestamp=${timestamp}`);
+      window.open(`/center-home/menu/asset-browse?${AnchorId}=${item?.dataAssetId}&${AnchorDirId}=${item?.dirId}&templateType=${LocalStorage.get('templateType')}&timestamp=${timestamp}`);
     } else {
       showMessage('warn', '资产目录类型不是资源也不是资产!');
     }

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

@@ -44,6 +44,8 @@ const AssetDirectory = (props) => {
   useEffect(() => {
     if ((id||'')!=='') {
       getDirectory();
+    } else {
+      setDir()
     }
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [ id, directoryChanged ])

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

 import React, { useEffect, useState, useRef } from 'react';
-import {Card, Spin, Tooltip, Tree, Dropdown, Menu, Modal, AutoComplete} from 'antd';
+import {Card, Spin, Tooltip, Tree, Dropdown, Menu, Modal, AutoComplete, Select} from 'antd';
 import { PlusOutlined, ImportOutlined,ExportOutlined,ReloadOutlined, SettingOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
 import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify";
+import LocalStorage from 'local-storage';
 
 import { dispatch } from '../../../../model';
 import ImportDirectory from './ImportDirectory'; 
@@ -62,6 +63,9 @@ const AssetManageTree = (props) => {
   const [ customDirectoryAction, setCustomDirectoryAction ] = useState('');
   const [options, setOptions] = useState([]);
   const [ loadedKeys, setLoadedKeys ] = useState([]);
+  const [loadingTemplates, setLoadingTemplates] = useState(false)
+  const [templates, setTemplates] = useState()
+  const [currentTemplateType, setTemplateType] = useState()
 
   const [modal, contextHolder] = Modal.useModal();
   
@@ -73,6 +77,7 @@ const AssetManageTree = (props) => {
   const dataListRef = useRef([]);
 
   useEffect(() => {
+    getTemplates()
     window?.addEventListener("storage", storageChange);
 
     return () => {
@@ -82,16 +87,16 @@ const AssetManageTree = (props) => {
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
-  useEffect(() => {
-    if ((did||'') !== '') {
-      getAllDirectoryAsTree(true, did);
-    } else if ((id||'') !== '') {
-      getDataAssetLocationThenGetTreeData();
-    }  else {
-      getAllDirectoryAsTree(true);
-    } 
-    //eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [timestamp])
+  // useEffect(() => {
+  //   if ((did||'') !== '') {
+  //     getAllDirectoryAsTree(true, did);
+  //   } else if ((id||'') !== '') {
+  //     getDataAssetLocationThenGetTreeData();
+  //   }  else {
+  //     getAllDirectoryAsTree(true);
+  //   } 
+  //   //eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, [timestamp])
 
   useEffect(() => {
     if ((tableId||'') !== '') {
@@ -117,6 +122,26 @@ const AssetManageTree = (props) => {
     }
   }
 
+  const getTemplates = () => {
+    setLoadingTemplates(true)
+    dispatch({
+      type: 'assetmanage.getTemplates',
+      callback: data => {
+        setLoadingTemplates(false)
+        setTemplates(data)
+        if ((data??[]).length > 0) {
+          setTemplateType(data[0].type)
+          LocalStorage.set('templateType', data[0].type)
+          onSelect?.('', '')
+          getAllDirectoryAsTree(false)
+        }
+      },
+      error: () => {
+        setLoadingTemplates(false)
+      }
+    })
+  }
+
   const getDataAssetLocationThenGetTreeData = () => {
     setLoading(true);
     dispatch({
@@ -152,9 +177,9 @@ const AssetManageTree = (props) => {
   const getAllDirectoryAsTree = (resetCurrentDirId=true, defaultSelectedId='', refresh = false) => {
 
     setLoading(true);
-    if (resetCurrentDirId) {
-      onSelect && onSelect('', '');
-    }
+    // if (resetCurrentDirId) {
+    //   onSelect && onSelect('', '');
+    // }
 
     let url = '';
     if (reference === AssetManageReference || reference === AssetMountReference) {
@@ -525,8 +550,9 @@ const AssetManageTree = (props) => {
   // }
 
   const onTreeSelect = (keys, { node }) => {
-
     if ((keys||[]).length === 0) {
+      setCurrentDirId();
+      onSelect?.('', '');
       return;
     }
 
@@ -714,13 +740,30 @@ const AssetManageTree = (props) => {
       className={classes}
       title={ (reference===AssetBrowseReference||reference===ResourceBrowseReference || reference===AssetMountReference) ? null : (
         <div
-          className='flex px-2'
+          className='flex'
           style={{
             height: 40,
             alignItems: 'center',
-            justifyContent: 'space-around',
+            justifyContent: 'space-between',
+            padding: '0 15px'
           }}
         >
+          <Select 
+            size='small'
+            value={currentTemplateType}
+            onChange={(val) => {
+              setTemplateType(val)
+              LocalStorage.set('templateType', val);
+              setCurrentDirId();
+              onSelect?.('', '');
+              getAllDirectoryAsTree(false)
+            }}
+            style={{ width: 65 }}
+          >
+          {
+            (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)
+          }
+          </Select>
           <Tooltip title="新增目录">
             <PlusOutlined className={(currentDir?.resourceType==='custom')?'disable': 'default'} onClick={addDir} style={{ fontSize:16,cursor: (currentDirType==='custom')?'not-allowed':'pointer' }}/>
           </Tooltip>

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

@@ -225,21 +225,20 @@ const AssetTable = (props) => {
   }, [])
 
   useEffect(() => {
-    if ((nodeId||'') !== '' ) {
+    if (nodeId !== null) {
       setSelectItem({});
       setCheckedKeys([]);
-
+  
       if (shouldScrollRef.current === true) {
         if (remoteRelationRef.current) {
           getDataAssetLocationByRelation();
         } else {
           getDataAssetLocation();
         }
-
+  
       } else {
         setPagination({ ...pagination, pageNum: 1 });
       }
-
     }
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [ nodeId ])
@@ -254,7 +253,7 @@ const AssetTable = (props) => {
   }, [timestamp])
 
   useEffect(() => {
-    if ((nodeId||'') !== '' || reference===AssetRecycleReference) {
+    if (nodeId!==null || reference===AssetRecycleReference) {
       getFilterElementsGroupThenGetDataAssets();
     }
     //eslint-disable-next-line react-hooks/exhaustive-deps
@@ -1035,9 +1034,9 @@ const AssetTable = (props) => {
           } */}
         </Space>
         <Space>
-          {
+          {/* {
             (reference!==AssetRecycleReference) && <Checkbox onChange={onFullSearchChange} checked={fullSearch}>全部数据</Checkbox>
-          }
+          } */}
           <Search 
             placeholder="请输入资产目录要素值" 
             allowClear 

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

 import React, { useEffect, useState, useRef } from 'react';
-import {Card, Spin, Tooltip, Tree, Modal, AutoComplete} from 'antd';
+import {Card, Spin, Tooltip, Tree, Modal, AutoComplete, Select} from 'antd';
 import { ReloadOutlined, SettingOutlined } from '@ant-design/icons';
 import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify";
+import LocalStorage from 'local-storage';
 
 import { dispatch } from '../../../../model';
 import CustomDirectoryModal from './CustomDirectoryModal';
@@ -52,6 +53,9 @@ const AssetTree = (props) => {
   const [ customDirectoryAction, setCustomDirectoryAction ] = useState('');
   const [options, setOptions] = useState([]);
   const [ loadedKeys, setLoadedKeys ] = useState([]);
+  const [loadingTemplates, setLoadingTemplates] = useState(false)
+  const [templates, setTemplates] = useState()
+  const [currentTemplateType, setTemplateType] = useState()
 
   const [modal, contextHolder] = Modal.useModal();
   
@@ -63,6 +67,7 @@ const AssetTree = (props) => {
   const dataListRef = useRef([]);
 
   useEffect(() => {
+    getTemplates()
     window?.addEventListener("storage", storageChange);
 
     return () => {
@@ -72,16 +77,16 @@ const AssetTree = (props) => {
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
-  useEffect(() => {
-    if ((did||'') !== '') {
-      getAllDirectoryAsTree(true, did);
-    } else if ((id||'') !== '') {
-      getDataAssetLocationThenGetTreeData();
-    }  else {
-      getAllDirectoryAsTree(true);
-    } 
-    //eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [timestamp])
+  // useEffect(() => {
+  //   if ((did||'') !== '') {
+  //     getAllDirectoryAsTree(true, did);
+  //   } else if ((id||'') !== '') {
+  //     getDataAssetLocationThenGetTreeData();
+  //   }  else {
+  //     getAllDirectoryAsTree(true);
+  //   } 
+  //   //eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, [timestamp])
 
   useEffect(() => {
     if ((tableId||'') !== '') {
@@ -107,6 +112,38 @@ const AssetTree = (props) => {
     }
   }
 
+  const getTemplates = () => {
+    setLoadingTemplates(true)
+    dispatch({
+      type: 'assetmanage.getTemplates',
+      callback: data => {
+        setLoadingTemplates(false)
+        setTemplates(data)
+        if ((data??[]).length > 0) {
+          setTemplateType(data[0].type)
+          const _templateType = getQueryParam('templateType', props?.location?.search)
+          const _dirId = getQueryParam(AnchorDirId, props?.location?.search)
+
+          if (_templateType) {
+            LocalStorage.set('templateType', _templateType)
+          } else {
+            LocalStorage.set('templateType', data[0].type)
+          }
+
+          if (_dirId) {
+            getAllDirectoryAsTree(true, _dirId)
+          } else {
+            onSelect?.('', '')
+            getAllDirectoryAsTree(false)
+          }
+        }
+      },
+      error: () => {
+        setLoadingTemplates(false)
+      }
+    })
+  }
+
   const getDataAssetLocationThenGetTreeData = () => {
     setLoading(true);
     dispatch({
@@ -141,9 +178,9 @@ const AssetTree = (props) => {
   const getAllDirectoryAsTree = (resetCurrentDirId=true, defaultSelectedId='', refresh = false) => {
 
     setLoading(true);
-    if (resetCurrentDirId) {
-      onSelect && onSelect('', '');
-    }
+    // if (resetCurrentDirId) {
+    //   onSelect && onSelect('', '');
+    // }
 
     let url = '';
     if (reference === AssetBrowseReference) {
@@ -413,6 +450,8 @@ const AssetTree = (props) => {
   const onTreeSelect = (keys, _) => {
 
     if ((keys||[]).length === 0) {
+      setCurrentDirId();
+      onSelect?.('', '');
       return;
     }
 
@@ -525,13 +564,30 @@ const AssetTree = (props) => {
       className='asset-tree'
       title={ 
         <div
-          className='flex px-2'
+          className='flex'
           style={{
             height: 40,
             alignItems: 'center',
-            justifyContent: 'space-around',
+            justifyContent: 'space-between',
+            padding: '0 15px'
           }}
         >
+          <Select 
+            size='small'
+            value={currentTemplateType}
+            onChange={(val) => {
+              setTemplateType(val)
+              LocalStorage.set('templateType', val);
+              setCurrentDirId();
+              onSelect?.('', '');
+              getAllDirectoryAsTree(false)
+            }}
+            style={{ width: 65 }}
+          >
+          {
+            (templates??[]).map((item, index) => <Select.Option key={index} value={item.type}>{item.name}</Select.Option>)
+          }
+          </Select>
           <Tooltip title="刷新目录">
             <ReloadOutlined className='default' onClick={refreshTree} style={{ fontSize:16,cursor:'pointer',flex:1}} />
           </Tooltip>

src/view/Manage/AssetManage/index.jsx

@@ -16,7 +16,7 @@ import './index.less';
 
 const AssetManage = (props) => {
 
-  const [ nodeId, setNodeId ] = useState('');
+  const [ nodeId, setNodeId ] = useState(null);
   const [ nodeType, setNodeType ] = useState('');
   const [ nodeLevel, setNodeLevel ] = useState(null);
   const [ assetParams, setAssetParams ] = useState({ assetId: '', assetDirId: '' })