Display importScreen when stage is not "default".

5 files changed, 14 insertions, 12 deletions

diff --git a/src/components/ImportScreen.vue b/src/components/ImportScreen.vue
index c55816d5..e0f3f827 100644
--- a/src/components/ImportScreen.vue
+++ b/src/components/ImportScreen.vue
@@ -21,7 +21,7 @@
   -->
 
 <template>
-	<div v-if="importState.stage != 'default'" class="emptycontent import-screen">
+	<div class="emptycontent import-screen">
 		<p class="icon-upload" />
 		<h3 class="import-screen__header">{{ t('contacts', 'Importing into') }} {{ addressbook }}</h3>
 		<progress :max="importState.total" :value="importState.accepted" class="import-screen__progress" />
diff --git a/src/components/Settings/SettingsImportContacts.vue b/src/components/Settings/SettingsImportContacts.vue
index 23a4990c..dc79ab75 100644
--- a/src/components/Settings/SettingsImportContacts.vue
+++ b/src/components/Settings/SettingsImportContacts.vue
@@ -88,12 +88,10 @@ export default {
 			let file = event.target.files[0]
 			let reader = new FileReader()
 			let selectedAddressbook = this.selectedAddressbook
-			// this.$store.dispatch('changeStage', 'parsing')
+			this.$store.dispatch('changeStage', 'parsing')
 			let self = this
 			reader.onload = function(e) {
-				// self.$store.dispatch('changeStage', 'importing')
 				self.$store.dispatch('getContactsFromAddressBook', { vcf: reader.result, addressbook: selectedAddressbook, importState: this.importState })
-				// self.$store.dispatch('changeStage', 'default')
 			}
 			reader.readAsText(file)
 		}
diff --git a/src/services/parseVcf.js b/src/services/parseVcf.js
index 36797982..e74b083f 100644
--- a/src/services/parseVcf.js
+++ b/src/services/parseVcf.js
@@ -28,8 +28,6 @@ export default function parseVcf(data = '', addressbook) {
 	let vCards = data.match(regexp)
 	let importState = Store.getters.getImportState
 
-	importState.total = vCards.length
-
 	if (!vCards) {
 		console.debug('Error during the parsing of the following vcf file: ', data)
 		return []
diff --git a/src/store/addressbooks.js b/src/store/addressbooks.js
index cc091c5c..169dfc41 100644
--- a/src/store/addressbooks.js
+++ b/src/store/addressbooks.js
@@ -208,11 +208,13 @@ const actions = {
 	 */
 	importContactsIntoAddressbook(context, { vcf, addressbook }) {
 		let contacts = parseVcf(vcf, addressbook)
+		this.$store.dispatch('changeStage', 'importing')
 		contacts.forEach(contact => {
 			context.commit('addContact', contact)
 			context.commit('addContactToAddressbook', contact)
 			context.commit('appendGroupsFromContacts', [contact])
 		})
+		this.$store.dispatch('changeStage', 'default')
 	},
 
 	/**
diff --git a/src/views/Contacts.vue b/src/views/Contacts.vue
index 8c0e6c5b..f39ef934 100644
--- a/src/views/Contacts.vue
+++ b/src/views/Contacts.vue
@@ -33,11 +33,13 @@
 		<div id="app-content">
 			<div id="app-content-wrapper">
 				<!-- loading -->
-				<import-screen />
-				<!-- contacts list -->
-				<content-list :list="contactsList" :contacts="contacts" :loading="loading" />
-				<!-- main contacts details -->
-				<contact-details :loading="loading" :uid="selectedContact" />
+				<import-screen v-if="importState.stage != 'default'" />
+				<template v-else>
+					<!-- contacts list -->
+					<content-list :list="contactsList" :contacts="contacts" :loading="loading" />
+					<!-- main contacts details -->
+					<contact-details :loading="loading" :uid="selectedContact" />
+				</template>
 			</div>
 		</div>
 
@@ -101,7 +103,9 @@ export default {
 		orderKey() {
 			return this.$store.getters.getOrderKey
 		},
-
+		importState() {
+			return this.$store.getters.getImportState
+		},
 		// first enabled addressbook of the list
 		defaultAddressbook() {
 			return this.addressbooks.find(addressbook => addressbook.enabled)