summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--css/ImportScreen.scss7
-rw-r--r--package-lock.json16
-rw-r--r--package.json2
-rw-r--r--src/App.vue2
-rw-r--r--src/components/ImportScreen.vue8
-rw-r--r--src/main.js1
-rw-r--r--src/store/addressbooks.js2
-rw-r--r--src/store/importState.js4
-rw-r--r--src/views/Contacts.vue53
9 files changed, 71 insertions, 24 deletions
diff --git a/css/ImportScreen.scss b/css/ImportScreen.scss
index eeb3b11d..0ed09580 100644
--- a/css/ImportScreen.scss
+++ b/css/ImportScreen.scss
@@ -21,18 +21,21 @@
*/
.import-screen {
+ margin: 50px;
+ width: auto;
+ min-width: 30vw;
&__header {
padding-top: 20px;
}
&__progress {
- width: 50%;
+ width: 80%;
min-width: 300px;
margin: auto;
}
&__tracker {
display: flex;
justify-content: space-between;
- width: 50%;
+ width: 80%;
min-width: 300px;
margin: auto;
padding-top: 10px;
diff --git a/package-lock.json b/package-lock.json
index 28086c90..f7047e95 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2258,7 +2258,7 @@
},
"cdav-library": {
"version": "github:nextcloud/cdav-library#d77d03e55eeffd7c7b184d18685726bb74aad8e2",
- "from": "github:nextcloud/cdav-library#d77d03e55eeffd7c7b184d18685726bb74aad8e2",
+ "from": "github:nextcloud/cdav-library",
"requires": {
"@babel/polyfill": "^7.4.0"
}
@@ -6026,9 +6026,9 @@
"dev": true
},
"js-yaml": {
- "version": "3.12.0",
- "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.12.0.tgz",
- "integrity": "sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==",
+ "version": "3.13.0",
+ "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.13.0.tgz",
+ "integrity": "sha512-pZZoSxcCYco+DIKBTimr67J6Hy+EYGZDY/HCWC+iAEA9h1ByhMXAIVUXMcMFpOCxQ/xjXmPI2MkDL5HRm5eFrQ==",
"dev": true,
"requires": {
"argparse": "^1.0.7",
@@ -6946,9 +6946,9 @@
}
},
"nextcloud-vue": {
- "version": "0.9.3",
- "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.9.3.tgz",
- "integrity": "sha512-Z5i1oaDsyGz6JR50Q3uwftP12INMokIIcdx8PqjZgc6HpzX05CaJ6z8SqJsahscYZKRGpy4DCZT3ejrvZcxyWg==",
+ "version": "0.9.4",
+ "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.9.4.tgz",
+ "integrity": "sha512-sXqHs02kWHfoY5H1Hm7fZUWqFSvTSIebWp+Wvc8U0RImDsabcKfybqZ3/JUne/Sv2WzQrM99sPyoGpF80Z7ujQ==",
"requires": {
"hammerjs": "^2.0.8",
"md5": "^2.2.1",
@@ -9355,7 +9355,7 @@
},
"sprintf-js": {
"version": "1.0.3",
- "resolved": "http://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+ "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
"dev": true
},
diff --git a/package.json b/package.json
index 15ec9b25..085d7f55 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
"ical.js": "^1.3.0",
"moment": "^2.24.0",
"nextcloud-server": "^0.15.9",
- "nextcloud-vue": "^0.9.3",
+ "nextcloud-vue": "^0.9.4",
"p-limit": "^2.2.0",
"p-queue": "^4.0.0",
"uuid": "^3.3.2",
diff --git a/src/App.vue b/src/App.vue
index a5d94527..06ab1b3e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -26,6 +26,6 @@
<script>
export default {
- name: 'App'
+ name: 'ContactsRoot'
}
</script>
diff --git a/src/components/ImportScreen.vue b/src/components/ImportScreen.vue
index 711e6836..6da8a09a 100644
--- a/src/components/ImportScreen.vue
+++ b/src/components/ImportScreen.vue
@@ -23,7 +23,10 @@
<template>
<div class="emptycontent import-screen">
<p class="icon-upload" />
- <h3 class="import-screen__header">
+ <h3 v-if="stage === 'done'" class="import-screen__header">
+ {{ t('contacts', 'Done importing {total} contacts into', { total }) }} {{ addressbook }}
+ </h3>
+ <h3 v-else class="import-screen__header">
{{ t('contacts', 'Importing {total} contacts into', { total }) }} {{ addressbook }}
</h3>
<progress :max="total" :value="progress" class="import-screen__progress" />
@@ -54,6 +57,9 @@ export default {
addressbook() {
return this.importState.addressbook
},
+ stage() {
+ return this.importState.stage
+ },
total() {
return this.importState.total
},
diff --git a/src/main.js b/src/main.js
index 53e1e9a9..bc6e37a3 100644
--- a/src/main.js
+++ b/src/main.js
@@ -72,6 +72,7 @@ if (window.location.pathname.split('/')[1] === 'index.php'
export default new Vue({
el: '#content',
+ name: 'ContactsApp',
router,
store,
render: h => h(App)
diff --git a/src/store/addressbooks.js b/src/store/addressbooks.js
index 8521c30c..264735f3 100644
--- a/src/store/addressbooks.js
+++ b/src/store/addressbooks.js
@@ -433,7 +433,7 @@ const actions = {
})
Promise.all(requests).then(() => {
- context.commit('changeStage', 'default')
+ context.commit('changeStage', 'done')
})
},
diff --git a/src/store/importState.js b/src/store/importState.js
index 98bb39a8..f969725e 100644
--- a/src/store/importState.js
+++ b/src/store/importState.js
@@ -73,7 +73,7 @@ const mutations = {
* Change stage to the indicated one
*
* @param {Object} state the store data
- * @param {string} stage the name of the stage ('default', 'importing', 'parsing')
+ * @param {string} stage the name of the stage ('default', 'importing', 'parsing', 'done')
*/
changeStage(state, stage) {
state.importState.stage = stage
@@ -139,7 +139,7 @@ const actions = {
* and reset if the parsing starts
*
* @param {Object} context the store mutations
- * @param {string} stage the name of the stage ('default', 'importing', 'parsing')
+ * @param {string} stage the name of the stage ('default', 'importing', 'parsing', 'done')
*/
changeStage(context, stage) {
context.commit('changeStage', stage)
diff --git a/src/views/Contacts.vue b/src/views/Contacts.vue
index 6e5b4a09..ce4ba79e 100644
--- a/src/views/Contacts.vue
+++ b/src/views/Contacts.vue
@@ -58,6 +58,10 @@
</template>
</div>
</template>
+ <modal v-if="isImporting" :clear-view-delay="-1" :can-close="isImportDone"
+ @close="closeImport">
+ <import-screen />
+ </modal>
</app-content>
</template>
@@ -67,7 +71,8 @@ import {
AppNavigation,
AppNavigationItem,
AppNavigationNew,
- AppNavigationSettings
+ AppNavigationSettings,
+ Modal
} from 'nextcloud-vue'
import moment from 'moment'
import download from 'downloadjs'
@@ -98,7 +103,8 @@ export default {
SettingsSection,
ContactsList,
ContactDetails,
- ImportScreen
+ ImportScreen,
+ Modal
},
// passed by the router
@@ -117,7 +123,9 @@ export default {
data() {
return {
loading: true,
- searchQuery: ''
+ searchQuery: '',
+ // are we in mobile mode
+ isMobile: window.outerWidth <= 768
}
},
@@ -142,16 +150,19 @@ export default {
return this.$store.getters.getImportState
},
+ // importing states
+ isImporting() {
+ return this.importState.stage !== 'default'
+ },
+ isImportDone() {
+ return this.importState.stage === 'done'
+ },
+
// first enabled addressbook of the list
defaultAddressbook() {
return this.addressbooks.find(addressbook => !addressbook.readOnly && addressbook.enabled)
},
- // are we in mobile mode
- isMobile() {
- return document.querySelector('body').offsetWidth < 768
- },
-
/**
* Contacts list based on the selected group.
* Those filters are pretty fast, so let's only
@@ -293,6 +304,12 @@ export default {
this.$store.commit('setOrder', localStorage.getItem('orderKey'))
}
})
+
+ window.addEventListener('resize', this.onResize)
+ },
+
+ beforeDestroy() {
+ window.removeEventListener('resize', this.onResize)
},
methods: {
@@ -457,6 +474,26 @@ export default {
selectedContact: undefined
}
})
+ },
+
+ /**
+ * Done importing, the user closed the import status screen
+ */
+ closeImport() {
+ // TODO: remove after https://github.com/nextcloud/nextcloud-vue/pull/323
+ if (this.isImportDone) {
+ this.$store.dispatch('changeStage', 'default')
+ }
+ },
+
+ /**
+ * Trigerred when window is resized
+ *
+ * @param {Object} event the event
+ */
+ onResize(event) {
+ // Update mobile mode
+ this.isMobile = window.outerWidth <= 768
}
}
}
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-30 22:41:55 +0000