andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-07 08:19:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix progress bar when uploading

Browse Source
This commit is contained in:
Proddy
2023-07-02 10:12:31 +02:00
parent 9b21607da5
commit 34113c3698
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
interface/src/components/upload/SingleUpload.tsx
View File

@@ -26,11 +26,12 @@ const getBorderColor = (theme: Theme, props: DropzoneState) => {
export interface SingleUploadProps {
onDrop: (acceptedFiles: File[]) => void;
onCancel: () => void;
isUploading: boolean;
progress: Progress;
}
const SingleUpload: FC<SingleUploadProps> = ({ onDrop, onCancel, progress }) => {
const isUploading = progress.total > 0;
const SingleUpload: FC<SingleUploadProps> = ({ onDrop, onCancel, isUploading, progress }) => {
const uploading = isUploading && progress.total > 0;
const dropzoneState = useDropzone({
onDrop,
@@ -48,7 +49,7 @@ const SingleUpload: FC<SingleUploadProps> = ({ onDrop, onCancel, progress }) =>
const { LL } = useI18nContext();
const progressText = () => {
if (isUploading) {
if (uploading) {
if (progress.total) {
return LL.UPLOADING() + ': ' + Math.round((progress.loaded * 100) / progress.total) + '%';
}
@@ -68,7 +69,7 @@ const SingleUpload: FC<SingleUploadProps> = ({ onDrop, onCancel, progress }) =>
color: theme.palette.grey[400],
transition: 'border .24s ease-in-out',
width: '100%',
cursor: isUploading ? 'default' : 'pointer',
cursor: uploading ? 'default' : 'pointer',
borderColor: getBorderColor(theme, dropzoneState)
}
})}
@@ -77,7 +78,7 @@ const SingleUpload: FC<SingleUploadProps> = ({ onDrop, onCancel, progress }) =>
<Box flexDirection="column" display="flex" alignItems="center">
<CloudUploadIcon fontSize="large" />
<Typography variant="h6">{progressText()}</Typography>
{isUploading && (
{uploading && (
<Fragment>
<Box width="100%" p={2}>
<LinearProgress

3
interface/src/framework/system/UploadFileForm.tsx
View File

@@ -45,7 +45,6 @@ const UploadFileForm: FC = () => {
setMd5(data.md5);
toast.success(LL.UPLOAD() + ' MD5 ' + LL.SUCCESSFUL());
} else {
toast.success(LL.UPLOAD() + ' ' + LL.SUCCESSFUL());
setRestarting(true);
}
});
@@ -123,7 +122,7 @@ const UploadFileForm: FC = () => {
<Typography variant="body2">{'MD5: ' + md5}</Typography>
</Box>
)}
<SingleUpload onDrop={startUpload} onCancel={cancelUpload} progress={progress} />
<SingleUpload onDrop={startUpload} onCancel={cancelUpload} isUploading={isUploading} progress={progress} />
{!isUploading && (
<>
<Typography sx={{ pt: 2, pb: 2 }} variant="h6" color="primary">