@coding-flow/flow-mobile-approval 0.0.1

package/dist/components/flow-approval/components/form-view-component.js

@@ -0,0 +1,68 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+import react from "react";
+import { useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { Form } from "antd-mobile";
+import { FlowFormView } from "@coding-flow/flow-mobile-form";
+const FormViewComponent = (props)=>{
+    const { state, context } = useApprovalContext();
+    const review = state.review || false;
+    const ViewComponent = ViewBindPlugin.getInstance().get(state.flow?.view || 'default') || FlowFormView;
+    const flowForm = state.flow?.form;
+    const fieldPermissions = state.flow?.fieldPermissions || [];
+    const mergeable = state.flow?.mergeable || false;
+    const todos = state.flow?.todos || [];
+    const formList = todos.length > 0 ? todos.map((item)=>({
+            form: Form.useForm()[0],
+            data: item
+        })) : [
+        {
+            form: Form.useForm()[0],
+            data: void 0
+        }
+    ];
+    react.useEffect(()=>{
+        formList.forEach((item)=>{
+            const formInstance = item.form;
+            const formRecord = item.data?.data;
+            context.getPresenter().getFormActionContext().addAction({
+                save: ()=>formInstance.getFieldsValue(),
+                key: ()=>'view-form',
+                validate: ()=>new Promise((resolve, reject)=>{
+                        formInstance.validateFields().then(resolve).catch(reject);
+                    })
+            });
+            formInstance.resetFields();
+            formInstance.setFieldsValue({
+                ...formRecord,
+                recordId: item.data?.recordId
+            });
+        });
+    }, []);
+    const handleMergeRecordIdsSelected = (recordIds)=>{
+        context.getPresenter().getFlowActionPresenter().setSubmitRecordIds(recordIds);
+    };
+    if (ViewComponent && flowForm) {
+        if (mergeable) return /*#__PURE__*/ jsx(ViewComponent, {
+            mergeable: mergeable,
+            fieldPermissions: fieldPermissions,
+            review: review,
+            meta: flowForm,
+            formList: formList,
+            onValuesChange: props.onValuesChange,
+            onMergeRecordIdsSelected: handleMergeRecordIdsSelected
+        });
+        return /*#__PURE__*/ jsx(Fragment, {
+            children: formList.map((item, index)=>/*#__PURE__*/ jsx(ViewComponent, {
+                    data: item.data,
+                    mergeable: mergeable,
+                    fieldPermissions: fieldPermissions,
+                    review: review,
+                    meta: flowForm,
+                    form: item.form,
+                    onValuesChange: props.onValuesChange
+                }, index))
+        });
+    }
+};
+export { FormViewComponent };

package/dist/components/flow-approval/index.css

@@ -0,0 +1,5 @@
+body {
+  margin: 0 !important;
+  padding: 0 !important;
+}
+

package/dist/components/flow-approval/index.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import "./index.scss";
+interface ApprovalPanelProps {
+    workflowCode?: string;
+    recordId?: string;
+    onClose?: () => void;
+    review?: boolean;
+}
+export declare const ApprovalPanel: React.FC<ApprovalPanelProps>;
+export {};

package/dist/components/flow-approval/index.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { detail } from "../../api/record.js";
+import { ApprovalLayout } from "./layout/index.js";
+import { useMockContext } from "@coding-flow/flow-approval-presenter";
+import "./index.css";
+const ApprovalPanel = (props)=>{
+    const [content, dispatch] = react.useState(void 0);
+    const mockKey = useMockContext();
+    react.useEffect(()=>{
+        const id = props.recordId || props.workflowCode || '';
+        detail(id, mockKey).then((res)=>{
+            if (res.success) dispatch(res.data);
+        });
+    }, []);
+    return /*#__PURE__*/ jsx("div", {
+        children: content && /*#__PURE__*/ jsx(ApprovalLayout, {
+            content: content,
+            onClose: props.onClose,
+            review: props.review
+        })
+    });
+};
+export { ApprovalPanel };

package/dist/components/flow-approval/layout/body.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface BodyProps {
+    height: string;
+}
+export declare const Body: React.FC<BodyProps>;
+export {};

package/dist/components/flow-approval/layout/body.js

@@ -0,0 +1,35 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import react from "react";
+import { Tabs } from "antd-mobile";
+import { FormViewComponent } from "../components/form-view-component.js";
+import { FlowNodeHistory } from "../components/flow-node-history.js";
+const Body = (props)=>{
+    const flowNodeHistoryAction = react.useRef(null);
+    return /*#__PURE__*/ jsx("div", {
+        style: {
+            height: props.height,
+            overflowY: "auto"
+        },
+        children: /*#__PURE__*/ jsxs(Tabs, {
+            style: {
+                width: '100%'
+            },
+            onChange: (key)=>{
+                if ("history" === key) flowNodeHistoryAction.current?.refresh();
+            },
+            children: [
+                /*#__PURE__*/ jsx(Tabs.Tab, {
+                    title: "流程详情",
+                    children: /*#__PURE__*/ jsx(FormViewComponent, {})
+                }, "detail"),
+                /*#__PURE__*/ jsx(Tabs.Tab, {
+                    title: "流程记录",
+                    children: /*#__PURE__*/ jsx(FlowNodeHistory, {
+                        actionRef: flowNodeHistoryAction
+                    })
+                }, "history")
+            ]
+        })
+    });
+};
+export { Body };

package/dist/components/flow-approval/layout/footer.d.ts

@@ -0,0 +1 @@
+export declare const Footer: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/flow-approval/layout/footer.js

@@ -0,0 +1,84 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { MoreOutlined } from "@ant-design/icons";
+import { FOOTER_HEIGHT } from "../typings/index.js";
+import { CustomStyleButton } from "../components/custom-style-button.js";
+import { useLayoutPresenter } from "./hooks/use-layout-presenter.js";
+import { ActionSheet, Button, Space, Toast } from "antd-mobile";
+import { RevokeAction } from "../components/action/revoke.js";
+import { UrgeAction } from "../components/action/urge.js";
+import { ActionFactory } from "../components/action/factory.js";
+import { EventBus, ObjectUtils } from "@coding-flow/flow-core";
+import { useApprovalContext } from "@coding-flow/flow-approval-presenter";
+const Footer = ()=>{
+    const { state, context } = useApprovalContext();
+    const presenter = useLayoutPresenter();
+    const [moreVisible, setMoreVisible] = useState(false);
+    const handlerAction = (id)=>{
+        if (state.flow?.mergeable) {
+            const presenter = context.getPresenter().getFlowActionPresenter();
+            const selectRecordIds = presenter.getSubmitRecordIds();
+            const currentFormData = presenter.getCurrentFormData();
+            if (ObjectUtils.isEmptyObject(currentFormData) && 0 == selectRecordIds.length) return void Toast.show('请先选择审批流程.');
+        }
+        EventBus.getInstance().emit(id);
+    };
+    return /*#__PURE__*/ jsx("div", {
+        style: {
+            height: FOOTER_HEIGHT,
+            width: '100%',
+            borderTop: '1px solid lightgray'
+        },
+        children: /*#__PURE__*/ jsxs("div", {
+            style: {
+                width: '100%',
+                height: '100%',
+                display: 'flex',
+                justifyContent: 'space-around',
+                gap: '10px',
+                alignItems: 'center'
+            },
+            children: [
+                presenter.getActions().map((action, index)=>ActionFactory.getInstance().render(action)),
+                !presenter.isReview() && presenter.getFooterOptions().map((action, index)=>/*#__PURE__*/ jsx(CustomStyleButton, {
+                        onClick: ()=>{
+                            handlerAction(action.id);
+                        },
+                        display: action.display,
+                        title: action.title
+                    }, index)),
+                !presenter.isReview() && presenter.hasMoreOptions() && /*#__PURE__*/ jsx(Button, {
+                    onClick: ()=>setMoreVisible(true),
+                    style: {
+                        width: '100%',
+                        padding: '10px',
+                        margin: '5px'
+                    },
+                    children: /*#__PURE__*/ jsxs(Space, {
+                        children: [
+                            /*#__PURE__*/ jsx("span", {
+                                children: "更多操作"
+                            }),
+                            /*#__PURE__*/ jsx(MoreOutlined, {})
+                        ]
+                    })
+                }),
+                /*#__PURE__*/ jsx(RevokeAction, {}),
+                /*#__PURE__*/ jsx(UrgeAction, {}),
+                /*#__PURE__*/ jsx(ActionSheet, {
+                    visible: moreVisible,
+                    onAction: (action)=>{
+                        handlerAction(action.key);
+                    },
+                    cancelText: "取消",
+                    actions: presenter.getMoreOptions().map((action)=>({
+                            text: action.title,
+                            key: action.id
+                        })),
+                    onClose: ()=>setMoreVisible(false)
+                })
+            ]
+        })
+    });
+};
+export { Footer };

package/dist/components/flow-approval/layout/header.d.ts

@@ -0,0 +1 @@
+export declare const Header: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/flow-approval/layout/header.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import { NavBar } from "antd-mobile";
+import "react";
+import { useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { HEADER_HEIGHT } from "../typings/index.js";
+const Header = ()=>{
+    const { state, context } = useApprovalContext();
+    return /*#__PURE__*/ jsx(NavBar, {
+        style: {
+            height: HEADER_HEIGHT,
+            borderBottom: '1px solid lightgray'
+        },
+        onBack: ()=>{
+            context.close();
+        },
+        right: false,
+        children: state.flow?.title || '审批详情'
+    });
+};
+export { Header };

package/dist/components/flow-approval/layout/hooks/use-layout-presenter.d.ts

@@ -0,0 +1,2 @@
+import { LayoutPresenter } from "../presenter";
+export declare const useLayoutPresenter: () => LayoutPresenter;

package/dist/components/flow-approval/layout/hooks/use-layout-presenter.js

@@ -0,0 +1,7 @@
+import { useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { LayoutPresenter } from "../presenter.js";
+const useLayoutPresenter = ()=>{
+    const { state } = useApprovalContext();
+    return new LayoutPresenter(state);
+};
+export { useLayoutPresenter };

package/dist/components/flow-approval/layout/index.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ApprovalLayoutProps } from "@coding-flow/flow-approval-presenter";
+export declare const ApprovalLayout: React.FC<ApprovalLayoutProps>;

package/dist/components/flow-approval/layout/index.js

@@ -0,0 +1,44 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { ApprovalContext, approvalStore, createApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { Provider } from "react-redux";
+import { BODY_HEIGHT, BODY_MAX_HEIGHT } from "../typings/index.js";
+import { Header } from "./header.js";
+import { Body } from "./body.js";
+import { Footer } from "./footer.js";
+import { useLayoutPresenter } from "./hooks/use-layout-presenter.js";
+const ApprovalContent = ()=>{
+    const presenter = useLayoutPresenter();
+    const hasFooter = presenter.hasFooter();
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(Body, {
+                height: hasFooter ? BODY_HEIGHT : BODY_MAX_HEIGHT
+            }),
+            hasFooter && /*#__PURE__*/ jsx(Footer, {})
+        ]
+    });
+};
+const ApprovalLayoutScope = (props)=>{
+    const { context } = createApprovalContext(props);
+    return /*#__PURE__*/ jsx(ApprovalContext.Provider, {
+        value: context,
+        children: /*#__PURE__*/ jsxs("div", {
+            style: {
+                margin: 0,
+                padding: 0
+            },
+            children: [
+                /*#__PURE__*/ jsx(Header, {}),
+                /*#__PURE__*/ jsx(ApprovalContent, {})
+            ]
+        })
+    });
+};
+const ApprovalLayout = (props)=>/*#__PURE__*/ jsx(Provider, {
+        store: approvalStore,
+        children: /*#__PURE__*/ jsx(ApprovalLayoutScope, {
+            ...props
+        })
+    });
+export { ApprovalLayout };

