新增资产

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

@@ -26,8 +26,8 @@ import RelationAssets from './asset-relation-assets';
 
 import './AssetAction.less';
 
-const AssetAction = (props) => {
-  const { id, dirId, action, terms, onChange, reference, form, onMetadataChange, onElementsChange, readonly = false, permissionId, catalog, onPostRelationsChange } = props;
+const AssetAction = React.forwardRef(function (props, ref) {
+  const { id, dirId, action, terms, onChange, reference, readonly = false, permissionId, catalog, template } = props;
 
   const [ currentAction, setCurrentAction ] = useState(action);
   const [ assetParams, setAssetParams ] = useState({ assets: {}, attributes: [] });
@@ -73,6 +73,28 @@ const AssetAction = (props) => {
   const [columnForm] = Form.useForm()
   const relationAssetsRef = useRef();
 
+  const [form] = Form.useForm();
+
+  React.useImperativeHandle(ref, () => ({
+    validate: async () => {
+      await form.validateFields();
+      await columnForm?.validateFields();
+    },
+    getAsset: () => {
+      const row = form?.getFieldsValue();
+      const newElements = [...elements];
+      (newElements||[]).forEach(element => {
+        if (row.hasOwnProperty(element.name)) {
+          element.value = row[element.name];
+        }
+      });
+
+      const data = (action==='add') ? { elements: newElements } : { ...assets, elements: newElements };
+
+      return {...data, businessRelations: relationAssetsRef.current?.assets, businessColumns: modifyMetadataColumnList};
+    }
+  }), [action, assets, form, elements, modifyMetadataColumnList])
+
   const columns = [
     {
       title: '技术ID(英文名称)',
@@ -265,17 +287,20 @@ const AssetAction = (props) => {
     return [];
   }, [currentDomainGroup, currentBussinessDomain, treeDataMap])
 
+  const isStructured = useMemo(() => {
+    return template?.structured || assets?.structured
+  }, [assets, template])
+
   const cols = useMemo(() => {
     let newCols = []
-    if (assets) {
-      newCols = assets.structured?[...columns]:[...businessColumns]
-      if (!assets.structured && currentAction!=='detail') {
+
+    newCols = isStructured?[...columns]:[...businessColumns]
+    if (!isStructured && currentAction!=='detail') {
       newCols.push(businessActionCol)
     }
-    }
  
     return newCols
-  }, [currentAction, assets, columns, businessColumns, businessActionCol])
+  }, [currentAction, isStructured, columns, businessColumns, businessActionCol])
 
   const [tableData, total] = useMemo(() => {
     let currentMetadataColumnList = currentAction!=='detail' ? [...modifyMetadataColumnList||[]] : [...metadataColumnList||[]]
@@ -366,7 +391,6 @@ const AssetAction = (props) => {
         setLoading(false);
         const _attributes = Array.from(new Set((data??[]).map(item => item.type)));
         setElements(data);
-        onElementsChange?.(data);
         setAssetParams({ attributes: _attributes });
         if ((_attributes??[]).length > 0) {
           setCurrentAttribute(_attributes[0])
@@ -485,10 +509,8 @@ const AssetAction = (props) => {
         const metadataIndex = data?.elements?.findIndex(item => item.name === '资产项');
 
         setElements(data?.elements||[]);
-        onElementsChange && onElementsChange(data?.elements||[]);
 
         setMetadataId(data?.metadataId||'');
-        onMetadataChange && onMetadataChange(data?.metadataId||'');
 
         const _attributes = Array.from(new Set((data?.elements??[]).map(item => item.type)))
 
@@ -533,7 +555,7 @@ const AssetAction = (props) => {
     if (assets?.id) {
       setLoadingMetadataColumnList(true);
       dispatch({
-        type: (assets?.structured)?'assetmanage.getColumns':'assetmanage.getBusinessColumns',
+        type: isStructured?'assetmanage.getColumns':'assetmanage.getBusinessColumns',
         payload: {
           dataAssetId: assets?.id
         },
@@ -940,7 +962,7 @@ const AssetAction = (props) => {
       <div>
         <Divider orientation='left'>字段级资产目录信息</Divider>
         {
-          assets?.structured ? <Table
+          isStructured ? <Table
             className='mt-3'
             loading={loadingMetadataColumnList}
             columns={cols??[]} 
@@ -969,7 +991,7 @@ const AssetAction = (props) => {
                     setModifyMetadataColumnList(prev => {
                       return [{
   
-                      }, ...prev]
+                      }, ...prev??[]]
                     })
                   } catch (errInfo) {
 
@@ -1018,10 +1040,9 @@ const AssetAction = (props) => {
       {contextHolder}
     </div>
   )
-}
-
-export default AssetAction;
+})
 
+export default AssetAction
 
 const MultipleSelect = ({ value = null, element, onChange }) => {
 

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

@@ -8,7 +8,6 @@ import { dispatch } from '../../../../model';
 const AssetDetailDrawer = (props) => {
   const { onCancel, visible, id, dirId, reference, readonly = false } = props;
   const [animated, setAnimated] = React.useState(true)
-  const [ form ] = Form.useForm();
   const [draftAsset, setDraftAsset] = React.useState()
 
   React.useEffect(() => {
@@ -58,7 +57,7 @@ const AssetDetailDrawer = (props) => {
       }}
     >
     {
-      visible && !animated && <AssetAction reference={reference} form={form} id={id} dirId={dirId} action='detail' readonly={readonly} onChange={() => {
+      visible && !animated && <AssetAction reference={reference} id={id} dirId={dirId} action='detail' readonly={readonly} onChange={() => {
         onCancel?.(true);
       }} />
     }

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

@@ -10,7 +10,7 @@ import { Subject } from "rxjs";
 import FilterElementModal from './FilterElementModal';
 import AssetMount from '../../AssetRecycle/Component/AssetMount';
 import ImportAssetDrawer from './ImportAssetDrawer';
-import AssetEdit from './AddAssetModel';
+import AddAsset from './add-asset';
 import AssetDetailDrawer from "./AssetDetailDrawer";
 import { dispatch, dispatchLatestHomepage } from '../../../../model';
 import { showMessage, showNotifaction, getQueryParam, inputWidth, isSzseEnv, highlightSearchContentByTerms, isPostAsset } from '../../../../util';
@@ -110,7 +110,9 @@ const AssetTable = (props) => {
   const [ checkedKeys, setCheckedKeys ] = useState([]);
   const [ importAssetVisible, setImportAssetVisible ] = useState(false);
   const [ filterElementVisible, setFilterElementVisible ] = useState(false);
-  const [ assetEditVisible, setAssetEditVisible ] = useState(false);
+  const [addAssetParams, setAddAssetParams] = useState({
+    visible: false,
+  })
   const [ assetDetailDrawerVisible, setAssetDetailDrawerVisible ] = useState(false);
   // const [ currentAssetId, setCurrentAssetId ] = useState('');
   const [ pagination, setPagination ] = useState( { pageNum: 1, pageSize: 20 } );
@@ -618,12 +620,9 @@ const AssetTable = (props) => {
   }
 
   const addAsset =()=>{
-    setAssetEditVisible(true);
-  }
-
-  const onAssetEditCancel=(refresh = false) => {
-    setAssetEditVisible(false);
-    refresh && getDataAssets();
+    setAddAssetParams({
+      visible: true
+    })
   }
 
   const onAssetMountCancel = (refresh = false) => {
@@ -1030,7 +1029,7 @@ const AssetTable = (props) => {
       > 
         <Space size={15}>
           { 
-            ((reference===AssetManageReference||isDataKeyUser) && template && !template?.structured) && <Button onClick={addAsset}>新增</Button>
+            ((reference===AssetManageReference||isDataKeyUser) && template && !template?.structured) && nodeId && <Button onClick={addAsset}>新增</Button>
           }
 
           { 
@@ -1200,10 +1199,17 @@ const AssetTable = (props) => {
         />
       </div> 
 
-      <AssetEdit 
-        visible={assetEditVisible}
+      <AddAsset
+        {...addAssetParams}
         nodeId={nodeId}
-        onCancel={onAssetEditCancel}
+        template={template}
+        onCancel={(refresh) => {
+          setAddAssetParams({
+            visible: false
+          })
+
+          refresh && getDataAssets()
+        }}
       />
       <ImportAssetDrawer 
         visible={importAssetVisible}

src/view/Manage/AssetManage/Component/add-asset.jsx

+import React from "react"
+import { Modal, Button, Spin, message, } from 'antd'
+
+import AssetAction from './AssetAction'
+import { dispatch } from '../../../../model'
+import { showMessage } from "../../../../util"
+
+const FC = ({ visible, nodeId, template, onCancel }) => {
+  const [animated, setAnimated] = React.useState(true)
+  const [waiting, setWaiting] = React.useState(false)
+  const basicRef = React.useRef()
+
+  React.useEffect(() => {
+    if (visible) {
+      setTimeout(() => {
+        setAnimated(false)
+      }, 300)
+    }
+  }, [visible])
+
+  const close = (refresh = false) => {
+    setAnimated(true)
+    setWaiting(false)
+    onCancel?.(refresh)
+  }
+
+  const save = async () => {
+    try {
+      await basicRef.current?.validate()
+
+      setWaiting(true)
+      dispatch({
+        type: 'assetmanage.checkIsNeedSaveAsDraft',
+        callback: (data) => {
+          const needSaveAsDraft = (data==='true')?true:false
+          dispatch({
+            type: needSaveAsDraft?'assetmanage.saveAsDraft':'assetmanage.addOrUpdateDataAsset',
+            payload: { 
+              params: {
+                dirId: nodeId,
+                operation: 'release',
+              },
+              data: basicRef.current?.getAsset() 
+            },
+            callback: () => {
+              showMessage("success","新增成功");
+              close(true)
+            },
+            error: () => {
+              setWaiting(false);
+            }
+          })
+        },
+        error: () => {
+          setWaiting(false);
+        }
+      })
+    } catch (errInfo) {
+      
+    }
+  }
+
+  const footer = React.useMemo(() => {
+    return [
+      <Button key='cancel'
+        onClick={() => close()}
+      >取消</Button>,
+      <Button key='save' type='primary'
+        disabled={waiting}
+        onClick={() => save()}
+      >保存</Button>
+    ]
+  }, [close, save, waiting])
+
+  return (
+    <Modal
+      title='新增资产目录信息'
+      visible={visible}
+      footer={footer}
+      width='80%'
+      bodyStyle={{ padding: '15px', overflowX: 'auto', height: '80vh' }}
+      centered destroyOnClose
+      onCancel={() => { close() }}
+    >
+      {
+        !animated && <Spin spinning={waiting}>
+          <AssetAction 
+            ref={basicRef}
+            dirId={nodeId} 
+            action='add'
+            template={template}
+          />
+        </Spin>
+      }
+    </Modal>
+  )
+}
+
+export default FC
\ No newline at end of file

src/view/Manage/AssetManage/index.jsx

@@ -7,7 +7,6 @@ import { ResizableBox } from 'react-resizable';
 import AssetTree from './Component/AssetManageTree';
 import AssetDirectory from './Component/AssetDirectory';
 import AssetTable from './Component/AssetTable';
-import AssetAction from './Component/AssetAction';
 import Separate from './Component/Separate';
 
 import { AssetManageReference } from '../../../util/constant';
@@ -27,7 +26,6 @@ const AssetManage = (props) => {
   const [ assetCount, setAssetCount ] = useState(0);
   const [ directoryChanged, setDirectoryChanged ] = useState(false);
   const [ elementsChanged, setElementsChanged ] = useState(false);
-  const [ assetActionChanged, setAssetActionChanged ] = useState(false);
   const [template, setTemplate] = useState();
   const [ form ] = Form.useForm();
 
@@ -60,10 +58,6 @@ const AssetManage = (props) => {
     setTemplate(val)
   }
 
-  const onAssetActionChange = () => {
-    setAssetActionChanged(!assetActionChanged);
-  }
-
   const onAssetCountChange = (count) => {
     setAssetCount(count);
   }
@@ -97,15 +91,11 @@ const AssetManage = (props) => {
       <div className={middleClasses}>
         {/* <AssetDirectory id={nodeId} assetCount={assetCount} directoryChanged={directoryChanged} onElementsChange={onElementsChange} />
         <Separate height={15} /> */}
-        <AssetTable template={template} nodeId={nodeId} nodeType={nodeType} nodeLevel={nodeLevel} nodeAllowdLoadDataAsset={nodeAllowdLoadDataAsset} reference={AssetManageReference} elementsChanged={elementsChanged} assetActionChanged={assetActionChanged} onSelect={onTableSelect} onCountChange={onAssetCountChange} onFullScreenChange={onFullScreenChange} {...props} />
+        <AssetTable template={template} nodeId={nodeId} nodeType={nodeType} nodeLevel={nodeLevel} nodeAllowdLoadDataAsset={nodeAllowdLoadDataAsset} reference={AssetManageReference} elementsChanged={elementsChanged} onSelect={onTableSelect} onCountChange={onAssetCountChange} onFullScreenChange={onFullScreenChange} {...props} />
         <div className='tree-toggle' onClick={treeToggleClick}>
         { expandTree ? <CaretLeftOutlined /> : <CaretRightOutlined /> }
         </div>
       </div>
-      {/* <Separate width='15px' />
-      <div className='right'>
-        <AssetAction form={form} id={assetId} dirId={assetDirId} action='detail' onChange={onAssetActionChange} />
-      </div> */}
     </div>
   )
 }