@nocobase/plugin-workflow 0.10.1-alpha.1 → 0.11.1-alpha.1

package/src/client/triggers/schedule/RepeatField.tsx

@@ -0,0 +1,116 @@
+import { css } from '@nocobase/client';
+import { InputNumber, Select } from 'antd';
+import React from 'react';
+import { Cron } from 'react-js-cron';
+import { useWorkflowTranslation } from '../../locale';
+import CronZhCN from './locale/Cron.zh-CN';
+
+const languages = {
+  'zh-CN': CronZhCN,
+};
+
+const RepeatOptions = [
+  { value: 'none', text: 'No repeat' },
+  { value: 60_000, text: 'By minute', unitText: 'Minutes' },
+  { value: 3600_000, text: 'By hour', unitText: 'Hours' },
+  { value: 86400_000, text: 'By day', unitText: 'Days' },
+  { value: 604800_000, text: 'By week', unitText: 'Weeks' },
+  // { value: 18144_000_000, text: 'By 30 days' },
+  { value: 'cron', text: 'Advanced' },
+];
+
+function getNumberOption(v) {
+  const opts = RepeatOptions.filter((option) => typeof option.value === 'number').reverse() as any[];
+  return opts.find((item) => !(v % item.value));
+}
+
+function getRepeatTypeValue(v) {
+  switch (typeof v) {
+    case 'number':
+      const option = getNumberOption(v);
+      return option ? option.value : 'none';
+    case 'string':
+      return 'cron';
+    default:
+      break;
+  }
+  return 'none';
+}
+
+function CommonRepeatField({ value, onChange }) {
+  const { t } = useWorkflowTranslation();
+  const option = getNumberOption(value);
+
+  return (
+    <InputNumber
+      value={value / option.value}
+      onChange={(v) => onChange(v * option.value)}
+      min={1}
+      addonBefore={t('Every')}
+      addonAfter={t(option.unitText)}
+    />
+  );
+}
+
+export function RepeatField({ value = null, onChange }) {
+  const { t } = useWorkflowTranslation();
+  const typeValue = getRepeatTypeValue(value);
+  function onTypeChange(v) {
+    if (v === 'none') {
+      onChange(null);
+      return;
+    }
+    if (v === 'cron') {
+      onChange('0 * * * * *');
+      return;
+    }
+    onChange(v);
+  }
+
+  const locale = languages[localStorage.getItem('NOCOBASE_LOCALE') || 'en-US'];
+
+  return (
+    <fieldset
+      className={css`
+        display: flex;
+        flex-direction: ${typeValue === 'cron' ? 'column' : 'row'};
+        align-items: flex-start;
+        gap: 0.5em;
+
+        .react-js-cron {
+          padding: 0.5em 0.5em 0 0.5em;
+          border: 1px dashed #ccc;
+
+          .react-js-cron-field {
+            margin-bottom: 0.5em;
+
+            > span {
+              margin: 0 0.5em 0 0;
+            }
+
+            > .react-js-cron-select {
+              margin: 0 0.5em 0 0;
+            }
+          }
+        }
+      `}
+    >
+      <Select value={typeValue} onChange={onTypeChange}>
+        {RepeatOptions.map((item) => (
+          <Select.Option key={item.value} value={item.value}>
+            {t(item.text)}
+          </Select.Option>
+        ))}
+      </Select>
+      {typeof typeValue === 'number' ? <CommonRepeatField value={value} onChange={onChange} /> : null}
+      {typeValue === 'cron' ? (
+        <Cron
+          value={value.trim().split(/\s+/).slice(1).join(' ')}
+          setValue={(v) => onChange(`0 ${v}`)}
+          clearButton={false}
+          locale={locale}
+        />
+      ) : null}
+    </fieldset>
+  );
+}

package/src/client/triggers/schedule/ScheduleConfig.tsx

