92 lines
2.4 KiB
TypeScript
92 lines
2.4 KiB
TypeScript
|
/*
|
||
|
|
* @Author: zhoujianlong
|
||
|
|
* @Date: 2021-06-22 14:46:22
|
||
|
|
* @Last Modified by: zhoujianlong
|
||
|
|
* @Last Modified time: 2021-08-03 14:09:26
|
||
|
|
*/
|
||
|
|
import React, { useState } from 'react';
|
||
|
|
import { Modal, Button, message, Spin } from 'antd';
|
||
|
|
import ProTable, { ProColumns } from '@ant-design/pro-table';
|
||
|
|
import { ApprovalProcess } from './service';
|
||
|
|
|
||
|
|
interface SeleApprovalProcessProps {
|
||
|
|
modalVisible: boolean; //弹窗visible
|
||
|
|
onCancel: () => void; //关闭弹窗方法回调
|
||
|
|
data: Array<any>[]; //传入列表展示的数组
|
||
|
|
annoId: any; //传入id
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* 公告、变更公告、失败公告、邀请函、公示 选择审批流程
|
||
|
|
*/
|
||
|
|
const SeleApprovalProcess: React.FC<SeleApprovalProcessProps> = (props) => {
|
||
|
|
const { modalVisible, onCancel, data, annoId } = props;
|
||
|
|
const modalHeight = (window.innerHeight * 96) / 100;
|
||
|
|
//loading
|
||
|
|
const [loading, setLoading] = useState<boolean>(false);
|
||
|
|
//发起审批操作
|
||
|
|
const toApprove = async (record: any) => {
|
||
|
|
setLoading(true);
|
||
|
|
await ApprovalProcess(annoId, { ...record })
|
||
|
|
.then((res) => {
|
||
|
|
if (res?.code == 200 && res?.success == true) {
|
||
|
|
message.success('操作成功');
|
||
|
|
onCancel();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.finally(() => {
|
||
|
|
setLoading(false);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
const columns: ProColumns<any>[] = [
|
||
|
|
{
|
||
|
|
title: '序号',
|
||
|
|
key: 'key',
|
||
|
|
render: (_, record: any, index: any) => index + 1,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '流程名称',
|
||
|
|
dataIndex: 'workflowName',
|
||
|
|
key: 'workflowName',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '操作',
|
||
|
|
dataIndex: 'options',
|
||
|
|
key: 'options',
|
||
|
|
render: (_: any, record: any) => (
|
||
|
|
<Button type="text" key="sele_approve" onClick={() => toApprove(record)}>
|
||
|
|
发起审批
|
||
|
|
</Button>
|
||
|
|
),
|
||
|
|
},
|
||
|
|
];
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Modal
|
||
|
|
destroyOnClose
|
||
|
|
title="请选择审批流程"
|
||
|
|
visible={modalVisible}
|
||
|
|
width={'40%'}
|
||
|
|
style={{ maxHeight: modalHeight }}
|
||
|
|
bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto' }}
|
||
|
|
centered
|
||
|
|
onCancel={() => onCancel()}
|
||
|
|
footer={null}
|
||
|
|
>
|
||
|
|
<Spin spinning={loading} delay={300} tip="正在发起审批，请稍等">
|
||
|
|
<ProTable
|
||
|
|
rowKey="id"
|
||
|
|
pagination={false}
|
||
|
|
search={false}
|
||
|
|
options={false}
|
||
|
|
columns={columns}
|
||
|
|
dataSource={data}
|
||
|
|
dateFormatter="string"
|
||
|
|
/>
|
||
|
|
</Spin>
|
||
|
|
</Modal>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default SeleApprovalProcess;
|