From 33cf62ff9b6ea671dc1022e345a65705bd814640 Mon Sep 17 00:00:00 2001 From: m4ximuel <54457152+m4ximuel@users.noreply.github.com> Date: Tue, 20 Apr 2021 00:17:02 +0900 Subject: [PATCH] Perf: Remove redundant dialog code, use Modal Mixin --- package.json | 1 - src/components/Modals/AddModal.vue | 11 -------- src/components/Modals/ChangeLocationModal.vue | 11 -------- src/components/Modals/ConfirmDeleteModal.vue | 11 -------- src/components/Modals/RenameModal.vue | 11 -------- .../Modals/SearchModal/SearchModal.vue | 11 -------- .../Modals/SettingsModal/SettingsModal.vue | 11 -------- src/components/Modals/SortModal.vue | 13 +-------- src/components/Modals/SpeedLimitModal.vue | 11 -------- .../CreateCategoryDialog.vue | 11 -------- .../TagsAndCategories/CreateTagDialog.vue | 13 --------- .../TorrentDetailModal/TorrentDetailModal.vue | 11 -------- src/mixins/Modal.js | 27 ++++++++++++++++--- 13 files changed, 24 insertions(+), 129 deletions(-) diff --git a/package.json b/package.json index 079dc30a..a6977ef6 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,6 @@ "uuid": "^8.3.2", "vue": "^2.6.12", "vue-apexcharts": "^1.6.0", - "vue-context": "^6.0.0", "vue-router": "^3.5.1", "vue-toastification": "^1.7.11", "vuedraggable": "^2.24.3", diff --git a/src/components/Modals/AddModal.vue b/src/components/Modals/AddModal.vue index 289afad8..42a61800 100644 --- a/src/components/Modals/AddModal.vue +++ b/src/components/Modals/AddModal.vue @@ -204,7 +204,6 @@ export default { props: ['initialMagnet'], data() { return { - hndlDialog: true, showWrapDrag: false, files: [], category: null, @@ -247,16 +246,6 @@ export default { }, availableCategories() { return this.getCategories() - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/ChangeLocationModal.vue b/src/components/Modals/ChangeLocationModal.vue index 124a17b9..f17cd0da 100644 --- a/src/components/Modals/ChangeLocationModal.vue +++ b/src/components/Modals/ChangeLocationModal.vue @@ -64,7 +64,6 @@ export default { }, data() { return { - hndlDialog: true, newPath: '', mdiFile, mdiFolder, mdiClose } @@ -79,16 +78,6 @@ export default { }, isPhone() { return this.$vuetify.breakpoint.xsOnly - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/ConfirmDeleteModal.vue b/src/components/Modals/ConfirmDeleteModal.vue index 0aff8c04..25b093de 100644 --- a/src/components/Modals/ConfirmDeleteModal.vue +++ b/src/components/Modals/ConfirmDeleteModal.vue @@ -63,7 +63,6 @@ export default { mixins: [Modal], data() { return { - hndlDialog: true, withFiles: false } }, @@ -72,16 +71,6 @@ export default { ...mapGetters(['getTorrents']), torrents() { return this.getTorrents().filter(t => this.selected_torrents.includes(t.hash)) - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, beforeDestroy() { diff --git a/src/components/Modals/RenameModal.vue b/src/components/Modals/RenameModal.vue index 12548c2e..24348bc8 100644 --- a/src/components/Modals/RenameModal.vue +++ b/src/components/Modals/RenameModal.vue @@ -61,7 +61,6 @@ export default { }, data() { return { - hndlDialog: true, name: '', mdiFile } @@ -73,16 +72,6 @@ export default { }, isPhone() { return this.$vuetify.breakpoint.xsOnly - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/SearchModal/SearchModal.vue b/src/components/Modals/SearchModal/SearchModal.vue index 39158162..67dfd115 100644 --- a/src/components/Modals/SearchModal/SearchModal.vue +++ b/src/components/Modals/SearchModal/SearchModal.vue @@ -97,7 +97,6 @@ export default { mixins: [Modal, FullScreenModal, General], data() { return { - hndlDialog: true, search: { id: null, status: null, @@ -129,16 +128,6 @@ export default { }, enabledSearchPlugins() { return this.getSearchPlugins().filter(p => p.enabled) - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/SettingsModal/SettingsModal.vue b/src/components/Modals/SettingsModal/SettingsModal.vue index 354ea3d4..dd9f45fd 100644 --- a/src/components/Modals/SettingsModal/SettingsModal.vue +++ b/src/components/Modals/SettingsModal/SettingsModal.vue @@ -95,7 +95,6 @@ export default { mixins: [Modal, FullScreenModal, SettingsTab], data() { return { - hndlDialog: true, tab: null, items: [], peers: [], @@ -105,16 +104,6 @@ export default { computed: { isPhone() { return this.$vuetify.breakpoint.xsOnly - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/SortModal.vue b/src/components/Modals/SortModal.vue index 3dc89ccb..7eb5bd0a 100644 --- a/src/components/Modals/SortModal.vue +++ b/src/components/Modals/SortModal.vue @@ -50,7 +50,6 @@ export default { mixins: [Modal], data() { return { - hndlDialog: true, sortProperty: { value: 'added_on', name: 'Added On' }, reverse: true, options: [ @@ -75,17 +74,7 @@ export default { } }, computed: { - ...mapState(['sort_options']), - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } - } + ...mapState(['sort_options']) }, methods: { close() { diff --git a/src/components/Modals/SpeedLimitModal.vue b/src/components/Modals/SpeedLimitModal.vue index 60b6d156..460ef23c 100644 --- a/src/components/Modals/SpeedLimitModal.vue +++ b/src/components/Modals/SpeedLimitModal.vue @@ -63,7 +63,6 @@ export default { }, data() { return { - hndlDialog: true, limit: '', mdiSpeedometer, mdiClose } @@ -75,16 +74,6 @@ export default { }, isPhone() { return this.$vuetify.breakpoint.xsOnly - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/TagsAndCategories/CreateCategoryDialog.vue b/src/components/Modals/TagsAndCategories/CreateCategoryDialog.vue index 9aaf3f21..370378ab 100644 --- a/src/components/Modals/TagsAndCategories/CreateCategoryDialog.vue +++ b/src/components/Modals/TagsAndCategories/CreateCategoryDialog.vue @@ -68,7 +68,6 @@ export default { initialCategory: Object }, data: () => ({ - hndlDialog: true, nameRules: [ v => !!v || 'Category name is required', v => @@ -87,16 +86,6 @@ export default { hasInitialCategory() { return !!(this.initialCategory && this.initialCategory.name) - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, created() { diff --git a/src/components/Modals/TagsAndCategories/CreateTagDialog.vue b/src/components/Modals/TagsAndCategories/CreateTagDialog.vue index 01fbc0e6..0ae96eb4 100644 --- a/src/components/Modals/TagsAndCategories/CreateTagDialog.vue +++ b/src/components/Modals/TagsAndCategories/CreateTagDialog.vue @@ -45,25 +45,12 @@ export default { name: 'CreateTagDialog', mixins: [Modal], data: () => ({ - hndlDialog: true, tagname: '', rules: [ v => !!v || 'Tag is required', v => v.length <= 10 || 'Tag must be less than 10 characters' ] }), - computed: { - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } - } - }, methods: { create() { qbit.createTag(this.tagname) diff --git a/src/components/Modals/TorrentDetailModal/TorrentDetailModal.vue b/src/components/Modals/TorrentDetailModal/TorrentDetailModal.vue index e5fcbc40..4275568e 100644 --- a/src/components/Modals/TorrentDetailModal/TorrentDetailModal.vue +++ b/src/components/Modals/TorrentDetailModal/TorrentDetailModal.vue @@ -93,7 +93,6 @@ export default { }, data() { return { - hndlDialog: true, hndlFullscreen: false, tab: null, items: [{ tab: 'Info' }, { tab: 'Content' }], @@ -116,16 +115,6 @@ export default { return true return false - }, - dialog: { - get: function () { - return this.hndlDialog - }, - set: function (e) { - this.hndlDialog = e - if (e === false) - this.deleteModal() - } } }, methods: { diff --git a/src/mixins/Modal.js b/src/mixins/Modal.js index f503af12..c17c832a 100644 --- a/src/mixins/Modal.js +++ b/src/mixins/Modal.js @@ -1,15 +1,34 @@ import { mapGetters } from 'vuex' export default { props: ['guid'], - computed: { - ...mapGetters(['getModalState']) + data() { + return { + hndlDialog: true + } }, + computed: { + ...mapGetters(['getModalState']), + dialog: { + get() { + return this.hndlDialog + }, + set(val) { + this.hndlDialog = val + if (!val) + this.deleteModal() + } + } + }, + methods: { deleteModal() { - setTimeout(() => this.$store.commit('DELETE_MODAL', this.guid), 100) + //this.hndlDialog = false + setTimeout(function () { + this.$store.commit('DELETE_MODAL', this.guid) + }.bind(this), 300) } }, beforeDestroy() { this.deleteModal() } -} +} \ No newline at end of file