quasar-ui-danx 0.4.84 → 0.4.87

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar-ui-danx",
-  "version": "0.4.84",
+  "version": "0.4.87",
   "author": "Dan <dan@flytedesk.com>",
   "description": "DanX Vue / Quasar component library",
   "license": "MIT",

package/src/components/ActionTable/Form/Fields/MultiFileField.vue

@@ -125,6 +125,8 @@ onFilesChange(() => {
   if (uploadedFiles.value.some(file => file.progress < 1)) {
     emit("uploading");
   }
+
+  emit("update:model-value", uploadedFiles.value);
 });
 onComplete(() => {
   emit("update:model-value", uploadedFiles.value);

package/src/components/Utility/Buttons/ActionButton.vue

@@ -65,6 +65,7 @@ import {
   FaSolidClock as ClockIcon,
   FaSolidCodeMerge as MergeIcon,
   FaSolidCopy as CopyIcon,
+  FaSolidEye as ViewIcon,
   FaSolidFileExport as ExportIcon,
   FaSolidFileImport as ImportIcon,
   FaSolidFloppyDisk as SaveIcon,
@@ -81,7 +82,7 @@ import { computed, ref } from "vue";
 import { ActionTarget, ResourceAction } from "../../../types";
 
 export interface ActionButtonProps {
-  type?: "save" | "trash" | "back" | "create" | "edit" | "copy" | "folder" | "play" | "stop" | "pause" | "refresh" | "restart" | "confirm" | "cancel" | "export" | "import" | "minus" | "merge" | "check" | "clock";
+  type?: "save" | "trash" | "back" | "create" | "edit" | "copy" | "folder" | "play" | "stop" | "pause" | "refresh" | "restart" | "confirm" | "cancel" | "export" | "import" | "minus" | "merge" | "check" | "clock" | "view";
   color?: "red" | "blue" | "blue-invert" | "sky" | "sky-invert" | "green" | "green-invert" | "lime" | "white" | "gray" | "slate" | "slate-invert" | "yellow" | "orange";
   size?: "xxs" | "xs" | "sm" | "md" | "lg";
   icon?: object | string;
@@ -227,6 +228,8 @@ const typeOptions = computed(() => {
       return { icon: MergeIcon };
     case "check":
       return { icon: CheckIcon };
+    case "view":
+      return { icon: ViewIcon };
     default:
       return { icon: EditIcon };
   }

package/src/helpers/multiFileUpload.ts

@@ -15,34 +15,40 @@ export function useMultiFileUpload(options?: FileUploadOptions) {
 	const onFilesChangeCb: Ref<OnFilesChangeCallback | null> = ref(null);
 	const onFilesSelected = (e: any) => {
 		uploadedFiles.value = [...uploadedFiles.value, ...e.target.files];
+		triggerFilesChange();
+
 		new FileUpload(e.target.files, options)
-				.prepare()
-				.onProgress(({ file }) => {
-					file && updateFileInList(file);
-				})
-				.onComplete(({ file, uploadedFile }) => {
-					file && updateFileInList(file, uploadedFile);
-				})
-				.onError(({ file, error }) => {
-					console.error("Failed to upload", file, error);
-					FlashMessages.error(`Failed to upload ${file.name}: ${error}`);
-				})
-				.onAllComplete(() => {
-					onCompleteCb.value && onCompleteCb.value({
-						file: uploadedFiles.value[0],
-						uploadedFile: uploadedFiles.value[0]
-					});
-					onFilesChangeCb.value && onFilesChangeCb.value(uploadedFiles.value);
-				})
-				.upload();
+			.prepare()
+			.onProgress(({ file }) => {
+				file && updateFileInList(file);
+			})
+			.onComplete(({ file, uploadedFile }) => {
+				file && updateFileInList(file, uploadedFile);
+			})
+			.onError(({ file, error }) => {
+				console.error("Failed to upload", file, error);
+				FlashMessages.error(`Failed to upload ${file.name}: ${error}`);
+			})
+			.onAllComplete(() => {
+				onCompleteCb.value && onCompleteCb.value({
+					file: uploadedFiles.value[0],
+					uploadedFile: uploadedFiles.value[0]
+				});
+				triggerFilesChange();
+			})
+			.upload();
 	};
 
+	function triggerFilesChange() {
+		onFilesChangeCb.value && onFilesChangeCb.value(uploadedFiles.value);
+	}
+
 	function updateFileInList(file: UploadedFile, replace: UploadedFile | null = null) {
 		const index = uploadedFiles.value.findIndex(f => f.id === file.id);
 		if (index !== -1) {
 			uploadedFiles.value.splice(index, 1, replace || file);
 		}
-		onFilesChangeCb.value && onFilesChangeCb.value(uploadedFiles.value);
+		triggerFilesChange();
 	}
 
 	const onDrop = (e: InputEvent) => {
@@ -59,7 +65,7 @@ export function useMultiFileUpload(options?: FileUploadOptions) {
 
 	const clearUploadedFiles = () => {
 		uploadedFiles.value = [];
-		onFilesChangeCb.value && onFilesChangeCb.value(uploadedFiles.value);
+		triggerFilesChange();
 		onCompleteCb.value && onCompleteCb.value({ file: null, uploadedFile: null });
 	};
 
@@ -68,7 +74,7 @@ export function useMultiFileUpload(options?: FileUploadOptions) {
 		if (index !== -1) {
 			uploadedFiles.value.splice(index, 1);
 		}
-		onFilesChangeCb.value && onFilesChangeCb.value(uploadedFiles.value);
+		triggerFilesChange();
 		onCompleteCb.value && onCompleteCb.value({ file, uploadedFile: file });
 	};