@@ -0,0 +1,227 @@
+import { onFieldValueChange } from '@formily/core';
+import { useForm, useFormEffects, ISchema } from '@formily/react';
+import { css, SchemaComponent } from '@nocobase/client';
+import React, { useState } from 'react';
+import { NAMESPACE } from '../../locale';
+import { appends, collection } from '../../schemas/collection';
+import { SCHEDULE_MODE } from './constants';
+import { EndsByField } from './EndsByField';
+import { OnField } from './OnField';
+import { RepeatField } from './RepeatField';
+
+const ModeFieldsets = {
+  [SCHEDULE_MODE.STATIC]: {
+    startsOn: {
+      type: 'datetime',
+      title: `{{t("Starts on", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'DatePicker',
+      'x-component-props': {
+        showTime: true,
+      },
+      required: true,
+    },
+    repeat: {
+      type: 'string',
+      title: `{{t("Repeat mode", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'RepeatField',
+      'x-reactions': [
+        {
+          target: 'endsOn',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+        {
+          target: 'limit',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+      ],
+    },
+    endsOn: {
+      type: 'datetime',
+      title: `{{t("Ends on", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'DatePicker',
+      'x-component-props': {
+        showTime: true,
+      },
+    },
+    limit: {
+      type: 'number',
+      title: `{{t("Repeat limit", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'InputNumber',
+      'x-component-props': {
+        placeholder: `{{t("No limit", { ns: "${NAMESPACE}" })}}`,
+        min: 0,
+      },
+    },
+  },
+  [SCHEDULE_MODE.COLLECTION_FIELD]: {
+    collection: {
+      ...collection,
+      'x-reactions': [
+        ...collection['x-reactions'],
+        {
+          // only full path works
+          target: 'startsOn',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+      ],
+    },
+    startsOn: {
+      type: 'object',
+      title: `{{t("Starts on", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'OnField',
+      'x-reactions': [
+        {
+          target: 'repeat',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+      ],
+      required: true,
+    },
+    repeat: {
+      type: 'string',
+      title: `{{t("Repeat mode", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'RepeatField',
+      'x-reactions': [
+        {
+          target: 'endsOn',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+        {
+          target: 'limit',
+          fulfill: {
+            state: {
+              visible: '{{!!$self.value}}',
+            },
+          },
+        },
+      ],
+    },
+    endsOn: {
+      type: 'object',
+      title: `{{t("Ends on", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'EndsByField',
+    },
+    limit: {
+      type: 'number',
+      title: `{{t("Repeat limit", { ns: "${NAMESPACE}" })}}`,
+      'x-decorator': 'FormItem',
+      'x-component': 'InputNumber',
+      'x-component-props': {
+        placeholder: `{{t("No limit", { ns: "${NAMESPACE}" })}}`,
+        min: 0,
+      },
+    },
+    appends: {
+      ...appends,
+      'x-reactions': [
+        {
+          dependencies: ['mode', 'collection'],
+          fulfill: {
+            state: {
+              visible: `{{$deps[0] === ${SCHEDULE_MODE.COLLECTION_FIELD} && $deps[1]}}`,
+            },
+          },
+        },
+      ],
+    },
+  },
+};
+
+const scheduleModeOptions = [
+  { value: SCHEDULE_MODE.STATIC, label: `{{t("Based on certain date", { ns: "${NAMESPACE}" })}}` },
+  {
+    value: SCHEDULE_MODE.COLLECTION_FIELD,
+    label: `{{t("Based on date field of collection", { ns: "${NAMESPACE}" })}}`,
+  },
+];
+
+export const ScheduleConfig = () => {
+  const { values = {}, clearFormGraph } = useForm();
+  const [mode, setMode] = useState(values.mode);
+  useFormEffects(() => {
+    onFieldValueChange('mode', (field) => {
+      setMode(field.value);
+      clearFormGraph('collection');
+      clearFormGraph('startsOn');
+      clearFormGraph('repeat');
+      clearFormGraph('endsOn');
+      clearFormGraph('limit');
+    });
+  });
+
+  return (
+    <>
+      <SchemaComponent
+        schema={{
+          type: 'number',
+          title: `{{t("Trigger mode", { ns: "${NAMESPACE}" })}}`,
+          name: 'mode',
+          'x-decorator': 'FormItem',
+          'x-component': 'Radio.Group',
+          'x-component-props': {
+            options: scheduleModeOptions,
+          },
+          required: true,
+          default: SCHEDULE_MODE.STATIC,
+        }}
+      />
+      <SchemaComponent
+        schema={
+          {
+            type: 'void',
+            properties: {
+              [`mode-${mode}`]: {
+                type: 'void',
+                'x-component': 'fieldset',
+                'x-component-props': {
+                  className: css`
+                    .ant-input-number {
+                      width: 4em;
+                    }
+
+                    .ant-picker {
+                      width: auto;
+                    }
+                  `,
+                },
+                properties: ModeFieldsets[mode],
+              },
+            },
+          } as ISchema
+        }
+        components={{
+          OnField,
+          RepeatField,
+          EndsByField,
+        }}
+      />
+    </>
+  );
+};

package/src/client/triggers/schedule/constants.ts

@@ -0,0 +1,4 @@
+export const SCHEDULE_MODE = {
+  STATIC: 0,
+  COLLECTION_FIELD: 1,
+};

package/src/client/triggers/schedule/index.tsx

@@ -0,0 +1,78 @@
+import { useCollectionDataSource, SchemaInitializerItemOptions, useCompile, useCollectionManager } from '@nocobase/client';
+
+import { ScheduleConfig } from './ScheduleConfig';
+import { SCHEDULE_MODE } from './constants';
+import { NAMESPACE, lang } from '../../locale';
+import { CollectionBlockInitializer } from '../../components/CollectionBlockInitializer';
+import { defaultFieldNames, getCollectionFieldOptions } from '../../variable';
+import { FieldsSelect } from '../../components/FieldsSelect';
+
+export default {
+  title: `{{t("Schedule event", { ns: "${NAMESPACE}" })}}`,
+  type: 'schedule',
+  fieldset: {
+    config: {
+      type: 'void',
+      'x-component': 'ScheduleConfig',
+      'x-component-props': {},
+    },
+  },
+  scope: {
+    useCollectionDataSource,
+  },
+  components: {
+    ScheduleConfig,
+  },
+  useVariables(config, opts) {
+    const compile = useCompile();
+    const { getCollectionFields } = useCollectionManager();
+    const { fieldNames = defaultFieldNames } = opts;
+    const options: any[] = [];
+    if (!opts?.types || opts.types.includes('date')) {
+      options.push({ key: 'date', value: 'date', label: lang('Trigger time') });
+    }
+
+    // const depth = config.appends?.length
+    //   ? config.appends.reduce((max, item) => Math.max(max, item.split('.').length), 1) + 1
+    //   : 1;
+
+    if (config.mode === SCHEDULE_MODE.COLLECTION_FIELD) {
+      const [fieldOption] = getCollectionFieldOptions({
+        // depth,
+        ...opts,
+        fields: [
+          {
+            collectionName: config.collection,
+            name: 'data',
+            type: 'hasOne',
+            target: config.collection,
+            uiSchema: {
+              title: lang('Trigger data'),
+            },
+          }
+        ],
+        appends: ['data', ...(config.appends?.map((item) => `data.${item}`) || [])],
+        compile,
+        getCollectionFields,
+      });
+      if (fieldOption) {
+        options.push(fieldOption);
+      }
+    }
+    return options;
+  },
+  useInitializers(config): SchemaInitializerItemOptions | null {
+    if (!config.collection) {
+      return null;
+    }
+
+    return {
+      type: 'item',
+      title: `{{t("Trigger data", { ns: "${NAMESPACE}" })}}`,
+      component: CollectionBlockInitializer,
+      collection: config.collection,
+      dataSource: '{{$context.data}}',
+    };
+  },
+  initializers: {},
+};

package/src/client/triggers/schedule/locale/Cron.zh-CN.ts

@@ -0,0 +1,79 @@
+export default {
+  everyText: '每',
+  emptyMonths: '每月',
+  emptyMonthDays: '每日(月)',
+  emptyMonthDaysShort: '每日',
+  emptyWeekDays: '每天(周)',
+  emptyWeekDaysShort: '每天(周)',
+  emptyHours: '每小时',
+  emptyMinutes: '每分钟',
+  emptyMinutesForHourPeriod: '每',
+  yearOption: '年',
+  monthOption: '月',
+  weekOption: '周',
+  dayOption: '天',
+  hourOption: '小时',
+  minuteOption: '分钟',
+  rebootOption: '重启',
+  prefixPeriod: '每',
+  prefixMonths: '的',
+  prefixMonthDays: '的',
+  prefixWeekDays: '的',
+  prefixWeekDaysForMonthAndYearPeriod: '并且',
+  prefixHours: '的',
+  prefixMinutes: ':',
+  prefixMinutesForHourPeriod: '的',
+  suffixMinutesForHourPeriod: '分钟',
+  errorInvalidCron: '不符合 cron 规则的表达式',
+  clearButtonText: '清空',
+  weekDays: [
+    // Order is important, the index will be used as value
+    '周日', // Sunday must always be first, it's "0"
+    '周一',
+    '周二',
+    '周三',
+    '周四',
+    '周五',
+    '周六',
+  ],
+  months: [
+    // Order is important, the index will be used as value
+    '一月',
+    '二月',
+    '三月',
+    '四月',
+    '五月',
+    '六月',
+    '七月',
+    '八月',
+    '九月',
+    '十月',
+    '十一月',
+    '十二月',
+  ],
+  altWeekDays: [
+    // Order is important, the index will be used as value
+    '周日', // Sunday must always be first, it's "0"
+    '周一',
+    '周二',
+    '周三',
+    '周四',
+    '周五',
+    '周六',
+  ],
+  altMonths: [
+    // Order is important, the index will be used as value
+    '一月',
+    '二月',
+    '三月',
+    '四月',
+    '五月',
+    '六月',
+    '七月',
+    '八月',
+    '九月',
+    '十月',
+    '十一月',
+    '十二月',
+  ],
+};

package/src/client/utils.ts

@@ -0,0 +1,36 @@
+export function linkNodes(nodes): void {
+  const nodesMap = new Map();
+  nodes.forEach((item) => nodesMap.set(item.id, item));
+  for (const node of nodesMap.values()) {
+    if (node.upstreamId) {
+      node.upstream = nodesMap.get(node.upstreamId);
+    }
+
+    if (node.downstreamId) {
+      node.downstream = nodesMap.get(node.downstreamId);
+    }
+  }
+}
+
+export function isValidFilter(condition) {
+  const group = condition.$and || condition.$or;
+  if (!group) {
+    return false;
+  }
+
+  return group.some((item) => {
+    if (item.$and || item.$or) {
+      return isValidFilter(item);
+    }
+    const [name] = Object.keys(item);
+    if (!name || !item[name]) {
+      return false;
+    }
+    const [op] = Object.keys(item[name]);
+    if (!op || typeof item[name][op] === 'undefined') {
+      return false;
+    }
+
+    return true;
+  });
+}