From 7574f529c353b1a6e6b845b7bca0685b38a41c2f Mon Sep 17 00:00:00 2001
From: lana-k <skochetova89@gmail.com>
Date: Thu, 6 May 2021 15:17:15 +0200
Subject: [PATCH] add hidden state for file in animation

---
 src/components/DbUploader/index.vue | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/DbUploader/index.vue b/src/components/DbUploader/index.vue
index 27ca871..6b5a5fa 100644
--- a/src/components/DbUploader/index.vue
+++ b/src/components/DbUploader/index.vue
@@ -26,7 +26,8 @@
         ref="fileImg"
         :class="{
           'swing': state === 'dragover',
-          'fly': state === 'drop'
+          'fly': state === 'dropping',
+          'hidden': state === 'dropped'
         }"
         :src="require('@/assets/images/file.png')"
       />
@@ -196,6 +197,7 @@ export default {
       this.animationPromise = new Promise((resolve) => {
         this.$refs.fileImg.addEventListener('animationend', event => {
           if (event.animationName.startsWith('fly')) {
+            this.state = 'dropped'
             resolve()
           }
         })
@@ -387,7 +389,7 @@ export default {
     },
 
     async checkFile (file) {
-      this.state = 'drop'
+      this.state = 'dropping'
       if (csvMimeTypes.includes(file.type)) {
         this.file = file
         this.header = true
@@ -519,6 +521,11 @@ export default {
     left: 225px;
   }
 }
+
+#file-img.hidden {
+  display: none;
+}
+
 /* Parse CSV dialog */
 .chars {
   display: flex;