tachybase_todo/packages/plugins/workflow/src/client/WorkflowCanvas.tsx

210 lines
6.0 KiB
TypeScript
Raw Normal View History

import React, { useEffect, useState } from 'react';
import { Link, useHistory } from 'react-router-dom';
import { Dropdown, Menu, Button, Tag, Switch, message, Breadcrumb } from 'antd';
import { DownOutlined, RightOutlined, EllipsisOutlined } from '@ant-design/icons';
import { cx } from '@emotion/css';
import classnames from 'classnames';
import { useTranslation } from 'react-i18next';
import {
ActionContext,
ResourceActionProvider,
SchemaComponent,
useDocumentTitle,
useResourceActionContext,
useResourceContext
} from '@nocobase/client';
import { FlowContext, useFlowContext } from './FlowContext';
import { branchBlockClass, nodeCardClass, nodeMetaClass, workflowVersionDropdownClass } from './style';
import { TriggerConfig } from './triggers';
import { Branch } from './Branch';
import { executionSchema } from './schemas/executions';
import { ExecutionLink } from './ExecutionLink';
import { lang } from './locale';
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
import { linkNodes } from './utils';
function ExecutionResourceProvider({ request, filter = {}, ...others }) {
const { workflow } = useFlowContext();
const props = {
...others,
request: {
...request,
params: {
...request?.params,
filter: {
...(request?.params?.filter),
key: workflow.key,
}
}
}
};
return (
<ResourceActionProvider {...props} />
);
}
export function WorkflowCanvas() {
const history = useHistory();
const { t } = useTranslation();
const { data, refresh, loading } = useResourceActionContext();
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
const { resource } = useResourceContext();
const { setTitle } = useDocumentTitle();
const [visible, setVisible] = useState(false);
useEffect(() => {
const { title } = data?.data ?? {};
setTitle?.(`${lang('Workflow')}${title ? `: ${title}` : ''}`);
}, [data?.data]);
if (!data?.data && !loading) {
return <div>{lang('Load failed')}</div>;
}
const { nodes = [], revisions = [], ...workflow } = data?.data ?? {};
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
linkNodes(nodes);
const entry = nodes.find(item => !item.upstream);
function onSwitchVersion({ key }) {
if (key != workflow.id) {
history.push(key);
}
}
async function onToggle(value) {
await resource.update({
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
filterByTk: workflow.id,
values: {
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
enabled: value
}
});
refresh();
}
async function onRevision() {
const { data: { data: revision } } = await resource.revision({
Feat(plugin-workflow) manual instruction (#1339) * feat(plugin-workflow): add prompt node * feat(plugin-workflow): useValueGetter for all instructions and triggers * feat(plugin-workflow): add workflow block initializer * refactor(plugin-workflow): change prompt node type to manual * feat(plugin-workflow): add ModeConfig component for mode * feat(plugin-workflow): add todo drawer * feat(plugin-workflow): add block value provider * feat(plugin-workflow): improve todo block and drawer * fix(plugin-workflow): fix instruction name in test cases * fix(plugin-workflow): fix test cases * refactor(plugin-workflow): change param type of collection field initializer * feat(plugin-workflow): add filter types for getters * fix(plugin-workflow): fix assignees variable * fix(plugin-workflow): filter todo by exist workflow * fix(plugin-workflow): fix duplicated save action in manual config * fix(plugin-workflow): fix transaction * feat(plugin-workflow): destroy workflow will be cascaded * fix(plugin-workflow): fix merge * fix(plugin-workflow): fix locale * fix(plugin-workflow): allow open ui view when executed * fix(plugin-workflow): change todo table filter * feat(plugin-workflow): use formula for calculation * fix(plugin-workflow): fix variable template regexp * fix(plugin-workflow): fix sub-options logic with types * refactor(plugin-workflow): drop useless component * fix(plugin-workflow): fix manual node action button * feat(plugin-workflow): add new variable input component * refactor(plugin-workflow): change all variable to new component * fix(plugin-workflow): fix type * fix(plugin-workflow): fix functions init * fix(plugin-workflow): change jsonb to json for stable order * fix(plugin-workflow): fix duplicated field name when initialize * fix(plugin-workflow): fix manual result in manual block * test(plugin-workflow): log field initializer props * fix(plugin-workflow): fix nullable arguments * test(plugin-workflow): test initializer fields schema * fix: observer * fix(plugin-workflow): adjust hints * fix(plugin-workflow): fix locale and cursor in variable input * refactor(plugin-workflow): change status keys * fix(plugin-workflow): fix parallel instruction * fix(plugin-workflow): fix calculation migration * fix(plugin-workflow): move tasks native filter to server * fix(plugin-workflow): fix manual options for variable * fix(plugin-workflow): fix conflict * fix(plugin-workflow): fix some bugs * fix(plugin-workflow): fix todo list filter and locale * fix(plugin-workflow): fix update action of workflow * refactor(plugin-workflow): add legacy condition calculation as basic engine * fix(plugin-workflow): fix type * fix(plugin-workflow): fix condition basic calculation * fix(plugin-workflow): fix type * fix(plugin-workflow): fix migration * fix(plugin-workflow): fix evaluators and scope * fix(plugin-workflow): remove disabled type select in schema config * fix(plugin-workflow): fix manual form schema designer --------- Co-authored-by: chenos <chenlinxh@gmail.com>
2023-02-20 11:52:06 +08:00
filterByTk: workflow.id,
filter: {
key: workflow.key
}
});
message.success(t('Operation succeeded'));
history.push(`${revision.id}`);
}
async function onMenuCommand({ key }) {
switch (key) {
case 'history':
setVisible(true);
return;
case 'revision':
return onRevision();
default:
break;
}
}
const revisionable = workflow.executed && !revisions.find(item => !item.executed && new Date(item.createdAt) > new Date(workflow.createdAt));
return (
<FlowContext.Provider value={{
workflow,
nodes,
refresh,
}}>
<div className="workflow-toolbar">
<header>
<Breadcrumb>
<Breadcrumb.Item>
<Link to={`/admin/settings/workflow/workflows`}>
{lang('Workflow')}
</Link>
</Breadcrumb.Item>
<Breadcrumb.Item>
<strong>{workflow.title}</strong>
</Breadcrumb.Item>
</Breadcrumb>
</header>
<aside>
<div className="workflow-versions">
<Dropdown
trigger={['click']}
overlay={
<Menu
onClick={onSwitchVersion}
defaultSelectedKeys={[`${workflow.id}`]}
className={cx(workflowVersionDropdownClass)}
>
{revisions.sort((a, b) => b.id - a.id).map((item, index) => (
<Menu.Item
key={`${item.id}`}
icon={item.current ? <RightOutlined /> : null}
className={classnames({
executed: item.executed,
unexecuted: !item.executed,
enabled: item.enabled,
})}
>
<strong>{`#${item.id}`}</strong>
<time>{(new Date(item.createdAt)).toLocaleString()}</time>
</Menu.Item>
))}
</Menu>
}
>
<Button type="text">
<label>{lang('Version')}</label>
<span>{workflow?.id ? `#${workflow.id}` : null}</span>
<DownOutlined />
</Button>
</Dropdown>
</div>
<Switch
checked={workflow.enabled}
onChange={onToggle}
checkedChildren={lang('On')}
unCheckedChildren={lang('Off')}
/>
<Dropdown
overlay={
<Menu onClick={onMenuCommand}>
<Menu.Item key="history" disabled={!workflow.allExecuted}>{lang('Execution history')}</Menu.Item>
<Menu.Item key="revision" disabled={!revisionable}>{lang('Copy to new version')}</Menu.Item>
</Menu>
}
>
<Button type="text" icon={<EllipsisOutlined />} />
</Dropdown>
<ActionContext.Provider value={{ visible, setVisible }}>
<SchemaComponent
schema={executionSchema}
components={{
ExecutionResourceProvider,
ExecutionLink
}}
/>
</ActionContext.Provider>
</aside>
</div>
<div className="workflow-canvas">
<TriggerConfig />
<div className={branchBlockClass}>
<Branch entry={entry} />
</div>
<div className={cx('end', nodeCardClass)}>
<div className={cx(nodeMetaClass)}>
<Tag color="#333">{lang('End')}</Tag>
</div>
</div>
</div>
</FlowContext.Provider>
);
}