资产详情改造

src/App.js

@@ -7,7 +7,7 @@ import {
 import { $hostParams, ContextPath } from './util';
 import loadable from "./util/loadable";
 
-import { AssetMountReference } from './util/constant';
+import { AssetBrowseReference, AssetMountReference } from './util/constant';
 
 export const AppContext = React.createContext();
 
@@ -22,7 +22,7 @@ const AssetBrowse = loadable(()=> import('./view/Manage/AssetBrowse'));
 const AssetRecycle = loadable(()=> import('./view/Manage/AssetRecycle'));
 const DatasourceManage = loadable(()=> import('./view/Manage/DatasourceManage'));
 const AssetDetailPage = loadable(()=> import('./view/Manage/AssetManage/Component/AssetDetailPage'));
-const AssetDetail = loadable(()=> import('./view/Manage/AssetManage/Component/AssetDetail'));
+const AssetAction = loadable(()=> import('./view/Manage/AssetManage/Component/AssetAction'));
 const ImportAction = loadable(()=> import('./view/Manage/Model/Component/ImportAction'));
 const EditModel = loadable(()=> import('./view/Manage/Model/Component/EditModel'));
 const EditTemplate = loadable(()=> import('./view/Manage/ModelConfig/Component/EditTemplate'));
@@ -90,11 +90,12 @@ export class App extends React.Component {
           setGlobalState,
           onGlobalStateChange
         }}>
-          <AssetDetail
+          <AssetAction reference={AssetBrowseReference} id={id} action='detail' terms={terms} readonly={true} />
+          {/* <AssetDetail
             reference='full-search'
             id={id} 
             terms={terms}
-          />
+          /> */}
         </AppContext.Provider>
       );
     }

src/model/assetmanage.js

 import * as service from '../service/dataassetmanager';
