@nocobase/plugin-workflow 0.9.1-alpha.1 → 0.9.1-alpha.2

package/lib/client/nodes/request.js

@@ -34,9 +34,8 @@ var _default = {
   type: 'request',
   group: 'extended',
   fieldset: {
-    'config.method': {
+    method: {
       type: 'string',
-      name: 'config.method',
       required: true,
       title: `{{t("HTTP method", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
@@ -63,9 +62,8 @@ var _default = {
       }],
       default: 'POST'
     },
-    'config.url': {
+    url: {
       type: 'string',
-      name: 'config.url',
       required: true,
       title: `{{t("URL", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
@@ -84,9 +82,8 @@ var _default = {
         placeholder: 'https://www.nocobase.com'
       }
     },
-    'config.headers': {
+    headers: {
       type: 'array',
-      name: 'config.headers',
       'x-component': 'ArrayItems',
       'x-decorator': 'FormItem',
       title: `{{t("Headers", { ns: "${_locale.NAMESPACE}" })}}`,
@@ -131,9 +128,8 @@ var _default = {
         }
       }
     },
-    'config.params': {
+    params: {
       type: 'array',
-      name: 'config.params',
       'x-component': 'ArrayItems',
       'x-decorator': 'FormItem',
       title: `{{t("Parameters", { ns: "${_locale.NAMESPACE}" })}}`,
@@ -177,9 +173,8 @@ var _default = {
         }
       }
     },
-    'config.data': {
+    data: {
       type: 'string',
-      name: 'config.data',
       title: `{{t("Body", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
       'x-decorator-props': {},
@@ -191,15 +186,14 @@ var _default = {
         },
         placeholder: `{{t("Input request data", { ns: "${_locale.NAMESPACE}" })}}`,
         className: (0, _css().css)`
-          font-size: 85%;
+          font-size: 90%;
           font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
         `
       },
       description: `{{t("Only support standard JSON data", { ns: "${_locale.NAMESPACE}" })}}`
     },
-    'config.timeout': {
+    timeout: {
       type: 'number',
-      name: 'config.timeout',
       title: `{{t("Timeout config", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
       'x-decorator-props': {},
@@ -211,9 +205,8 @@ var _default = {
         defaultValue: 5000
       }
     },
-    'config.ignoreFail': {
+    ignoreFail: {
       type: 'boolean',
-      name: 'config.ignoreFail',
       title: `{{t("Ignore fail request and continue workflow", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
       'x-component': 'Checkbox'

package/lib/client/nodes/update.d.ts

@@ -5,10 +5,9 @@ declare const _default: {
     type: string;
     group: string;
     fieldset: {
-        'config.collection': {
+        collection: {
             type: string;
             title: string;
-            name: string;
             required: boolean;
             'x-reactions': string[];
             'x-decorator': string;
@@ -17,35 +16,40 @@ declare const _default: {
                 placeholder: string;
             };
         };
-        'config.params.filter': {
-            title: string;
-            type: string;
-            name: string;
-            'x-decorator': string;
-            'x-decorator-props': {
-                labelAlign: string;
-                className: string;
-            };
-            'x-component': string;
-            'x-component-props': {
-                useProps(): {
-                    options: any[];
-                    className: string;
-                };
-                dynamicComponent: string;
-            };
-        };
-        'config.params.values': {
+        params: {
             type: string;
             title: string;
-            name: string;
             'x-decorator': string;
-            'x-decorator-props': {
-                labelAlign: string;
-                className: string;
+            properties: {
+                filter: {
+                    title: string;
+                    type: string;
+                    'x-decorator': string;
+                    'x-decorator-props': {
+                        labelAlign: string;
+                        className: string;
+                    };
+                    'x-component': string;
+                    'x-component-props': {
+                        useProps(): {
+                            options: any[];
+                            className: string;
+                        };
+                        dynamicComponent: string;
+                    };
+                };
+                values: {
+                    type: string;
+                    title: string;
+                    'x-decorator': string;
+                    'x-decorator-props': {
+                        labelAlign: string;
+                        className: string;
+                    };
+                    'x-component': string;
+                    description: string;
+                };
             };
-            'x-component': string;
-            description: string;
         };
     };
     view: {};

package/lib/client/nodes/update.js

@@ -36,11 +36,18 @@ var _default = {
   type: 'update',
   group: 'collection',
   fieldset: {
-    'config.collection': _collection.collection,
-    'config.params.filter': _objectSpread(_objectSpread({}, _collection.filter), {}, {
-      title: `{{t("Only update records matching conditions", { ns: "${_locale.NAMESPACE}" })}}`
-    }),
-    'config.params.values': _collection.values
+    collection: _collection.collection,
+    params: {
+      type: 'object',
+      title: '',
+      'x-decorator': 'FormItem',
+      properties: {
+        filter: _objectSpread(_objectSpread({}, _collection.filter), {}, {
+          title: `{{t("Only update records matching conditions", { ns: "${_locale.NAMESPACE}" })}}`
+        }),
+        values: _collection.values
+      }
+    }
   },
   view: {},
   scope: {

package/lib/client/schemas/collection.d.ts

@@ -1,7 +1,6 @@
 export declare const collection: {
     type: string;
     title: string;
-    name: string;
     required: boolean;
     'x-reactions': string[];
     'x-decorator': string;
@@ -13,7 +12,6 @@ export declare const collection: {
 export declare const values: {
     type: string;
     title: string;
-    name: string;
     'x-decorator': string;
     'x-decorator-props': {
         labelAlign: string;
@@ -25,7 +23,6 @@ export declare const values: {
 export declare const filter: {
     type: string;
     title: string;
-    name: string;
     'x-decorator': string;
     'x-decorator-props': {
         labelAlign: string;

package/lib/client/schemas/collection.js

@@ -40,7 +40,6 @@ var _locale = require("../locale");
 const collection = {
   type: 'string',
   title: '{{t("Collection")}}',
-  name: 'config.collection',
   required: true,
   'x-reactions': ['{{useCollectionDataSource()}}'],
   'x-decorator': 'FormItem',
@@ -53,7 +52,6 @@ exports.collection = collection;
 const values = {
   type: 'object',
   title: '{{t("Fields values")}}',
-  name: 'config.params.values',
   'x-decorator': 'FormItem',
   'x-decorator-props': {
     labelAlign: 'left',
@@ -68,7 +66,6 @@ exports.values = values;
 const filter = {
   type: 'object',
   title: '{{t("Filter")}}',
-  name: 'config.params.filter',
   'x-decorator': 'FormItem',
   'x-decorator-props': {
     labelAlign: 'left',
@@ -79,12 +76,10 @@ const filter = {
   'x-component': 'Filter',
   'x-component-props': {
     useProps() {
-      var _values$config;
-
       const _useForm = (0, _react().useForm)(),
             values = _useForm.values;
 
-      const options = (0, _client().useCollectionFilterOptions)((_values$config = values.config) === null || _values$config === void 0 ? void 0 : _values$config.collection);
+      const options = (0, _client().useCollectionFilterOptions)(values === null || values === void 0 ? void 0 : values.collection);
       return {
         options,
         className: (0, _css().css)`

package/lib/client/style.js

@@ -172,19 +172,27 @@ const nodeClass = (0, _css().css)`
 `;
 exports.nodeClass = nodeClass;
 const nodeCardClass = (0, _css().css)`
+  position: relative;
   width: 20em;
   background: #fff;
   padding: 1em;
   box-shadow: 0 .25em .5em rgba(0, 0, 0, .1);
+  border-radius: .5em;
+  cursor: pointer;
+  transition: box-shadow .3s ease;
+
+  &.configuring{
+    box-shadow: 0 .25em 1em rgba(0, 100, 200, .25);
+  }
 
   .workflow-node-remove-button,
   .workflow-node-job-button{
     position: absolute;
-    right: -.5em;
-    top: -.5em;
   }
 
   .workflow-node-remove-button{
+    right: .5em;
+    top: .5em;
     color: #999;
     opacity: 0;
     transition: opacity .3s ease;
@@ -200,8 +208,8 @@ const nodeCardClass = (0, _css().css)`
 
   .workflow-node-job-button{
     display: flex;
-    top: 0;
-    right: 0;
+    top: 1em;
+    right: 1em;
     width: 1.25rem;
     height: 1.25rem;
     min-width: 1.25rem;
@@ -215,7 +223,32 @@ const nodeCardClass = (0, _css().css)`
     }
   }
 
+  .ant-input{
+    font-weight: bold;
+
+    &:not(:focus){
+      transition: background-color .3s ease, border-color .3s ease;
+      border-color: #f7f7f7;
+      background-color: #f7f7f7;
+
+      &:not(:disabled):hover{
+        border-color: #eee;
+        background-color: #eee;
+      }
+
+      &:disabled:hover{
+        border-color: #f7f7f7;
+      }
+    }
+  }
+
+  .workflow-node-config-button{
+    padding: 0;
+  }
+
   &:hover{
+    box-shadow: 0 .25em .5em rgba(0, 0, 0, .25);
+
     .workflow-node-remove-button{
       opacity: 1;
     }
@@ -228,13 +261,20 @@ const nodeHeaderClass = (0, _css().css)`
 exports.nodeHeaderClass = nodeHeaderClass;
 const nodeMetaClass = (0, _css().css)`
   margin-bottom: .5em;
+
+  .workflow-node-id{
+    color: #999;
+
+    &:before{
+      content: "#"
+    }
+  }
 `;
 exports.nodeMetaClass = nodeMetaClass;
 const nodeTitleClass = (0, _css().css)`
   display: flex;
   align-items: center;
   font-weight: normal;
-
   .workflow-node-id{
     color: #999;
   }
@@ -249,5 +289,11 @@ exports.nodeSubtreeClass = nodeSubtreeClass;
 const addButtonClass = (0, _css().css)`
   flex-shrink: 0;
   padding: 2em 0;
+
+  > .ant-btn{
+    &:disabled{
+      visibility: hidden;
+    }
+  }
 `;
 exports.addButtonClass = addButtonClass;

package/lib/client/triggers/collection.d.ts

@@ -5,18 +5,18 @@ declare const _default: {
     title: string;
     type: string;
     fieldset: {
-        'config.collection': {
+        collection: {
             "x-reactions": (string | {
                 target: string;
+                effects: string[];
                 fulfill: {
                     state: {
-                        visible: string;
+                        value: any[];
                     };
                 };
             })[];
             type: string;
             title: string;
-            name: string;
             required: boolean;
             'x-decorator': string;
             'x-component': string;
@@ -24,10 +24,9 @@ declare const _default: {
                 placeholder: string;
             };
         };
-        'config.mode': {
+        mode: {
             type: string;
             title: string;
-            name: string;
             'x-decorator': string;
             'x-component': string;
             'x-component-props': {
@@ -38,18 +37,28 @@ declare const _default: {
                 placeholder: string;
             };
             required: boolean;
-            'x-reactions': {
+            'x-reactions': ({
+                dependencies: string[];
+                fulfill: {
+                    state: {
+                        visible: string;
+                        disabled?: undefined;
+                    };
+                };
+                target?: undefined;
+            } | {
                 target: string;
                 fulfill: {
                     state: {
                         disabled: string;
+                        visible?: undefined;
                     };
                 };
-            }[];
+                dependencies?: undefined;
+            })[];
         };
-        'config.changed': {
+        changed: {
             type: string;
-            name: string;
             title: string;
             description: string;
             'x-decorator': string;
@@ -57,11 +66,27 @@ declare const _default: {
             'x-component-props': {
                 mode: string;
                 placeholder: string;
+                filter(field: any): boolean;
             };
+            'x-reactions': {
+                dependencies: string[];
+                fulfill: {
+                    state: {
+                        visible: string;
+                    };
+                };
+            }[];
         };
-        'config.condition': {
-            name: string;
+        condition: {
             title: string;
+            'x-reactions': {
+                dependencies: string[];
+                fulfill: {
+                    state: {
+                        visible: string;
+                    };
+                };
+            }[];
             type: string;
             'x-decorator': string;
             'x-decorator-props': {
@@ -82,7 +107,7 @@ declare const _default: {
         useCollectionDataSource: typeof useCollectionDataSource;
     };
     components: {
-        FieldsSelect: React.MemoExoticComponent<React.FunctionComponent<unknown>>;
+        FieldsSelect: React.MemoExoticComponent<React.FunctionComponent<Pick<any, string | number | symbol>>>;
     };
     getOptions(config: any, types: any): any[];
     useInitializers(config: any): SchemaInitializerItemOptions | null;

package/lib/client/triggers/collection.js

@@ -25,16 +25,6 @@ function _antd() {
   return data;
 }
 
-function _core() {
-  const data = require("@formily/core");
-
-  _core = function _core() {
-    return data;
-  };
-
-  return data;
-}
-
 function _react2() {
   const data = require("@formily/react");
 
@@ -65,6 +55,8 @@ var _CollectionFieldInitializers = require("../components/CollectionFieldInitial
 
 var _locale = require("../locale");
 
+const _excluded = ["filter"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -73,8 +65,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 const FieldsSelect = (0, _react2().observer)(props => {
-  var _values$config;
+  const _props$filter = props.filter,
+        filter = _props$filter === void 0 ? () => true : _props$filter,
+        others = _objectWithoutProperties(props, _excluded);
 
   const compile = (0, _client().useCompile)();
 
@@ -82,18 +80,10 @@ const FieldsSelect = (0, _react2().observer)(props => {
         getCollectionFields = _useCollectionManager.getCollectionFields;
 
   const _useForm = (0, _react2().useForm)(),
-        values = _useForm.values,
-        clearFormGraph = _useForm.clearFormGraph,
-        setValuesIn = _useForm.setValuesIn;
-
-  const fields = getCollectionFields(values === null || values === void 0 ? void 0 : (_values$config = values.config) === null || _values$config === void 0 ? void 0 : _values$config.collection);
-  (0, _react2().useFormEffects)(() => {
-    (0, _core().onFieldValueChange)('config.collection', field => {
-      clearFormGraph('config.changed');
-      setValuesIn('config.condition', null);
-    });
-  });
-  return _react().default.createElement(_antd().Select, _objectSpread({}, props), fields.filter(field => !field.hidden && (field.uiSchema ? !field.uiSchema['x-read-pretty'] : true) && !['linkTo', 'hasOne', 'hasMany', 'belongsToMany'].includes(field.type)).map(field => {
+        values = _useForm.values;
+
+  const fields = getCollectionFields(values === null || values === void 0 ? void 0 : values.collection);
+  return _react().default.createElement(_antd().Select, _objectSpread({}, others), fields.filter(filter).map(field => {
     var _field$uiSchema;
 
     return _react().default.createElement(_antd().Select.Option, {
@@ -125,34 +115,28 @@ var _default = {
   title: `{{t("Collection event", { ns: "${_locale.NAMESPACE}" })}}`,
   type: 'collection',
   fieldset: {
-    'config.collection': _objectSpread(_objectSpread({}, _collection.collection), {}, {
+    collection: _objectSpread(_objectSpread({}, _collection.collection), {}, {
       ['x-reactions']: [..._collection.collection['x-reactions'], {
-        target: 'config.mode',
-        fulfill: {
-          state: {
-            visible: '{{!!$self.value}}'
-          }
-        }
-      }, {
-        target: 'config.changed',
+        target: 'changed',
+        effects: ['onFieldValueChange'],
         fulfill: {
           state: {
-            visible: '{{!!$self.value}}'
+            value: []
           }
         }
       }, {
-        target: 'config.condition',
+        target: 'condition',
+        effects: ['onFieldValueChange'],
         fulfill: {
           state: {
-            visible: '{{!!$self.value}}'
+            value: null
           }
         }
       }]
     }),
-    'config.mode': {
+    mode: {
       type: 'number',
       title: `{{t("Trigger on", { ns: "${_locale.NAMESPACE}" })}}`,
-      name: 'config.mode',
       'x-decorator': 'FormItem',
       'x-component': 'Select',
       'x-component-props': {
@@ -161,7 +145,14 @@ var _default = {
       },
       required: true,
       'x-reactions': [{
-        target: 'config.changed',
+        dependencies: ['collection'],
+        fulfill: {
+          state: {
+            visible: '{{!!$deps[0]}}'
+          }
+        }
+      }, {
+        target: 'changed',
         fulfill: {
           state: {
             disabled: `{{!($self.value & ${COLLECTION_TRIGGER_MODE.UPDATED})}}`
@@ -169,22 +160,62 @@ var _default = {
         }
       }]
     },
-    'config.changed': {
+    changed: {
       type: 'array',
-      name: 'changed',
       title: `{{t("Changed fields", { ns: "${_locale.NAMESPACE}" })}}`,
       description: `{{t("Triggered only if one of the selected fields changes. If unselected, it means that it will be triggered when any field changes. When record is added or deleted, any field is considered to have been changed.", { ns: "${_locale.NAMESPACE}" })}}`,
       'x-decorator': 'FormItem',
       'x-component': 'FieldsSelect',
       'x-component-props': {
         mode: 'multiple',
-        placeholder: '{{t("Select Field")}}'
-      }
+        placeholder: '{{t("Select Field")}}',
+
+        filter(field) {
+          return !field.hidden && (field.uiSchema ? !field.uiSchema['x-read-pretty'] : true) && !['linkTo', 'hasOne', 'hasMany', 'belongsToMany'].includes(field.type);
+        }
+
+      },
+      'x-reactions': [{
+        dependencies: ['collection'],
+        fulfill: {
+          state: {
+            visible: '{{!!$deps[0]}}'
+          }
+        }
+      }]
     },
-    'config.condition': _objectSpread(_objectSpread({}, _collection.filter), {}, {
-      name: 'config.condition',
-      title: `{{t("Only triggers when match conditions", { ns: "${_locale.NAMESPACE}" })}}`
-    })
+    condition: _objectSpread(_objectSpread({}, _collection.filter), {}, {
+      title: `{{t("Only triggers when match conditions", { ns: "${_locale.NAMESPACE}" })}}`,
+      'x-reactions': [{
+        dependencies: ['collection'],
+        fulfill: {
+          state: {
+            visible: '{{!!$deps[0]}}'
+          }
+        }
+      }]
+    }) // appends: {
+    //   type: 'array',
+    //   title: `{{t("Prefetch fields", { ns: "${NAMESPACE}" })}}`,
+    //   description: `{{t("Triggered only if one of the selected fields changes. If unselected, it means that it will be triggered when any field changes. When record is added or deleted, any field is considered to have been changed.", { ns: "${NAMESPACE}" })}}`,
+    //   'x-decorator': 'FormItem',
+    //   'x-component': 'FieldsSelect',
+    //   'x-component-props': {
+    //     mode: 'multiple',
+    //     placeholder: '{{t("Select Field")}}'
+    //   },
+    //   'x-reactions': [
+    //     {
+    //       dependencies: ['collection'],
+    //       fulfill: {
+    //         state: {
+    //           visible: '{{!!$deps[0]}}',
+    //         },
+    //       }
+    //     },
+    //   ]
+    // },
+
   },
   scope: {
     useCollectionDataSource: _client().useCollectionDataSource

package/lib/client/triggers/index.d.ts

@@ -1,6 +1,6 @@
+import React from "react";
 import { ISchema } from "@formily/react";
 import { Registry } from "@nocobase/utils/client";
-import React from "react";
 import { SchemaInitializerItemOptions } from '@nocobase/client';
 export interface Trigger {
     title: string;