From 70aeb7a48342df9dafa2c49fd8d7ebc34245d591 Mon Sep 17 00:00:00 2001 From: HFO4 <912394456@qq.com> Date: Wed, 13 Apr 2022 18:32:49 +0800 Subject: [PATCH] feat: set uploading task concurrent limit --- src/component/Modals/ConcurrentOption.js | 62 ++++++++++++++++++ src/component/Uploader/Popup/MoreActions.js | 70 +++++++++++++++------ src/component/Uploader/Popup/TaskList.js | 3 - src/component/Uploader/Uploader.js | 5 +- src/component/Uploader/core/index.ts | 4 ++ src/component/Uploader/core/utils/pool.ts | 2 +- 6 files changed, 121 insertions(+), 25 deletions(-) create mode 100644 src/component/Modals/ConcurrentOption.js diff --git a/src/component/Modals/ConcurrentOption.js b/src/component/Modals/ConcurrentOption.js new file mode 100644 index 0000000..a3bf0cd --- /dev/null +++ b/src/component/Modals/ConcurrentOption.js @@ -0,0 +1,62 @@ +import React, { useState } from "react"; +import { Input, InputLabel, makeStyles } from "@material-ui/core"; +import { + Button, + Dialog, + DialogActions, + DialogContent, + DialogTitle, +} from "@material-ui/core"; +import FormControl from "@material-ui/core/FormControl"; +import Auth from "../../middleware/Auth"; +const useStyles = makeStyles((theme) => ({})); + +export default function ConcurrentOptionDialog({ open, onClose, onSave }) { + const [count, setCount] = useState( + Auth.GetPreferenceWithDefault("concurrent_limit", "5") + ); + const classes = useStyles(); + + return ( + + 任务并行数量 + + + + + 同时上传的任务数量 + + setCount(e.target.value)} + /> + + + + + +
+ +
+ + + ); +} diff --git a/src/component/Uploader/Popup/MoreActions.js b/src/component/Uploader/Popup/MoreActions.js index d9edce4..caf9292 100644 --- a/src/component/Uploader/Popup/MoreActions.js +++ b/src/component/Uploader/Popup/MoreActions.js @@ -6,7 +6,7 @@ import { MenuItem, Tooltip, } from "@material-ui/core"; -import React, { useCallback, useMemo } from "react"; +import React, { useCallback, useMemo, useState } from "react"; import { useDispatch } from "react-redux"; import API from "../../../middleware/Api"; import { TaskType } from "../core/types"; @@ -15,6 +15,9 @@ import Divider from "@material-ui/core/Divider"; import CheckIcon from "@material-ui/icons/Check"; import { DeleteEmpty } from "mdi-material-ui"; import DeleteIcon from "@material-ui/icons/Delete"; +import ConcurrentOptionDialog from "../../Modals/ConcurrentOption"; +import Auth from "../../../middleware/Auth"; +import { ClearAll } from "@material-ui/icons"; const useStyles = makeStyles((theme) => ({ icon: { @@ -37,6 +40,7 @@ export default function MoreActions({ }) { const classes = useStyles(); const dispatch = useDispatch(); + const [concurrentDialog, setConcurrentDialog] = useState(false); const ToggleSnackbar = useCallback( (vertical, horizontal, msg, color) => dispatch(toggleSnackbar(vertical, horizontal, msg, color)), @@ -126,6 +130,13 @@ export default function MoreActions({ onClick: () => cleanFinished(), icon: , text: "清除已完成任务", + divider: true, + }, + { + tooltip: "清除列表中已完成、失败、被取消的任务", + onClick: () => setConcurrentDialog(true), + icon: , + text: "设置并行数量", divider: false, }, ], @@ -140,25 +151,44 @@ export default function MoreActions({ ] ); + const onConcurrentLimitSave = (val) => { + val = parseInt(val); + if (val > 0) { + Auth.SetPreference("concurrent_limit", val); + uploadManager.changeConcurrentLimit(parseInt(val)); + } + setConcurrentDialog(false); + }; + return ( - - {listItems.map((item) => ( - <> - - - - {item.icon} - - {item.text} - - - {item.divider && } - - ))} - + <> + + {listItems.map((item) => ( + <> + + + + {item.icon} + + {item.text} + + + {item.divider && } + + ))} + + setConcurrentDialog(false)} + onSave={onConcurrentLimitSave} + /> + ); } diff --git a/src/component/Uploader/Popup/TaskList.js b/src/component/Uploader/Popup/TaskList.js index 87ebb05..2c63b64 100644 --- a/src/component/Uploader/Popup/TaskList.js +++ b/src/component/Uploader/Popup/TaskList.js @@ -109,9 +109,6 @@ const filters = { ongoing: (u) => u.status < Status.finished, }; -const getTaskListPreference = (key, defaultVal) => - Auth.GetPreference(key) ? Auth.GetPreference(key) : defaultVal; - export default function TaskList({ open, onClose, diff --git a/src/component/Uploader/Uploader.js b/src/component/Uploader/Uploader.js index 0df3100..d8e4163 100644 --- a/src/component/Uploader/Uploader.js +++ b/src/component/Uploader/Uploader.js @@ -13,6 +13,7 @@ import { refreshStorage, toggleSnackbar, } from "../../redux/explorer"; +import Auth from "../../middleware/Auth"; let totalProgressCollector = null; let lastProgressStart = -1; @@ -82,7 +83,9 @@ export default function Uploader() { const uploadManager = useMemo(() => { return new UploadManager({ logLevel: "INFO", - concurrentLimit: 5, + concurrentLimit: parseInt( + Auth.GetPreferenceWithDefault("concurrent_limit", "5") + ), dropZone: document.querySelector("body"), onToast: (type, msg) => { ToggleSnackbar("top", "right", msg, type); diff --git a/src/component/Uploader/core/index.ts b/src/component/Uploader/core/index.ts index 64eba59..11ef391 100644 --- a/src/component/Uploader/core/index.ts +++ b/src/component/Uploader/core/index.ts @@ -79,6 +79,10 @@ export default class UploadManager { } } + changeConcurrentLimit = (newLimit: number) => { + this.pool.limit = newLimit; + }; + dispatchUploader(task: Task): Base { if (task.type == TaskType.resumeHint) { return new ResumeHint(task, this); diff --git a/src/component/Uploader/core/utils/pool.ts b/src/component/Uploader/core/utils/pool.ts index 143828d..e7dd020 100644 --- a/src/component/Uploader/core/utils/pool.ts +++ b/src/component/Uploader/core/utils/pool.ts @@ -11,7 +11,7 @@ export class Pool { queue: Array = []; processing: Array = []; - constructor(private limit: number) {} + constructor(public limit: number) {} enqueue(uploader: Base) { return new Promise((resolve, reject) => {