+import * as metadataService from '../service/metadata';
+
 import { call } from 'redux-saga/effects';
 
 export function* importElement(payload) {
@@ -265,3 +267,15 @@ export function* startFlow(payload) {
 export function* getSystems(payload) {
   return yield call(service.getSystems, payload);
 }
+
+export function* getMetadataAttributes(payload) {
+  return yield call(metadataService.getAttributes, payload);
+}
+
+export function* exportMetadataAttributes(payload) {
+  return yield call(metadataService.exportAttributes, payload);
+}
+
+export function* importMetadataAttributes(payload) {
+  return yield call(metadataService.importAttributes, payload);
+}
\ No newline at end of file

src/service/metadata.js

-import { GetJSON } from "../util/axios"
+import { GetJSON, PostJSON, callFetchRaw, PostFile } from "../util/axios"
 
 export function queryDatabase(payload) {
   return GetJSON("/metadatarepo/rest/tag/getDatabaseBySystemCode", payload);
@@ -19,3 +19,15 @@ export function queryAllFields(payload) {
 export function getSystemAllGraph(payload) {
   return GetJSON("/metadatarelation/getSystemAllGraph", payload);
 }
+
+export function getAttributes(payload) {
+  return PostJSON("/metadatarepo/rest/metadata/getByIdList", payload);
+}
+
+export function exportAttributes(payload) {
+  return callFetchRaw('post', '/metadatarepo/rest/download/exportList', payload)
+}
+
+export function importAttributes(payload) {
+  return PostFile("/metadatarepo/rest/import/add", payload);
+}
\ No newline at end of file

src/util/axios.js

 
 import axios from 'axios';
+import qs from 'qs';
 
 import { IsArr, showMessage, isSzseEnv } from './index';
 
@@ -163,3 +164,28 @@ export function PostFile(url, payload) {
     callback
   )
 }
+
+const config = {
+  baseURL,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+  cache: 'no-cache',
+  // `paramsSerializer` is an optional function in charge of serializing `params`
+  // (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/)
+  paramsSerializer: function (params: any) {
+    // return qs.stringify(params, { arrayFormat: 'repeat' })
+    return qs.stringify(params, { arrayFormat: 'brackets' })
+  },
+}
+
+export const callFetchRaw = (method, url, options) => {
+  const { body: data, ...reqConfig } = options
+  return axios.request({
+    method,
+    url,
+    data,
+    ...config,
+    ...reqConfig
+  })
+}
\ No newline at end of file

src/util/download.ts

+import { AxiosResponse } from "axios"
+
+export default function (res: AxiosResponse<any>) {
+  const blob = res.data
+  const headers = res.headers
+
+  let tempName = headers["content-disposition"]
+    ?.split(";")?.[1]
+    ?.split("filename=")?.[1];
+  tempName = decodeURI(tempName);
+
+  // const blob = new Blob([content], { type: 'application/octet-stream' })
+  var url = (window.URL && window.URL.createObjectURL) ? window.URL.createObjectURL(blob) : window.webkitURL.createObjectURL(blob);
+  const link = document.createElement('a');
+  link.style.display = 'none';
+  link.href = url;
+  link.setAttribute('download', tempName); //or any other extension
+  document.body.appendChild(link);
+  link.click();
+  URL.revokeObjectURL(link.href) // 释放URL 对象
+  document.body.removeChild(link)
+}
\ No newline at end of file

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

-import React, { useEffect, useState, useContext, useMemo } from 'react';
-import { Form, Spin, Input, Descriptions, Space, Button, Tooltip, Select, Cascader } from 'antd';
+import React, { useEffect, useState, useContext, useMemo, useRef } from 'react';
+import { Form, Spin, Input, Descriptions, Space, Button, Tooltip, Select, Cascader, Table, Radio, Divider } from 'antd';
 import { DownOutlined, UpOutlined } from '@ant-design/icons';
 
 import MetadataInfo from './MetadataInfo';
@@ -9,16 +9,19 @@ import { AppContext } from '../../../../App';
 import Tag from '../../Tag';  
 import Separate from './Separate';
 import AssetTagModal from './AssetTagModal';
-import { AnchorId, AnchorDirId } from '../../../../util/constant';
+import { AnchorId, AnchorDirId, AssetManageReference } from '../../../../util/constant';
 import IndexCode from './IndexCode';
+import Upload from './Upload';
 
 import { CancelSvg, EditSvg, SaveSvg, FullScreenSvg, CancelFullScreenSvg } from './AssetSvg';
 import SelectUser from '../../Model/Component/SelectUsers';
 import SelectFilter from '../../Model/Component/SelectFilter';
 import { checkDataAssetEditable } from '../../../../service/dataassetmanager';
+import download from '../../../../util/download';
+import './AssetAction.less';
 
 const AssetAction = (props) => {
-  const { id, dirId, action, terms, onChange, readOnly = false, form, onMetadataChange, onElementsChange } = props;
+  const { id, dirId, action, terms, onChange, reference, form, onMetadataChange, onElementsChange, readonly = false } = props;
 
   const [ currentAction, setCurrentAction ] = useState(action);
   const [ assetParams, setAssetParams ] = useState({ assets: {}, attributes: [], attributesFoldMap: {} });
@@ -43,8 +46,64 @@ const AssetAction = (props) => {
   const [ businessData, setBusinessData ] = useState(undefined);
   const [currentDomainGroup, setCurrentDomainGroup] = useState(undefined);
   const [canEdit, setEdit] = useState(false);
+  const [metadata, setMetadata] = useState(undefined);
+  const [loadingMetadataColumnList, setLoadingMetadataColumnList] = useState(false);
+  const [metadataColumnList, setMetadataColumnList] = useState(undefined);
+  const [mode, setMode] = useState(undefined);
 
   const app = useContext(AppContext);
+  const uploadRef = useRef(undefined);
+
+  const columns = [
+    {
+      title: '技术ID',
+      dataIndex: 'name',
+      ellipsis: true,
+      render: (text, record, _) => {
+        return (
+          <Tooltip title={text||''}>
+            <a onClick={() => {
+              window.open(`/center-home/metadetail?mid=${record._id}&action=metadetail&type=detail&manager=false&activekey=1`);
+            }}>
+            {text||''}
+            </a>
+          </Tooltip>
+        );
+      }
+    },
+    {
+      title: '名称',
+      dataIndex: 'cnName',
+      width: 100,
+      ellipsis: true,
+    },
+    {
+      title: '业务规则',
+      dataIndex: 'businessRules',
+      width: 240,
+      ellipsis: true,
+    },
+    {
+      title: '计量单位',
+      dataIndex: 'unitOfMeasurement',
+      ellipsis: true,
+    },
+    {
+      title: '备注信息',
+      dataIndex: 'remarks',
+      ellipsis: true,
+    },
+    {
+      title: '类型',
+      dataIndex: 'typeName',
+      ellipsis: true,
+    },
+    {
+      title: '长度',
+      dataIndex: 'size',
+      ellipsis: true,
+    },
+  ];
 
   useEffect(() => {
     getSystems();
@@ -70,6 +129,14 @@ const AssetAction = (props) => {
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [id, dirId])
 
+  const currentAttributeElements = useMemo(() => {
+    if (mode && elements?.length > 0) {
+      return (elements||[]).filter(element => element.type===mode);
+    }
+
+    return [];
+  }, [mode, elements])
+
   const domains = useMemo(() => {
     if (currentDomainGroup && treeDataMap) {
       return treeDataMap[currentDomainGroup];
@@ -224,6 +291,10 @@ const AssetAction = (props) => {
         })
 
         setAssetParams({ assets: {}, attributes: _attributes, attributesFoldMap: newAttributesFoldMap });
+        if (_attributes.length>0) {
+          setMode(_attributes[0]);
+        }
+
         form?.resetFields();
 
         if (currentAction==='add') {
@@ -281,27 +352,39 @@ const AssetAction = (props) => {
       payload: {
         dataAssetId: id,
         dirId: dirId,
-        checkPermission: readOnly
+        checkPermission: reference!==AssetManageReference
       },
       callback: data => {
         setLoading(false);
 
+        const metadataIndex = data?.elements?.findIndex(item => item.name === '资产项');
+        console.log('metadataIndex', metadataIndex);
+        if (metadataIndex !== -1) {
+          let metadataValue = data?.elements[metadataIndex].value;
+          try {
+            setMetadata(JSON.parse(metadataValue));
+            getMetadataAttributes();
+          } catch(error) {
+          
+          }
+        }
+
         if (userElements) {
           const userElementIds = [];
           (userElements||[]).forEach(element => {
             userElementIds.push(element?.id);
-          })
+          });
 
           const filterElements = (data?.elements||[]).filter(element => userElementIds.indexOf(element?.id) !== -1);
 
-          data = { ...data, elements: filterElements }
+          data = { ...data, elements: filterElements };
         }
 
         setElements(data?.elements||[]);
         onElementsChange && onElementsChange(data?.elements||[]);
 
-        setMetadataId(data?.mid||'');
-        onMetadataChange && onMetadataChange(data?.mid||'');
+        setMetadataId(data?.metadataId||'');
+        onMetadataChange && onMetadataChange(data?.metadataId||'');
 
         const _attributes = [];
         (data?.elements||[]).forEach(element => {
@@ -318,6 +401,9 @@ const AssetAction = (props) => {
         })
 
         setAssetParams({ assets: data, attributes: _attributes, attributesFoldMap: newAttributesFoldMap });
+        if (!mode && _attributes.length > 0) {
+          setMode(_attributes[0]);
+        }
 
         let _fieldsValue = {};
         (data.elements||[]).forEach(element => {
@@ -335,6 +421,31 @@ const AssetAction = (props) => {
     })
   }
 
+  const getMetadataAttributes = () => {
+    setMetadata(prevMetadata => {
+      setLoadingMetadataColumnList(true);
+      const ids = prevMetadata?.columnItems.map(item => item.metadataColumnId)
+      dispatch({
+        type: 'assetmanage.getMetadataAttributes',
+        payload: {
+          data: ids,
+          params: {
+            catalog: app?.env?.domainId,
+          }
+        },
+        callback: data => {
+          setLoadingMetadataColumnList(false);
+          setMetadataColumnList(data);
+        },
+        error: () => {
+          setLoadingMetadataColumnList(false);
+        }
+      });
+
+      return prevMetadata
+    })
+  }
+
   const onCancelButtonClick = () => {
     setCurrentAction('detail');
     getAsset();
@@ -349,14 +460,6 @@ const AssetAction = (props) => {
   }
 
   const jumpToPath = (item) => {
-    if (!readOnly) {
-      setFullScreen(false);
-      let event = new Event('storage');
-      event.key = 'assetPathOnClickEvent';
-      event.dirId = item.dirId||'';
-      event.id = item.dataAssetId||'';
-      window?.dispatchEvent(event);
-    } else {
     const timestamp = new Date().getTime();
 
     if (item.resourceType==='innerSource'||item.resourceType==='outerSource') {
@@ -366,17 +469,10 @@ const AssetAction = (props) => {
     } else {
       showMessage('warn', '资产类型不是资源也不是资产!');
     }
-    }
   
   }
 
   const jumpToRelation = (relation) => {
-    if (!readOnly) {
-      let event = new Event('storage');
-      event.key = 'assetRelationOnClickEvent';
-      event.relation = relation;
-      window?.dispatchEvent(event);
-    } else {
     const timestamp = new Date().getTime();
 
     if (relation.resourceType==='innerSource'||relation.resourceType==='outerSource') {
@@ -387,7 +483,6 @@ const AssetAction = (props) => {
       showMessage('warn', '资产类型不是资源也不是资产!');
     }
   }
-  }
 
   const onOk = async() => {
     try {
@@ -498,16 +593,16 @@ const AssetAction = (props) => {
     }
   }
 
-  const formItemLayout = {
-    labelCol: {
-      xs: { span: 24 },
-      sm: { span: 5 },
-    },
-    wrapperCol: {
-      xs: { span: 24 },
-      sm: { span: 17 },
-    },
-  };
+  // const formItemLayout = {
+  //   labelCol: {
+  //     xs: { span: 24 },
+  //     sm: { span: 5 },
+  //   },
+  //   wrapperCol: {
+  //     xs: { span: 24 },
+  //     sm: { span: 17 },
+  //   },
+  // };
 
   const elementEditComponent = (element) => {
     if (element.name==='资产项') return <MetadataInfo />;
@@ -608,9 +703,9 @@ const AssetAction = (props) => {
       )
     }
 
-    if (element.selectMode==='多选') return <MultipleSelect element={element} />
+    if (element.selectMode==='多选') return <MultipleSelect element={element}/>;
 
-    return <Input disabled={element.manualMaintain==='否'}  />
+    return <Input disabled={element.manualMaintain==='否'} />;
   }
 
   const elementDetailComponent = (item) => {
@@ -633,6 +728,27 @@ const AssetAction = (props) => {
     return <span className='text-color'>{highlightSearchContentByTerms(item.value||'', terms)}</span>;
   }
 
+  const onExportClick = () => {
+    dispatch({
+      type: 'assetmanage.exportMetadataAttributes',
+      payload: { 
+        responseType: 'blob', 
+        params: {  
+          catalog: app?.env?.domainId,
+          isManager: true,
+          metadataIds: metadata?.columnItems.map(item => item.metadataColumnId).join(',')
+        } 
+      },
+      callback: (res) => {
+        download(res);
+      }
+    })
+  }
+
+  const handleModeChange = (e) => {
+    setMode(e.target.value);
+  }
+
   const onValuesChange = (changedValues, allValues) => {
     if (changedValues.hasOwnProperty('主题域分组')) {
       setCurrentDomainGroup(changedValues['主题域分组']);
@@ -642,64 +758,22 @@ const AssetAction = (props) => {
 
   return (
     <div
-      className='flex'
+      className='flex asset-action'
       style={{
         height: '100%',
         flexDirection: 'column',
-        position: fullScreen?'absolute':'relative',
-        left: 0,
-        right: 0,
-        top: 0,
-        bottom: 0,
-        backgroundColor: '#fff',
-        zIndex: fullScreen?100:0,
-      }}
-    >
-      {
-        (!readOnly&&action!=='add') && <div
-          className='flex px-common primary-bg-container'
-          style={{
-            height: 46,
-            alignItems: 'center',
-            justifyContent: 'space-between',
-            color: '#fff',
+        overflow: 'auto',
+        // position: fullScreen?'absolute':'relative',
+        // left: 0,
+        // right: 0,
+        // top: 0,
+        // bottom: 0,
+        // backgroundColor: '#fff',
+        // zIndex: fullScreen?100:0,
       }}
     >
-          <div>资产详情</div>
-          <Space>
-            {
-              ((id||'')!=='') && <React.Fragment>
-                {
-                  (currentAction!=='detail') && <Tooltip title='取消编辑'>
-                    <Button 
-                      onClick={onCancelButtonClick} 
-                      icon={<CancelSvg className='greyIcon' style={{ width: 20, height: 20 }} />} 
-                      type='text' 
-                    />
-                  </Tooltip>
-                }
-                <Tooltip title={(currentAction==='detail')?'编辑':'保存'}>
-                  <Button 
-                    loading={confirmLoading} 
-                    onClick={onActionButtonClick}
-                    icon={(currentAction==='detail')?<EditSvg className='greyIcon' style={{ width: 20, height: 20 }} />: <SaveSvg className='greyIcon' style={{ width: 20, height: 20 }} />}
-                    type='text'  
-                  />
-                </Tooltip>
-              </React.Fragment>
-            }
-            <Tooltip title={fullScreen?'取消全屏':'全屏'}>
-              <Button 
-                onClick={onFullScreenClick}
-                icon={fullScreen?<CancelFullScreenSvg className='greyIcon' style={{ width: 20, height: 20 }} />: <FullScreenSvg className='greyIcon' style={{ width: 20, height: 20 }} />}
-                type='text'  
-              />
-            </Tooltip>
-          </Space>
-        </div>
-      }
       {
-        readOnly && canEdit && <div className='flex' style={{ justifyContent: 'right' }}>
+        (!readonly && (reference===AssetManageReference||canEdit)) && <div className='flex' style={{ justifyContent: 'right' }}>
           {
             currentAction==='detail' ? <Button type='primary' onClick={onActionButtonClick}>编辑</Button> : <Space>
               <Button type='primary' onClick={onCancelButtonClick}>取消</Button>
@@ -753,130 +827,105 @@ const AssetAction = (props) => {
               </Descriptions.Item> */}
             </Descriptions>
           </div>
-          {
-            !readOnly && <Separate height={8} />
-          }
         </div>  
       }
 
-      <div
+      {/* <div
         style={{
           flex: 1,
           overflow: 'auto',
         }}
-      >
+      > */}
         <Spin 
           spinning={loading}
           style={{ marginTop: 30 }}
         >
+          <Radio.Group className='mb-3' onChange={handleModeChange} value={mode}>
           {
-            (attributes||[]).map((attribute, index) => {
-              let sameAttributeElements = (elements||[]).filter(element => element.type===attribute);
-
-              if (currentAction!=='add' && !fullScreen && attributesFoldMap[attribute]) {
-                sameAttributeElements = (sameAttributeElements||[]).filter(element => element.foldAble==='否');
-              }
-
-              return (
-                <div key={index}>
-                  <div 
-                    className='flex pl-common'
-                    style={{
-                      justifyContent: 'space-between',
-                      alignItems: 'center',
-                      backgroundColor: '#fff',
-                      height: 46,
-                      borderBottom: '1px solid #f0f0f0',
-                    }}
-                  >
-                    <div 
-                      className='flex'
-                      style={{ 
-                        alignItems: 'center'
-                      }}
-                    >
-                      <div className='primary-bg-color' style={{ width: 3, height: 14, marginRight: 5 }} />
-                      <div className='title-text' style={{ fontWeight: 'bold' }}>{attribute||''}</div>   
-                    </div>
-                    {
-                      currentAction!=='add'&&!fullScreen && (
-                        attributesFoldMap[attribute] ? <Button 
-                          type='text' 
-                          style={{ padding: 0 }} 
-                          onClick={() => { onFoldButtonClick(attribute, false) }} 
-                          icon={<DownOutlined className='default' />}
-                        /> : <Button 
-                          type='text' 
-                          style={{ padding: 0 }} 
-                          onClick={() => { onFoldButtonClick(attribute, true) }}
-                          icon={<UpOutlined className='default' />}
-                        />
-                      )
+            attributes?.map((attribute, index) => {
+              return <Radio.Button value={attribute} key={index}>{attribute}</Radio.Button>;
+            })
           }
-                  </div>
-                  <div className='px-common py-compact-common'>
+          </Radio.Group>
+          <Form form={form} onValuesChange={onValuesChange}>
+            <Descriptions column={1} bordered>
             {
-                    (currentAction==='add'||currentAction==='edit') ? 
-                      <AppContext.Consumer>
-                      {
-                        value => {
-                          value?.onGlobalStateChange&&value?.onGlobalStateChange((state, prev) => {
-                            if (state.message === 'data-govern-show-metadata-list-callback-message') {
-                              setMetadataId(state.data?.metadataId||'');
-                              onMetadataChange && onMetadataChange(state.data?.metadataId||'');
-
-                              form?.setFieldsValue({ '资产项': state.data?.metadataInfoJson||'' });
-
-                              if ((state.data?.metadataId||'') !== '') {
-                                fillElementValueBeforeCreate(state.data?.metadataId||'');
-                              }
-                            }
-                        });
+              elements?.map((element, index) => {
+                if (element.name === '资产项') return null;
 
                 return (
-                          <Form {...formItemLayout} form={form} labelWrap onValuesChange={onValuesChange}>
+                  <Descriptions.Item 
+                    key={index}
+                    label={element.name}
+                    labelStyle={{ width: 180 }}
+                    style={{ display: (element.type===mode)?'': 'none'}}
+                  >
                   {
-                            (sameAttributeElements||[]).map((element, _index) => {
-                              return (
-                                <Form.Item 
-                                  label={<div className='title-color'>{element.name||''}</div>}
+                    (currentAction==='add'||currentAction==='edit') ? <Form.Item 
+                      label=''
                       name={element.name}
                       rules={[{ required: element.required }]}    
-                                  key={_index}
-                                  style={{ marginBottom: (_index===sameAttributeElements.length-1)? 0 : 15 }}
+                      style={{ width: 500, marginBottom: 0 }}     
                     >
                       {elementEditComponent(element)}
-                                </Form.Item>
-                              );
-                            })
+                    </Form.Item> : <React.Fragment>
+                    { elementDetailComponent(element) }
+                    </React.Fragment>
                   }
-                          </Form>
-                        );
-                      }}
-                      </AppContext.Consumer>  
-                     : <Descriptions column={1}>
-                    {
-                      (sameAttributeElements||[]).map((item, index) => {
-                        return (
-                          <Descriptions.Item label={<div className='title-common' style={{ textAlign: 'right', width: 60 }}>{item.name||''}</div>} key={index} style={{ paddingBottom: (index===sameAttributeElements.length-1)? 0 : 10 }}>
-                          { elementDetailComponent(item) }
                   </Descriptions.Item>
-                        );
+                )
               })
             }
             </Descriptions>
-                  }
+          </Form>
+
+        </Spin>
+      {/* </div>   */}
+      
+      <div>
+      <Divider orientation='left'>字段级资产信息</Divider>
       </div>
     
+      <Space style={{ marginLeft: 'auto' }}>
         {
-                    currentAction!=='add' && (index < (attributes.length-1)) && !readOnly && <Separate height={8} />
+          (reference===AssetManageReference||canEdit) && <Button type='primary' onClick={() => {
+              uploadRef.current?.chooseFile()
+            }}>导入</Button>
         }
-                </div>
-              );
-            })
+        <Button type='primary' onClick={onExportClick}>导出</Button>
+      </Space>
+      
+      <Table
+        className='mt-2'
+        loading={loadingMetadataColumnList}
+        columns={columns} 
+        rowKey='_id'
+        dataSource={metadataColumnList||[]}
+        pagination={{
+          position: ['bottomLeft'],
+          size: 'small',
+          showTotal: (total) => `共${total}项`
+        }} 
+      />
+      
+      <Upload ref={uploadRef} accept={'.xls,.xlsx'} upload={(files) => {
+          dispatch({
+            type: 'assetmanage.importMetadataAttributes',
+            payload: { 
+              fileList: [files[0]],
+              params: {
+                catalog: app?.env?.domainId,
+                ignoreTechnical: true
               }
-        </Spin>
-      </div>  
+            },
+            callback: (data) => {
+              getMetadataAttributes();
+            },
+            error: () => {
+              
+            }
+          })
+        }} />
     
       <AppContext.Consumer>
       {

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

+.asset-action {
+  .yy-table-tbody > tr > td  {
+    padding: 8px 8px !important;
+  }
+}
\ No newline at end of file

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

@@ -4,7 +4,7 @@ import { Drawer, Form } from 'antd';
 import AssetAction from './AssetAction';
 
 const AssetDetailDrawer = (props) => {
-  const { onCancel, visible, id, dirId } = props;
+  const { onCancel, visible, id, dirId, reference } = props;
   
   const [ form ] = Form.useForm();
 
@@ -13,7 +13,7 @@ const AssetDetailDrawer = (props) => {
       forceRender
       visible={ visible }
       title='资产详情'
-      width={600}
+      width={830}
       placement="right"
       closable={ true }
       onClose={() => {
@@ -21,7 +21,7 @@ const AssetDetailDrawer = (props) => {
       }}
     >
     {
-      visible && <AssetAction form={form} id={id} dirId={dirId} action='detail' readOnly onChange={() => {
+      visible && <AssetAction reference={reference} form={form} id={id} dirId={dirId} action='detail' onChange={() => {
         onCancel?.(true);
       }} />
     }

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

@@ -515,31 +515,31 @@ const AssetTable = (props) => {
           }, 500)
         }
 
-        if (reference === AssetManageReference) {
-          if (remoteRelationRef.current) {
-            const index = _assets.findIndex((asset) => asset.id === remoteRelationRef.current.dataAssetId);
-
-            remoteRelationRef.current = null;
-
-            if (index === -1) {
-              setSelectItem(_assets.length>0?_assets[0]:{});
-              onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
-            } else {
-              setSelectItem(_assets[index]);
-              onSelect && onSelect(_assets[index].id, _assets[index].dirId);
-            }
-          } else if ((selectItem?.id||'') !=='') {
-            const index = _assets.findIndex((asset) => asset.id === selectItem?.id);
+        // if (reference === AssetManageReference) {
+        //   if (remoteRelationRef.current) {
+        //     const index = _assets.findIndex((asset) => asset.id === remoteRelationRef.current.dataAssetId);
+
+        //     remoteRelationRef.current = null;
+
+        //     if (index === -1) {
+        //       setSelectItem(_assets.length>0?_assets[0]:{});
+        //       onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
+        //     } else {
+        //       setSelectItem(_assets[index]);
+        //       onSelect && onSelect(_assets[index].id, _assets[index].dirId);
+        //     }
+        //   } else if ((selectItem?.id||'') !=='') {
+        //     const index = _assets.findIndex((asset) => asset.id === selectItem?.id);
   
-            if (index === -1) {
-              setSelectItem(_assets.length>0?_assets[0]:{});
-              onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
-            }
-          } else {
-            setSelectItem(_assets.length>0?_assets[0]:{});
-            onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
-          }
-        }
+        //     if (index === -1) {
+        //       setSelectItem(_assets.length>0?_assets[0]:{});
+        //       onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
+        //     }
+        //   } else {
+        //     setSelectItem(_assets.length>0?_assets[0]:{});
+        //     onSelect && onSelect(_assets.length>0?_assets[0].id:'', _assets.length>0?_assets[0].dirId:'');
+        //   }
+        // }
 
         setTotal(data.total||0);
         onCountChange && onCountChange(data.total||0);
@@ -943,7 +943,7 @@ const AssetTable = (props) => {
         <Space size={15}>
           { 
             //栏目和自定义目录 不允许新增资产
-            (reference===AssetManageReference && nodeLevel!==1 && nodeType!=='custom') && <Button onClick={addAsset}>新增</Button>
+            // (reference===AssetManageReference && nodeLevel!==1 && nodeType!=='custom') && <Button onClick={addAsset}>新增</Button>
           }
 
           { 
@@ -1052,9 +1052,7 @@ const AssetTable = (props) => {
                   setSelectItem(record);
                   onSelect && onSelect(record?.id, record?.dirId);
 
-                  if (reference !== AssetManageReference) {
                   setAssetDetailDrawerVisible(true);
-                  }
                 },
                 onContextMenu: event => {
                   if ((reference===AssetManageReference||(reference===AssetBrowseReference&&record.hasPermission)) && (record.resourceState==='uncombed'||record.resourceState==='notRelatedAsset')) {
@@ -1136,6 +1134,7 @@ const AssetTable = (props) => {
         id={selectItem?.id}
         dirId={selectItem?.dirId}
         visible={assetDetailDrawerVisible}
+        reference={reference}
         onCancel={onAssetDetailDrawerCancel}
       />
       <AssetDeleteModal 

src/view/Manage/AssetManage/Component/Upload.tsx

+import React, { useCallback, useImperativeHandle, useRef } from "react";
+import { showMessage } from "../../../../util";
+
+export interface UploadType {
+  chooseFile: () => void
+}
+
+export default React.forwardRef<UploadType, { accept: string, upload: (files: FileList) => void }>(function ({ accept, upload }, ref) {
+
+  const input = useRef<HTMLInputElement>(null)
+
+  useImperativeHandle(ref, () => ({
+    chooseFile: () => {
+      input.current!.click();
+    }
+  }), [])
+
+  const onChange: React.ChangeEventHandler<HTMLInputElement> = useCallback((e) => {
+    console.log('files', e.target.files)
+    if (e.target.files) { //console.debug(input.current!.files)
+      e.preventDefault();
+
+      let file = e.target.files[0]
+      if (file) {
+        const fileSize = file.size
+        const isLt5G = fileSize / 1024 / 1024 / 1024 < 5
+        if (!isLt5G) {
+          showMessage('warn', '上传文件大小不超过5G')
+          return
+        }
+      }
+      e.target.files && upload(e.target.files)
+    }
+  }, [upload])
+
+  const onInputClick: React.MouseEventHandler<HTMLInputElement> = useCallback((e) => {
+    input.current!.value = null
+  }, [])
+
+  return <input ref={input} type="file" multiple={false} accept={accept ?? "image/png"} style={{ visibility: 'hidden' }}
+    onChange={onChange}
+    onClick={onInputClick}
+  />
+})
\ No newline at end of file

src/view/Manage/AssetManage/index.jsx

@@ -96,10 +96,10 @@ const AssetManage = (props) => {
         { expandTree ? <CaretLeftOutlined /> : <CaretRightOutlined /> }
         </div>
       </div>
-      <Separate width='15px' />
+      {/* <Separate width='15px' />
       <div className='right'>
         <AssetAction form={form} id={assetId} dirId={assetDirId} action='detail' onChange={onAssetActionChange} />
-      </div>
+      </div> */}
     </div>
   )
 }