giime 0.0.30 → 0.1.0

package/lib/hooks/base/useDownload/index.js

@@ -1,89 +1,50 @@
 'use strict';
 
 var vue = require('vue');
+var FileSaver = require('file-saver');
 var index = require('../../../components/src/plugins/notification/index.js');
+var uuid = require('uuid');
 var JSZip = require('jszip');
 
 const useDownload = () => {
-  let xhrInstance;
-  let downloading = false;
-  const progress = vue.ref(0);
-  const currentClass = `class${Date.now()}`;
-  vue.onBeforeUnmount(() => {
-    if (xhrInstance) {
-      xhrInstance.abort();
-      xhrInstance = null;
-    }
-  });
-  const downloadBlob = (options) => {
-    return new Promise((resolve, reject) => {
-      xhrInstance = new XMLHttpRequest();
-      xhrInstance.responseType = "blob";
-      xhrInstance.open("get", options.url, true);
-      xhrInstance.onprogress = (e) => {
-        progress.value = Math.floor(e.loaded / e.total * 100);
-        if (!options.isZip) {
-          editElementContent(currentClass, `\u5F53\u524D\u4E0B\u8F7D\u8FDB\u5EA6 ${progress.value}%`);
-        }
-        if (progress.value == 100) {
-          progress.value = 0;
-          downloading = false;
-        }
-      };
-      xhrInstance.onloadend = (e) => {
-        const eventTarget = e.target;
-        if ([200, 304].includes(eventTarget.status)) {
-          const blob = eventTarget.response;
-          if (!options.isZip) {
-            createDownload(blob, options.fileName, options.fileType);
-            index.GmNotification({
-              type: "success",
-              title: "\u6E29\u99A8\u63D0\u793A",
-              message: "\u4E0B\u8F7D\u5B8C\u6210",
-              duration: 3e3
-            });
-          }
-          xhrInstance = null;
-          resolve(blob);
-        }
-      };
-      xhrInstance.onerror = function(e) {
-        downloading = false;
-        index.GmNotification({
-          type: "error",
-          title: "\u6E29\u99A8\u63D0\u793A",
-          message: "\u4E0B\u8F7D\u5F02\u5E38\uFF0C\u8BF7\u91CD\u8BD5",
-          duration: 1500
-        });
-        reject(e);
-      };
-      xhrInstance.send();
+  const getUrlFilename = (url) => {
+    const filename = url.split("/").pop()?.split("?")[0] || "file";
+    return filename;
+  };
+  const downloadByUrl = async (url, options) => {
+    const filename = options?.filename || getUrlFilename(url);
+    const curId = uuid.v4();
+    const modalInfo = index.GmNotification({
+      title: "\u4E0B\u8F7D\u4E2D",
+      message: vue.h("div", { className: curId }, [`\u5F53\u524D\u4E0B\u8F7D\u8FDB\u5EA6 0%`]),
+      duration: 0
+    });
+    await createDownload({
+      url,
+      filename,
+      uuid: curId
     });
+    modalInfo.close();
   };
-  const downloadFile = async (options) => {
-    try {
-      if (downloading || !options.url || !options.fileName)
-        return;
-      downloading = true;
-      const fileType = options.fileType || options.url.split(".").pop();
-      const modalInfo = index.GmNotification({
-        title: "\u4E0B\u8F7D\u4E2D",
-        message: vue.h("div", { className: currentClass }, [`\u5F53\u524D\u4E0B\u8F7D\u8FDB\u5EA6 ${progress.value}%`]),
-        duration: 0
-      });
-      const downblobOptions = {
-        url: options.url,
-        fileName: options.fileName,
-        fileType,
-        isZip: false
-      };
-      await downloadBlob(downblobOptions);
-      modalInfo.close();
-    } catch (error) {
-      console.error(error);
-    }
+  const downloadByRes = async (res, options) => {
+    const filename = options?.filename || res.headers["Content-Disposition"]?.split("filename=")[1] || "file";
+    const resBlob = await res.data;
+    const curId = uuid.v4();
+    const modalInfo = index.GmNotification({
+      title: "\u4E0B\u8F7D\u4E2D",
+      message: vue.h("div", { className: curId }, [`\u5F53\u524D\u4E0B\u8F7D\u8FDB\u5EA6 0%`]),
+      duration: 0
+    });
+    const blob = new Blob([resBlob]);
+    const fileUrl = window.URL.createObjectURL(blob);
+    await createDownload({
+      url: fileUrl,
+      filename,
+      uuid: curId
+    });
+    modalInfo.close();
   };
-  const downloadZip = async (fileList, fileName) => {
+  const downloadToZip = async (fileList, filename) => {
     try {
       const currentContentClass = `message${Date.now()}`;
       const downloadCount = vue.ref(0);
@@ -96,28 +57,21 @@ const useDownload = () => {
       const zipInstance = new JSZip();
       for (let i = 0; i < len; i++) {
         const currentItem = fileList[i];
-        const currentFileType = currentItem.fileType || currentItem.url.split(".").pop();
         const downblobOptions = {
           url: currentItem.url,
-          fileName: currentItem.fileName,
-          fileType: currentFileType,
+          filename: currentItem.filename ?? getUrlFilename(currentItem.url),
           isZip: true
         };
-        downloadBlob(downblobOptions).then((res) => {
-          zipInstance.file(`${currentItem.fileName}.${currentFileType}`, res);
+        createDownload(downblobOptions).then((res) => {
+          zipInstance.file(downblobOptions.filename, res);
           downloadCount.value++;
           editElementContent(currentContentClass, `\u603B\u4E0B\u8F7D\u6587\u4EF6\u6570\uFF1A${len}\uFF0C\u5DF2\u4E0B\u8F7D\u6587\u4EF6\u6570\uFF1A${downloadCount.value}`);
           if (downloadCount.value == len) {
-            downloading = false;
-            modalInfo.close();
-            index.GmNotification({
-              type: "success",
-              title: "\u6E29\u99A8\u63D0\u793A",
-              message: "\u4E0B\u8F7D\u5B8C\u6210",
-              duration: 3e3
-            });
+            editElementContent(currentContentClass, `\u6B63\u5728\u5408\u5E76...`);
             zipInstance.generateAsync({ type: "blob" }).then((res2) => {
-              createDownload(res2, fileName, "zip");
+              modalInfo.close();
+              const fileUrl = window.URL.createObjectURL(res2);
+              downloadByUrl(fileUrl, { filename });
             }).catch((error) => {
               console.error(error);
             });
@@ -128,23 +82,43 @@ const useDownload = () => {
       console.error(error);
     }
   };
-  return {
-    downloadFile,
-    downloadZip
+  const createDownload = (options) => {
+    return new Promise((resolve, reject) => {
+      const xhr = new XMLHttpRequest();
+      xhr.open("GET", options.url, true);
+      xhr.responseType = "blob";
+      xhr.onprogress = function(event) {
+        if (event.lengthComputable) {
+          const percentComplete = Math.floor(event.loaded / event.total * 100);
+          if (options.uuid) {
+            editElementContent(options.uuid, `\u5F53\u524D\u4E0B\u8F7D\u8FDB\u5EA6 ${percentComplete}%`);
+          }
+        }
+      };
+      xhr.onload = function(e) {
+        const eventTarget = e.target;
+        if ([200, 304].includes(eventTarget.status)) {
+          const blob = eventTarget.response;
+          if (!options.isZip) {
+            FileSaver.saveAs(blob, options.filename);
+            index.GmNotification({
+              type: "success",
+              title: "\u6E29\u99A8\u63D0\u793A",
+              message: "\u4E0B\u8F7D\u5B8C\u6210",
+              duration: 3e3
+            });
+          }
+          resolve(blob);
+        }
+      };
+      xhr.onerror = function(e) {
+        GmMessage.error("\u4E0B\u8F7D\u5F02\u5E38\uFF0C\u8BF7\u91CD\u8BD5");
+        reject(e);
+      };
+      xhr.send();
+    });
   };
-};
-const createDownload = (blob, fileName, fileType) => {
-  if (!blob || !fileName || !fileType)
-    return;
-  const ele = document.createElement("a");
-  const url = window.URL.createObjectURL(blob);
-  ele.style.display = "none";
-  ele.href = url;
-  ele.download = `${fileName}.${fileType}`;
-  document.body.appendChild(ele);
-  ele.click();
-  window.URL.revokeObjectURL(url);
-  document.body.removeChild(ele);
+  return { downloadByUrl, downloadByRes, downloadToZip };
 };
 const editElementContent = (className, content) => {
   const currentEle = document.getElementsByClassName(className)[0];

package/lib/hooks/base/useDownload/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/hooks/base/useDownload/index.ts"],"sourcesContent":["import { h, onBeforeUnmount, ref } from 'vue';\r\nimport GmNotification from '@giime/components/src/plugins/notification';\r\nimport JSZip from 'jszip';\r\n\r\n// 参数类型\r\nexport interface OptionsType {\r\n  url: string;\r\n  fileName: string;\r\n  fileType?: string;\r\n}\r\n\r\ninterface DownloadOptionsType extends OptionsType {\r\n  isZip: boolean;\r\n  fileType: string;\r\n}\r\n\r\nexport const useDownload = () => {\r\n  let xhrInstance: XMLHttpRequest | null;\r\n  // 是否正在下载\r\n  let downloading = false;\r\n  // 单文件下载进度\r\n  const progress = ref(0);\r\n  // 动态生成唯一的 class\r\n  const currentClass = `class${Date.now()}`;\r\n  onBeforeUnmount(() => {\r\n    if (xhrInstance) {\r\n      xhrInstance.abort();\r\n      xhrInstance = null;\r\n    }\r\n  });\r\n  // 将 url 下载为 blob 文件\r\n  const downloadBlob = (options: DownloadOptionsType) => {\r\n    return new Promise<Blob>((resolve, reject) => {\r\n      xhrInstance = new XMLHttpRequest();\r\n      xhrInstance.responseType = 'blob';\r\n      xhrInstance.open('get', options.url, true);\r\n      xhrInstance.onprogress = e => {\r\n        progress.value = Math.floor((e.loaded / e.total) * 100);\r\n        if (!options.isZip) {\r\n          editElementContent(currentClass, `当前下载进度 ${progress.value}%`);\r\n        }\r\n        if (progress.value == 100) {\r\n          progress.value = 0;\r\n          downloading = false;\r\n        }\r\n      };\r\n      xhrInstance.onloadend = e => {\r\n        const eventTarget = e.target as XMLHttpRequest;\r\n        if ([200, 304].includes(eventTarget.status)) {\r\n          const blob = eventTarget.response;\r\n          if (!options.isZip) {\r\n            createDownload(blob, options.fileName, options.fileType);\r\n            GmNotification({\r\n              type: 'success',\r\n              title: '温馨提示',\r\n              message: '下载完成',\r\n              duration: 3000,\r\n            });\r\n          }\r\n          xhrInstance = null;\r\n          resolve(blob);\r\n        }\r\n      };\r\n      xhrInstance.onerror = function (e) {\r\n        downloading = false;\r\n        GmNotification({\r\n          type: 'error',\r\n          title: '温馨提示',\r\n          message: '下载异常，请重试',\r\n          duration: 1500,\r\n        });\r\n        reject(e);\r\n      };\r\n      xhrInstance.send();\r\n    });\r\n  };\r\n  // 下载单文件\r\n  const downloadFile = async (options: OptionsType) => {\r\n    try {\r\n      if (downloading || !options.url || !options.fileName) return;\r\n      downloading = true;\r\n      const fileType = options.fileType || options.url.split('.').pop()!;\r\n      const modalInfo = GmNotification({\r\n        title: '下载中',\r\n        message: h('div', { className: currentClass }, [`当前下载进度 ${progress.value}%`]),\r\n        duration: 0,\r\n      });\r\n      const downblobOptions = {\r\n        url: options.url,\r\n        fileName: options.fileName,\r\n        fileType,\r\n        isZip: false,\r\n      };\r\n      await downloadBlob(downblobOptions);\r\n      modalInfo.close();\r\n    } catch (error) {\r\n      console.error(error);\r\n    }\r\n  };\r\n  // 下载多文件 转为zip\r\n  const downloadZip = async (fileList: OptionsType[], fileName: string) => {\r\n    try {\r\n      const currentContentClass = `message${Date.now()}`;\r\n      const downloadCount = ref(0);\r\n      const len = fileList.length;\r\n      const modalInfo = GmNotification({\r\n        title: '下载中',\r\n        message: h('div', [h('div', { className: currentContentClass }, [`总下载文件数：${len}，已下载文件数：${downloadCount.value}`])]),\r\n        duration: 0,\r\n      });\r\n      // h('div', { className: currentClass }, [`当前下载进度 ${progress.value}%`]),\r\n      const zipInstance = new JSZip();\r\n      for (let i = 0; i < len; i++) {\r\n        const currentItem = fileList[i];\r\n        const currentFileType = currentItem.fileType || currentItem.url.split('.').pop()!;\r\n        // const fileBlob = await\r\n        const downblobOptions = {\r\n          url: currentItem.url,\r\n          fileName: currentItem.fileName,\r\n          fileType: currentFileType,\r\n          isZip: true,\r\n        };\r\n        downloadBlob(downblobOptions).then(res => {\r\n          zipInstance.file(`${currentItem.fileName}.${currentFileType}`, res);\r\n          downloadCount.value++;\r\n          editElementContent(currentContentClass, `总下载文件数：${len}，已下载文件数：${downloadCount.value}`);\r\n          if (downloadCount.value == len) {\r\n            downloading = false;\r\n            modalInfo.close();\r\n            GmNotification({\r\n              type: 'success',\r\n              title: '温馨提示',\r\n              message: '下载完成',\r\n              duration: 3000,\r\n            });\r\n            zipInstance\r\n              .generateAsync({ type: 'blob' })\r\n              .then(res => {\r\n                createDownload(res, fileName, 'zip');\r\n              })\r\n              .catch(error => {\r\n                console.error(error);\r\n              });\r\n          }\r\n        });\r\n      }\r\n    } catch (error) {\r\n      console.error(error);\r\n    }\r\n  };\r\n\r\n  return {\r\n    downloadFile,\r\n    downloadZip,\r\n  };\r\n};\r\n// 创建下载链接 并下载\r\nconst createDownload = (blob: Blob, fileName: string, fileType: string) => {\r\n  if (!blob || !fileName || !fileType) return;\r\n  const ele = document.createElement('a');\r\n  const url = window.URL.createObjectURL(blob);\r\n  ele.style.display = 'none';\r\n  ele.href = url;\r\n  ele.download = `${fileName}.${fileType}`;\r\n  document.body.appendChild(ele);\r\n  ele.click();\r\n  window.URL.revokeObjectURL(url);\r\n  document.body.removeChild(ele);\r\n};\r\n\r\n// 动态更新 notify 中的message 信息\r\nconst editElementContent = (className: string, content: string) => {\r\n  // eslint-disable-next-line unicorn/prefer-query-selector\r\n  const currentEle = document.getElementsByClassName(className)[0];\r\n  if (currentEle) {\r\n    currentEle.innerHTML = content;\r\n  }\r\n};\r\n"],"names":["ref","onBeforeUnmount","GmNotification","h","res"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/hooks/base/useDownload/index.ts"],"sourcesContent":["import { h, ref } from 'vue';\r\nimport FileSaver from 'file-saver';\r\n\r\nimport GmNotification from '@giime/components/src/plugins/notification';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport JSZip from 'jszip';\r\nimport type { AxiosResponse } from 'axios';\r\n\r\nexport interface DownloadOptions {\r\n  filename?: string;\r\n}\r\nexport interface DateownloadZipItem {\r\n  url: string;\r\n  filename?: string;\r\n}\r\n\r\nexport const useDownload = () => {\r\n  const getUrlFilename = (url: string) => {\r\n    const filename = url.split('/').pop()?.split('?')[0] || 'file';\r\n    return filename;\r\n  };\r\n  /**\r\n   * 通过url下载\r\n   * @param url\r\n   * @param options\r\n   */\r\n  const downloadByUrl = async (url: string, options?: DownloadOptions) => {\r\n    const filename = options?.filename || getUrlFilename(url);\r\n    const curId = uuidv4();\r\n    const modalInfo = GmNotification({\r\n      title: '下载中',\r\n      message: h('div', { className: curId }, [`当前下载进度 0%`]),\r\n      duration: 0,\r\n    });\r\n    await createDownload({\r\n      url,\r\n      filename,\r\n      uuid: curId,\r\n    });\r\n    modalInfo.close();\r\n  };\r\n  /**\r\n   * 通过接口响应结果下载\r\n   * @param res\r\n   * @param options\r\n   */\r\n  const downloadByRes = async (res: AxiosResponse<any, any>, options?: DownloadOptions) => {\r\n    const filename = options?.filename || res.headers['Content-Disposition']?.split('filename=')[1] || 'file';\r\n    const resBlob = await res.data;\r\n    const curId = uuidv4();\r\n    const modalInfo = GmNotification({\r\n      title: '下载中',\r\n      message: h('div', { className: curId }, [`当前下载进度 0%`]),\r\n      duration: 0,\r\n    });\r\n    // 设置type类型\r\n    const blob = new Blob([resBlob]);\r\n    const fileUrl = window.URL.createObjectURL(blob);\r\n    await createDownload({\r\n      url: fileUrl,\r\n      filename,\r\n      uuid: curId,\r\n    });\r\n    modalInfo.close();\r\n  };\r\n  /**\r\n   * 下载多文件 转为zip\r\n   * @param fileList\r\n   * @param filename\r\n   */\r\n  const downloadToZip = async (fileList: DateownloadZipItem[], filename: string) => {\r\n    try {\r\n      const currentContentClass = `message${Date.now()}`;\r\n      const downloadCount = ref(0);\r\n      const len = fileList.length;\r\n      const modalInfo = GmNotification({\r\n        title: '下载中',\r\n        message: h('div', [h('div', { className: currentContentClass }, [`总下载文件数：${len}，已下载文件数：${downloadCount.value}`])]),\r\n        duration: 0,\r\n      });\r\n      // h('div', { className: currentClass }, [`当前下载进度 ${progress.value}%`]),\r\n      const zipInstance = new JSZip();\r\n      for (let i = 0; i < len; i++) {\r\n        const currentItem = fileList[i];\r\n        // const fileBlob = await\r\n        const downblobOptions = {\r\n          url: currentItem.url,\r\n          filename: currentItem.filename ?? getUrlFilename(currentItem.url),\r\n          isZip: true,\r\n        };\r\n        createDownload(downblobOptions).then(res => {\r\n          zipInstance.file(downblobOptions.filename, res);\r\n          downloadCount.value++;\r\n          editElementContent(currentContentClass, `总下载文件数：${len}，已下载文件数：${downloadCount.value}`);\r\n          if (downloadCount.value == len) {\r\n            editElementContent(currentContentClass, `正在合并...`);\r\n\r\n            zipInstance\r\n              .generateAsync({ type: 'blob' })\r\n              .then(res => {\r\n                modalInfo.close();\r\n\r\n                const fileUrl = window.URL.createObjectURL(res);\r\n                // FileSaver.saveAs(res, filename);\r\n                downloadByUrl(fileUrl, { filename });\r\n              })\r\n              .catch(error => {\r\n                console.error(error);\r\n              });\r\n          }\r\n        });\r\n      }\r\n    } catch (error) {\r\n      console.error(error);\r\n    }\r\n  };\r\n  const createDownload = (options: { url: string; filename: string; uuid?: string; isZip?: boolean }) => {\r\n    return new Promise<Blob>((resolve, reject) => {\r\n      // 创建一个新的 XMLHttpRequest 对象\r\n      const xhr = new XMLHttpRequest();\r\n      // 初始化一个GET请求\r\n      xhr.open('GET', options.url, true);\r\n      xhr.responseType = 'blob'; // 设置响应类型为blob，以便处理二进制文件\r\n\r\n      // 监听 progress 事件\r\n      xhr.onprogress = function (event) {\r\n        if (event.lengthComputable) {\r\n          const percentComplete = Math.floor((event.loaded / event.total) * 100);\r\n          if (options.uuid) {\r\n            editElementContent(options.uuid, `当前下载进度 ${percentComplete}%`);\r\n          }\r\n        }\r\n      };\r\n\r\n      // 监听 load 事件，表示下载完成\r\n      xhr.onload = function (e) {\r\n        const eventTarget = e.target as XMLHttpRequest;\r\n        if ([200, 304].includes(eventTarget.status)) {\r\n          const blob = eventTarget.response;\r\n          // const url = window.URL.createObjectURL(blob);\r\n          if (!options.isZip) {\r\n            FileSaver.saveAs(blob, options.filename);\r\n            GmNotification({\r\n              type: 'success',\r\n              title: '温馨提示',\r\n              message: '下载完成',\r\n              duration: 3000,\r\n            });\r\n          }\r\n\r\n          resolve(blob);\r\n        }\r\n      };\r\n\r\n      // 监听 error 事件\r\n      xhr.onerror = function (e) {\r\n        GmMessage.error('下载异常，请重试');\r\n        reject(e);\r\n      };\r\n\r\n      // 发送请求\r\n      xhr.send();\r\n    });\r\n  };\r\n  return { downloadByUrl, downloadByRes, downloadToZip };\r\n};\r\n\r\n// 动态更新 notify 中的message 信息\r\nconst editElementContent = (className: string, content: string) => {\r\n  // eslint-disable-next-line unicorn/prefer-query-selector\r\n  const currentEle = document.getElementsByClassName(className)[0];\r\n  if (currentEle) {\r\n    currentEle.innerHTML = content;\r\n  }\r\n};\r\n"],"names":["uuidv4","GmNotification","h","ref","res"],"mappings":"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"}

package/lib/index.css

@@ -1,7 +1,3 @@
-[data-v-512cf874] .gmSearchForm .el-form-item {
-  margin-right: 8px;
-  margin-bottom: 8px;
-}
 .gm-flex-center[data-v-d1c6dac0] {
   align-items: center;
 }
@@ -9,27 +5,31 @@
 .gm-flex-justify-between[data-v-d1c6dac0] {
   justify-content: space-between;
 }
-[data-v-9f72778f] .gmTableNoBorder .el-table__body .el-table__cell {
+[data-v-512cf874] .gmSearchForm .el-form-item {
+  margin-right: 8px;
+  margin-bottom: 8px;
+}
+[data-v-e38c9d81] .gmTableNoBorder .el-table__body .el-table__cell {
   border-right: none;
 }
 
-[data-v-9f72778f] .gmTableNoBorder .el-table__inner-wrapper:before {
+[data-v-e38c9d81] .gmTableNoBorder .el-table__inner-wrapper:before {
   height: 0;
 }
 
-[data-v-9f72778f] .gmTableNoBorder.el-table--border .el-table__inner-wrapper:after {
+[data-v-e38c9d81] .gmTableNoBorder.el-table--border .el-table__inner-wrapper:after {
   height: 0;
 }
 
-[data-v-9f72778f] .gmTableNoBorder.el-table--border:after {
+[data-v-e38c9d81] .gmTableNoBorder.el-table--border:after {
   height: 0;
 }
 
-[data-v-9f72778f] .gmTableNoBorder.el-table--border:before {
+[data-v-e38c9d81] .gmTableNoBorder.el-table--border:before {
   height: 0;
 }
 
-[data-v-9f72778f] .gmTableNoBorder .el-table__border-left-patch {
+[data-v-e38c9d81] .gmTableNoBorder .el-table__border-left-patch {
   height: 0;
 }
 /*

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "giime",
-  "version": "0.0.30",
+  "version": "0.1.0",
   "description": "A Component Library for Vue 3",
   "keywords": [
     "giime",
@@ -63,6 +63,8 @@
     "clipboard": "^2.0.11",
     "uuid": "^9.0.1",
     "jszip": "^3.10.1",
+    "file-saver": "^2.0.5",
+    "@types/file-saver": "^2.0.7",
     "@types/lodash": "^4.17.0",
     "@types/lodash-es": "^4.17.12"
   },