@ibiz-template/core 0.0.1-alpha.5 → 0.0.1-beta.1

package/src/context/index.ts

@@ -1,36 +1,3 @@
-/* eslint-disable no-param-reassign */
-/* eslint-disable no-constructor-return */
-/* eslint-disable no-underscore-dangle */
-/* eslint-disable max-classes-per-file */
-/**
- * 上下文代理处理
- *
- * @author chitanda
- * @date 2022-07-14 10:07:45
- * @class IBizContextProxyHandle
- * @implements {ProxyHandler<IBizContext>}
- */
-export class IBizContextProxyHandle implements ProxyHandler<IBizContext> {
-  set(target: IBizContext, p: string | symbol, value: unknown): boolean {
-    target.context[p] = value;
-    return true;
-  }
-
-  get(target: IBizContext, p: string | symbol, _receiver: unknown): unknown {
-    if (target[p] !== undefined) {
-      return target[p];
-    }
-    if (target.context[p] !== undefined) {
-      return target.context[p];
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if ((target as any)._parent && (target as any)._parent[p] !== undefined) {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      return (target as any)._parent[p];
-    }
-  }
-}
-
 /**
  * 上下文处理类
  *
@@ -43,15 +10,7 @@ export class IBizContext implements IContext {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   [key: string | symbol]: any;
 
-  /**
-   * 父上下文
-   *
-   * @author chitanda
-   * @date 2022-07-14 10:07:06
-   * @protected
-   * @type {(IBizContext | null)}
-   */
-  protected _parent: IContext | null = null;
+  protected _context!: IContext;
 
   /**
    * Creates an instance of IBizContext.
@@ -61,33 +20,40 @@ export class IBizContext implements IContext {
    * @param {IContext} [context={}] 自身的上下文
    * @param {IBizContext} [parent]
    */
-  constructor(public context: IContext = {}, parent?: IContext) {
+  // eslint-disable-next-line default-param-last
+  constructor(context: IContext = {}, parent?: IBizContext) {
     if (parent) {
-      this._parent = parent;
+      // eslint-disable-next-line @typescript-eslint/no-this-alias
+      const self = this;
+      // 定义私有变量，用于存储父已有上下文，方便覆盖
+      Object.defineProperty(this, '_context', {
+        enumerable: false,
+        value: {},
+      });
+      // 监控父上下文参数，自身不存在时从父取
+      const properties: { [key: string]: PropertyDescriptor } = {};
+      const keys = Object.keys(parent);
+      keys.forEach(key => {
+        properties[key] = {
+          enumerable: true,
+          set(val: unknown) {
+            if (val == null) {
+              self._context[key] = null;
+            } else {
+              self._context[key] = val;
+            }
+          },
+          get() {
+            if (self._context[key] !== undefined) {
+              return self._context[key];
+            }
+            return parent[key];
+          },
+        };
+      });
+      Object.defineProperties(this, properties);
     }
-    return this.createProxy();
-  }
-
-  /**
-   * 创建代理
-   *
-   * @author chitanda
-   * @date 2022-07-14 11:07:37
-   * @protected
-   * @return {*}  {IBizContext}
-   */
-  protected createProxy(): IBizContext {
-    return new Proxy(this, new IBizContextProxyHandle());
-  }
-
-  /**
-   * 销毁上下文，避免内存泄漏
-   *
-   * @author chitanda
-   * @date 2022-07-14 11:07:45
-   */
-  destroy(): void {
-    this.context = {};
-    this._parent = null;
+    // 合并给入上下文
+    Object.assign(this, context);
   }
 }

package/src/environment/environment.ts

@@ -1,13 +1,22 @@
+import { LoginMode, MenuPermissionMode } from '../constant';
 import { IEnvironment } from '../interface';
 
 /**
  * 环境变量
  */
 export const Environment: IEnvironment = {
+  dev: false,
+  logLevel: 'ERROR',
+  jsCdn: 'https://cdn.jsdelivr.net',
   baseUrl: '',
+  pluginBaseUrl: './plugins',
   remoteModelUrl: '/remotemodel',
   assetsUrl: './assets',
   dcSystem: '',
-  ExportFile: '/ibizutil/download',
-  UploadFile: '/ibizutil/upload',
+  downloadFileUrl: '/ibizutil/download',
+  uploadFileUrl: '/ibizutil/upload',
+  casLoginUrl: '',
+  loginMode: LoginMode.DEFAULT,
+  menuPermissionMode: MenuPermissionMode.MIXIN,
+  enablePermission: true,
 };

package/src/error/http-error/http-error.ts

@@ -1,4 +1,5 @@
 import { AxiosError, AxiosResponse } from 'axios';
+import { HttpStatusMessageConst } from '../../constant';
 
 /**
  * 请求异常
@@ -27,6 +28,12 @@ export class HttpError implements Error {
       } else {
         this.message = res.statusText;
       }
+      if (!this.message) {
+        this.message = HttpStatusMessageConst[res.status];
+      }
+      if (!this.message) {
+        this.message = '网络异常，请稍后重试!';
+      }
       this.status = res.status;
     } else {
       this.message = err.message;

package/src/factory-center.ts

@@ -0,0 +1,9 @@
+/**
+ * 工厂类挂载中心，挂载各种解耦用创建工厂
+ *
+ * @author lxm
+ * @date 2022-10-17 15:10:04
+ * @export
+ * @class FactoryCenter
+ */
+export class FactoryCenter {}

package/src/ibizsys.ts

@@ -1,6 +1,6 @@
 import { Environment } from './environment/environment';
 import { OrgData } from './interface';
-import { Net } from './utils';
+import { Logger, Net } from './utils';
 
 /**
  * 全局对象
@@ -19,6 +19,14 @@ export class IBizSys {
    */
   env = Environment;
 
+  /**
+   * 日志对象
+   *
+   * @author chitanda
+   * @date 2022-10-25 20:10:22
+   */
+  log = Logger;
+
   /**
    * 网络请求工具类
    *

package/src/index.ts

@@ -1,10 +1,11 @@
 import './types';
 
 export * from './constant';
-export { IBizContext, IBizContextProxyHandle } from './context';
+export { IBizContext } from './context';
 export { Environment } from './environment/environment';
 export * from './error';
 export * from './interface';
 export * from './utils';
 export { IBizSys } from './ibizsys';
+export { FactoryCenter } from './factory-center';
 export { install } from './install';

package/src/install.ts

@@ -1,5 +1,6 @@
+import { FactoryCenter } from './factory-center';
 import { IBizSys } from './ibizsys';
-import { Interceptor } from './utils';
+import { CoreInterceptor } from './utils';
 
 /**
  * 初始化全局对象
@@ -13,5 +14,6 @@ export function install(): void {
     throw new Error('ibiz 已经存在, 无需重复安装');
   }
   window.ibiz = new IBizSys();
-  new Interceptor();
+  window.___fc = new FactoryCenter();
+  ibiz.net.addInterceptor('CoreInterceptor', new CoreInterceptor());
 }

package/src/interface/click-outside/click-outside.ts

@@ -0,0 +1,71 @@
+/**
+ * 可选配置参数
+ *
+ * @author lxm
+ * @date 2022-10-28 16:10:48
+ * @export
+ * @interface OnClickOutsideOptions
+ * @extends {ConfigurableWindow}
+ * @template E
+ */
+export interface OnClickOutsideOptions {
+  /**
+   * 指定使用的window,不给就用默认的window
+   * 一般是在iframe或测试环境中使用。
+   *
+   * @author lxm
+   * @date 2022-10-28 17:10:49
+   * @type {Window}
+   */
+  window?: Window;
+  /**
+   * 指定需要忽略的元素，用于排除某些外部的元素
+   *
+   * @author lxm
+   * @date 2022-10-28 17:10:50
+   * @type {HTMLElement[]}
+   */
+  ignore?: HTMLElement[];
+  /**
+   * 是否捕获内部元素。默认为是，内部元素不会触发回调。
+   * @default true
+   */
+  capture?: boolean;
+}
+
+/**
+ * 回调处理函数类型
+ */
+export type OnClickOutsideHandler = (_evt: PointerEvent | MouseEvent) => void;
+
+/**
+ * OnClickOutside返回对象类型
+ *
+ * @author lxm
+ * @date 2022-10-31 11:10:59
+ * @export
+ * @interface OnClickOutsideResult
+ */
+export interface OnClickOutsideResult {
+  /**
+   * 停止监听，并移除相关监听事件
+   *
+   * @author lxm
+   * @date 2022-10-31 11:10:28
+   */
+  stop: () => void;
+  /**
+   * 暂停监听
+   *
+   * @author lxm
+   * @date 2022-10-31 11:10:30
+   */
+  pause: () => void;
+  /**
+   * 继续监听
+   *
+   * @author lxm
+   * @date 2022-10-31 11:10:32
+   */
+  proceed: () => void;
+}

package/src/interface/i-environment/i-environment.ts

@@ -1,3 +1,6 @@
+import { LogLevelDesc } from 'loglevel';
+import { LoginMode, MenuPermissionMode } from '../../constant';
+
 /**
  * 配置参数
  *
@@ -16,6 +19,35 @@ export interface IEnvironment {
    */
   namespace?: string;
 
+  /**
+   * 是否为开发模式
+   *
+   * @default false
+   * @author chitanda
+   * @date 2022-10-21 11:10:29
+   * @type {boolean}
+   */
+  dev: boolean;
+
+  /**
+   * 日志级别
+   *
+   * @author chitanda
+   * @date 2022-10-25 20:10:55
+   * @type {LogLevelDesc}
+   */
+  logLevel: LogLevelDesc;
+
+  /**
+   * js 静态文件 cdn 地址
+   *
+   * @default https://cdn.jsdelivr.net/
+   * @author chitanda
+   * @date 2022-10-24 11:10:14
+   * @type {string}
+   */
+  jsCdn: string;
+
   /**
    * 请求根路径
    *
@@ -25,6 +57,33 @@ export interface IEnvironment {
    */
   baseUrl: string;
 
+  /**
+   * 插件默认所在目录
+   *
+   * @author chitanda
+   * @date 2022-10-31 14:10:49
+   * @type {string}
+   */
+  pluginBaseUrl: string;
+
+  /**
+   * 登录模式
+   *
+   * @author lxm
+   * @date 2022-10-12 14:10:51
+   * @type {LoginMode}
+   */
+  loginMode: LoginMode;
+
+  /**
+   * 中央认证登录地址
+   *
+   * @author lxm
+   * @date 2022-10-11 12:10:21
+   * @type {string}
+   */
+  casLoginUrl: string;
+
   /**
    * 远程模型路径
    *
@@ -53,20 +112,38 @@ export interface IEnvironment {
   dcSystem: string;
 
   /**
-   * 文件导出
+   * 文件下载url
    *
    * @author chitanda
    * @date 2022-08-22 23:08:46
    * @type {string}
    */
-  ExportFile: string;
+  downloadFileUrl: string;
 
   /**
-   * 文件上传
+   * 文件上传url
    *
    * @author chitanda
    * @date 2022-08-22 23:08:46
    * @type {string}
    */
-  UploadFile: string;
+  uploadFileUrl: string;
+
+  /**
+   * 是否启用权限校验（默认true）
+   *
+   * @author lxm
+   * @date 2022-10-12 18:10:25
+   * @type {boolean}
+   */
+  enablePermission: boolean;
+
+  /**
+   * 菜单权限校验模式（默认MIXIN）
+   *
+   * @author lxm
+   * @date 2022-10-12 18:10:27
+   * @type {MenuPermissionMode}
+   */
+  menuPermissionMode: MenuPermissionMode;
 }