package/dist/components/flow-approval/layout/presenter.d.ts

@@ -0,0 +1,15 @@
+import { FlowAction } from "@coding-flow/flow-types";
+import { ApprovalState } from "@coding-flow/flow-approval-presenter";
+export declare class LayoutPresenter {
+    private static readonly MAX_OPTION_SIZE;
+    private readonly state;
+    private readonly actions;
+    private readonly review;
+    constructor(state: ApprovalState);
+    hasFooter(): boolean;
+    isReview(): boolean;
+    getActions(): FlowAction[];
+    getFooterOptions(): FlowAction[];
+    hasMoreOptions(): boolean;
+    getMoreOptions(): FlowAction[];
+}

package/dist/components/flow-approval/layout/presenter.js

@@ -0,0 +1,40 @@
+class LayoutPresenter {
+    static MAX_OPTION_SIZE = 3;
+    state;
+    actions;
+    review;
+    constructor(state){
+        this.state = state;
+        this.actions = state.flow?.actions || [];
+        this.review = state.review || false;
+    }
+    hasFooter() {
+        if (this.review) {
+            if (this.state.flow?.revoke) return true;
+            if (this.state.flow?.urge) return true;
+            return false;
+        }
+        return true;
+    }
+    isReview() {
+        return this.review;
+    }
+    getActions() {
+        return this.actions;
+    }
+    getFooterOptions() {
+        const options = [];
+        for(let i = 0; i < this.actions.length; i++){
+            const action = this.actions[i];
+            if (i < LayoutPresenter.MAX_OPTION_SIZE) options.push(action);
+        }
+        return options;
+    }
+    hasMoreOptions() {
+        return this.actions.length > LayoutPresenter.MAX_OPTION_SIZE;
+    }
+    getMoreOptions() {
+        return this.actions.slice(LayoutPresenter.MAX_OPTION_SIZE);
+    }
+}
+export { LayoutPresenter };

