@ibiz-template/core 0.0.1-beta.1 → 0.0.1-beta.30

package/out/utils/upload/upload-file.js

@@ -0,0 +1,150 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable no-param-reassign */
+import { cloneDeep, isFunction, merge, round, uniqueId } from 'lodash-es';
+import { selectFile } from './select-file';
+/**
+ * 使用上传文件逻辑
+ *
+ * @author lxm
+ * @date 2022-11-20 21:11:52
+ * @export
+ * @param {IUploadFileOpts} _opts
+ * @returns {*}
+ */
+export function uploadFile(_opts) {
+    const opts = merge({
+        multiple: true,
+        accept: '',
+        separate: true,
+        beforeUpload: (_fileData, _files) => true,
+        finish: (_resultFiles) => { },
+        success: (_resultFiles, _res) => { },
+        error: (_resultFiles, _error) => { },
+        progress: (_files) => { },
+    }, _opts);
+    /**
+     * 进度条回调
+     *
+     * @author lxm
+     * @date 2022-11-20 21:11:47
+     * @param {IParams} event
+     * @param {IUploadFile[]} files
+     */
+    const onUploadProgress = (event, files) => {
+        files.forEach(file => {
+            file.percentage = round(event.progress * 100);
+        });
+        opts.progress(cloneDeep(files));
+    };
+    /**
+     * 上传请求方法，返回响应对象
+     *
+     * @author lxm
+     * @date 2022-11-18 13:11:57
+     * @param {File[]} files
+     * @returns {*}  {Promise<HttpResponse>}
+     */
+    const uploadRequest = async (files, onProgress) => {
+        // 自定义上传请求
+        if (opts.request && isFunction(opts.request)) {
+            return opts.request(files);
+        }
+        // 默认每次单个文件上传，可能存在接口一次上传多个文件,
+        const data = new FormData();
+        files.forEach(file => {
+            data.append('file', file);
+        });
+        const res = await ibiz.net.request(opts.uploadUrl, {
+            method: 'post',
+            baseURL: '',
+            data,
+            headers: { 'Content-Type': 'multipart/form-data' },
+            onUploadProgress: onProgress,
+        });
+        return res;
+    };
+    /**
+     * 执行一次上传，可能是一个文件也可能是多个文件
+     *
+     * @author lxm
+     * @date 2022-11-18 14:11:54
+     * @param {File[]} files 此次上传文件的集合
+     * @returns {*}  {Promise<IUploadFile[]>}
+     */
+    const executeSingleUpload = async (files) => {
+        const resultFiles = files.map(file => {
+            return {
+                status: 'uploading',
+                name: file.name,
+                uid: uniqueId(),
+                percentage: 0,
+            };
+        });
+        // 上传前回调，可以取消此次下载
+        const pass = opts.beforeUpload(files, resultFiles);
+        if (!pass) {
+            resultFiles.forEach(file => {
+                file.status = 'cancel';
+            });
+            ibiz.log.debug('取消上传', resultFiles);
+            return resultFiles;
+        }
+        try {
+            const res = await uploadRequest(files, event => {
+                onUploadProgress(event, resultFiles);
+            });
+            resultFiles.forEach(file => {
+                file.status = 'finished';
+            });
+            // 上传成功事件
+            opts.success(resultFiles, res);
+            resultFiles.forEach(file => {
+                file.response = res;
+            });
+        }
+        catch (error) {
+            resultFiles.forEach(file => {
+                file.status = 'fail';
+            });
+            // 上传失败事件
+            opts.error(resultFiles, error);
+            resultFiles.forEach(file => {
+                file.error = error;
+            });
+            ibiz.log.error(error);
+            ibiz.log.error(`${files.map(file => file.name).join(',')}上传失败`);
+        }
+        return resultFiles;
+    };
+    /**
+     * 执行上传文件逻辑
+     *
+     * @author lxm
+     * @date 2022-11-18 13:11:21
+     * @param {files} File[] 文件集合
+     */
+    const uploadFiles = async (files) => {
+        const uploadSequence = opts.separate ? files.map(file => [file]) : [files];
+        const res = await Promise.allSettled(uploadSequence.map(async (sequence) => {
+            return executeSingleUpload(sequence);
+        }));
+        // 整合所有的返回文件
+        const resultFiles = [];
+        res.forEach(result => {
+            if (result.status === 'fulfilled') {
+                resultFiles.push(...result.value);
+            }
+        });
+        opts.finish(resultFiles);
+    };
+    const select = () => {
+        selectFile({
+            accept: opts.accept,
+            multiple: opts.multiple,
+            onSelected: files => {
+                uploadFiles(files);
+            },
+        });
+    };
+    select();
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ibiz-template/core",
-  "version": "0.0.1-beta.1",
+  "version": "0.0.1-beta.30",
   "description": "核心包",
   "type": "module",
   "main": "out/index.js",
@@ -30,7 +30,7 @@
   "author": "chitanda",
   "license": "MIT",
   "dependencies": {
-    "axios": "^1.1.3",
+    "axios": "^1.2.1",
     "loglevel": "^1.8.0",
     "pluralize": "^8.0.0",
     "qs": "^6.11.0"
@@ -44,6 +44,5 @@
   "peerDependencies": {
     "lodash-es": "^4.17.21",
     "qx-util": "^0.4.4"
-  },
-  "gitHead": "9514cbc720208af6160c67bc43e822262274da1f"
+  }
 }

