Skip to content

S
szse
Commit e7e8280f by zhaochengxiang
Options

资产详情改造

parent af606786
Showing with 397 additions and 219 deletions
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 0 → 100644
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 0 → 100644
.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 0 → 100644
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>
)
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment