amis 1.4.2-beta.6 → 1.5.0

package/src/utils/api.ts

@@ -1,6 +1,7 @@
-import {Api, ApiObject, fetcherResult, Payload} from '../types';
+import omit from 'lodash/omit';
+import {Api, ApiObject, EventTrack, fetcherResult, Payload} from '../types';
 import {fetcherConfig} from '../factory';
-import {tokenize, dataMapping} from './tpl-builtin';
+import {tokenize, dataMapping, escapeHtml} from './tpl-builtin';
 import {evalExpression} from './tpl';
 import {
   isObject,
@@ -10,11 +11,12 @@ import {
   qsstringify,
   cloneObject,
   createObject,
-  qsparse
+  qsparse,
+  uuid
 } from './helper';
 import isPlainObject from 'lodash/isPlainObject';
 
-const rSchema = /(?:^|raw\:)(get|post|put|delete|patch|options|head):/i;
+const rSchema = /(?:^|raw\:)(get|post|put|delete|patch|options|head|jsonp):/i;
 
 interface ApiCacheConfig extends ApiObject {
   cachedPromise: Promise<any>;
@@ -62,6 +64,23 @@ export function buildApi(
   };
   api.method = (api.method || (options as any).method || 'get').toLowerCase();
 
+  if (api.headers) {
+    api.headers = dataMapping(api.headers, data, undefined, false);
+  }
+
+  if (api.requestAdaptor && typeof api.requestAdaptor === 'string') {
+    api.requestAdaptor = str2function(api.requestAdaptor, 'api') as any;
+  }
+
+  if (api.adaptor && typeof api.adaptor === 'string') {
+    api.adaptor = str2function(
+      api.adaptor,
+      'payload',
+      'response',
+      'api'
+    ) as any;
+  }
+
   if (!data) {
     return api;
   } else if (
@@ -107,7 +126,7 @@ export function buildApi(
   }
 
   // get 类请求，把 data 附带到 url 上。
-  if (api.method === 'get') {
+  if (api.method === 'get' || api.method === 'jsonp') {
     if (!~raw.indexOf('$') && !api.data && autoAppend) {
       api.query = api.data = data;
     } else if (
@@ -145,23 +164,6 @@ export function buildApi(
     }
   }
 
-  if (api.headers) {
-    api.headers = dataMapping(api.headers, data, undefined, false);
-  }
-
-  if (api.requestAdaptor && typeof api.requestAdaptor === 'string') {
-    api.requestAdaptor = str2function(api.requestAdaptor, 'api') as any;
-  }
-
-  if (api.adaptor && typeof api.adaptor === 'string') {
-    api.adaptor = str2function(
-      api.adaptor,
-      'payload',
-      'response',
-      'api'
-    ) as any;
-  }
-
   return api;
 }
 
@@ -194,11 +196,26 @@ export function str2AsyncFunction(
 }
 
 export function responseAdaptor(ret: fetcherResult, api: ApiObject) {
-  const data = ret.data;
+  let data = ret.data;
   let hasStatusField = true;
 
   if (!data) {
-    throw new Error('Response is empty!');
+    throw new Error('Response is empty');
+  }
+
+  if (typeof data === 'string') {
+    try {
+      data = JSON.parse(data);
+      if (typeof data === 'undefined') {
+        throw new Error('Response should be JSON');
+      }
+    } catch (e) {
+      const responseBrief =
+        typeof data === 'string'
+          ? escapeHtml((data as string).substring(0, 100))
+          : '';
+      throw new Error(`Response should be JSON\n ${responseBrief}`);
+    }
   }
 
   // 兼容几种常见写法
@@ -246,7 +263,7 @@ export function responseAdaptor(ret: fetcherResult, api: ApiObject) {
   }
 
   if (payload.ok && api.responseData) {
-    payload.data = dataMapping(
+    const responseData = dataMapping(
       api.responseData,
 
       createObject(
@@ -260,13 +277,16 @@ export function responseAdaptor(ret: fetcherResult, api: ApiObject) {
       undefined,
       api.convertKeyToPath
     );
+    console.debug('responseData', responseData);
+    payload.data = responseData;
   }
 
   return payload;
 }
 
 export function wrapFetcher(
-  fn: (config: fetcherConfig) => Promise<fetcherResult>
+  fn: (config: fetcherConfig) => Promise<fetcherResult>,
+  tracker?: (eventTrack: EventTrack, data: any) => void
 ): (api: Api, data: object, options?: object) => Promise<Payload | void> {
   return function (api, data, options) {
     api = buildApi(api, data, options) as ApiObject;
@@ -296,6 +316,15 @@ export function wrapFetcher(
       api.headers['Content-Type'] = 'application/json';
     }
 
+    tracker?.(
+      {eventType: 'api', eventData: omit(api, ['config', 'data', 'body'])},
+      api.data
+    );
+
+    if (api.method?.toLocaleLowerCase() === 'jsonp') {
+      return wrapAdaptor(jsonpFetcher(api), api);
+    }
+
     if (typeof api.cache === 'number' && api.cache > 0) {
       const apiCache = getApiCache(api);
       return wrapAdaptor(
@@ -338,6 +367,71 @@ export function wrapAdaptor(promise: Promise<fetcherResult>, api: ApiObject) {
     : promise.then(ret => responseAdaptor(ret, api));
 }
 
+export function jsonpFetcher(api: ApiObject): Promise<fetcherResult> {
+  return new Promise((resolve, reject) => {
+    let script: HTMLScriptElement | null = document.createElement('script');
+    let src = api.url;
+
+    script.async = true;
+
+    function remove() {
+      if (script) {
+        // @ts-ignore
+        script.onload = script.onreadystatechange = script.onerror = null;
+
+        if (script.parentNode) {
+          script.parentNode.removeChild(script);
+        }
+
+        script = null;
+      }
+    }
+
+    const jsonp = api.query?.callback || 'axiosJsonpCallback' + uuid();
+    const old = (window as any)[jsonp];
+
+    (window as any)[jsonp] = function (responseData: any) {
+      (window as any)[jsonp] = old;
+
+      const response = {
+        data: responseData,
+        status: 200,
+        headers: {}
+      };
+
+      resolve(response);
+    };
+
+    const additionalParams: any = {
+      _: new Date().getTime(),
+      _callback: jsonp
+    };
+
+    src += (src.indexOf('?') >= 0 ? '&' : '?') + qsstringify(additionalParams);
+
+    // @ts-ignore IE 为script.onreadystatechange
+    script.onload = script.onreadystatechange = function () {
+      // @ts-ignore
+      if (!script.readyState || /loaded|complete/.test(script.readyState)) {
+        remove();
+      }
+    };
+
+    script.onerror = function () {
+      remove();
+      const errResponse = {
+        status: 0,
+        headers: {}
+      };
+
+      reject(errResponse);
+    };
+
+    script.src = src;
+    document.head.appendChild(script);
+  });
+}
+
 export function isApiOutdated(
   prevApi: Api | undefined,
   nextApi: Api | undefined,

package/src/utils/dom.tsx

@@ -267,3 +267,15 @@ export function calculatePosition(
     activePlacement
   };
 }
+
+/**
+ * 专门用来获取样式的像素值，默认返回 0
+ */
+export function getStyleNumber(element: HTMLElement, styleName: string) {
+  if (!element) {
+    return 0;
+  }
+  return (
+    parseInt(getComputedStyle(element).getPropertyValue(styleName), 10) || 0
+  );
+}

package/src/utils/helper.ts

@@ -10,55 +10,43 @@ import {IIRendererStore} from '../store';
 import {IFormStore} from '../store/form';
 import {autobindMethod} from './autobind';
 import {
+  createObject,
+  cloneObject,
+  isObject,
+  string2regExp,
+  getVariable,
+  setVariable,
+  deleteVariable,
+  keyToPath,
   isPureVariable,
   resolveVariable,
   resolveVariableAndFilter
-} from './tpl-builtin';
+} from 'amis-formula';
 import {isObservable} from 'mobx';
 
-// 方便取值的时候能够把上层的取到，但是获取的时候不会全部把所有的数据获取到。
-export function createObject(
-  superProps?: {[propName: string]: any},
-  props?: {[propName: string]: any},
-  properties?: any
-): object {
-  if (superProps && Object.isFrozen(superProps)) {
-    superProps = cloneObject(superProps);
-  }
-
-  const obj = superProps
-    ? Object.create(superProps, {
-        ...properties,
-        __super: {
-          value: superProps,
-          writable: false,
-          enumerable: false
-        }
-      })
-    : Object.create(Object.prototype, properties);
+export {
+  createObject,
+  cloneObject,
+  isObject,
+  string2regExp,
+  getVariable,
+  setVariable,
+  deleteVariable,
+  keyToPath
+};
 
-  props &&
-    isObject(props) &&
-    Object.keys(props).forEach(key => (obj[key] = props[key]));
+export function preventDefault(event: TouchEvent | Event): void {
+  if (typeof event.cancelable !== 'boolean' || event.cancelable) {
+    event.preventDefault();
+  }
+}
 
-  return obj;
+export function isMobile() {
+  return (window as any).matchMedia?.('(max-width: 768px)').matches;
 }
 
-export function cloneObject(target: any, persistOwnProps: boolean = true) {
-  const obj =
-    target && target.__super
-      ? Object.create(target.__super, {
-          __super: {
-            value: target.__super,
-            writable: false,
-            enumerable: false
-          }
-        })
-      : Object.create(Object.prototype);
-  persistOwnProps &&
-    target &&
-    Object.keys(target).forEach(key => (obj[key] = target[key]));
-  return obj;
+export function range(num: number, min: number, max: number): number {
+  return Math.min(Math.max(num, min), max);
 }
 
 /**
@@ -156,96 +144,6 @@ export function findIndex(
   return -1;
 }
 
-export function getVariable(
-  data: {[propName: string]: any},
-  key: string | undefined,
-  canAccessSuper: boolean = true
-): any {
-  if (!data || !key) {
-    return undefined;
-  } else if (canAccessSuper ? key in data : data.hasOwnProperty(key)) {
-    return data[key];
-  }
-
-  return keyToPath(key).reduce(
-    (obj, key) =>
-      obj &&
-      typeof obj === 'object' &&
-      (canAccessSuper ? key in obj : obj.hasOwnProperty(key))
-        ? obj[key]
-        : undefined,
-    data
-  );
-}
-
-export function setVariable(
-  data: {[propName: string]: any},
-  key: string,
-  value: any,
-  convertKeyToPath?: boolean
-) {
-  data = data || {};
-
-  if (key in data) {
-    data[key] = value;
-    return;
-  }
-
-  const parts = convertKeyToPath !== false ? keyToPath(key) : [key];
-  const last = parts.pop() as string;
-
-  while (parts.length) {
-    let key = parts.shift() as string;
-    if (isPlainObject(data[key])) {
-      data = data[key] = {
-        ...data[key]
-      };
-    } else if (Array.isArray(data[key])) {
-      data[key] = data[key].concat();
-      data = data[key];
-    } else if (data[key]) {
-      // throw new Error(`目标路径不是纯对象，不能覆盖`);
-      // 强行转成对象
-      data[key] = {};
-      data = data[key];
-    } else {
-      data[key] = {};
-      data = data[key];
-    }
-  }
-
-  data[last] = value;
-}
-
-export function deleteVariable(data: {[propName: string]: any}, key: string) {
-  if (!data) {
-    return;
-  } else if (data.hasOwnProperty(key)) {
-    delete data[key];
-    return;
-  }
-
-  const parts = keyToPath(key);
-  const last = parts.pop() as string;
-
-  while (parts.length) {
-    let key = parts.shift() as string;
-    if (isPlainObject(data[key])) {
-      data = data[key] = {
-        ...data[key]
-      };
-    } else if (data[key]) {
-      throw new Error(`目标路径不是纯对象，不能修改`);
-    } else {
-      break;
-    }
-  }
-
-  if (data && data.hasOwnProperty && data.hasOwnProperty(last)) {
-    delete data[last];
-  }
-}
-
 export function hasOwnProperty(
   data: {[propName: string]: any},
   key: string
@@ -676,18 +574,6 @@ export function __uri(id: string) {
   return id;
 }
 
-export function isObject(obj: any) {
-  const typename = typeof obj;
-  return (
-    obj &&
-    typename !== 'string' &&
-    typename !== 'number' &&
-    typename !== 'boolean' &&
-    typename !== 'function' &&
-    !Array.isArray(obj)
-  );
-}
-
 // xs < 768px
 // sm >= 768px
 // md >= 992px
@@ -1240,17 +1126,6 @@ export function getLevelFromClassName(
   return defaultValue;
 }
 
-export function string2regExp(value: string, caseSensitive = false) {
-  if (typeof value !== 'string') {
-    throw new TypeError('Expected a string');
-  }
-
-  return new RegExp(
-    value.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&').replace(/-/g, '\\x2d'),
-    !caseSensitive ? 'i' : ''
-  );
-}
-
 export function pickEventsProps(props: any) {
   const ret: any = {};
   props &&
@@ -1452,38 +1327,6 @@ export function loadScript(src: string) {
 
 export class SkipOperation extends Error {}
 
-/**
- * 将例如像 a.b.c 或 a[1].b 的字符串转换为路径数组
- *
- * @param string 要转换的字符串
- */
-export const keyToPath = (string: string) => {
-  const result = [];
-
-  if (string.charCodeAt(0) === '.'.charCodeAt(0)) {
-    result.push('');
-  }
-
-  string.replace(
-    new RegExp(
-      '[^.[\\]]+|\\[(?:([^"\'][^[]*)|(["\'])((?:(?!\\2)[^\\\\]|\\\\.)*?)\\2)\\]|(?=(?:\\.|\\[\\])(?:\\.|\\[\\]|$))',
-      'g'
-    ),
-    (match, expression, quote, subString) => {
-      let key = match;
-      if (quote) {
-        key = subString.replace(/\\(\\)?/g, '$1');
-      } else if (expression) {
-        key = expression.trim();
-      }
-      result.push(key);
-      return '';
-    }
-  );
-
-  return result;
-};
-
 /**
  * 检查对象是否有循环引用，来自 https://stackoverflow.com/a/34909127
  * @param obj
@@ -1698,3 +1541,30 @@ export function isClickOnInput(e: React.MouseEvent<HTMLElement>) {
   }
   return false;
 }
+
+// 计算字符串 hash
+export function hashCode(s: string): number {
+  return s.split('').reduce((a, b) => {
+    a = (a << 5) - a + b.charCodeAt(0);
+    return a & a;
+  }, 0);
+}
+
+/**
+ * 遍历 schema
+ * @param json
+ * @param mapper
+ */
+export function JSONTraverse(
+  json: any,
+  mapper: (value: any, key: string | number, host: Object) => any
+) {
+  Object.keys(json).forEach(key => {
+    const value: any = json[key];
+    if (isPlainObject(value) || Array.isArray(value)) {
+      JSONTraverse(value, mapper);
+    } else {
+      mapper(value, key, json);
+    }
+  });
+}