Skip to content

B
bkunyun
Commit b219876e authored by 吴永生#A02208's avatar 吴永生#A02208
Browse files
Options

feat: 文件传输联调

parent 126e0a9c
Hide whitespace changes
Inline Side-by-side
Showing with 564 additions and 455 deletions
src/api/fileserver/raysyncApi.ts
View file @ b219876e
......@@ -110,7 +110,7 @@ const ZONEID = (params: string) => {
};
const urlToken = (filetoken: string, projectId: string) => {
let token = getLoaclStorageOfKey("token_key").access_token;
let token = getLoaclStorageOfKey("token").access_token;
return `?username=${projectId}&token=${token}&filetoken=${encodeURIComponent(
filetoken
)}&share=false&project=true`;
......
src/hooks/useDeepEffect.ts 0 → 100644
View file @ b219876e
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-14 17:22:15
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-14 17:22:56
* @FilePath: /bkunyun/src/hooks/useDeepEffect.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { useEffect, useRef } from 'react';
import _ from 'lodash';
export default function useDeepEffect(effectFunc: Function, deps: any[]) {
const isFirstRef = useRef(true);
const preDeps = useRef(deps);
useEffect(() => {
const isSame = preDeps.current.every((obj, index) => {
return _.isEqual(obj, deps[index]);
});
if (isFirstRef.current || !isSame) {
effectFunc();
}
isFirstRef.current = false;
preDeps.current = deps;
}, [deps]);
}
src/store/index.ts
View file @ b219876e
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-09 20:41:05
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-14 10:16:23
* @LastEditTime: 2022-06-14 20:55:22
* @FilePath: /bkunyun/src/store/index.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -11,11 +11,11 @@ import { configure } from "mobx";
import permissionStore from "./modules/permission";
import menuStore from "./modules/menu";
import currentProjectStore from "./modules/currentProject";
import fileList from "./modules/fileList";
import fileListStore from "./modules/fileList";
configure({ enforceActions: "always" });
export const stores = { permissionStore, menuStore, currentProjectStore, fileList };
export const stores = { permissionStore, menuStore, currentProjectStore, fileListStore };
/** Store类型 */
export type Stores = typeof stores;
......
src/store/modules/fileList.ts
View file @ b219876e
......@@ -2,12 +2,12 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-13 17:00:19
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-14 11:06:13
* @LastEditTime: 2022-06-14 21:47:28
* @FilePath: /bkunyun/src/store/modules/upload.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { makeAutoObservable } from "mobx";
import { makeAutoObservable, observable, action } from "mobx";
interface IUploadInfo {
id: string,
......@@ -25,14 +25,29 @@ class FileList {
/** 文件上传列表 */
fileList: IUploadInfo[] = [];
setFileList (val: IUploadInfo[]) {
this.fileList = val
// setFileList (val: IUploadInfo[]) {
// this.fileList = val
// }
/** 新需要上传的文件列表 */
newFileList: IUploadInfo[] = [];
/** 设置最新需要上传的文件列表 */
setNewFileList (val: IUploadInfo[]) {
this.fileList = this.fileList.concat(val)
this.newFileList = val
}
/** 设置文件上传信息 */
setUploadInfo(id: string, val: IUploadInfo) {
console.log(val,id,'22222')
const newFileList = this.fileList?.map((item)=>{
if(item.id === id){
console.log('3333',item)
return val
} return item
})
......@@ -65,8 +80,9 @@ class FileList {
} return item
})
this.fileList = newFileList
}
}
}
const fileListStore = new FileList()
export default new FileList();
export default fileListStore
src/utils/Upload/tusUpload.js
View file @ b219876e
import React from "react";
import React, { useEffect, useState } from "react";
import * as tus from "tus-js-client";
import {
verifyLettersNumbersCertainChars4,
verifyLettersNumbersCertainChars5,
} from "../helper";
import { getDataFileToken } from "@/api/project_api";
import useMyRequest from "@/hooks/useMyRequest";
import { getTokenInfo } from "@/utils/util";
import ConsoleLayout from "@/views/ConsoleLayout";
const UseTusUpload = (props) => {
const { fileList: uploadInfoStore } = props;
console.log(uploadInfoStore, 222);
const uploadInfoList = uploadInfoStore?.uploadInfo?.list || [];
const uploadInfoIsPermanence =
uploadInfoStore?.uploadInfo?.isPermanence || [];
const uploadInfoOpen = uploadInfoStore?.uploadInfo?.open || [];
const { fileListStore: uploadInfoStore, currentProjectStore } = props;
const uploadFile = (id, file, url, filepath, callBack) => {
/** 文件token */
const [fileToken, setFileToken] = useState("");
/** token信息 */
let tokenInfo = getTokenInfo();
/** 获取文件token请求 */
const { run: getDataFileTokenRun } = useMyRequest(getDataFileToken, {
onSuccess: (res) => {
setFileToken(res.data);
},
});
useEffect(() => {
getDataFileTokenRun({
id: currentProjectStore?.currentProjectInfo.id,
});
}, []);
const uploadFile = (item, file, url, filepath, callBack) => {
for (let i in localStorage) {
if (i.indexOf("tus::tus-br") > -1) {
localStorage.removeItem(i);
}
}
uploadInfoStore?.setUploadInfoIsPermanence(id, false);
uploadInfoStore?.setUploadInfoIsPermanence(item.id, false);
if (!verifyLettersNumbersCertainChars4(file.name)) {
let json1 = uploadInfoStore?.uploadInfo?.list.concat({
......@@ -38,7 +55,7 @@ const UseTusUpload = (props) => {
statusMsgDetail:
"上传失败，文件或文件夹的命名长度不超过127字节，不支持特殊符号、空格。",
});
uploadInfoStore?.setUploadInfo(id, {
uploadInfoStore?.setUploadInfo(item.id, {
open: true,
list: json1,
isPermanence: false,
......@@ -48,9 +65,9 @@ const UseTusUpload = (props) => {
// Create a new tus upload
let timeId = new Date().getTime();
let headers = {
username: "",
token: "",
filetoken: "",
username: currentProjectStore?.currentProjectInfo.id,
token: tokenInfo?.access_token || "",
filetoken: fileToken,
share: false,
};
let upload = new tus.Upload(file, {
......@@ -67,10 +84,10 @@ const UseTusUpload = (props) => {
},
onProgress: function (bytesUploaded, bytesTotal, a) {
var percentage = ((bytesUploaded / bytesTotal) * 100).toFixed(2);
let fliterJson = uploadInfoList?.filter((item) => item.id === timeId);
let fliterJson = item.list?.filter((item) => item.id === timeId);
let json = [];
if (fliterJson.length === 0) {
json = uploadInfoList.concat({
json = item.list.concat({
name: upload.file.name,
bytesUploaded: bytesUploaded,
bytesTotal: bytesTotal,
......@@ -83,13 +100,13 @@ const UseTusUpload = (props) => {
upload,
dir: "/home/cloudam/",
});
uploadInfoStore?.setUploadInfo(id, {
uploadInfoStore?.setUploadInfo(item.id, {
open: true,
list: json,
isPermanence: uploadInfoStore?.uploadInfo?.isPermanence,
});
} else {
let a = uploadInfoList;
let a = item.list;
let time = new Date().getTime();
a.map((element) => {
if (element.id === timeId) {
......@@ -108,18 +125,20 @@ const UseTusUpload = (props) => {
: element["endTime"];
}
});
uploadInfoStore?.setUploadInfo(id, {
uploadInfoStore?.setUploadInfo(item.id, {
open: true,
list: a.concat([]),
isPermanence: uploadInfoIsPermanence,
isPermanence: item.isPermanence,
});
}
},
onSuccess: function () {
let fliterJson = uploadInfoList.filter((item) => item.id === timeId);
let fliterJson = item.list.filter((item) => item.id === timeId);
console.log(upload.file, "9999999");
if (fliterJson.length === 0 && upload.file["size"] === 0) {
console.log("000011111");
let json = [];
json = uploadInfoList.concat({
json = item.list.concat({
name: upload.file.name,
bytesUploaded: 0,
bytesTotal: 0,
......@@ -131,21 +150,22 @@ const UseTusUpload = (props) => {
statusMsg: "上传成功",
upload,
});
uploadInfoStore?.setUploadInfo(id, {
uploadInfoStore?.setUploadInfo(item.id, {
open: true,
list: json,
isPermanence: uploadInfoIsPermanence,
isPermanence: item.isPermanence,
});
} else {
uploadInfoList.map((item) => {
console.log(item.list, "000022222");
item.list.map((item) => {
if (item.id === timeId) {
item["statusMsg"] = "上传成功";
}
});
uploadInfoStore?.setUploadInfo(id, {
uploadInfoStore?.setUploadInfo(item.id, {
open: true,
list: uploadInfoList,
isPermanence: uploadInfoIsPermanence,
list: item.list,
isPermanence: item.isPermanence,
});
}
callBack && callBack(upload, filepath);
......@@ -155,391 +175,391 @@ const UseTusUpload = (props) => {
upload.start();
};
const uploadFileCallBack = (file, url, filepath, callBack) => {
if (!verifyLettersNumbersCertainChars4(file.name)) {
let json1 = uploadInfoList.concat({
name: file.name,
bytesUploaded: 0,
bytesTotal: 0,
percentage: 0,
startTime: new Date().getTime(),
endTime: new Date().getTime() + 1000,
bytesUploaded2: 0,
fileIsCn: true,
id: new Date().getTime,
statusMsg: "上传失败",
upload: null,
statusMsgDetail:
"上传失败，文件或文件夹的命名长度不超过127字节，不支持特殊符号、空格。",
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json1,
isPermanence: false,
});
return;
}
for (let i in localStorage) {
if (i.indexOf("tus::tus-br") > -1) {
localStorage.removeItem(i);
}
}
uploadInfoStore?.setUploadInfoIsPermanence(false);
// const uploadFileCallBack = (file, url, filepath, callBack) => {
// if (!verifyLettersNumbersCertainChars4(file.name)) {
// let json1 = uploadInfoList.concat({
// name: file.name,
// bytesUploaded: 0,
// bytesTotal: 0,
// percentage: 0,
// startTime: new Date().getTime(),
// endTime: new Date().getTime() + 1000,
// bytesUploaded2: 0,
// fileIsCn: true,
// id: new Date().getTime,
// statusMsg: "上传失败",
// upload: null,
// statusMsgDetail:
// "上传失败，文件或文件夹的命名长度不超过127字节，不支持特殊符号、空格。",
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json1,
// isPermanence: false,
// });
// return;
// }
// for (let i in localStorage) {
// if (i.indexOf("tus::tus-br") > -1) {
// localStorage.removeItem(i);
// }
// }
// uploadInfoStore?.setUploadInfoIsPermanence(false);
// Create a new tus upload
let timeId = new Date().getTime();
// // Create a new tus upload
// let timeId = new Date().getTime();
let headers = {
username: "",
token: "",
filetoken: "",
share: false,
};
let upload = new tus.Upload(file, {
endpoint: url,
parallelUploads: 1,
chunkSize: 5242880,
metadata: {
filepath: filepath,
},
retryDelays: [0, 3000, 5000, 10000, 20000],
headers: headers,
onError: function (error) {
console.log("Failed because: " + error);
},
onProgress: function (bytesUploaded, bytesTotal, a) {
var percentage = ((bytesUploaded / bytesTotal) * 100).toFixed(2);
let fliterJson = uploadInfoList.filter((item) => item.id === timeId);
let json = [];
if (fliterJson.length === 0) {
json = uploadInfoList.concat({
name: upload.file.name,
bytesUploaded: bytesUploaded,
bytesTotal: bytesTotal,
percentage: percentage,
startTime: new Date().getTime(),
endTime: new Date().getTime() + 1000,
bytesUploaded2: bytesUploaded,
id: timeId,
statusMsg: "正在上传",
upload,
dir: "/home/cloudam/",
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json,
isPermanence: uploadInfoIsPermanence,
});
} else {
let a = uploadInfoList;
let time = new Date().getTime();
a.map((element) => {
if (element.id === timeId) {
element["bytesUploaded"] = bytesUploaded;
element["bytesTotal"] = bytesTotal;
element["percentage"] = percentage;
element["bytesUploaded2"] =
parseInt((parseInt(time) - parseInt(element.endTime)) / 1000) >=
2
? bytesUploaded
: element["bytesUploaded2"];
element["endTime"] =
parseInt((parseInt(time) - parseInt(element.endTime)) / 1000) >=
2
? time
: element["endTime"];
}
});
uploadInfoStore?.setUploadInfo({
open: true,
list: a.concat([]),
isPermanence: uploadInfoIsPermanence,
});
}
},
onSuccess: function () {
let fliterJson = uploadInfoList.filter((item) => item.id === timeId);
if (fliterJson.length === 0 && upload.file["size"] === 0) {
let json = [];
json = uploadInfoList.concat({
name: upload.file.name,
bytesUploaded: 0,
bytesTotal: 0,
id: timeId,
percentage: 100,
startTime: new Date().getTime(),
endTime: new Date().getTime() + 1000,
bytesUploaded2: 0,
statusMsg: "上传成功",
upload,
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json,
isPermanence: uploadInfoIsPermanence,
});
} else {
uploadInfoList.map((item) => {
if (item.id === timeId) {
item["statusMsg"] = "上传成功";
}
});
// let headers = {
// username: "",
// token: "",
// filetoken: "",
// share: false,
// };
// let upload = new tus.Upload(file, {
// endpoint: url,
// parallelUploads: 1,
// chunkSize: 5242880,
// metadata: {
// filepath: filepath,
// },
// retryDelays: [0, 3000, 5000, 10000, 20000],
// headers: headers,
// onError: function (error) {
// console.log("Failed because: " + error);
// },
// onProgress: function (bytesUploaded, bytesTotal, a) {
// var percentage = ((bytesUploaded / bytesTotal) * 100).toFixed(2);
// let fliterJson = uploadInfoList.filter((item) => item.id === timeId);
// let json = [];
// if (fliterJson.length === 0) {
// json = uploadInfoList.concat({
// name: upload.file.name,
// bytesUploaded: bytesUploaded,
// bytesTotal: bytesTotal,
// percentage: percentage,
// startTime: new Date().getTime(),
// endTime: new Date().getTime() + 1000,
// bytesUploaded2: bytesUploaded,
// id: timeId,
// statusMsg: "正在上传",
// upload,
// dir: "/home/cloudam/",
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json,
// isPermanence: uploadInfoIsPermanence,
// });
// } else {
// let a = uploadInfoList;
// let time = new Date().getTime();
// a.map((element) => {
// if (element.id === timeId) {
// element["bytesUploaded"] = bytesUploaded;
// element["bytesTotal"] = bytesTotal;
// element["percentage"] = percentage;
// element["bytesUploaded2"] =
// parseInt((parseInt(time) - parseInt(element.endTime)) / 1000) >=
// 2
// ? bytesUploaded
// : element["bytesUploaded2"];
// element["endTime"] =
// parseInt((parseInt(time) - parseInt(element.endTime)) / 1000) >=
// 2
// ? time
// : element["endTime"];
// }
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: a.concat([]),
// isPermanence: uploadInfoIsPermanence,
// });
// }
// },
// onSuccess: function () {
// let fliterJson = uploadInfoList.filter((item) => item.id === timeId);
// if (fliterJson.length === 0 && upload.file["size"] === 0) {
// let json = [];
// json = uploadInfoList.concat({
// name: upload.file.name,
// bytesUploaded: 0,
// bytesTotal: 0,
// id: timeId,
// percentage: 100,
// startTime: new Date().getTime(),
// endTime: new Date().getTime() + 1000,
// bytesUploaded2: 0,
// statusMsg: "上传成功",
// upload,
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json,
// isPermanence: uploadInfoIsPermanence,
// });
// } else {
// uploadInfoList.map((item) => {
// if (item.id === timeId) {
// item["statusMsg"] = "上传成功";
// }
// });
uploadInfoStore?.setUploadInfo({
open: true,
list: uploadInfoList,
isPermanence: uploadInfoIsPermanence,
});
}
callBack && callBack(upload);
},
});
// Start the upload
upload.start();
};
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: uploadInfoList,
// isPermanence: uploadInfoIsPermanence,
// });
// }
// callBack && callBack(upload);
// },
// });
// // Start the upload
// upload.start();
// };
const uploadFileFunc = (
file,
url,
filepath,
page,
length,
allFile,
path,
timeId,
callBack
) => {
// Create a new tus upload
for (let i in localStorage) {
if (i.indexOf("tus::tus-br") > -1) {
localStorage.removeItem(i);
}
}
let timeIdFile = new Date().getTime();
// const uploadFileFunc = (
// file,
// url,
// filepath,
// page,
// length,
// allFile,
// path,
// timeId,
// callBack
// ) => {
// // Create a new tus upload
// for (let i in localStorage) {
// if (i.indexOf("tus::tus-br") > -1) {
// localStorage.removeItem(i);
// }
// }
// let timeIdFile = new Date().getTime();
let headers = {
username: "",
token: "",
filetoken: "",
share: false,
};
let uploads = new tus.Upload(file, {
endpoint: url,
parallelUploads: 1,
chunkSize: 5242880,
metadata: {
filepath: filepath,
},
retryDelays: [0, 3000, 5000, 10000, 20000],
headers: headers,
onError: function (error) {
console.log("Failed because: " + error);
},
onProgress: function (bytesUploaded, bytesTotal, percentage) {
// console.log("正在上传的文件名:" + uploads['file']['name'], 'onProgress')
if (
uploadInfoList.filter((item) => item.id === timeId) &&
uploadInfoList.filter((item) => item.id === timeId).length > 0
) {
let k = uploadInfoList;
k.map((item) => {
if (item.id === timeId) {
item["upload"] = uploads;
}
});
uploadInfoStore?.setUploadInfo({
open: true,
list: k,
isPermanence: uploadInfoIsPermanence,
});
// let headers = {
// username: "",
// token: "",
// filetoken: "",
// share: false,
// };
// let uploads = new tus.Upload(file, {
// endpoint: url,
// parallelUploads: 1,
// chunkSize: 5242880,
// metadata: {
// filepath: filepath,
// },
// retryDelays: [0, 3000, 5000, 10000, 20000],
// headers: headers,
// onError: function (error) {
// console.log("Failed because: " + error);
// },
// onProgress: function (bytesUploaded, bytesTotal, percentage) {
// // console.log("正在上传的文件名:" + uploads['file']['name'], 'onProgress')
// if (
// uploadInfoList.filter((item) => item.id === timeId) &&
// uploadInfoList.filter((item) => item.id === timeId).length > 0
// ) {
// let k = uploadInfoList;
// k.map((item) => {
// if (item.id === timeId) {
// item["upload"] = uploads;
// }
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: k,
// isPermanence: uploadInfoIsPermanence,
// });
return;
}
let json = uploadInfoList.concat({
name: allFile[page]["path"].split("/")[0],
bytesUploaded: page + 1,
statusMsg: "正在上传",
bytesTotal: length,
upload: uploads,
ids: timeIdFile,
percentage: ((page + 1) / length) * 100,
type: "folder",
id: timeId,
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json,
isPermanence: uploadInfoIsPermanence,
});
},
onSuccess: function (bytesUploaded, bytesTotal, percentage) {
++page;
// 每次成功 page累加 当page 与 总上传文件长度 进行比较 判断是否上传文件夹是否成功。
if (page >= length) {
uploadInfoList.map((item) => {
if (item.id === timeId) {
item["statusMsg"] = "上传成功";
item["bytesUploaded"] = length;
item["bytesTotal"] = length;
item["percentage"] = 100;
}
});
uploadInfoStore?.setUploadInfo({
open: uploadInfoOpen,
list: uploadInfoList,
isPermanence: uploadInfoIsPermanence,
});
// return;
// }
// let json = uploadInfoList.concat({
// name: allFile[page]["path"].split("/")[0],
// bytesUploaded: page + 1,
// statusMsg: "正在上传",
// bytesTotal: length,
// upload: uploads,
// ids: timeIdFile,
// percentage: ((page + 1) / length) * 100,
// type: "folder",
// id: timeId,
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json,
// isPermanence: uploadInfoIsPermanence,
// });
// },
// onSuccess: function (bytesUploaded, bytesTotal, percentage) {
// ++page;
// // 每次成功 page累加 当page 与 总上传文件长度 进行比较 判断是否上传文件夹是否成功。
// if (page >= length) {
// uploadInfoList.map((item) => {
// if (item.id === timeId) {
// item["statusMsg"] = "上传成功";
// item["bytesUploaded"] = length;
// item["bytesTotal"] = length;
// item["percentage"] = 100;
// }
// });
// uploadInfoStore?.setUploadInfo({
// open: uploadInfoOpen,
// list: uploadInfoList,
// isPermanence: uploadInfoIsPermanence,
// });
// 上传文件夹成功 回调 页面 刷新 列表 重新请求数据
callBack && callBack(true);
return;
} else {
// 判断 传输列表中是否有 有该 id 的任务
// 进度 判断: 成功一个文件 page 累加 redux
if (
uploadInfoList((item) => item.id === timeId) &&
uploadInfoList((item) => item.id === timeId).length > 0
) {
let newList = uploadInfoList;
newList.forEach((items) => {
if (items.id === timeId) {
items["name"] = allFile[page]["path"].split("/")[0];
items["bytesUploaded"] = page + 1;
items["bytesTotal"] = length;
items["statusMsg"] = "正在上传";
items["percentage"] = ((page + 1) / length) * 100;
}
});
uploadInfoStore?.setUploadInfo({
open: true,
list: newList.concat([]),
isPermanence: uploadInfoIsPermanence,
});
}
uploadFileFunc(
allFile[page],
url,
path === "/"
? path + allFile[page]["path"]
: path + "/" + allFile[page]["path"],
page,
allFile.length,
allFile,
path,
timeId,
callBack
);
}
},
});
// 每次调用 把 任务 重新赋值给 该上传任务 以便于 文件夹暂停下载功能实现
if (
uploadInfoList.filter((item) => item.id === timeId) &&
uploadInfoList.filter((item) => item.id === timeId).length > 0
) {
let k = uploadInfoList;
k.map((item) => {
if (item.id === timeId) {
item["upload"] = uploads;
}
});
uploadInfoStore?.setUploadInfo({
open: true,
list: k,
isPermanence: uploadInfoIsPermanence,
});
}
uploads.start();
};
// // 上传文件夹成功 回调 页面 刷新 列表 重新请求数据
// callBack && callBack(true);
// return;
// } else {
// // 判断 传输列表中是否有 有该 id 的任务
// // 进度 判断: 成功一个文件 page 累加 redux
// if (
// uploadInfoList((item) => item.id === timeId) &&
// uploadInfoList((item) => item.id === timeId).length > 0
// ) {
// let newList = uploadInfoList;
// newList.forEach((items) => {
// if (items.id === timeId) {
// items["name"] = allFile[page]["path"].split("/")[0];
// items["bytesUploaded"] = page + 1;
// items["bytesTotal"] = length;
// items["statusMsg"] = "正在上传";
// items["percentage"] = ((page + 1) / length) * 100;
// }
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: newList.concat([]),
// isPermanence: uploadInfoIsPermanence,
// });
// }
// uploadFileFunc(
// allFile[page],
// url,
// path === "/"
// ? path + allFile[page]["path"]
// : path + "/" + allFile[page]["path"],
// page,
// allFile.length,
// allFile,
// path,
// timeId,
// callBack
// );
// }
// },
// });
// // 每次调用 把 任务 重新赋值给 该上传任务 以便于 文件夹暂停下载功能实现
// if (
// uploadInfoList.filter((item) => item.id === timeId) &&
// uploadInfoList.filter((item) => item.id === timeId).length > 0
// ) {
// let k = uploadInfoList;
// k.map((item) => {
// if (item.id === timeId) {
// item["upload"] = uploads;
// }
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: k,
// isPermanence: uploadInfoIsPermanence,
// });
// }
// uploads.start();
// };
const uploadFolder = (file, url, filepath, callBack) => {
// tus 上传会设置 缓存 清除缓存设置
for (let i in localStorage) {
if (i.indexOf("tus::tus-br") > -1) {
localStorage.removeItem(i);
}
}
// 打开传输列表
uploadInfoStore?.setUploadInfoIsPermanence(false);
// const uploadFolder = (file, url, filepath, callBack) => {
// // tus 上传会设置 缓存 清除缓存设置
// for (let i in localStorage) {
// if (i.indexOf("tus::tus-br") > -1) {
// localStorage.removeItem(i);
// }
// }
// // 打开传输列表
// uploadInfoStore?.setUploadInfoIsPermanence(false);
// 判断 文件夹中 是否中 是否 全部是中文 不是 过滤 文件路径中文或者特殊符号 含有任务的
let filterFileJson = [];
if (file && file.length > 0) {
filterFileJson = file.filter((item) =>
verifyLettersNumbersCertainChars5(item.path)
);
}
if (filterFileJson && filterFileJson.length === 0) {
let json1 = uploadInfoList.concat({
name: file[0]["path"].split("/")[0],
bytesUploaded: 0,
bytesTotal: 0,
percentage: 0,
startTime: new Date().getTime(),
endTime: new Date().getTime() + 1000,
bytesUploaded2: 0,
fileIsCn: true,
statusMsg: "上传失败",
type: true,
statusMsgDetail:
"上传失败，文件或文件夹的命名长度不超过127字节，不支持特殊符号、空格。",
// 已自动过滤掉命名包含中文、特殊符号、空格的文件及文件夹
upload: null,
id: new Date().getTime(),
dir: "/home/cloudam/",
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json1,
isPermanence: false,
});
return;
}
let timeId = new Date().getTime();
if (filterFileJson && filterFileJson.length < file.length) {
let json1 = uploadInfoList.concat({
name: file[0]["path"].split("/")[0],
bytesUploaded: 0,
bytesTotal: filterFileJson.length,
percentage: 0,
startTime: new Date().getTime(),
endTime: new Date().getTime() + 1000,
id: timeId,
type: true,
statusMsg: "正在上传",
statusMsgDetail: "已自动过滤掉命名包含特殊符号、空格的文件及文件夹",
});
uploadInfoStore?.setUploadInfo({
open: true,
list: json1,
isPermanence: false,
});
}
// // 判断 文件夹中 是否中 是否 全部是中文 不是 过滤 文件路径中文或者特殊符号 含有任务的
// let filterFileJson = [];
// if (file && file.length > 0) {
// filterFileJson = file.filter((item) =>
// verifyLettersNumbersCertainChars5(item.path)
// );
// }
// if (filterFileJson && filterFileJson.length === 0) {
// let json1 = uploadInfoList.concat({
// name: file[0]["path"].split("/")[0],
// bytesUploaded: 0,
// bytesTotal: 0,
// percentage: 0,
// startTime: new Date().getTime(),
// endTime: new Date().getTime() + 1000,
// bytesUploaded2: 0,
// fileIsCn: true,
// statusMsg: "上传失败",
// type: true,
// statusMsgDetail:
// "上传失败，文件或文件夹的命名长度不超过127字节，不支持特殊符号、空格。",
// // 已自动过滤掉命名包含中文、特殊符号、空格的文件及文件夹
// upload: null,
// id: new Date().getTime(),
// dir: "/home/cloudam/",
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json1,
// isPermanence: false,
// });
// return;
// }
// let timeId = new Date().getTime();
// if (filterFileJson && filterFileJson.length < file.length) {
// let json1 = uploadInfoList.concat({
// name: file[0]["path"].split("/")[0],
// bytesUploaded: 0,
// bytesTotal: filterFileJson.length,
// percentage: 0,
// startTime: new Date().getTime(),
// endTime: new Date().getTime() + 1000,
// id: timeId,
// type: true,
// statusMsg: "正在上传",
// statusMsgDetail: "已自动过滤掉命名包含特殊符号、空格的文件及文件夹",
// });
// uploadInfoStore?.setUploadInfo({
// open: true,
// list: json1,
// isPermanence: false,
// });
// }
let page = 0;
file = filterFileJson;
uploadFileFunc(
file[page],
url,
filepath === "/"
? filepath + file[page]["path"]
: filepath + "/" + file[page]["path"],
page,
file.length,
file,
filepath,
timeId,
callBack
);
return file;
// Start the upload
};
// let page = 0;
// file = filterFileJson;
// uploadFileFunc(
// file[page],
// url,
// filepath === "/"
// ? filepath + file[page]["path"]
// : filepath + "/" + file[page]["path"],
// page,
// file.length,
// file,
// filepath,
// timeId,
// callBack
// );
// return file;
// // Start the upload
// };
return {
uploadFile,
uploadFileCallBack,
uploadFolder,
uploadFileFunc,
// uploadFileCallBack,
// uploadFolder,
// uploadFileFunc,
};
};
......
src/utils/util.ts
View file @ b219876e
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-07 18:37:53
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-14 10:32:54
* @LastEditTime: 2022-06-14 17:21:52
* @FilePath: /bkunyun/src/utils/util.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -29,19 +29,30 @@ export const isProjectOwner = (name: string) => {
return pwd;
};
// 获取用户token 信息
// 获取用户信息
export const getUserInfo = () => {
let val: any;
try {
val = JSON.parse(localStorage.getItem("userInfo") || "{}")
}
catch {
console.error("获取用户信息token 出错");
console.error("获取用户信息 出错");
}
return val
}
// 获取token信息
export const getTokenInfo = () => {
let val: any;
try {
val = JSON.parse(localStorage.getItem("token") || "{}")
}
catch {
console.error("获取token信息 出错");
}
return val
}
const IsNumberLetterChineseReg = new RegExp("^[A-Za-z0-9\u4e00-\u9fa5]+$");
......@@ -52,4 +63,4 @@ export const checkIsNumberLetterChinese = (string: string) => {
export const getMbfromB = (b: number) => {
return Math.floor(b / 1048576);
};
};
\ No newline at end of file
src/views/ConsoleLayout/components/FileItem/index.tsx
View file @ b219876e
import { useEffect } from "react";
import useGlobalStore from "@/hooks/useGlobalStore";
import { observer } from "mobx-react-lite";
import { toJS } from "mobx";
import UseTusUpload from "@/utils/Upload/tusUpload";
// import { any } from "@/store/modules/fileList";
// toJS(currentProjectStore.currentProjectInfo.id);
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-11 15:46:42
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-14 11:07:55
* @LastEditTime: 2022-06-14 21:35:09
* @FilePath: /bkunyun/src/views/ConsoleLayout/components/FileItem/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
const FileItem = observer(() => {
const fileList = toJS(useGlobalStore("fileList"));
const { uploadFile } = UseTusUpload(fileList?.fileList);
useEffect(() => {
fileList?.fileList?.forEach((item) => {
uploadFile(
item.id,
item.list,
"/",
"/",
(upload: any, filepath: string) => console.log(upload, filepath, 1111)
);
});
console.log(fileList?.fileList, 1111);
}, [fileList.fileList, uploadFile]);
interface IProps {
fileItemInfo: any;
}
const FileItem = (props: IProps) => {
const { fileItemInfo } = props;
console.log(fileItemInfo, 2222);
return <div>dd</div>;
});
};
export default FileItem;
src/views/ConsoleLayout/components/TransferList/index.tsx
View file @ b219876e
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-10 18:05:21
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-11 18:08:27
* @LastEditTime: 2022-06-14 21:00:46
* @FilePath: /bkunyun/src/views/ConsoleLayout/components/TransferList/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -12,8 +12,11 @@ import { memo } from "react";
import MySelect from "@/components/mui/MySelect";
import MyTitle from "@/components/mui/MyTitle";
import FileItem from "../FileItem";
import useGlobalStore from "@/hooks/useGlobalStore";
import { observer } from "mobx-react-lite";
const TranSferList = () => {
const TranSferList = observer(() => {
const fileList = useGlobalStore("fileListStore");
return (
<Box style={{ width: 520, padding: 20 }}>
<MyTitle title="传输列表" />
......@@ -42,10 +45,12 @@ const TranSferList = () => {
/>
</Box>
<Box>
<FileItem />
{fileList?.fileList.map((item) => {
return <FileItem fileItemInfo={item} />;
})}
</Box>
</Box>
);
};
});
export default memo(TranSferList);
src/views/ConsoleLayout/index.tsx
View file @ b219876e
......@@ -16,6 +16,13 @@ import MyPopover from "@/components/mui/MyPopover";
import TranSferList from "./components/TransferList";
import style from "./index.module.css";
import useGlobalStore from "@/hooks/useGlobalStore";
import { toJS } from "mobx";
import { urlToken } from "@/api/fileserver/raysyncApi";
import UseTusUpload from "@/utils/Upload/tusUpload";
import useMyRequest from "@/hooks/useMyRequest";
import { getDataFileToken } from "@/api/project_api";
import useDeepEffect from "@/hooks/useDeepEffect";
const ConsoleLayout = observer(() => {
const {
......@@ -36,6 +43,42 @@ const ConsoleLayout = observer(() => {
permissionStore.setSidebarRouters(location.pathname);
}, [location, permissionStore]);
const fileList = toJS(useGlobalStore("fileListStore"));
const currentProjectStore = toJS(useGlobalStore("currentProjectStore"));
const { uploadFile } = UseTusUpload({
fileListStore: fileList,
currentProjectStore,
});
/** 获取文件token请求 */
const { run: getDataFileTokenRun } = useMyRequest(getDataFileToken, {
onSuccess: (res: any) => {
let url =
"https://fileserver.cloudam.cn/parallelupload/" +
urlToken(
res?.data || "",
currentProjectStore?.currentProjectInfo?.id as string
);
fileList?.newFileList?.forEach((item: any) => {
uploadFile(
item,
item?.list,
url,
"/",
(upload: any, filepath: string) => console.log(upload, filepath, 1111)
);
});
},
});
useDeepEffect(() => {
if (fileList?.newFileList?.length) {
getDataFileTokenRun({
id: currentProjectStore?.currentProjectInfo.id || "",
});
}
}, [fileList?.newFileList]);
return (
<Box>
<Box className={style.topApp}>
......
src/views/Project/ProjectData/UpLoaderFile/index.tsx
View file @ b219876e
......@@ -13,11 +13,12 @@ import noFile from "@/assets/project/noFile.svg";
import uploaderIcon from "@/assets/project/uploaderIcon.svg";
import classnames from "classnames";
import { getMbfromB } from "@/utils/util";
import { observer } from "mobx-react-lite";
import useGlobalStore from "@/hooks/useGlobalStore";
import { observer } from "mobx-react";
import { useStores } from "@/store";
import { toJS } from "mobx";
const UpLoaderFile = observer((props: any) => {
const uploadInfoStore = useGlobalStore("fileList");
const { fileListStore } = useStores();
const message = useMessage();
const [fileList, setFileList] = useState<any>([]);
// list 是项目数据table的数据
......@@ -59,17 +60,17 @@ const UpLoaderFile = observer((props: any) => {
let dialogRef: any = React.createRef();
const handleSubmit = () => {
const newFileList = fileList?.map((item: any) => {
return {
id: uuid(),
open: false,
list: item,
isPermanence: true,
};
});
uploadInfoStore.setFileList(newFileList);
console.log("handleSubmit");
const newFileList =
fileList?.map((item: any) => {
return {
id: uuid(),
open: false,
list: item,
isPermanence: true,
};
}) || [];
console.log(newFileList);
toJS(fileListStore?.setNewFileList)(newFileList);
};
const showDialog = () => {
......
src/views/Project/ProjectSetting/BaseInfo/index.tsx
View file @ b219876e
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-01 09:15:10
* @LastEditTime: 2022-06-14 15:40:27
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment