@cloudbase/lowcode-builder 1.7.1 → 1.8.1

package/template/mp/common/event-emitter.ts

@@ -0,0 +1,117 @@
+function checkFunc(listener) {
+  if (!listener instanceof Function) {
+    throw new Error(' The listener argument must be of type Function. ');
+  }
+}
+
+export default class EventEmitter {
+  constructor() {
+    this.listeners = {};
+  }
+
+  on(eventName, listener) {
+    checkFunc(listener);
+    let listeners = this.listeners[eventName];
+    if (!listeners) {
+      this.listeners[eventName] = [listener];
+    } else {
+      listeners.push(listener);
+    }
+  }
+
+  off(eventName, listener) {
+    let listeners = this.listeners[eventName];
+    if (listeners && listeners.length) {
+      const index = listeners.indexOf(listener);
+      index > -1 && listeners.splice(index, 1);
+    }
+  }
+
+  emit(eventName, ...args) {
+    let listeners = this.listeners[eventName] || [];
+    listeners.forEach((fn) => {
+      try {
+        fn.call(this, ...args);
+      } catch (err) {
+        console.error(err);
+      }
+    });
+  }
+
+  clear() {
+    this.listeners = {};
+  }
+}
+
+export class Event {
+  type: string;
+  detail: any;
+  /**
+   * 类别应当为 typeof UserWidget
+   * 当前类别为 typeof $page.widgets.xxxx
+   * 添加上报确定用量
+   */
+  currentTarget: any /* typeof UserWidget */;
+  target?: any /* typeof UserWidget */;
+  /**
+   * 内部实现
+   * 外部不应该进行访问
+   */
+  _isCapturePhase: boolean;
+  origin: Event;
+  constructor({
+    type = '',
+    detail = undefined,
+    currentTarget = undefined,
+    target = undefined,
+    _isCapturePhase = false,
+    origin,
+  }: {
+    type: string;
+    currentTarget: any;
+    target?: any;
+    detail?: any;
+    _isCapturePhase?: boolean;
+    origin?: Event;
+  }) {
+    function proxyWrapper(target, key) {
+      try {
+        return new Proxy(target, {
+          get(target, p) {
+            if (p !== 'id') {
+              // reportEvent(`event.${key}.${String(p)}`);
+            }
+            return target[p];
+          },
+        });
+      } catch (e) {
+        return target;
+      }
+    }
+    this.type = type;
+    this.detail = detail;
+    this.currentTarget = proxyWrapper(currentTarget, 'currentTarget');
+    this.target = proxyWrapper(target, 'target');
+    this.origin = proxyWrapper(origin, 'origin');
+
+    this._isCapturePhase = _isCapturePhase;
+    return new Proxy(this, {
+      get(target, prop) {
+        switch (prop) {
+          case 'name': {
+            console.warn('[deprecated] event.name 将在未来版本放弃支持，请使用 event.type 替代');
+            return target.type;
+          }
+          case 'origin':
+          case 'target':
+          case 'currentTarget': {
+            return target[prop];
+            break;
+          }
+        }
+
+        return target[prop];
+      },
+    });
+  }
+}

package/template/mp/common/flow.ts