package/src/context/index.ts

@@ -10,8 +10,25 @@ export class IBizContext implements IContext {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   [key: string | symbol]: any;
 
+  /**
+   * 修改的父上下文
+   *
+   * @author lxm
+   * @date 2022-12-08 18:12:16
+   * @protected
+   * @type {IContext}
+   */
   protected _context!: IContext;
 
+  /**
+   * 父的上下文源对象
+   *
+   * @author lxm
+   * @date 2022-12-08 18:12:31
+   * @type {IBizContext}
+   */
+  declare _parent?: IBizContext;
+
   /**
    * Creates an instance of IBizContext.
    *
@@ -25,7 +42,13 @@ export class IBizContext implements IContext {
     if (parent) {
       // eslint-disable-next-line @typescript-eslint/no-this-alias
       const self = this;
-      // 定义私有变量，用于存储父已有上下文，方便覆盖
+      // 定义私有变量，存放父上下文源对象
+      Object.defineProperty(this, '_parent', {
+        enumerable: false,
+        value: parent,
+      });
+
+      // 定义私有变量，用于存储对父已有上下文的修改。
       Object.defineProperty(this, '_context', {
         enumerable: false,
         value: {},
@@ -56,4 +79,25 @@ export class IBizContext implements IContext {
     // 合并给入上下文
     Object.assign(this, context);
   }
+
+  /**
+   * 返回自身的上下文，独有的和与父有差异的。
+   *
+   * @author lxm
+   * @date 2022-12-08 17:12:26
+   * @returns {*}  {IContext}
+   */
+  getOwnContext(): IContext {
+    const result: IContext = {};
+    Object.keys(this).forEach(key => {
+      // 父没有的，或者修改了父的上下文
+      if (
+        !Object.prototype.hasOwnProperty.call(this._parent, key) ||
+        Object.prototype.hasOwnProperty.call(this._context, key)
+      ) {
+        result[key] = this[key];
+      }
+    });
+    return result;
+  }
 }

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

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

package/src/utils/download-file/download-file.ts

@@ -51,12 +51,33 @@ export function calcMimeByFileName(fileName: string) {
     case '.tar':
       mime = 'application/x-tar';
       break;
+    case '.xlsx':
+      mime = 'application/vnd.ms-excel';
+      break;
     default:
       mime = '';
   }
   return mime;
 }
 
+/**
+ * 判断是否是图片格式
+ *
+ * @author lxm
+ * @date 2022-11-21 13:11:23
+ * @export
+ * @param {string} fileName
+ * @returns {*}  {boolean}
+ */
+export function isImage(fileName: string): boolean {
+  const ext = fileName.split('.').pop();
+  if (!ext) {
+    return false;
+  }
+  const imageTypes = ['.jpeg', 'jpg', 'gif', 'png', 'bmp', 'svg'];
+  return imageTypes.includes(ext);
+}
+
 /**
  * 纯JS触发下载文件
  *

package/src/utils/index.ts

@@ -10,3 +10,6 @@ export * from './event/event';
 export * from './click-outside/click-outside';
 export * from './color/color';
 export * from './download-file/download-file';
+export * from './upload/select-file';
+export * from './upload/upload-file';
+export * from './sync';

package/src/utils/sync/count-latch.ts

@@ -0,0 +1,99 @@
+import { RuntimeError } from '../../error';
+
+/**
+ * 计数插销工具类
+ *
+ * @author lxm
+ * @date 2022-11-24 19:11:49
+ * @export
+ * @class CountLatch
+ */
+export class CountLatch {
+  private promise: Promise<void> | null = null;
+
+  private resolve: ((value: void) => void) | null = null;
+
+  /**
+   * 计数，当前等待的异步逻辑个数
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:59
+   * @type {number}
+   */
+  count: number = 0;
+
+  /**
+   * 开启promise
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:32
+   * @private
+   */
+  private startPromise() {
+    this.promise = new Promise(resolve => {
+      this.resolve = resolve;
+    });
+  }
+
+  /**
+   * 结束promise
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:44
+   * @private
+   */
+  private endPromise() {
+    if (this.resolve) {
+      this.resolve();
+      this.resolve = null;
+      this.promise = null;
+    }
+  }
+
+  /**
+   * 上锁，计数加一
+   * 第一次计数，开启异步
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:27
+   */
+  lock() {
+    console.log('lock');
+    this.count += 1;
+    if (!this.promise) {
+      console.log('startPromise');
+      this.startPromise();
+    }
+  }
+
+  /**
+   * 解锁，计数减一
+   * 归零时结束异步
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:47
+   */
+  unlock() {
+    if (this.count < 1) {
+      throw new RuntimeError('lock和unlock次数不匹配！');
+    }
+    console.log('unlock');
+    this.count -= 1;
+    if (this.count === 0) {
+      debugger;
+      this.endPromise();
+    }
+  }
+
+  /**
+   * 等待，计数归零异步结束
+   *
+   * @author lxm
+   * @date 2022-11-24 19:11:20
+   */
+  async await() {
+    if (this.promise) {
+      await this.promise;
+    }
+  }
+}