package/dist/components/flow-approval/typings/index.d.ts

@@ -0,0 +1,4 @@
+export declare const HEADER_HEIGHT = "60px";
+export declare const FOOTER_HEIGHT = "80px";
+export declare const BODY_HEIGHT = "calc(100vh - 140px)";
+export declare const BODY_MAX_HEIGHT = "calc(100vh - 60px)";

package/dist/components/flow-approval/typings/index.js

@@ -0,0 +1,5 @@
+const HEADER_HEIGHT = '60px';
+const FOOTER_HEIGHT = '80px';
+const BODY_HEIGHT = 'calc(100vh - 140px)';
+const BODY_MAX_HEIGHT = 'calc(100vh - 60px)';
+export { BODY_HEIGHT, BODY_MAX_HEIGHT, FOOTER_HEIGHT, HEADER_HEIGHT };

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './components/flow-approval';

package/dist/index.js

@@ -0,0 +1 @@
+export * from "./components/flow-approval/index.js";

package/dist/plugins/view/add-audit-view.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { AddAuditViewPlugin } from "@coding-flow/flow-approval-presenter";
+export declare const AddAuditView: React.FC<AddAuditViewPlugin>;

package/dist/plugins/view/add-audit-view.js

@@ -0,0 +1,39 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { AddAuditViewPluginKey, useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { Selector } from "antd-mobile";
+const AddAuditView = (props)=>{
+    const AddAuditViewComponent = ViewBindPlugin.getInstance().get(AddAuditViewPluginKey);
+    const { state } = useApprovalContext();
+    const value = react.useMemo(()=>{
+        if (props.value) if (Array.isArray(props.value)) return props.value;
+        else return [
+            props.value
+        ];
+        return [];
+    }, [
+        props.value
+    ]);
+    const createOperator = state.flow?.createOperator;
+    const options = createOperator ? [
+        {
+            label: createOperator.name,
+            value: createOperator.id + ''
+        }
+    ] : [];
+    if (AddAuditViewComponent) return /*#__PURE__*/ jsx(AddAuditViewComponent, {
+        ...props
+    });
+    const handleChange = (value)=>{
+        props.onChange?.(value);
+    };
+    return /*#__PURE__*/ jsx(Selector, {
+        value: value,
+        onChange: (value, option)=>{
+            handleChange(value);
+        },
+        options: options
+    });
+};
+export { AddAuditView };

package/dist/plugins/view/delegate-view.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { DelegateViewPlugin } from "@coding-flow/flow-approval-presenter";
+export declare const DelegateView: React.FC<DelegateViewPlugin>;

package/dist/plugins/view/delegate-view.js

@@ -0,0 +1,39 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { DelegateViewPluginKey, useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { Selector } from "antd-mobile";
+const DelegateView = (props)=>{
+    const DelegateViewComponent = ViewBindPlugin.getInstance().get(DelegateViewPluginKey);
+    const { state } = useApprovalContext();
+    const value = react.useMemo(()=>{
+        if (props.value) if (Array.isArray(props.value)) return props.value;
+        else return [
+            props.value
+        ];
+        return [];
+    }, [
+        props.value
+    ]);
+    const createOperator = state.flow?.createOperator;
+    const options = createOperator ? [
+        {
+            label: createOperator.name,
+            value: createOperator.id + ''
+        }
+    ] : [];
+    if (DelegateViewComponent) return /*#__PURE__*/ jsx(DelegateViewComponent, {
+        ...props
+    });
+    const handleChange = (value)=>{
+        props.onChange?.(value);
+    };
+    return /*#__PURE__*/ jsx(Selector, {
+        value: value,
+        onChange: (value, option)=>{
+            handleChange(value);
+        },
+        options: options
+    });
+};
+export { DelegateView };

package/dist/plugins/view/return-view.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ReturnViewPlugin } from "@coding-flow/flow-approval-presenter";
+export declare const ReturnView: React.FC<ReturnViewPlugin>;

package/dist/plugins/view/return-view.js

@@ -0,0 +1,47 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { ReturnViewPluginKey, useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { Selector } from "antd-mobile";
+const ReturnView = (props)=>{
+    const ReturnViewComponent = ViewBindPlugin.getInstance().get(ReturnViewPluginKey);
+    const { state } = useApprovalContext();
+    const value = react.useMemo(()=>{
+        if (props.value) if (Array.isArray(props.value)) return props.value;
+        else return [
+            props.value
+        ];
+        return [];
+    }, [
+        props.value
+    ]);
+    const nodeOptions = react.useMemo(()=>{
+        const nodes = state.flow?.nodes || [];
+        const currentId = state.flow?.nodeId || '';
+        const options = [];
+        for (const node of nodes){
+            if (currentId === node.id) break;
+            if (node.display) options.push({
+                label: node.name,
+                value: node.id
+            });
+        }
+        return options;
+    }, [
+        state.flow?.nodes
+    ]);
+    if (ReturnViewComponent) return /*#__PURE__*/ jsx(ReturnViewComponent, {
+        ...props
+    });
+    const handleChange = (value)=>{
+        props.onChange?.(value);
+    };
+    return /*#__PURE__*/ jsx(Selector, {
+        value: value,
+        onChange: (value, option)=>{
+            handleChange(value);
+        },
+        options: nodeOptions
+    });
+};
+export { ReturnView };

package/dist/plugins/view/sign-key-view.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { SignKeyViewPlugin } from "@coding-flow/flow-approval-presenter";
+export declare const SignKeyView: React.FC<SignKeyViewPlugin>;

package/dist/plugins/view/sign-key-view.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { SignKeyViewPluginKey } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { TextArea } from "antd-mobile";
+const SignKeyView = (props)=>{
+    const SignKeyViewComponent = ViewBindPlugin.getInstance().get(SignKeyViewPluginKey);
+    if (SignKeyViewComponent) return /*#__PURE__*/ jsx(SignKeyViewComponent, {
+        ...props
+    });
+    return /*#__PURE__*/ jsx(TextArea, {
+        value: props.value,
+        placeholder: "请输入审批签名",
+        onChange: (value)=>{
+            props.onChange?.(value);
+        }
+    });
+};
+export { SignKeyView };

package/dist/plugins/view/transfer-view.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { TransferViewPlugin } from "@coding-flow/flow-approval-presenter";
+export declare const TransferView: React.FC<TransferViewPlugin>;

package/dist/plugins/view/transfer-view.js

@@ -0,0 +1,39 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { TransferViewPluginKey, useApprovalContext } from "@coding-flow/flow-approval-presenter";
+import { ViewBindPlugin } from "@coding-flow/flow-core";
+import { Selector } from "antd-mobile";
+const TransferView = (props)=>{
+    const TransferViewComponent = ViewBindPlugin.getInstance().get(TransferViewPluginKey);
+    const { state } = useApprovalContext();
+    const value = react.useMemo(()=>{
+        if (props.value) if (Array.isArray(props.value)) return props.value;
+        else return [
+            props.value
+        ];
+        return [];
+    }, [
+        props.value
+    ]);
+    const createOperator = state.flow?.createOperator;
+    const options = createOperator ? [
+        {
+            label: createOperator.name,
+            value: createOperator.id + ''
+        }
+    ] : [];
+    if (TransferViewComponent) return /*#__PURE__*/ jsx(TransferViewComponent, {
+        ...props
+    });
+    const handleChange = (value)=>{
+        props.onChange?.(value);
+    };
+    return /*#__PURE__*/ jsx(Selector, {
+        value: value,
+        onChange: (value, option)=>{
+            handleChange(value);
+        },
+        options: options
+    });
+};
+export { TransferView };