@@ -0,0 +1,102 @@
+import { createEventHandlers, getMpEventHandlerName } from './util';
+import { Event } from './event-emitter';
+type IGenerateContext = any;
+
+export interface IEventFlowContext extends IGenerateContext {
+  $page?: any;
+  $app?: any;
+  target?: any; // widget
+}
+
+interface IMPEventFlowGenerateOptions {
+  looseError?: boolean;
+  isComposite?: boolean;
+}
+
+export class EventFlow {
+  id: string;
+  description: string;
+  private _eventHandlerMap: Record<string, Function> = {};
+  private _context: IEventFlowContext;
+
+  constructor({
+    schema,
+    context,
+    options,
+  }: {
+    schema: {
+      id?: string;
+      description?: string;
+      /**
+       * 预处理后 event handler listeners
+       */
+      eventHandlers?: Record<string, any>;
+    };
+    context: IEventFlowContext;
+    options?: IMPEventFlowGenerateOptions;
+  }) {
+    this._context = context;
+    const { id, description, eventHandlers = {} } = schema || {};
+    this.id = id || '';
+    this.description = description || '';
+
+    this._eventHandlerMap = Object.entries(createEventHandlers(eventHandlers, {
+      looseError: true,
+      isComposite: options?.isComposite || false,
+      syncCall: true
+    })).reduce(
+      (map, [key, fn]) => {
+        map[key] = fn;
+        return map;
+      },
+      {
+        _getInstance: () => this._context.$page || this._context.$app,
+      },
+    );
+
+    return this;
+  }
+
+  trigger(additionalScope, options: Partial<IEventFlowContext> = {}) {
+    const mergedContext = {
+      ...this._context,
+      ...options,
+    };
+    const { target } = mergedContext;
+    const eventName = `${this.id}.start`;
+    return this._eventHandlerMap[getMpEventHandlerName(this.id, eventName)](
+      new Event({
+        type: eventName,
+        detail: additionalScope,
+        target,
+        currentTarget: target,
+      }),
+    );
+    // const emit = (trigger, eventData, originalEvent?) =>
+    //   generateEmit($w, target)(
+    //     trigger,
+    //     this._listenerInstances,
+    //     eventData,
+    //     forContext,
+    //     originalEvent,
+    //     scopeContext,
+    //     dataContext,
+    //     $w.page.id,
+    //     true,
+    //   );
+    // return emit(`${this.id}.start`, additionalScope);
+  }
+}
+
+export function generateEventFlows(
+  flows: { id: string }[] = [],
+  context: IEventFlowContext,
+  options?: IMPEventFlowGenerateOptions,
+) {
+  const result = {};
+
+  for (let flow of flows) {
+    result[flow.id] = new EventFlow({ schema: flow, context, options });
+  }
+  return result;
+}

package/template/mp/common/query.ts