package/src/interface/index.ts

@@ -1,2 +1,3 @@
 export { IEnvironment } from './i-environment/i-environment';
 export { OrgData } from './org-data/org-data';
+export * from './click-outside/click-outside';

package/src/types.ts

@@ -1,11 +1,21 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { FactoryCenter } from './factory-center';
 import { IBizSys } from './ibizsys';
 
 declare global {
   const ibiz: IBizSys;
+  const ___fc: FactoryCenter;
 
   interface Window {
     ibiz: IBizSys;
+    /**
+     * 全局工厂中心
+     *
+     * @author lxm
+     * @date 2022-10-17 15:10:43
+     * @type {FactoryCenter}
+     */
+    ___fc: FactoryCenter;
   }
 
   /**

package/src/utils/click-outside/click-outside.ts

@@ -0,0 +1,110 @@
+import { RuntimeError } from '../../error';
+import {
+  OnClickOutsideHandler,
+  OnClickOutsideOptions,
+  OnClickOutsideResult,
+} from '../../interface';
+import { eventPath, isEventInside, listenJSEvent } from '../event/event';
+
+const defaultWindow = typeof window !== 'undefined' ? window : undefined;
+
+/**
+ * 监听目标元素之外的点击事件回调
+ *
+ * @author lxm
+ * @date 2022-10-28 18:10:25
+ * @export
+ * @param {HTMLElement} target 目标元素
+ * @param {OnClickOutsideHandler} handler 触发的时间回调
+ * @param {OnClickOutsideOptions} [options={}] 额外配置参数
+ * @returns {*}  {OnClickOutsideResult}
+ */
+export function onClickOutside(
+  target: HTMLElement,
+  handler: OnClickOutsideHandler,
+  options: OnClickOutsideOptions = {},
+): OnClickOutsideResult {
+  const { window = defaultWindow, ignore = [], capture = true } = options;
+
+  if (!target) throw new RuntimeError('target元素不存在');
+  if (!window) throw new RuntimeError('找不到window');
+
+  /** 是否需要监听，为false时handler不会执行 */
+  let shouldListen = true;
+
+  /**
+   * 判断event的触发是否是在元素的外部(排除了ignore元素)
+   * @param event 事件对象
+   * @returns
+   */
+  const isOutside = (event: MouseEvent) => {
+    // 有一个判断是在内部，则不算外部，返回false
+    return ![target, ...ignore].some(el => {
+      return isEventInside(event, el);
+    });
+  };
+
+  /** 暂停，所有监听的回调都不执行，用于增强某些ignore无法实现的场景 */
+  let isPaused = false;
+  const pause = () => {
+    isPaused = true;
+  };
+  const proceed = () => {
+    isPaused = false;
+  };
+
+  /** pointerup延时触发标识 */
+  let fallback: number;
+
+  /**
+   * 事件监听处理回调
+   * @param event 事件对象
+   * @returns
+   */
+  const listener = (event: MouseEvent) => {
+    if (isPaused) return;
+    window.clearTimeout(fallback);
+
+    // 当需要监听并且最终触发在外部时才需要执行回调
+    if (!(shouldListen && isOutside(event))) return;
+
+    handler(event);
+  };
+
+  // 鼠标左键单击先后触发pointerdown,pointerup,click
+  // 鼠标右键单击先后触发pointerdown,pointerup
+  const cleanups = [
+    listenJSEvent(window, 'click', listener, { passive: true, capture }),
+    listenJSEvent(
+      window,
+      'pointerdown',
+      e => {
+        if (isPaused) return;
+        // 当pointerdown是在内部触发则不需要后续监听
+        shouldListen = isOutside(e);
+      },
+      { passive: true },
+    ),
+    listenJSEvent(
+      window,
+      'pointerup',
+      e => {
+        if (isPaused) return;
+        // 鼠标左键触发才执行
+        if (e.button === 0) {
+          // 锁死结果避免延时执行时变更
+          const path = eventPath(e);
+          e.composedPath = () => path;
+          fallback = window.setTimeout(() => listener(e), 50);
+        }
+      },
+      { passive: true },
+    ),
+  ].filter(Boolean);
+
+  /**
+   * 停止事件监听，移除监听
+   */
+  const stop = () => cleanups.forEach(fn => fn());
+  return { stop, pause, proceed };
+}

package/src/utils/color/color.ts

@@ -0,0 +1,84 @@
+/* eslint-disable no-bitwise */
+/* eslint-disable no-nested-ternary */
+const r = Math.round;
+
+/**
+ * 把颜色字符串转成RGBA数组
+ *
+ * @param {string} color 颜色字符串
+ * @returns {*}  {number[]}
+ */
+function toRGBA(color: string): number[] {
+  const l = color.length;
+  const rgba = [];
+  if (color.slice(0, 3).toLowerCase() === 'rgb') {
+    const d = color.match(/([\d|.%]{1,3})/g)!;
+    rgba[0] = parseInt(d[0], 10);
+    rgba[1] = parseInt(d[1], 10);
+    rgba[2] = parseInt(d[2], 10);
+    rgba[3] = d[3]
+      ? d[3].indexOf('%') !== -1
+        ? parseInt(d[3], 10) / 100
+        : parseFloat(d[3])
+      : 1;
+  } else {
+    let d: number;
+    if (l < 6)
+      d = parseInt(
+        String(color[1]) +
+          color[1] +
+          color[2] +
+          color[2] +
+          color[3] +
+          color[3] +
+          (l > 4 ? String(color[4]) + color[4] : ''),
+        16,
+      );
+    else d = parseInt(color.slice(1), 16);
+    rgba[0] = (d >> 16) & 255;
+    rgba[1] = (d >> 8) & 255;
+    rgba[2] = d & 255;
+    rgba[3] =
+      l === 9 || l === 5 ? r((((d >> 24) & 255) / 255) * 10000) / 10000 : 1;
+  }
+  return rgba;
+}
+
+/**
+ * 混合两种颜色，颜色格式支持hex和rgb
+ * 如：#46b5d555，#fff
+ * rgb(245 245 245 / 80%)
+ *
+ * @param {string} color1 颜色1
+ * @param {string} color2 颜色2
+ * @param {number} [p=0.5] 颜色1占多少百分比，小数格式
+ * @param {("hex" | "rgb")} [format="hex"] 输出的格式，hex或rgb
+ * @returns {*}
+ */
+export function colorBlend(
+  color1: string,
+  color2: string,
+  p = 0.5,
+  format: 'hex' | 'rgb' = 'hex',
+): string {
+  color1 = color1.trim();
+  color2 = color2.trim();
+  const c1 = toRGBA(color1);
+  const c2 = toRGBA(color2);
+  const result = [
+    r((1 - p) * c1[0] + p * c2[0]),
+    r((1 - p) * c1[1] + p * c2[1]),
+    r((1 - p) * c1[2] + p * c2[2]),
+    (1 - p) * c1[3] + p * c2[3],
+  ];
+  if (format === 'hex') {
+    const hex = [
+      result[0].toString(16),
+      result[1].toString(16),
+      result[2].toString(16),
+      result[3] === 0 ? '00' : r(result[3] * 255).toString(16),
+    ];
+    return `#${hex[0]}${hex[1]}${hex[2]}${hex[3]}`;
+  }
+  return `rgb(${result[0]} ${result[1]} ${result[2]} / ${result[3]})`;
+}