feat: optimized file editor upload files

src/components/file/FileEditor.vue

@@ -285,6 +285,7 @@ export default defineComponent({
     const getFilteredFiles = (items: FileNavItem[]): FileNavItem[] => {
       return items
         .filter(d => {
+          if (!fileSearchString.value) return true;
           if (!d.is_dir) {
             return d.name?.toLowerCase().includes(fileSearchString.value.toLowerCase());
           }
@@ -300,6 +301,11 @@ export default defineComponent({
           if (!d.is_dir) return d;
           d.children = getFilteredFiles(d.children || []);
           return d;
+        })
+        .sort((a, b) => {
+          if (a.is_dir && !b.is_dir) return -1;
+          if (!a.is_dir && b.is_dir) return 1;
+          return a.name?.localeCompare(b.name || '') || 0;
         });
     };
 
@@ -309,7 +315,7 @@ export default defineComponent({
         path: FILE_ROOT,
         name: FILE_ROOT,
         is_dir: true,
-        children: fileSearchString.value ? getFilteredFiles(navItems) : navItems,
+        children: getFilteredFiles(navItems || []),
       };
       return [root];
     });

src/components/spider/UploadSpiderFilesDialog.vue

@@ -67,6 +67,7 @@ export default defineComponent({
     const {
       listRootDir,
       saveFileBinary,
+      saveFilesBinary,
     } = useSpiderService(store);
 
     const id = computed<string>(() => {
@@ -117,8 +118,8 @@ export default defineComponent({
 
     const uploadFiles = async () => {
       if (!files.value) return;
-      await Promise.all(files.value.map((f: FileWithPath) => {
-        return saveFileBinary(id.value, getFilePath(f), f as File);
+      await saveFilesBinary(id.value, files.value.map((f: FileWithPath) => {
+        return {path: getFilePath(f), file: f as File};
       }));
       store.commit(`${ns}/resetFiles`);
       await listRootDir(id.value);

src/interfaces/services/request.d.ts

@@ -25,6 +25,11 @@ export declare global {
     file?: File;
   }
 
+  interface SaveFilesRequestPayload {
+    id: string;
+    files: { path: string, file: File }[];
+  }
+
   interface Response {
     status: string;
     message: string;

src/interfaces/services/spider.d.ts

@@ -6,6 +6,7 @@ export declare global {
     getFileInfo: (id: string, path: string) => Promise<ResponseWithData<FileNavItem>>;
     saveFile: (id: string, path: string, data: string) => Promise<Response>;
     saveFileBinary: (id: string, path: string, file: File) => Promise<Response>;
+    saveFilesBinary: (id: string, files: { path: string, file: File }[]) => Promise<Response>;
     saveDir: (id: string, path: string) => Promise<Response>;
     renameFile: (id: string, path: string, new_path: string) => Promise<Response>;
     deleteFile: (id: string, path: string) => Promise<Response>;

src/interfaces/store/modules/spider.d.ts

@@ -54,6 +54,7 @@ declare global {
     getFileInfo: StoreAction<SpiderStoreState, FileRequestPayload>;
     saveFile: StoreAction<SpiderStoreState, FileRequestPayload>;
     saveFileBinary: StoreAction<SpiderStoreState, FileRequestPayload>;
+    saveFilesBinary: StoreAction<SpiderStoreState, SaveFilesRequestPayload>;
     saveDir: StoreAction<SpiderStoreState, FileRequestPayload>;
     renameFile: StoreAction<SpiderStoreState, FileRequestPayload>;
     deleteFile: StoreAction<SpiderStoreState, FileRequestPayload>;

src/services/spider/spiderService.ts

@@ -30,6 +30,10 @@ const useSpiderService = (store: Store<RootStoreState>): SpiderServices => {
     return dispatch(`${ns}/saveFileBinary`, {id, path, file});
   };
 
+  const saveFilesBinary = (id: string, files: { path: string, file: File }[]) => {
+    return dispatch(`${ns}/saveFilesBinary`, {id, files});
+  };
+
   const saveDir = (id: string, path: string) => {
     return dispatch(`${ns}/saveDir`, {id, path});
   };
@@ -54,6 +58,7 @@ const useSpiderService = (store: Store<RootStoreState>): SpiderServices => {
     getFileInfo,
     saveFile,
     saveFileBinary,
+    saveFilesBinary,
     saveDir,
     renameFile,
     deleteFile,

src/store/modules/spider.ts

@@ -27,6 +27,7 @@ const {
   get,
   post,
   getList,
+  del,
 } = useRequest();
 
 const state = {
@@ -201,6 +202,20 @@ const actions = {
       }
     });
   },
+  saveFilesBinary: async ({commit}: StoreActionContext<BaseStoreState<Spider>>, {
+    id,
+    files,
+  }: SaveFilesRequestPayload) => {
+    const data = new FormData();
+    files.forEach(({path, file}) => {
+      data.append(path, file as File);
+    });
+    return await post(`${endpoint}/${id}/files/save/batch`, data, null, {
+      headers: {
+        'Content-Type': 'multipart/form-data',
+      }
+    });
+  },
   saveDir: async ({commit}: StoreActionContext<BaseStoreState<Spider>>, {id, path}: FileRequestPayload) => {
     return await post(`${endpoint}/${id}/files/save/dir`, {path});
   },
@@ -212,7 +227,7 @@ const actions = {
     return await post(`${endpoint}/${id}/files/rename`, {path, new_path});
   },
   deleteFile: async ({commit}: StoreActionContext<BaseStoreState<Spider>>, {id, path}: FileRequestPayload) => {
-    return await post(`${endpoint}/${id}/files/delete`, {path});
+    return await del(`${endpoint}/${id}/files`, {path});
   },
   copyFile: async ({commit}: StoreActionContext<BaseStoreState<Spider>>, {id, path, new_path}: FileRequestPayload) => {
     return await post(`${endpoint}/${id}/files/copy`, {path, new_path});

src/views/spider/detail/tabs/SpiderDetailTabFiles.vue

@@ -92,13 +92,14 @@ export default defineComponent({
         if (isRoot(item)) {
           path = `${pathSep}${name}`;
         } else {
-          const itemDirPath = getDirPath(item.path || '');
+          const itemDirPath = item.path || '';
           path = `${itemDirPath}${pathSep}${name}`;
         }
       } else {
         const dirPath = getDirPath(item.path as string);
         path = `${dirPath}${pathSep}${name}`;
       }
+      console.debug(path)
       return path;
     };
 

src/views/spider/list/useSpiderList.ts

@@ -168,9 +168,9 @@ const useSpiderList = () => {
       icon: ['fa', 'heartbeat'],
       width: '120',
       value: (row: Spider) => {
-        const status = row.stat?.last_task?.status;
+        const {error, status} = row.stat?.last_task || {};
         if (!status) return;
-        return h(TaskStatus, {status} as TaskStatusProps);
+        return h(TaskStatus, {status, error} as TaskStatusProps);
       }
     },
     {