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

package/lib/client/style.js

@@ -16,10 +16,6 @@ function _css() {
 }
 
 const workflowPageClass = (0, _css().css)`
-  height: 100%;
-  width: 100%;
-  overflow: auto;
-
   .workflow-toolbar{
     display: flex;
     align-items: center;
@@ -176,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;
@@ -204,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;
@@ -219,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;
     }
@@ -232,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;
   }
@@ -253,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

@@ -1,21 +1,22 @@
 import React from 'react';
-import { useCollectionDataSource } from '@nocobase/client';
+import { SchemaInitializerItemOptions, useCollectionDataSource } from '@nocobase/client';
+import { CollectionFieldInitializers } from '../components/CollectionFieldInitializers';
 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;
@@ -23,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': {
@@ -37,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;
@@ -56,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': {
@@ -81,9 +107,12 @@ 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;
+    initializers: {
+        CollectionFieldInitializers: typeof CollectionFieldInitializers;
     };
-    getOptions(config: any): any[];
-    getter(props: any): JSX.Element;
 };
 export default _default;

package/lib/client/triggers/collection.js

@@ -45,35 +45,17 @@ function _client() {
   return data;
 }
 
-var _FlowContext = require("../FlowContext");
-
 var _collection = require("../schemas/collection");
 
-function _css() {
-  const data = require("@emotion/css");
-
-  _css = function _css() {
-    return data;
-  };
-
-  return data;
-}
+var _variable = require("../variable");
 
-function _core() {
-  const data = require("@formily/core");
-
-  _core = function _core() {
-    return data;
-  };
-
-  return data;
-}
+var _CollectionBlockInitializer = require("../components/CollectionBlockInitializer");
 
-var _CollectionFieldSelect = _interopRequireDefault(require("../components/CollectionFieldSelect"));
+var _CollectionFieldInitializers = require("../components/CollectionFieldInitializers");
 
 var _locale = require("../locale");
 
-var _calculators = require("../calculators");
+const _excluded = ["filter"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -83,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)();
 
@@ -92,22 +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(_objectSpread({}, props), {}, {
-    className: (0, _css().css)`
-        min-width: 6em;
-      `
-  }), 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, {
@@ -139,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': {
@@ -175,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})}}`
@@ -183,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
@@ -207,34 +224,39 @@ var _default = {
     FieldsSelect
   },
 
-  getOptions(config) {
+  getOptions(config, types) {
     const _useWorkflowTranslati = (0, _locale.useWorkflowTranslation)(),
           t = _useWorkflowTranslati.t;
 
-    const options = [{
+    const fieldOptions = (0, _variable.useCollectionFieldOptions)({
+      collection: config.collection,
+      types
+    });
+    const options = [...((fieldOptions === null || fieldOptions === void 0 ? void 0 : fieldOptions.length) ? [{
+      label: t('Trigger data'),
+      key: 'data',
       value: 'data',
-      label: t('Trigger data')
-    }];
+      children: fieldOptions
+    }] : [])];
     return options;
   },
 
-  getter(props) {
-    const _onChange = props.onChange;
-
-    const _useFlowContext = (0, _FlowContext.useFlowContext)(),
-          workflow = _useFlowContext.workflow;
-
-    const _useOperandContext = (0, _calculators.useOperandContext)(),
-          options = _useOperandContext.options;
+  useInitializers(config) {
+    if (!config.collection) {
+      return null;
+    }
+
+    return {
+      type: 'item',
+      title: `{{t("Trigger data", { ns: "${_locale.NAMESPACE}" })}}`,
+      component: _CollectionBlockInitializer.CollectionBlockInitializer,
+      collection: config.collection,
+      dataSource: '{{$context.data}}'
+    };
+  },
 
-    return _react().default.createElement(_CollectionFieldSelect.default, {
-      collection: workflow.config.collection,
-      value: options === null || options === void 0 ? void 0 : options.path,
-      onChange: path => {
-        _onChange(`{{$context.data.${path}}}`);
-      }
-    });
+  initializers: {
+    CollectionFieldInitializers: _CollectionFieldInitializers.CollectionFieldInitializers
   }
-
 };
 exports.default = _default;

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

@@ -1,10 +1,11 @@
+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;
     type: string;
-    getOptions?(config: any): {
+    getOptions?(config: any, types: any[]): {
         label: string;
         value: any;
         key: string;
@@ -20,7 +21,9 @@ export interface Trigger {
         [key: string]: any;
     };
     render?(props: any): React.ReactNode;
-    getter?(node: any): React.ReactNode;
+    useInitializers?(config: any): SchemaInitializerItemOptions | null;
+    initializers?: any;
 }
 export declare const triggers: Registry<Trigger>;
 export declare const TriggerConfig: () => JSX.Element;
+export declare function useTrigger(): Trigger;