@@ -0,0 +1,239 @@
+import { observable, IReactionDisposer, autorun, toJS } from 'mobx';
+import { createEventHandlers, getMpEventHandlerName, mergeDynamic2StaticData } from './util';
+import { Event } from './event-emitter';
+
+interface IMPDataSourceQuery {
+  id: string;
+  label?: string;
+  description?: string;
+  trigger: 'auto' | 'manual';
+  type: 'model' | 'apis' | 'sql';
+  dataSourceName: string;
+  methodName: string;
+  data: object;
+  dataBinds: Record<string, Function>;
+  /**
+   * 预处理后 event handler listeners
+   */
+  eventHandlers?: Record<string, any>;
+}
+interface IQueryContext {
+  $w: any,
+  $app?: any,
+  $page?: any
+};
+type IDataBind = any;
+interface IGenerateOptions {
+  looseError: boolean
+};
+
+export class Query {
+  private _schema: IMPDataSourceQuery;
+  private _context: IQueryContext;
+  private _disposes: IReactionDisposer[] = [];
+  private _dataBinds: Record<string, IDataBind> = {};
+  private _triggered = false;
+  private _action: any;
+  private _paramsRef: { current: any } = observable({ current: null });
+  private _currentRequestKey: any = null;
+  private _observableValue: { data: any; error: Error | null } = observable({ data: null, error: null });
+  private _eventHandlerMap: Record<string, Function> = {};
+  private _timer: any;
+
+  constructor({
+    schema,
+    context,
+    options = {},
+  }: {
+    schema: IMPDataSourceQuery;
+    context: IQueryContext;
+    options?: IGenerateOptions;
+  }) {
+    const { looseError = false } = options;
+    const { $w } = context;
+    this._schema = schema;
+    this._context = context;
+
+    if (this._schema?.trigger === 'auto') {
+      this._disposes.push(
+        autorun(
+          (r) => {
+            try {
+              const data = this._resolveParams();
+              if (this._triggered) {
+                this._debounceTrigger(data);
+              }
+            } catch (e) {
+              console.error(e);
+            }
+          },
+          { delay: 50 },
+        ),
+      );
+    }
+
+    const baseParam: {
+      dataSourceName: string;
+      sqlTemplateId?: string;
+      methodName?: string;
+    } = {
+      dataSourceName: this._schema.dataSourceName,
+    };
+
+    if (this._schema?.type === 'sql') {
+      baseParam.sqlTemplateId = this._schema.methodName;
+    } else {
+      baseParam.methodName = this._schema.methodName;
+    }
+
+    this._paramsRef.current = this._schema.data;
+    this._dataBinds = this._schema.dataBinds;
+
+    this._action = async (data) => {
+      return $w.cloud.callDataSource({
+        ...baseParam,
+        params: data,
+      });
+    };
+
+    this._eventHandlerMap = Object.entries(
+      createEventHandlers(this._schema.eventHandlers || {}, {
+        looseError: looseError,
+        isComposite: false,
+      }),
+    ).reduce(
+      (map, [key, fn]: [string, any]) => {
+        // map[key] = fn.bind(this);
+        map[key] = fn;
+        return map;
+      },
+      {
+        _getInstance: () => this._context.$page || this._context.$app,
+      },
+    );
+
+    // this._emit = async (trigger, eventData, originalEvent?) =>
+    //   generateEmit($w)(
+    //     trigger,
+    //     generateListnerInstances(
+    //       {
+    //         $app,
+    //         $page,
+    //         actionsMap: (this._context as any).actionsMap,
+    //       },
+    //       this._schema.listeners || [],
+    //     ),
+    //     eventData,
+    //     {},
+    //     originalEvent,
+    //     {},
+    //     {},
+    //     $w.page.id,
+    //     true,
+    //   );
+
+    return this;
+  }
+
+  get id(): string {
+    return this._schema?.id || '';
+  }
+
+  get label(): string {
+    return this._schema?.label || '';
+  }
+
+  get description(): string {
+    return this._schema?.description || '';
+  }
+
+  get data() {
+    return this._observableValue.data;
+  }
+
+  get error() {
+    return this._observableValue.error;
+  }
+
+  async trigger(additionalScope?, options = {}) {
+    this._triggered = true;
+    return this._innerTrigger(this._resolveParams(), additionalScope, options);
+  }
+
+  reset() {
+    this._observableValue.data = null;
+    this._observableValue.error = null;
+  }
+
+  async _innerTrigger(data, additionalScope?, options = {}) {
+    this._currentRequestKey = Date.now();
+    const key = this._currentRequestKey;
+    try {
+      const res = await this._action(data);
+      if (key === this._currentRequestKey) {
+        this._observableValue.data = res;
+        this._observableValue.error = null;
+        this._emit(`success`, res);
+      }
+      return res;
+    } catch (e) {
+      if (key === this._currentRequestKey) {
+        this._observableValue.data = null;
+        this._observableValue.error = e as any;
+        this._emit(`fail`, e);
+      }
+      throw e;
+    }
+  }
+
+  private _debounceTrigger(...args) {
+    if (this._timer) {
+      clearTimeout(this._timer);
+    }
+    this._timer = setTimeout(() => {
+      this._innerTrigger(...args);
+    }, 300);
+  }
+
+  destroy() {
+    this._disposes.forEach((dispose) => dispose());
+  }
+
+  private _resolveParams() {
+    /**
+     * 这里万一其中某个字段计算失败
+     * 好像会阻塞其他字段的计算
+     * 从而导致 autorun 没有添加依赖
+     */
+    return mergeDynamic2StaticData(toJS(this._paramsRef.current), this._dataBinds, {
+      codeContext: {
+        /**
+         * $page 或 $comp 实例
+         */
+        instance: this._context.$page,
+      },
+      $w: this._context.$w,
+      // may be additional scope
+    })?.params;
+  }
+
+  private async _emit(eventName: string, data?: any) {
+    return this._eventHandlerMap[getMpEventHandlerName(this.id, eventName)]?.(
+      new Event({
+        type: eventName,
+        detail: data,
+        target: undefined,
+        currentTarget: undefined,
+      }),
+    );
+  }
+}
+
+export function generateDatasetQuery(schema, context: IQueryContext, options: IGenerateOptions) {
+  const result = {};
+
+  for (const key in schema) {
+    result[key] = new Query({ schema: schema[key], context, options });
+  }
+  return result;
+}

package/template/mp/common/util.js

@@ -4,6 +4,9 @@ import { generateForContextOfWidget, generateWidgetAPIContext, getWidget } from
 import { observable, untracked } from 'mobx';
 import { getAccessToken, loginScope } from '../datasources/index';
 import { app } from '../app/weapps-api';
+export { generateDatasetQuery } from './query';
+export { generateEventFlows } from './flow';
+import { Event } from './event-emitter';
 
 /**
  * Convert abcWordSnd -> abc-word-snd
@@ -55,9 +58,10 @@ export function createEventHandlers(
   options = {
     looseError: false,
     isComposite: false,
+    syncCall: false,
   },
 ) {
-  const { looseError = false, isComposite = false } = options;
+  const { looseError = false, isComposite = false, syncCall = false } = options;
   const evtHandlers = {};
   for (const name in evtListeners) {
     const listeners = evtListeners[name];
@@ -71,7 +75,6 @@ export function createEventHandlers(
       const [prefix = '', trigger] = name.split('$');
       // The page event handler
       const forContext = (!!currentTarget && generateForContextOfWidget(currentTarget)) || {};
-      const { lists = [], forItems = {} } = forContext;
       const dataContext = untracked(() => generateDataContext(currentTarget));
       const $w = untracked(() => generateWidgetAPIContext(owner?.__internal__?.$w, currentTarget, forContext));
 
@@ -84,7 +87,13 @@ export function createEventHandlers(
         }
         const { id, __internal__ } = currentPageContext || {};
         if (pageId && id) {
-          if (pageId !== id || (__internal__ && !__internal__.active)) {
+          /**
+           * TODO:
+           * IOS 设备跳转扫码成功回到当前页调度存在时序问题
+           * 成功响应时当前页非 active 状态
+           * 取消判断待兼容
+           */
+          if (pageId !== id /* || (__internal__ && !__internal__.active)*/) {
             console.error(`Action error: [${name}] 页面生命周期结束，链式调用中断`);
             return false;
           }
