@jiangood/open-admin-flowable 2.0.0

package/src/pages/flowable/user-task/index.jsx

@@ -0,0 +1,184 @@
+import React from "react";
+import {Button, Tabs} from "antd";
+import {HttpUtils, LinkButton, Page, PageLoading, PageUtils, ProTable} from "@jiangood/open-admin";
+
+
+export default class extends React.Component {
+
+    state = {
+        show: true
+    }
+
+    render() {
+        if (!this.state.show) {
+            return <PageLoading/>
+        }
+
+        const items = [
+            {label: '待办任务', key: '1', children: this.renderTodo()},
+            {label: '已办任务', key: '2', children: this.renderDone()},
+            {label: '我发起的', key: '3', children: this.renderMyStart()},
+        ]
+
+        return <Page padding>
+            <Tabs defaultActiveKey="1" destroyOnHidden items={items}>
+
+            </Tabs>
+        </Page>
+    }
+
+
+    renderTodo = () => <ProTable
+        showToolbarSearch={false}
+        request={(params) => HttpUtils.get("admin/flowable/user-task/todoTaskPage", params)}
+        columns={[
+
+            {
+                title: '发起人',
+                dataIndex: 'instanceStarter'
+            },
+            {
+                title: '流程名称',
+                dataIndex: 'instanceName',
+            },
+            {
+                title: '当前节点',
+                dataIndex: 'taskName',
+                width: 100,
+            },
+            {
+                title: '当前操作人',
+                dataIndex: 'assigneeInfo',
+                width: 100
+            },
+
+            {
+                title: '发起时间',
+                dataIndex: 'instanceStartTime',
+            },
+            {
+                title: '任务创建时间',
+                dataIndex: 'createTime',
+            },
+
+            {
+                title: '操作',
+                dataIndex: 'option',
+                render: (_, record) => {
+                    let path = '/flowable/user-task/form?taskId=' + record.id;
+                    return (
+                        <LinkButton
+                            type='primary'
+                            path={path}
+                            label='处理任务'>处理</LinkButton>
+                    );
+                },
+            },
+        ]}
+        size='small'
+    />;
+
+    renderDone = () => <ProTable
+        showToolbarSearch={false}
+        request={(params) => HttpUtils.get("admin/flowable/user-task/doneTaskPage", params)}
+        columns={[
+            {
+                title: '流程名称',
+                dataIndex: 'instanceName',
+            },
+            {
+                title: '发起人',
+                dataIndex: 'instanceStarter'
+            },
+            {
+                title: '发起时间',
+                dataIndex: 'instanceStartTime',
+            },
+            {
+                title: '任务创建时间',
+                dataIndex: 'createTime',
+            },
+            {
+                title: '处理时间',
+                dataIndex: 'endTime',
+            },
+            {
+                title: '耗时',
+                dataIndex: 'durationInfo',
+            },
+            {
+                title: '处理节点',
+                dataIndex: 'taskName'
+            },
+            {
+                title: '操作人',
+                dataIndex: 'assigneeInfo'
+            },
+
+
+            {
+                title: '操作',
+                dataIndex: 'option',
+                render: (_, record) => (
+                     <Button size='small' onClick={() => PageUtils.open('/flowable/user-task/instance/view?id='+record.id, '流程信息') }> 查看 </Button>
+                ),
+            },
+        ]}
+        size='small'
+    />;
+
+    renderMyStart = () => <ProTable
+        request={(params) => HttpUtils.get("admin/flowable/user-task/myInstance", params)}
+        columns={[
+
+            {
+                title: '流程名称',
+                dataIndex: 'processDefinitionName',
+                render(_, r) {
+                    return r.name || r.processDefinitionName
+                }
+            },
+            {
+                title: '发起人',
+                dataIndex: 'startUserName',
+            },
+            {
+                title: '发起时间',
+                dataIndex: 'startTime',
+            },
+            {
+                title: '业务标识',
+                dataIndex: 'businessKey',
+
+            },
+
+
+            {
+                title: '结束时间',
+                dataIndex: 'endTime',
+            },
+
+            {
+                title: '流程状态',
+                dataIndex: 'x',
+                render(_, row) {
+                    return row.endTime == null ? '进行中' : '已结束'
+                }
+            },
+            {
+                title: '终止原因',
+                dataIndex: 'deleteReason',
+            },
+
+
+            {
+                title: '操作',
+                dataIndex: 'option',
+                render: (_, record) => (
+                 <Button size='small' onClick={() => PageUtils.open('/flowable/user-task/instance/view?id='+record.id, '流程信息') }> 查看 </Button>
+
+            ),
+            },
+        ]}
+    />;
+}

package/src/pages/flowable/user-task/instance/view.jsx

@@ -0,0 +1,85 @@
+import React from "react";
+import {Gap, HttpUtils, Page, PageUtils, ProTable} from "@jiangood/open-admin";
+import {Card, Empty, Skeleton, Table} from "antd";
+
+export default class extends React.Component {
+    state = {
+        instanceCommentList: [],
+        vars: {},
+
+        id: null,
+        starter: null,
+        startTime: null,
+        name: null,
+
+        data: {
+            commentList: [],
+            img: null
+        },
+        loading: true,
+
+        errorMsg: null
+    }
+
+
+    componentDidMount() {
+        const { id} = PageUtils.currentParams()
+
+        HttpUtils.get("admin/flowable/user-task/getInstanceInfo", {id}).then(rs => {
+            this.setState(rs)
+            this.setState({data: rs})
+        }).catch(e => {
+            this.setState({errorMsg: e})
+        }).finally(() => {
+            this.setState({loading: false})
+        })
+
+    }
+
+
+    render() {
+
+        if (this.state.errorMsg) {
+            return <Empty description={this.state.errorMsg}></Empty>
+        }
+
+        const {data, loading} = this.state
+        const {commentList, img} = data
+        if (loading) {
+            return <Skeleton/>
+        }
+
+
+        return <Page padding>
+            <Card title='流程图'>
+                <img src={img} style={{maxWidth: '100%'}}/>
+            </Card>
+            <Gap/>
+            <Card title='审批记录'>
+                <Table dataSource={commentList}
+                       size='small'
+                       pagination={false}
+                       rowKey='id'
+                       columns={[
+                           {
+                               dataIndex: 'content',
+                               title: '操作'
+                           },
+                           {
+                               dataIndex: 'user',
+                               title: '处理人',
+                           },
+                           {
+                               dataIndex: 'time',
+                               title: '处理时间'
+                           },
+                       ]}
+                />
+            </Card>
+
+
+        </Page>
+    }
+
+
+}