-
+
@@ -23,6 +24,7 @@
@@ -40,13 +42,32 @@ defineProps<{
:file-name="key.name"
:size="key.size"
>
+
+
+
+
-
+
- {{ value }}%
+ {{
+ typeof value === "string"
+ ? value
+ : typeof value === "number"
+ ? value === 100
+ ? "Finishing upload..."
+ : `${value}%`
+ : "Upload completed"
+ }}
diff --git a/SecureSend/ClientApp/src/views/FileUploadView.vue b/SecureSend/ClientApp/src/views/FileUploadView.vue
index eead77f..f435b6b 100644
--- a/SecureSend/ClientApp/src/views/FileUploadView.vue
+++ b/SecureSend/ClientApp/src/views/FileUploadView.vue
@@ -24,16 +24,22 @@
>
Back
- {{ step < 2 ? "Next" : "Upload" }}
+
+ {{ step < 2 ? "Next" : "Upload" }}
+
+
@@ -59,7 +65,7 @@ import SchemaInput from "@/components/FileUploadForm/SchemaInput.vue";
import { SecureSendService } from "@/services/SecureSendService";
import AuthenticatedSecretKeyCryptography from "@/utils/AuthenticatedSecretKeyCryptography";
import splitFile from "@/utils/splitFile";
-import { ref } from "vue";
+import { ref, type Ref } from "vue";
import { useForm } from "vee-validate";
import { computed } from "vue";
import FileInput from "@/components/FileUploadForm/FileInput.vue";
@@ -69,6 +75,8 @@ import { ButtonType } from "@/models/enums/ButtonType";
import ConfirmModalVue from "@/components/ConfirmModal.vue";
import { useConfirmDialog } from "@/utils/composables/useConfirmDialog";
import SimpleInput from "@/components/SimpleInput.vue";
+import { inject } from "vue";
+import LoadingIndicator from "@/components/LoadingIndicator.vue";
interface IMappedFormValues {
expiryDate: string;
@@ -84,6 +92,8 @@ const step = ref
(0);
let downloadUrl: string;
+const isLoading = inject[>("isLoading");
+
const stepZeroschema = {
password(value: string) {
if (value) return true;
@@ -119,11 +129,15 @@ const { handleSubmit, meta, resetForm } = useForm({
const onSubmit = handleSubmit(async (values: IMappedFormValues) => {
if (step.value === 1) {
+ isLoading!.value = true;
await SecureSendService.createSecureUpload(uuid);
+ isLoading!.value = false;
} else if (step.value === 2) {
+ isLoading!.value = true;
keychain = new AuthenticatedSecretKeyCryptography(values.password, salt);
await keychain.start();
await encryptFile();
+ isLoading!.value = false;
const { data } = await reveal();
console.log(data);
if (data) {
@@ -141,7 +155,7 @@ const copyToClipboard = () => navigator.clipboard.writeText(downloadUrl);
const uuid = self.crypto.randomUUID();
const uploadStatus = ref();
-const files = ref(new Map());
+const files = ref(new Map());
const onFilesChange = (event: any) => {
files.value.clear();
@@ -177,7 +191,12 @@ const encryptFile = async () => {
chunk,
file.type
);
- files.value.set(file, Math.ceil(((num + 1) / totalChunks) * 100));
+ files.value.set(
+ file,
+ num + 1 === totalChunks
+ ? true
+ : Math.ceil(((num + 1) / totalChunks) * 100)
+ );
} catch (error) {
files.value.set(file, "Error with uploading file");
throw error;
]