Initial commit

src/utils/SeleApprovalProcess/index.tsx

@@ -0,0 +1,91 @@
+/*
+ * @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;