package/src/utils/sync/index.ts

@@ -0,0 +1 @@
+export { CountLatch } from './count-latch';

package/src/utils/upload/select-file.ts

@@ -0,0 +1,86 @@
+import { merge } from 'lodash-es';
+
+/**
+ * 文件List转数组
+ *
+ * @author lxm
+ * @date 2022-11-18 13:11:03
+ * @export
+ * @param {FileList} fileList
+ * @returns {*}
+ */
+export function fileListToArr(fileList: FileList): File[] {
+  const files = [];
+  for (let i = 0; i < fileList.length; i++) {
+    files.push(fileList[i]);
+  }
+  return files;
+}
+
+/**
+ * JS打开文件上传操作配置参数
+ *
+ * @author lxm
+ * @date 2022-11-20 21:11:47
+ * @export
+ * @interface SelectFileOpts
+ */
+export interface SelectFileOpts {
+  /**
+   * 接受的文件类型
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:52
+   * @type {string}
+   */
+  accept?: string;
+  /**
+   * 是否支持多选
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:52
+   * @type {boolean}
+   */
+  multiple?: boolean;
+  /**
+   * 选中文件后回调
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:50
+   */
+  onSelected: (_fileList: File[]) => void;
+}
+
+/**
+ * JS打开文件上传操作
+ *
+ * @author lxm
+ * @date 2022-11-20 21:11:31
+ * @export
+ * @param {SelectFileOpts} _opts 配置参数
+ */
+export function selectFile(_opts: SelectFileOpts) {
+  const opts: Required<SelectFileOpts> = merge(
+    {
+      multiple: true,
+      accept: '',
+    },
+    _opts,
+  );
+  const input = document.createElement('input');
+  input.setAttribute('type', 'file');
+  input.setAttribute('multiple', `${opts.multiple}`);
+  input.setAttribute('accept', opts.accept);
+  input.onchange = e => {
+    const inputEl = e.target as HTMLInputElement;
+    const files = inputEl.files ? fileListToArr(inputEl.files) : [];
+    if (files.length === 0) {
+      return;
+    }
+    opts.onSelected(files);
+    inputEl.value = ''; // 如果不置空，相同的文件不会触发change事件
+  };
+  document.body.appendChild(input);
+  input.click();
+  document.body.removeChild(input);
+}

package/src/utils/upload/upload-file.ts

