fix(plugin-workflow): fix node form values when closed (#2978)
* fix(plugin-workflow): fix node form values when closed * fix(plugin-workflow): fix manual schema config refresh
This commit is contained in:
		
							parent
							
								
									10a1f65284
								
							
						
					
					
						commit
						2747e7640f
					
				@ -2,7 +2,7 @@ import { css, cx } from '@emotion/css';
 | 
			
		||||
import { useForm } from '@formily/react';
 | 
			
		||||
import { Input } from 'antd';
 | 
			
		||||
import { cloneDeep } from 'lodash';
 | 
			
		||||
import React, { useEffect, useMemo, useRef, useState } from 'react';
 | 
			
		||||
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 | 
			
		||||
import sanitizeHTML from 'sanitize-html';
 | 
			
		||||
 | 
			
		||||
import { error } from '@nocobase/utils/client';
 | 
			
		||||
@ -228,26 +228,30 @@ export function TextArea(props) {
 | 
			
		||||
      }
 | 
			
		||||
      const sel = window.getSelection?.();
 | 
			
		||||
      if (sel) {
 | 
			
		||||
        const children = Array.from(current.childNodes) as HTMLElement[];
 | 
			
		||||
        if (children.length) {
 | 
			
		||||
          if (range[0] === -1) {
 | 
			
		||||
            if (range[1]) {
 | 
			
		||||
              nextRange.setStartAfter(children[range[1] - 1]);
 | 
			
		||||
        try {
 | 
			
		||||
          const children = Array.from(current.childNodes) as HTMLElement[];
 | 
			
		||||
          if (children.length) {
 | 
			
		||||
            if (range[0] === -1) {
 | 
			
		||||
              if (range[1]) {
 | 
			
		||||
                nextRange.setStartAfter(children[range[1] - 1]);
 | 
			
		||||
              }
 | 
			
		||||
            } else {
 | 
			
		||||
              nextRange.setStart(children[range[0]], range[1]);
 | 
			
		||||
            }
 | 
			
		||||
          } else {
 | 
			
		||||
            nextRange.setStart(children[range[0]], range[1]);
 | 
			
		||||
          }
 | 
			
		||||
          if (range[2] === -1) {
 | 
			
		||||
            if (range[3]) {
 | 
			
		||||
              nextRange.setEndAfter(children[range[3] - 1]);
 | 
			
		||||
            if (range[2] === -1) {
 | 
			
		||||
              if (range[3]) {
 | 
			
		||||
                nextRange.setEndAfter(children[range[3] - 1]);
 | 
			
		||||
              }
 | 
			
		||||
            } else {
 | 
			
		||||
              nextRange.setEnd(children[range[2]], range[3]);
 | 
			
		||||
            }
 | 
			
		||||
          } else {
 | 
			
		||||
            nextRange.setEnd(children[range[2]], range[3]);
 | 
			
		||||
          }
 | 
			
		||||
          nextRange.collapse(true);
 | 
			
		||||
          sel.removeAllRanges();
 | 
			
		||||
          sel.addRange(nextRange);
 | 
			
		||||
        } catch (ex) {
 | 
			
		||||
          // console.error(ex);
 | 
			
		||||
        }
 | 
			
		||||
        nextRange.collapse(true);
 | 
			
		||||
        sel.removeAllRanges();
 | 
			
		||||
        sel.addRange(nextRange);
 | 
			
		||||
      }
 | 
			
		||||
    } else {
 | 
			
		||||
      const { lastChild } = current;
 | 
			
		||||
@ -262,39 +266,45 @@ export function TextArea(props) {
 | 
			
		||||
    }
 | 
			
		||||
  }, [html]);
 | 
			
		||||
 | 
			
		||||
  function onInsert(paths: string[]) {
 | 
			
		||||
    const variable: string[] = paths.filter((key) => Boolean(key.trim()));
 | 
			
		||||
    const { current } = inputRef;
 | 
			
		||||
    if (!current || !variable) {
 | 
			
		||||
      return;
 | 
			
		||||
    }
 | 
			
		||||
  const onInsert = useCallback(
 | 
			
		||||
    function (paths: string[]) {
 | 
			
		||||
      const variable: string[] = paths.filter((key) => Boolean(key.trim()));
 | 
			
		||||
      const { current } = inputRef;
 | 
			
		||||
      if (!current || !variable) {
 | 
			
		||||
        return;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
    current.focus();
 | 
			
		||||
      current.focus();
 | 
			
		||||
 | 
			
		||||
    const content = createVariableTagHTML(variable.join('.'), keyLabelMap);
 | 
			
		||||
    pasteHTML(current, content, {
 | 
			
		||||
      range,
 | 
			
		||||
    });
 | 
			
		||||
      const content = createVariableTagHTML(variable.join('.'), keyLabelMap);
 | 
			
		||||
      pasteHTML(current, content, {
 | 
			
		||||
        range,
 | 
			
		||||
      });
 | 
			
		||||
 | 
			
		||||
    setChanged(true);
 | 
			
		||||
    setRange(getCurrentRange(current));
 | 
			
		||||
    onChange(getValue(current));
 | 
			
		||||
  }
 | 
			
		||||
      setChanged(true);
 | 
			
		||||
      setRange(getCurrentRange(current));
 | 
			
		||||
      onChange(getValue(current));
 | 
			
		||||
    },
 | 
			
		||||
    [keyLabelMap, onChange, range],
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  function onInput({ currentTarget }) {
 | 
			
		||||
    if (ime) {
 | 
			
		||||
      return;
 | 
			
		||||
    }
 | 
			
		||||
    setChanged(true);
 | 
			
		||||
  const onInput = useCallback(
 | 
			
		||||
    function ({ currentTarget }) {
 | 
			
		||||
      if (ime) {
 | 
			
		||||
        return;
 | 
			
		||||
      }
 | 
			
		||||
      setChanged(true);
 | 
			
		||||
      setRange(getCurrentRange(currentTarget));
 | 
			
		||||
      onChange(getValue(currentTarget));
 | 
			
		||||
    },
 | 
			
		||||
    [ime, onChange],
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  const onBlur = useCallback(function ({ currentTarget }) {
 | 
			
		||||
    setRange(getCurrentRange(currentTarget));
 | 
			
		||||
    onChange(getValue(currentTarget));
 | 
			
		||||
  }
 | 
			
		||||
  }, []);
 | 
			
		||||
 | 
			
		||||
  function onBlur({ currentTarget }) {
 | 
			
		||||
    setRange(getCurrentRange(currentTarget));
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  function onKeyDown(ev) {
 | 
			
		||||
  const onKeyDown = useCallback(function (ev) {
 | 
			
		||||
    if (ev.key === 'Enter') {
 | 
			
		||||
      ev.preventDefault();
 | 
			
		||||
    }
 | 
			
		||||
@ -305,37 +315,40 @@ export function TextArea(props) {
 | 
			
		||||
    // if (ev.key === 'Alt') {
 | 
			
		||||
    //   console.debug(getCurrentRange(ev.currentTarget));
 | 
			
		||||
    // }
 | 
			
		||||
  }
 | 
			
		||||
  }, []);
 | 
			
		||||
 | 
			
		||||
  function onPaste(ev) {
 | 
			
		||||
    ev.preventDefault();
 | 
			
		||||
    const input = ev.clipboardData.getData('text/html') || ev.clipboardData.getData('text');
 | 
			
		||||
    const sanitizedHTML = sanitizeHTML(input, {
 | 
			
		||||
      allowedTags: ['span'],
 | 
			
		||||
      allowedAttributes: {
 | 
			
		||||
        span: ['data-variable', 'contenteditable'],
 | 
			
		||||
      },
 | 
			
		||||
      allowedClasses: {
 | 
			
		||||
        span: ['ant-tag', 'ant-tag-*'],
 | 
			
		||||
      },
 | 
			
		||||
      transformTags: {
 | 
			
		||||
        span(tagName, attribs) {
 | 
			
		||||
          return attribs['data-variable']
 | 
			
		||||
            ? {
 | 
			
		||||
                tagName: tagName,
 | 
			
		||||
                attribs,
 | 
			
		||||
              }
 | 
			
		||||
            : {};
 | 
			
		||||
  const onPaste = useCallback(
 | 
			
		||||
    function (ev) {
 | 
			
		||||
      ev.preventDefault();
 | 
			
		||||
      const input = ev.clipboardData.getData('text/html') || ev.clipboardData.getData('text');
 | 
			
		||||
      const sanitizedHTML = sanitizeHTML(input, {
 | 
			
		||||
        allowedTags: ['span'],
 | 
			
		||||
        allowedAttributes: {
 | 
			
		||||
          span: ['data-variable', 'contenteditable'],
 | 
			
		||||
        },
 | 
			
		||||
      },
 | 
			
		||||
    }).replace(/\n/g, ' ');
 | 
			
		||||
    // ev.clipboardData.setData('text/html', sanitizedHTML);
 | 
			
		||||
    // console.log(input, sanitizedHTML);
 | 
			
		||||
    setChanged(true);
 | 
			
		||||
    pasteHTML(ev.currentTarget, sanitizedHTML);
 | 
			
		||||
    setRange(getCurrentRange(ev.currentTarget));
 | 
			
		||||
    onChange(getValue(ev.currentTarget));
 | 
			
		||||
  }
 | 
			
		||||
        allowedClasses: {
 | 
			
		||||
          span: ['ant-tag', 'ant-tag-*'],
 | 
			
		||||
        },
 | 
			
		||||
        transformTags: {
 | 
			
		||||
          span(tagName, attribs) {
 | 
			
		||||
            return attribs['data-variable']
 | 
			
		||||
              ? {
 | 
			
		||||
                  tagName: tagName,
 | 
			
		||||
                  attribs,
 | 
			
		||||
                }
 | 
			
		||||
              : {};
 | 
			
		||||
          },
 | 
			
		||||
        },
 | 
			
		||||
      }).replace(/\n/g, ' ');
 | 
			
		||||
      // ev.clipboardData.setData('text/html', sanitizedHTML);
 | 
			
		||||
      // console.log(input, sanitizedHTML);
 | 
			
		||||
      setChanged(true);
 | 
			
		||||
      pasteHTML(ev.currentTarget, sanitizedHTML);
 | 
			
		||||
      setRange(getCurrentRange(ev.currentTarget));
 | 
			
		||||
      onChange(getValue(ev.currentTarget));
 | 
			
		||||
    },
 | 
			
		||||
    [onChange],
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  const disabled = props.disabled || form.disabled;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -1,4 +1,4 @@
 | 
			
		||||
import React, { useCallback, useContext, useMemo, useState } from 'react';
 | 
			
		||||
import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 | 
			
		||||
import { DeleteOutlined } from '@ant-design/icons';
 | 
			
		||||
import { cloneDeep } from 'lodash';
 | 
			
		||||
import { createForm } from '@formily/core';
 | 
			
		||||
@ -8,6 +8,7 @@ import { useTranslation } from 'react-i18next';
 | 
			
		||||
 | 
			
		||||
import {
 | 
			
		||||
  ActionContextProvider,
 | 
			
		||||
  FormProvider,
 | 
			
		||||
  SchemaComponent,
 | 
			
		||||
  SchemaInitializerItemOptions,
 | 
			
		||||
  css,
 | 
			
		||||
@ -273,6 +274,10 @@ export function JobButton() {
 | 
			
		||||
  );
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function useNodeFormProps() {
 | 
			
		||||
  return { form: useForm() };
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function NodeDefaultView(props) {
 | 
			
		||||
  const { data, children } = props;
 | 
			
		||||
  const compile = useCompile();
 | 
			
		||||
@ -292,15 +297,14 @@ export function NodeDefaultView(props) {
 | 
			
		||||
    const values = cloneDeep(data.config);
 | 
			
		||||
    return createForm({
 | 
			
		||||
      initialValues: values,
 | 
			
		||||
      values,
 | 
			
		||||
      disabled: workflow.executed,
 | 
			
		||||
    });
 | 
			
		||||
  }, [data, workflow]);
 | 
			
		||||
 | 
			
		||||
  const resetForm = useCallback(
 | 
			
		||||
    (changed) => {
 | 
			
		||||
      setFormValueChanged(changed);
 | 
			
		||||
      if (!changed) {
 | 
			
		||||
    (editing) => {
 | 
			
		||||
      setEditingConfig(editing);
 | 
			
		||||
      if (!editing) {
 | 
			
		||||
        form.reset();
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
@ -366,123 +370,129 @@ export function NodeDefaultView(props) {
 | 
			
		||||
        <ActionContextProvider
 | 
			
		||||
          value={{
 | 
			
		||||
            visible: editingConfig,
 | 
			
		||||
            setVisible: setEditingConfig,
 | 
			
		||||
            setVisible: resetForm,
 | 
			
		||||
            formValueChanged,
 | 
			
		||||
            setFormValueChanged: resetForm,
 | 
			
		||||
            setFormValueChanged,
 | 
			
		||||
          }}
 | 
			
		||||
        >
 | 
			
		||||
          <SchemaComponent
 | 
			
		||||
            scope={instruction.scope}
 | 
			
		||||
            components={instruction.components}
 | 
			
		||||
            schema={{
 | 
			
		||||
              type: 'void',
 | 
			
		||||
              properties: {
 | 
			
		||||
                ...(instruction.view ? { view: instruction.view } : {}),
 | 
			
		||||
                button: {
 | 
			
		||||
                  type: 'void',
 | 
			
		||||
                  'x-content': detailText,
 | 
			
		||||
                  'x-component': Button,
 | 
			
		||||
                  'x-component-props': {
 | 
			
		||||
                    type: 'link',
 | 
			
		||||
                    className: 'workflow-node-config-button',
 | 
			
		||||
                  },
 | 
			
		||||
                },
 | 
			
		||||
                [`${instruction.type}_${data.id}`]: {
 | 
			
		||||
                  type: 'void',
 | 
			
		||||
                  title: (
 | 
			
		||||
                    <div
 | 
			
		||||
                      className={css`
 | 
			
		||||
                        display: flex;
 | 
			
		||||
                        justify-content: space-between;
 | 
			
		||||
 | 
			
		||||
                        strong {
 | 
			
		||||
                          font-weight: bold;
 | 
			
		||||
                        }
 | 
			
		||||
 | 
			
		||||
                        .ant-tag {
 | 
			
		||||
                          margin-inline-end: 0;
 | 
			
		||||
                        }
 | 
			
		||||
 | 
			
		||||
                        code {
 | 
			
		||||
                          font-weight: normal;
 | 
			
		||||
                        }
 | 
			
		||||
                      `}
 | 
			
		||||
                    >
 | 
			
		||||
                      <strong>{data.title}</strong>
 | 
			
		||||
                      <Tooltip title={lang('Variable key of node')}>
 | 
			
		||||
                        <Tag>
 | 
			
		||||
                          <code>{data.key}</code>
 | 
			
		||||
                        </Tag>
 | 
			
		||||
                      </Tooltip>
 | 
			
		||||
                    </div>
 | 
			
		||||
                  ),
 | 
			
		||||
                  'x-decorator': 'FormV2',
 | 
			
		||||
                  'x-decorator-props': {
 | 
			
		||||
                    form,
 | 
			
		||||
                  },
 | 
			
		||||
                  'x-component': 'Action.Drawer',
 | 
			
		||||
                  properties: {
 | 
			
		||||
                    ...(instruction.description
 | 
			
		||||
                      ? {
 | 
			
		||||
                          description: {
 | 
			
		||||
                            type: 'void',
 | 
			
		||||
                            'x-component': DrawerDescription,
 | 
			
		||||
                            'x-component-props': {
 | 
			
		||||
                              label: lang('Node type'),
 | 
			
		||||
                              title: instruction.title,
 | 
			
		||||
                              description: instruction.description,
 | 
			
		||||
                            },
 | 
			
		||||
                          },
 | 
			
		||||
                        }
 | 
			
		||||
                      : {}),
 | 
			
		||||
                    fieldset: {
 | 
			
		||||
                      type: 'void',
 | 
			
		||||
                      'x-component': 'fieldset',
 | 
			
		||||
                      'x-component-props': {
 | 
			
		||||
                        className: css`
 | 
			
		||||
                          .ant-input,
 | 
			
		||||
                          .ant-select,
 | 
			
		||||
                          .ant-cascader-picker,
 | 
			
		||||
                          .ant-picker,
 | 
			
		||||
                          .ant-input-number,
 | 
			
		||||
                          .ant-input-affix-wrapper {
 | 
			
		||||
                            &.auto-width {
 | 
			
		||||
                              width: auto;
 | 
			
		||||
                              min-width: 6em;
 | 
			
		||||
                            }
 | 
			
		||||
                          }
 | 
			
		||||
                        `,
 | 
			
		||||
                      },
 | 
			
		||||
                      properties: instruction.fieldset,
 | 
			
		||||
          <FormProvider form={form}>
 | 
			
		||||
            <SchemaComponent
 | 
			
		||||
              scope={{
 | 
			
		||||
                ...instruction.scope,
 | 
			
		||||
                useNodeFormProps,
 | 
			
		||||
              }}
 | 
			
		||||
              components={instruction.components}
 | 
			
		||||
              schema={{
 | 
			
		||||
                type: 'void',
 | 
			
		||||
                properties: {
 | 
			
		||||
                  ...(instruction.view ? { view: instruction.view } : {}),
 | 
			
		||||
                  button: {
 | 
			
		||||
                    type: 'void',
 | 
			
		||||
                    'x-content': detailText,
 | 
			
		||||
                    'x-component': Button,
 | 
			
		||||
                    'x-component-props': {
 | 
			
		||||
                      type: 'link',
 | 
			
		||||
                      className: 'workflow-node-config-button',
 | 
			
		||||
                    },
 | 
			
		||||
                    actions: workflow.executed
 | 
			
		||||
                      ? null
 | 
			
		||||
                      : {
 | 
			
		||||
                          type: 'void',
 | 
			
		||||
                          'x-component': 'Action.Drawer.Footer',
 | 
			
		||||
                          properties: {
 | 
			
		||||
                            cancel: {
 | 
			
		||||
                              title: '{{t("Cancel")}}',
 | 
			
		||||
                              'x-component': 'Action',
 | 
			
		||||
                  },
 | 
			
		||||
                  [`${instruction.type}_${data.id}`]: {
 | 
			
		||||
                    type: 'void',
 | 
			
		||||
                    title: (
 | 
			
		||||
                      <div
 | 
			
		||||
                        className={css`
 | 
			
		||||
                          display: flex;
 | 
			
		||||
                          justify-content: space-between;
 | 
			
		||||
 | 
			
		||||
                          strong {
 | 
			
		||||
                            font-weight: bold;
 | 
			
		||||
                          }
 | 
			
		||||
 | 
			
		||||
                          .ant-tag {
 | 
			
		||||
                            margin-inline-end: 0;
 | 
			
		||||
                          }
 | 
			
		||||
 | 
			
		||||
                          code {
 | 
			
		||||
                            font-weight: normal;
 | 
			
		||||
                          }
 | 
			
		||||
                        `}
 | 
			
		||||
                      >
 | 
			
		||||
                        <strong>{data.title}</strong>
 | 
			
		||||
                        <Tooltip title={lang('Variable key of node')}>
 | 
			
		||||
                          <Tag>
 | 
			
		||||
                            <code>{data.key}</code>
 | 
			
		||||
                          </Tag>
 | 
			
		||||
                        </Tooltip>
 | 
			
		||||
                      </div>
 | 
			
		||||
                    ),
 | 
			
		||||
                    'x-decorator': 'FormV2',
 | 
			
		||||
                    'x-decorator-props': {
 | 
			
		||||
                      // form,
 | 
			
		||||
                      useProps: '{{ useNodeFormProps }}',
 | 
			
		||||
                    },
 | 
			
		||||
                    'x-component': 'Action.Drawer',
 | 
			
		||||
                    properties: {
 | 
			
		||||
                      ...(instruction.description
 | 
			
		||||
                        ? {
 | 
			
		||||
                            description: {
 | 
			
		||||
                              type: 'void',
 | 
			
		||||
                              'x-component': DrawerDescription,
 | 
			
		||||
                              'x-component-props': {
 | 
			
		||||
                                useAction: '{{ cm.useCancelAction }}',
 | 
			
		||||
                                label: lang('Node type'),
 | 
			
		||||
                                title: instruction.title,
 | 
			
		||||
                                description: instruction.description,
 | 
			
		||||
                              },
 | 
			
		||||
                            },
 | 
			
		||||
                            submit: {
 | 
			
		||||
                              title: '{{t("Submit")}}',
 | 
			
		||||
                              'x-component': 'Action',
 | 
			
		||||
                              'x-component-props': {
 | 
			
		||||
                                type: 'primary',
 | 
			
		||||
                                useAction: useUpdateAction,
 | 
			
		||||
                          }
 | 
			
		||||
                        : {}),
 | 
			
		||||
                      fieldset: {
 | 
			
		||||
                        type: 'void',
 | 
			
		||||
                        'x-component': 'fieldset',
 | 
			
		||||
                        'x-component-props': {
 | 
			
		||||
                          className: css`
 | 
			
		||||
                            .ant-input,
 | 
			
		||||
                            .ant-select,
 | 
			
		||||
                            .ant-cascader-picker,
 | 
			
		||||
                            .ant-picker,
 | 
			
		||||
                            .ant-input-number,
 | 
			
		||||
                            .ant-input-affix-wrapper {
 | 
			
		||||
                              &.auto-width {
 | 
			
		||||
                                width: auto;
 | 
			
		||||
                                min-width: 6em;
 | 
			
		||||
                              }
 | 
			
		||||
                            }
 | 
			
		||||
                          `,
 | 
			
		||||
                        },
 | 
			
		||||
                        properties: instruction.fieldset,
 | 
			
		||||
                      },
 | 
			
		||||
                      actions: workflow.executed
 | 
			
		||||
                        ? null
 | 
			
		||||
                        : {
 | 
			
		||||
                            type: 'void',
 | 
			
		||||
                            'x-component': 'Action.Drawer.Footer',
 | 
			
		||||
                            properties: {
 | 
			
		||||
                              cancel: {
 | 
			
		||||
                                title: '{{t("Cancel")}}',
 | 
			
		||||
                                'x-component': 'Action',
 | 
			
		||||
                                'x-component-props': {
 | 
			
		||||
                                  useAction: '{{ cm.useCancelAction }}',
 | 
			
		||||
                                },
 | 
			
		||||
                              },
 | 
			
		||||
                              submit: {
 | 
			
		||||
                                title: '{{t("Submit")}}',
 | 
			
		||||
                                'x-component': 'Action',
 | 
			
		||||
                                'x-component-props': {
 | 
			
		||||
                                  type: 'primary',
 | 
			
		||||
                                  useAction: useUpdateAction,
 | 
			
		||||
                                },
 | 
			
		||||
                              },
 | 
			
		||||
                            },
 | 
			
		||||
                          },
 | 
			
		||||
                        },
 | 
			
		||||
                  },
 | 
			
		||||
                } as ISchema,
 | 
			
		||||
              },
 | 
			
		||||
            }}
 | 
			
		||||
          />
 | 
			
		||||
                    },
 | 
			
		||||
                  } as ISchema,
 | 
			
		||||
                },
 | 
			
		||||
              }}
 | 
			
		||||
            />
 | 
			
		||||
          </FormProvider>
 | 
			
		||||
        </ActionContextProvider>
 | 
			
		||||
      </div>
 | 
			
		||||
      {children}
 | 
			
		||||
 | 
			
		||||
@ -1,8 +1,8 @@
 | 
			
		||||
import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 | 
			
		||||
import { FormLayout } from '@formily/antd-v5';
 | 
			
		||||
import { createForm } from '@formily/core';
 | 
			
		||||
import { FormProvider, ISchema, Schema, useFieldSchema, useForm } from '@formily/react';
 | 
			
		||||
import { Alert, Button, Modal, Space } from 'antd';
 | 
			
		||||
import React, { useContext, useEffect, useMemo, useState } from 'react';
 | 
			
		||||
import { useTranslation } from 'react-i18next';
 | 
			
		||||
 | 
			
		||||
import {
 | 
			
		||||
@ -450,22 +450,27 @@ export function SchemaConfig({ value, onChange }) {
 | 
			
		||||
    [],
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  const refresh = useCallback(
 | 
			
		||||
    function refresh() {
 | 
			
		||||
      // ctx.refresh?.();
 | 
			
		||||
      const { tabs } = lodash.get(schema.toJSON(), 'properties.drawer.properties') as { tabs: ISchema };
 | 
			
		||||
      const forms = Array.from(manualFormTypes.getValues()).reduce(
 | 
			
		||||
        (result, item: ManualFormType) => Object.assign(result, item.config.parseFormOptions(tabs)),
 | 
			
		||||
        {},
 | 
			
		||||
      );
 | 
			
		||||
      form.setValuesIn('forms', forms);
 | 
			
		||||
 | 
			
		||||
      onChange(tabs.properties);
 | 
			
		||||
    },
 | 
			
		||||
    [form, onChange, schema],
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  return (
 | 
			
		||||
    <SchemaComponentContext.Provider
 | 
			
		||||
      value={{
 | 
			
		||||
        ...ctx,
 | 
			
		||||
        designable: !workflow.executed,
 | 
			
		||||
        refresh() {
 | 
			
		||||
          ctx.refresh?.();
 | 
			
		||||
          const { tabs } = lodash.get(schema.toJSON(), 'properties.drawer.properties') as { tabs: ISchema };
 | 
			
		||||
          const forms = Array.from(manualFormTypes.getValues()).reduce(
 | 
			
		||||
            (result, item: ManualFormType) => Object.assign(result, item.config.parseFormOptions(tabs)),
 | 
			
		||||
            {},
 | 
			
		||||
          );
 | 
			
		||||
          form.setValuesIn('forms', forms);
 | 
			
		||||
 | 
			
		||||
          onChange(tabs.properties);
 | 
			
		||||
        },
 | 
			
		||||
        refresh,
 | 
			
		||||
      }}
 | 
			
		||||
    >
 | 
			
		||||
      <SchemaInitializerProvider
 | 
			
		||||
@ -520,7 +525,9 @@ export function SchemaConfigButton(props) {
 | 
			
		||||
      <Button type="primary" onClick={() => setVisible(true)}>
 | 
			
		||||
        {workflow.executed ? lang('View user interface') : lang('Configure user interface')}
 | 
			
		||||
      </Button>
 | 
			
		||||
      <ActionContextProvider value={{ visible, setVisible }}>{props.children}</ActionContextProvider>
 | 
			
		||||
      <ActionContextProvider value={{ visible, setVisible, formValueChanged: false }}>
 | 
			
		||||
        {props.children}
 | 
			
		||||
      </ActionContextProvider>
 | 
			
		||||
    </>
 | 
			
		||||
  );
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user