fix(plugin-workflow): fix minors ui issues (#1635)

* fix(plugin-workflow): fix minors ui issues

* fix(plugin-workflow): add refresh after title changed back

* fix(plugin-workflow): fix collection fields variable
This commit is contained in:
Junyi 2023-04-02 12:24:25 +07:00 committed by GitHub
parent 3f81d7cd7d
commit 822099271a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 67 additions and 63 deletions

View File

@ -141,22 +141,21 @@ export function WorkflowCanvas() {
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({
items={revisions.sort((a, b) => b.id - a.id).map((item, index) => ({
key: `${item.id}`,
icon: item.current ? <RightOutlined /> : null,
label: (
<span 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>
})}>
<strong>{`#${item.id}`}</strong>
<time>{(new Date(item.createdAt)).toLocaleString()}</time>
</span>
)
}))}
/>
}
>
<Button type="text">

View File

@ -276,9 +276,9 @@ export const workflowSchema: ISchema = {
type: 'primary',
},
properties: {
modal: {
drawer: {
type: 'void',
'x-component': 'Action.Modal',
'x-component': 'Action.Drawer',
'x-decorator': 'Form',
'x-decorator-props': {
useValues: '{{ cm.useValuesFromRecord }}',
@ -299,7 +299,7 @@ export const workflowSchema: ISchema = {
},
footer: {
type: 'void',
'x-component': 'Action.Modal.Footer',
'x-component': 'Action.Drawer.Footer',
properties: {
cancel: {
title: '{{ t("Cancel") }}',

View File

@ -47,23 +47,6 @@ export const workflowPageClass = css`
export const workflowVersionDropdownClass = css`
.ant-dropdown-menu-item{
strong{
font-weight: normal;
}
&.enabled{
strong{
font-weight: bold;
}
}
&.unexecuted{
strong{
font-style: italic;
}
}
.ant-dropdown-menu-title-content{
text-align: right;
@ -72,6 +55,22 @@ export const workflowVersionDropdownClass = css`
color: #999;
font-size: 80%;
}
strong{
font-weight: normal;
}
> .enabled{
strong{
font-weight: bold;
}
}
> .unexecuted{
strong{
font-style: italic;
}
}
}
}
`;

View File

@ -1,4 +1,4 @@
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import { css, cx } from "@emotion/css";
import { ISchema, useForm } from "@formily/react";
import { Registry } from "@nocobase/utils/client";
@ -131,6 +131,12 @@ export const TriggerConfig = () => {
const api = useAPIClient();
const compile = useCompile();
const { workflow, refresh } = useFlowContext();
const [editingTitle, setEditingTitle] = useState<string>('');
const [editingConfig, setEditingConfig] = useState(false);
useEffect(() => {
setEditingTitle(workflow.title ?? typeTitle);
}, [workflow]);
if (!workflow || !workflow.type) {
return null;
}
@ -139,9 +145,6 @@ export const TriggerConfig = () => {
const detailText = executed ? '{{t("View")}}' : '{{t("Configure")}}';
const titleText = `${lang('Trigger')}: ${compile(typeTitle)}`;
const [editingTitle, setEditingTitle] = useState<string>(title ?? typeTitle);
const [editingConfig, setEditingConfig] = useState(false);
async function onChangeTitle(next) {
const t = next || typeTitle;
setEditingTitle(t);

View File

@ -8,7 +8,7 @@ export type VariableOption = {
key: string;
value: string;
label: string;
children?: VariableOption[];
children?: VariableOption[] | null;
};
const VariableTypes = [
@ -97,32 +97,35 @@ export function useWorkflowVariableOptions() {
return options;
}
export function useCollectionFieldOptions(props) {
const { fields, collection, types } = props;
const compile = useCompile();
function useCollectionNormalFields(collection) {
const { getCollectionFields } = useCollectionManager();
const result = filterTypedFields(fields ?? getCollectionFields(collection), types).map((field) => ({
label: compile(field.uiSchema?.title || field.name),
key: field.name,
value: field.name,
children: ['linkTo', 'belongsTo', 'hasOne', 'hasMany', 'belongsToMany'].includes(field.type)
? getCollectionFields(field.target)
?.filter((subField) => subField.interface && (!subField.target || subField.type === 'belongsTo'))
.map((subField) =>
subField.type === 'belongsTo'
? {
label: `${compile(subField.uiSchema?.title || subField.name)} ID`,
key: subField.foreignKey,
value: subField.foreignKey,
}
: {
label: compile(subField.uiSchema?.title || subField.name),
key: subField.name,
value: subField.name,
},
)
: null,
}));
const fields = getCollectionFields(collection);
return fields.filter(field => field.interface);
}
export function useCollectionFieldOptions(options, depth = 1): VariableOption[] {
const { fields, collection, types } = options;
const compile = useCompile();
const result: VariableOption[] = [];
filterTypedFields((fields ?? useCollectionNormalFields(collection)), types)
.forEach(field => {
const label = compile(field.uiSchema?.title || field.name);
if (field.type === 'belongsTo') {
result.push({
label: `${label} ID`,
key: field.foreignKey,
value: field.foreignKey,
});
}
result.push({
label,
key: field.name,
value: field.name,
children: ['linkTo', 'belongsTo', 'hasOne', 'hasMany', 'belongsToMany'].includes(field.type) && depth > 0
? useCollectionFieldOptions({ collection: field.target, types }, depth - 1)
: null
});
});
return result;
}