@@ -0,0 +1,206 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable no-param-reassign */
+import { cloneDeep, isFunction, merge, round, uniqueId } from 'lodash-es';
+import { HttpResponse } from '../net/http-response';
+import { selectFile } from './select-file';
+
+export interface IUploadFile {
+  name: string;
+  uid: string;
+  status: 'uploading' | 'finished' | 'fail' | 'cancel';
+  percentage: number;
+  response?: HttpResponse;
+  error?: unknown;
+}
+
+export interface IUploadFileOpts {
+  uploadUrl: string;
+  /**
+   * 接受的文件类型
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:52
+   * @type {string}
+   */
+  accept?: string;
+  /**
+   * 是否支持多选
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:52
+   * @type {Boolean}
+   */
+  multiple?: boolean;
+  separate?: string;
+  request?: (_files: File[]) => Promise<HttpResponse>;
+  beforeUpload?: (_fileData: File[], _files: IUploadFile[]) => boolean;
+  finish?: (_resultFiles: IUploadFile[]) => void;
+  success?: (_resultFiles: IUploadFile[], _res: HttpResponse) => void;
+  error?: (_resultFiles: IUploadFile[], _error: unknown) => void;
+  progress?: (_files: IUploadFile[]) => void;
+}
+
+/**
+ * 使用上传文件逻辑
+ *
+ * @author lxm
+ * @date 2022-11-20 21:11:52
+ * @export
+ * @param {IUploadFileOpts} _opts
+ * @returns {*}
+ */
+export function uploadFile(_opts: IUploadFileOpts) {
+  const opts: Required<IUploadFileOpts> = merge(
+    {
+      multiple: true,
+      accept: '',
+      separate: true,
+      beforeUpload: (_fileData: File[], _files: IUploadFile[]) => true,
+      finish: (_resultFiles: IUploadFile[]) => {},
+      success: (_resultFiles: IUploadFile[], _res: HttpResponse) => {},
+      error: (_resultFiles: IUploadFile[], _error: unknown) => {},
+      progress: (_files: IUploadFile[]) => {},
+    },
+    _opts,
+  );
+
+  /**
+   * 进度条回调
+   *
+   * @author lxm
+   * @date 2022-11-20 21:11:47
+   * @param {IParams} event
+   * @param {IUploadFile[]} files
+   */
+  const onUploadProgress = (event: IParams, files: IUploadFile[]) => {
+    files.forEach(file => {
+      file.percentage = round(event.progress * 100);
+    });
+    opts.progress(cloneDeep(files));
+  };
+
+  /**
+   * 上传请求方法，返回响应对象
+   *
+   * @author lxm
+   * @date 2022-11-18 13:11:57
+   * @param {File[]} files
+   * @returns {*}  {Promise<HttpResponse>}
+   */
+  const uploadRequest = async (
+    files: File[],
+    onProgress: (_event: IParams) => void,
+  ): Promise<HttpResponse> => {
+    // 自定义上传请求
+    if (opts.request && isFunction(opts.request)) {
+      return opts.request(files);
+    }
+
+    // 默认每次单个文件上传，可能存在接口一次上传多个文件,
+    const data = new FormData();
+    files.forEach(file => {
+      data.append('file', file);
+    });
+    const res = await ibiz.net.request(opts.uploadUrl, {
+      method: 'post',
+      baseURL: '',
+      data,
+      headers: { 'Content-Type': 'multipart/form-data' },
+      onUploadProgress: onProgress,
+    });
+    return res;
+  };
+
+  /**
+   * 执行一次上传，可能是一个文件也可能是多个文件
+   *
+   * @author lxm
+   * @date 2022-11-18 14:11:54
+   * @param {File[]} files 此次上传文件的集合
+   * @returns {*}  {Promise<IUploadFile[]>}
+   */
+  const executeSingleUpload = async (files: File[]): Promise<IUploadFile[]> => {
+    const resultFiles: IUploadFile[] = files.map(file => {
+      return {
+        status: 'uploading',
+        name: file.name,
+        uid: uniqueId(),
+        percentage: 0,
+      };
+    });
+
+    // 上传前回调，可以取消此次下载
+    const pass = opts.beforeUpload(files, resultFiles);
+    if (!pass) {
+      resultFiles.forEach(file => {
+        file.status = 'cancel';
+      });
+      ibiz.log.debug('取消上传', resultFiles);
+      return resultFiles;
+    }
+
+    try {
+      const res = await uploadRequest(files, event => {
+        onUploadProgress(event, resultFiles);
+      });
+      resultFiles.forEach(file => {
+        file.status = 'finished';
+      });
+      // 上传成功事件
+      opts.success(resultFiles, res);
+      resultFiles.forEach(file => {
+        file.response = res;
+      });
+    } catch (error) {
+      resultFiles.forEach(file => {
+        file.status = 'fail';
+      });
+      // 上传失败事件
+      opts.error(resultFiles, error);
+      resultFiles.forEach(file => {
+        file.error = error;
+      });
+      ibiz.log.error(error);
+      ibiz.log.error(`${files.map(file => file.name).join(',')}上传失败`);
+    }
+    return resultFiles;
+  };
+
+  /**
+   * 执行上传文件逻辑
+   *
+   * @author lxm
+   * @date 2022-11-18 13:11:21
+   * @param {files} File[] 文件集合
+   */
+  const uploadFiles = async (files: File[]) => {
+    const uploadSequence = opts.separate ? files.map(file => [file]) : [files];
+    const res = await Promise.allSettled(
+      uploadSequence.map(async sequence => {
+        return executeSingleUpload(sequence);
+      }),
+    );
+
+    // 整合所有的返回文件
+    const resultFiles: IUploadFile[] = [];
+    res.forEach(result => {
+      if (result.status === 'fulfilled') {
+        resultFiles.push(...result.value);
+      }
+    });
+
+    opts.finish(resultFiles);
+  };
+
+  const select = () => {
+    selectFile({
+      accept: opts.accept,
+      multiple: opts.multiple,
+      onSelected: files => {
+        uploadFiles(files);
+      },
+    });
+  };
+
+  select();
+}