feat: 优化项目代码结构

src/utils/buildFromTree.ts

@@ -0,0 +1,15 @@
+import VirtualDirectory, { Tree, VirtualFile } from '@/class/VirtualDirectory'
+
+/**
+ * 通过VirtualDirectory的.tree重建文件夹树
+ * @param {any} data:Tree
+ * @returns {any}
+ */
+const buildFromTree = (data: Tree) => {
+   const root = new VirtualDirectory(data)
+   root.files = data.files?.map((v) => new VirtualFile(v, root))
+   root.directories = data.directories?.map((v) => buildFromTree(v))
+   return root
+}
+
+export default buildFromTree

src/utils/dateFormatter.ts

@@ -0,0 +1,28 @@
+export default function dateFormatter(date: Date, fmt: string) {
+   var o: any = {
+      'M+': date.getMonth() + 1, //月份
+      'd+': date.getDate(), //日
+      'h+': date.getHours(), //小时
+      'm+': date.getMinutes(), //分
+      's+': date.getSeconds(), //秒
+      'q+': Math.floor((date.getMonth() + 3) / 3), //季度
+      S: date.getMilliseconds() //毫秒
+   }
+   if (/(y+)/.test(fmt)) {
+      fmt = fmt.replace(
+         RegExp.$1,
+         (date.getFullYear() + '').substr(4 - RegExp.$1.length)
+      )
+   }
+   for (var k in o) {
+      if (new RegExp('(' + k + ')').test(fmt)) {
+         fmt = fmt.replace(
+            RegExp.$1,
+            RegExp.$1.length == 1
+               ? o[k]
+               : ('00' + o[k]).substr(('' + o[k]).length)
+         )
+      }
+   }
+   return fmt
+}

src/utils/dropHandler.ts

@@ -0,0 +1,114 @@
+import config from '@/config'
+
+const { uploadSizeLimit } = config
+
+export type dropHandlerHooks = {
+   /**
+    * 仅返回小于config.ts中大小限制的文件，不会返回文件夹
+    */
+   onDropFiles?: (files: File[]) => void
+   /**
+    * 当拖动时
+    */
+   onOver?: () => void
+   /**
+    * 当进入时
+    */
+   onEnter?: () => void
+
+   /**
+    * 当离开时
+    */
+   onLeave?: () => void
+
+   /**
+    * 离开或是放下时都会触发
+    * @returns {any}
+    */
+   onEnd?: () => void
+}
+
+const isFile = (file: File) =>
+   new Promise((resolve) => {
+      const reader = new FileReader()
+      reader.onload = () => {
+         resolve(true)
+         reader.abort()
+      }
+      reader.onerror = () => {
+         resolve(false)
+         reader.abort()
+      }
+      reader.readAsText(file)
+   })
+
+/**
+ * 只保留文件，移去文件夹
+ * @param {File[]} files
+ */
+const filesFilter = async (files: File[]) => {
+   let index = 0
+   while (index < files.length) {
+      const currentFile = files[index]
+      const _isFile = await isFile(currentFile)
+      if (_isFile) {
+         index += 1
+         continue
+      } else {
+         files.splice(index, 1)
+         continue
+      }
+   }
+}
+
+export default function dropHandler(
+   dom: HTMLDivElement,
+   hooks?: dropHandlerHooks
+) {
+   dom.addEventListener(
+      'dragenter',
+      function (e) {
+         e.preventDefault()
+         e.stopPropagation()
+         hooks?.onEnter && hooks?.onEnter()
+      },
+      false
+   )
+
+   dom.addEventListener(
+      'dragover',
+      function (e) {
+         e.preventDefault()
+         e.stopPropagation()
+         hooks?.onOver && hooks?.onOver()
+      },
+      false
+   )
+
+   dom.addEventListener(
+      'dragleave',
+      function (e) {
+         e.preventDefault()
+         e.stopPropagation()
+         hooks?.onLeave && hooks?.onLeave()
+         hooks?.onEnd && hooks.onEnd()
+      },
+      false
+   )
+
+   dom.addEventListener(
+      'drop',
+      async function (e) {
+         // console.log(e, e.dataTransfer?.types);
+         e.preventDefault()
+         e.stopPropagation()
+         const files = [...(e.dataTransfer?.files ?? [])].filter(
+            (file) => file.size < uploadSizeLimit
+         )
+         await filesFilter(files)
+         hooks?.onDropFiles && hooks.onDropFiles(files)
+         hooks?.onEnd && hooks.onEnd()
+      },
+      false
+   )
+}

src/utils/generateId.ts

@@ -0,0 +1,16 @@
+const idList: number[] = []
+
+/**
+ * 生成一个唯一的id
+ * @param {any} length 生成id的长度
+ * @returns {number}
+ */
+export default function generateId(length?: number) {
+   length || (length = 16)
+   let id
+   while (!id || idList.includes(id)) {
+      id = Math.ceil(Math.random() * 10 ** 16)
+   }
+   idList.push(id)
+   return id
+}

src/utils/miaoTools.ts

@@ -0,0 +1,64 @@
+import { NIcon } from 'naive-ui'
+import { h } from 'vue'
+
+export const filePicker = (() => {
+   let _resolve: ((files: File[]) => void) | undefined
+   return (option?: { accept?: 'string'; multiple: boolean }) => {
+      if (_resolve) {
+         _resolve([])
+         _resolve = undefined
+      }
+      return new Promise<File[]>((resolve) => {
+         const inpEle = document.createElement('input')
+         inpEle.id = `__file_${Math.ceil(Math.random() * 100000000)}`
+         inpEle.type = 'file'
+         inpEle.style.display = 'none'
+         _resolve = resolve
+         // 文件类型限制
+         // inpEle.accept="image/*"
+         option?.accept && (inpEle.accept = option?.accept)
+         // 多选限制
+         option?.multiple && (inpEle.multiple = option?.multiple)
+         // inpEle.addEventListener("change", event => fn.call(inpEle, event, inpEle.files), { once: true });
+         inpEle.addEventListener(
+            'change',
+            () => {
+               if (!inpEle.files) {
+                  return
+               }
+               const files: File[] = []
+               let i = 0
+               while (i < inpEle.files?.length) {
+                  const _file = inpEle?.files?.item(i)
+                  if (_file !== null) {
+                     files.push(_file)
+                  }
+                  i += 1
+               }
+               resolve(files)
+               _resolve = undefined
+            },
+            { once: true }
+         )
+         inpEle.click()
+      })
+   }
+})()
+
+export const renderIcon = (icon: any) => {
+   return () => {
+      return h(NIcon, null, {
+         default: () => h(icon)
+      })
+   }
+}
+
+export const sleep = async (timeout: number) => {
+   await new Promise((_) => setTimeout(_, timeout))
+}
+
+export default {
+   filePicker,
+   renderIcon,
+   sleep
+}