@@ -92,7 +101,7 @@ export function createEventHandlers(
         return true;
       }
 
-      listeners.forEach(async (l) => {
+      async function processListener(l) {
         /**
          * 调用前置校验
          * 是否仍可调用方法
@@ -115,10 +124,16 @@ export function createEventHandlers(
         const isIfAction = l.sourceKey === 'platform:utils.If';
         const isShowModalAction = l.sourceKey === 'platform:showModal';
         try {
-          for (const k in boundData) {
-            set(data, k, boundData[k].call(owner, owner, lists, forItems, event, dataContext, $w));
-          }
-          let res = await l.handler.call(owner, { event, data });
+          const resolvedData = mergeDynamic2StaticData(data, boundData, {
+            $w,
+            forContext,
+            codeContext: {
+              instance: owner,
+              event,
+            },
+            dataContext,
+          });
+          let res = await l.handler.call(owner, { event, data: resolvedData });
           nextEventHandles[0].handlerName =
             prefix && l.key ? `${prefix}$${l.key}${!isIfAction || res ? '_success' : '_fail'}` : '';
           nextEventHandles[0].event.detail = isIfAction ? event.detail : res;
@@ -164,17 +179,41 @@ export function createEventHandlers(
             }
             throw error;
           } else {
-            await Promise.all(
-              nextEventHandles.map(async (nextHandler) => {
-                if (self[nextHandler.handlerName]) {
+            const res = await Promise.all(
+              nextEventHandles
+                .filter((nextHandler) => self[nextHandler.handlerName])
+                .map(async (nextHandler) => {
                   return self[nextHandler.handlerName](nextHandler.event);
-                }
-                return null;
-              }),
+                }),
             );
+            return res.length ? res[res.length - 1] : nextEventHandles[nextEventHandles.length - 1]?.event?.detail;
           }
         }
-      });
+      }
+
+      const promise = Promise.all(
+        listeners.map((l) => {
+          return processListener(l).then(
+            (res) => ({ data: res, error: null }),
+            (error) => ({ data: null, error }),
+          );
+        }),
+      );
+
+      if (syncCall) {
+        return promise.then((listenerRes) => {
+          const res = [];
+          for (const item of listenerRes) {
+            if (item.error) {
+              throw item.error;
+            } else {
+              res.push(item.data);
+            }
+          }
+          return res.length ? res[0] : event.detail;
+        });
+      }
+
     };
   }
 
@@ -417,6 +456,7 @@ export function formatErrorMsg(e) {
  * 检查页面权限
  **/
 export async function checkAuth(app, appId, $page) {
+  return true;
   const loginPage = findLoginPage(app);
   if (loginPage?.id === $page.id) {
     return true;
@@ -560,3 +600,45 @@ const isEmptyObj = (obj) => {
   }
   return true;
 };
+
+export function mergeDynamic2StaticData(
+  staticData,
+  dataBinds,
+  context /*: {
+    $w: any;
+    forContext?: {
+      lists: any[]
+      forItems: Record<string,any>
+    };
+    codeContext: {
+      instance: any
+      event?: Event;
+    };
+    dataContext?: Record<string,any>;
+  }*/,
+) {
+  const { forContext = {}, codeContext = {}, dataContext = {}, $w } = context;
+  const { lists = [], forItems = {} } = forContext;
+
+  const resolvedData = {
+    ...staticData,
+  };
+
+  for (const key in dataBinds) {
+    set(
+      resolvedData,
+      key,
+      dataBinds[key].call(
+        codeContext.instance,
+        codeContext.instance,
+        lists,
+        forItems,
+        codeContext.event,
+        dataContext,
+        $w,
+      ),
+    );
+  }
+
+  return resolvedData;
+}