|
@@ -19,7 +19,7 @@ function FlowModal(props) {
|
|
|
const [nodeLoading, setNodeLoading] = useState(false);
|
|
|
const [pageSize, setPageSize] = useState(9)
|
|
|
const [stepsData, setStepsData] = useState([])
|
|
|
- const [auditvisible, setAuditVisible] = useState(false);
|
|
|
+ const [auditVisible, setAuditVisible] = useState(false);
|
|
|
// const app = useXFlowApp();
|
|
|
// const appRef = userRef()
|
|
|
|
|
@@ -37,6 +37,9 @@ function FlowModal(props) {
|
|
|
useEffect(() => {
|
|
|
if(!visible) setAuditVisible(false);
|
|
|
}, [visible, version])
|
|
|
+ useEffect(()=>{
|
|
|
+ if(!auditVisible) setPageSize(9)
|
|
|
+ },[auditVisible])
|
|
|
|
|
|
const handleSelectNode = async args => {
|
|
|
let res;
|
|
@@ -67,16 +70,40 @@ function FlowModal(props) {
|
|
|
};
|
|
|
|
|
|
const updateSteps = (data) => {
|
|
|
- let newData = []
|
|
|
- data?.forEach(item => {
|
|
|
- let list = {
|
|
|
- current: item.audit_status == 0 ? item.audit_status : item.audit_status-1,
|
|
|
- list:item.FlowInfo.FlowNodes,
|
|
|
- name:item.FlowInfo.name,
|
|
|
+ let newData = [];
|
|
|
+ let set = new Set()
|
|
|
+ data.forEach(item=>set.add(item.template_node_id));
|
|
|
+ // console.log("========================节点id ",[...set])
|
|
|
+ let dataList = [...set].map(template_node_id=>{
|
|
|
+
|
|
|
+ let itemDataList = data.filter(item => item.template_node_id == template_node_id).sort((a, b)=>{
|
|
|
+ return a.nodeId > b.nodeId
|
|
|
+ })
|
|
|
+ let obj = {
|
|
|
+ current:itemDataList.find(item=>item.node_id == itemDataList.length)?.audit_status != 3 ? itemDataList.length-1 : itemDataList.length ,
|
|
|
+ list: itemDataList[0].FlowInfo.FlowNodes,
|
|
|
+ name:itemDataList[0].FlowInfo.name,
|
|
|
}
|
|
|
- newData.push(list);
|
|
|
+ itemDataList.forEach((itemData, idx) => {
|
|
|
+ // if(itemData.audit_status != 3 && obj.current < itemData.node_id -1) {
|
|
|
+ // obj.current = itemData.node_id -1;
|
|
|
+ // }
|
|
|
+ obj.list[idx].auditor = itemData.auditor;
|
|
|
+ })
|
|
|
+ return obj
|
|
|
})
|
|
|
- setStepsData(newData)
|
|
|
+ // console.log("================dataList ",dataList)
|
|
|
+
|
|
|
+ // template_node_id: 430 audit_status: 1 FlowInfo.name:'测试审批'
|
|
|
+ // data?.forEach(item => {
|
|
|
+ // let list = {
|
|
|
+ // current: item.audit_status == 0 ? item.audit_status : item.audit_status-1,
|
|
|
+ // list:item.FlowInfo.FlowNodes,
|
|
|
+ // name:item.FlowInfo.name,
|
|
|
+ // }
|
|
|
+ // newData.push(list);
|
|
|
+ // })
|
|
|
+ setStepsData(dataList)
|
|
|
setPageSize(pageSize - data.length)
|
|
|
};
|
|
|
|
|
@@ -173,19 +200,18 @@ function FlowModal(props) {
|
|
|
<div style={{width:'100%'}}>
|
|
|
<Table style={{maxHeight:'90%'}} columns={columns} dataSource={data} loading={nodeLoading} bordered={false} pagination={{ pageSize}}/>
|
|
|
</div>
|
|
|
- <Space direction="vertical" size='8' style={{ display: auditvisible ? 'flex' : 'none' }}>
|
|
|
- {stepsData.map((item ,idx)=> <div key={`${item.name}_${idx}`} style={{marginBottom:'8px'}}>
|
|
|
- <div style={{marginBottom:'4px'}}>{item.name}</div>
|
|
|
- <Steps size='small' current={item.current} >
|
|
|
- {item.list.map(node =>
|
|
|
- <Step
|
|
|
- key={`${node.id}_${node.node}`}
|
|
|
- title={node.node}
|
|
|
- />
|
|
|
- )}
|
|
|
- </Steps>
|
|
|
- </div>)}
|
|
|
- </Space>
|
|
|
+ {stepsData.map((item ,idx)=> <div key={`${item.name}_${idx}`} style={{marginBottom:'20px'}}>
|
|
|
+ <div style={{marginBottom:'4px'}}>{item.name}</div>
|
|
|
+ <Steps size='small' current={item.current} >
|
|
|
+ {item.list.map(node =>
|
|
|
+ <Step
|
|
|
+ key={`${node.id}_${node.node}`}
|
|
|
+ title={node.node}
|
|
|
+ description={`审批人:${item?.auditor || '-'}`}
|
|
|
+ />
|
|
|
+ )}
|
|
|
+ </Steps>
|
|
|
+ </div>)}
|
|
|
</Col>
|
|
|
</Row>
|
|
|
</Modal>
|