Skip to content

S
szse
Commit d28ae430 by zhaochengxiang
Options

资产属性关联

parent 9b8bafd5
Showing with 254 additions and 93 deletions
package.json
......@@ -46,6 +46,7 @@
"redux-saga": "^1.0.5",
"rxjs": "^7.5.5",
"showdown": "^1.9.1",
"immer": "^9.0.15",
"smooth-scroll": "^16.1.3",
"typescript": "4.4.4",
"web-vitals": "^1.0.1"
......@@ -77,6 +78,6 @@
"last 1 safari version"
]
},
"proxy": "http://139.198.127.28:18189",
"proxy": "http://139.198.126.96:8089",
"homepage": "http://myhost/data-govern"
}
src/model/assetmanage.js
......@@ -201,6 +201,22 @@ export function* getRelAttrByModel(payload) {
return yield call(service.getRelAttrByModel, payload);
}
export function* listSourceModels(payload) {
return yield call(service.listSourceModels, payload);
}
export function* saveEleAndAttrRelWithSourceModel(payload) {
return yield call(service.saveEleAndAttrRelWithSourceModel, payload);
}
export function* getRelAttrBySourceModel(payload) {
return yield call(service.getRelAttrBySourceModel, payload);
}
export function* deleteRelAttrBySourceModel(payload) {
return yield call(service.deleteRelAttrBySourceModel, payload);
}
export function* fillElementValueBeforeCreate(payload) {
return yield call(service.fillElementValueBeforeCreate, payload);
}
......
src/service/dataassetmanager.js
import { PostJSON, GetJSON, PostFile, Post } from "../util/axios"
import { PostJSON, GetJSON, PostFile, Post, Delete } from "../util/axios"
export function importElement(payload) {
return PostFile("/dataassetmanager/elementApi/import", payload);
......@@ -212,6 +212,22 @@ export function getRelAttrByModel(payload) {
return PostJSON("/dataassetmanager/eleAndAttrApi/getRelAttrByModel", payload);
}
export function listSourceModels() {
return GetJSON("/dataassetmanager/eleAndAttrApi/listSourceModels")
}
export function saveEleAndAttrRelWithSourceModel(payload) {
return PostJSON("/dataassetmanager/eleAndAttrApi/saveEleAndAttrRelWithSourceModel", payload)
}
export function getRelAttrBySourceModel(payload) {
return GetJSON("/dataassetmanager/eleAndAttrApi/getRelAttrBySourceModel", payload)
}
export function deleteRelAttrBySourceModel(payload) {
return PostJSON("/dataassetmanager/eleAndAttrApi/delEleAndAttrRelWithSourceModel", payload)
}
export function fillElementValueBeforeCreate(payload) {
return PostJSON("/dataassetmanager/eleAndAttrApi/fillElementValueBeforeCreate", payload);
}
......
src/view/Manage/AssetManage/Component/AttributeRelationModal.jsx
import React, { useEffect, useState } from 'react';
import { Modal, Form, TreeSelect, Select, Space, Button, Row, Col, } from 'antd';
import React, { useEffect, useMemo, useRef, useState } from 'react';
import { Modal, Form, TreeSelect, Select, Space, Button, Row, Col, Tabs, Spin, Input } from 'antd';
import { dispatch } from '../../../../model';
import { draft } from '../../../../service/datamodeler';
import { showMessage } from '../../../../util';
const AddSourceModelName = '新增数据来源'
const MetaModelSelect = ({ value = {}, metaModelTreeData = [], onChange, ...restProps }) => {
const [ attributes, setAttributes ] = useState([]);
......@@ -98,82 +102,79 @@ const MetaModelSelect = ({ value = {}, metaModelTreeData = [], onChange, ...rest
);
}
const AttributeRelationModal = (props) => {
const { visible, onCancel } = props;
const AttributeRelationWithSourceModel = (props) => {
const { elements, sourceModel, metadataModelTreeData, activeKey, onChange } = props;
const [ loading, setLoading ] = useState(false)
const [ confirmLoading, setConfirmLoading ] = useState(false);
const [ metadataModelTreeData, setMetadataModelTreeData ] = useState([]);
const [ elements, setElements] = useState([]);
const [ currentRelations, setCurrentRelations ] = useState();
const [ form ] = Form.useForm();
const [modal, contextHolder] = Modal.useModal()
useEffect(() => {
if (visible) {
getMetadataModelTree();
if (sourceModel) {
getRelAttrBySourceModel()
} else {
form.resetFields()
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [visible])
form.setFieldsValue({ sourceModel })
}, [activeKey, sourceModel])
const getMetadataModelTree = () => {
dispatch({
type: 'assetmanage.getMetadataModelTree',
callback: data => {
let newData = [...data];
function recursion(_data, superKey='') {
if ((_data||[]).length===0) return;
(_data||[]).forEach(item=> {
item.title = item.nodeName||'';
item.value = superKey + '/' +(item.nodeName||'');
recursion(item.children, item.value);
})
}
recursion(newData);
setMetadataModelTreeData(newData||[]);
useEffect(() => {
if (currentRelations && elements?.length > 0) {
let newFiledsValue = {};
(currentRelations||[]).forEach(item => {
newFiledsValue[item.elementId] = {model: item.model, modelValue: item.model, attrName: item.attrName||'', attrCnName: item.attrCnName||''};
})
loadElementWithoutCustom();
},
error: () => {
}
});
}
form.setFieldsValue(newFiledsValue);
}
}, [currentRelations, elements])
const loadElementWithoutCustom = () => {
const getRelAttrBySourceModel = () => {
setLoading(true)
dispatch({
type: 'assetmanage.loadElementWithoutCustom',
type: 'assetmanage.getRelAttrBySourceModel',
payload: {
sourceModel
},
callback: data => {
setElements(data||[]);
getRelAttrByModel();
setLoading(false)
setCurrentRelations(data||[])
},
error: () => {
setLoading(false)
}
});
}
const getRelAttrByModel = () => {
dispatch({
type: 'assetmanage.getRelAttrByModel',
callback: data => {
let _fieldsValue = {};
(data||[]).forEach(item => {
_fieldsValue[item.elementId] = {model: item.model, modelValue: item.model, attrName: item.attrName||'', attrCnName: item.attrCnName||''};
})
form.setFieldsValue(_fieldsValue);
},
error: () => {
const onDelete = () => {
modal.confirm({
title: '提示!',
content: '您确定要删除该来源模型名称吗?',
onOk: () => {
dispatch({
type: 'assetmanage.deleteRelAttrBySourceModel',
payload: {
params: {
sourceModel
}
},
callback: () => {
showMessage('success', '删除成功')
onChange?.('delete')
},
error: () => {
}
});
}
});
}
const onOk = async() => {
const onOk = async () => {
try {
const row = await form.validateFields();
......@@ -189,13 +190,17 @@ const AttributeRelationModal = (props) => {
setConfirmLoading(true);
dispatch({
type: 'assetmanage.saveEleAndAttrRel',
type: 'assetmanage.saveEleAndAttrRelWithSourceModel',
payload: {
data: newRels
data: newRels,
params: {
sourceModel: row.sourceModel,
}
},
callback: data => {
reset();
onCancel && onCancel();
showMessage('success', sourceModel?'更新成功':'新增成功')
setConfirmLoading(false);
onChange?.('update', row.sourceModel)
},
error: () => {
setConfirmLoading(false);
......@@ -208,11 +213,6 @@ const AttributeRelationModal = (props) => {
}
}
const reset = () => {
setConfirmLoading(false);
form.resetFields();
}
const formItemLayout = {
labelCol: {
xs: { span: 24 },
......@@ -224,45 +224,173 @@ const AttributeRelationModal = (props) => {
},
};
return <Spin spinning={loading}>
<div className='mb-3' style={{ textAlign: 'right' }}>
<Space>
{
sourceModel && <Button type="primary" danger onClick={() => onDelete()}>删除</Button>
}
<Button type="primary" onClick={() => onOk()} loading={confirmLoading}>确定</Button>
</Space>
</div>
<Form form={form} style={{ maxHeight: 500, overflow: 'auto' }} {...formItemLayout}>
<Form.Item
label='来源模型名称'
name='sourceModel'
rules={[{ required: true, message: '请输入来源名称'}]}
>
<Input placeholder='请输入来源模型名称' disabled={sourceModel} />
</Form.Item>
{
(elements||[]).map((element, index) => {
return (
<Form.Item
label={element.name||''}
name={element.id||''}
key={index}
>
<MetaModelSelect
metaModelTreeData={metadataModelTreeData}
/>
</Form.Item>
);
})
}
</Form>
{contextHolder}
</Spin>
}
const AttributeRelationModal = (props) => {
const { visible, onCancel } = props;
const [ loadingSourceModels, setLoadingSourceModels] = useState(false)
const [ sourceModels, setSourceModels ] = useState()
const [ metadataModelTreeData, setMetadataModelTreeData ] = useState([]);
const [ elements, setElements] = useState([]);
const [ activeKey, setActiveKey ] = useState();
const activeKeyRef = useRef();
useEffect(() => {
if (visible) {
getSourceModels();
loadElementWithoutCustom();
getMetadataModelTree();
}
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [visible])
const tabData = useMemo(() => {
return [...sourceModels||[], AddSourceModelName]
}, [sourceModels])
const getSourceModels = () => {
setLoadingSourceModels(true)
dispatch({
type: 'assetmanage.listSourceModels',
callback: (data) => {
setLoadingSourceModels(false)
setSourceModels(data||[])
if (!activeKeyRef.current) {
activeKeyRef.current = data?.length > 0 ? data[0] : AddSourceModelName
setActiveKey(data?.length > 0 ? data[0] : AddSourceModelName)
} else if (activeKeyRef.current !== activeKey) {
setActiveKey(activeKeyRef.current)
}
},
error: () => {
setLoadingSourceModels(false)
}
})
}
const getMetadataModelTree = () => {
dispatch({
type: 'assetmanage.getMetadataModelTree',
callback: data => {
let newData = [...data];
function recursion(_data, superKey='') {
if ((_data||[]).length===0) return;
(_data||[]).forEach(item=> {
item.title = item.nodeName||'';
item.value = superKey + '/' +(item.nodeName||'');
recursion(item.children, item.value);
})
}
recursion(newData);
setMetadataModelTreeData(newData||[]);
},
error: () => {
}
});
}
const loadElementWithoutCustom = () => {
dispatch({
type: 'assetmanage.loadElementWithoutCustom',
callback: data => {
setElements(data||[]);
},
error: () => {
}
});
}
const onTabsChange = (value) => {
activeKeyRef.current = value
setActiveKey(value)
}
const onRelationChange = (type, value) => {
if (type === 'delete') {
activeKeyRef.current = undefined
getSourceModels()
} else if (type === 'update') {
activeKeyRef.current = value
getSourceModels()
}
}
return (
<Modal
forceRender
title={'资产属性关联'}
visible={visible}
width={600}
width={1000}
onCancel={() => {
reset();
onCancel && onCancel()
onCancel?.()
}}
footer={
<Space>
<Button onClick={() => {
reset();
onCancel && onCancel();
}}>返回</Button>
<Button type="primary" onClick={ onOk } loading={ confirmLoading }>确定</Button>
onCancel?.();
}}>取消</Button>
</Space>
}
>
<div style={{ maxHeight: 500, overflow: 'auto' }}>
<Form form={form} {...formItemLayout}>
{
(elements||[]).map((element, index) => {
return (
<Form.Item
label={element.name||''}
name={element.id||''}
key={index}
>
<MetaModelSelect
metaModelTreeData={metadataModelTreeData}
/>
</Form.Item>
);
})
}
</Form>
</div>
<Tabs tabPosition='left' activeKey={activeKey} onChange={onTabsChange} style={{ maxHeight: 500, overflow: 'auto' }}>
{
tabData?.map((item, i) => {
return <Tabs.TabPane tab={item} key={item}>
<AttributeRelationWithSourceModel
elements={elements}
metadataModelTreeData={metadataModelTreeData}
sourceModel={item === AddSourceModelName ? undefined: item}
activeKey={activeKey}
onChange={onRelationChange}
/>
</Tabs.TabPane>
})
}
</Tabs>
</Modal>
);
}
......
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