From 78978e9bdba43e01287c041b497cdb8513d5a94b Mon Sep 17 00:00:00 2001 From: Grzegorz Leoniec Date: Thu, 10 Jan 2019 10:29:02 +0100 Subject: [PATCH] Added disabled, isOpen, openMenu, closeMenu to Dropdown --- components/Dropdown.vue | 60 ++++++++++++++++++++++++++++++++++++----- 1 file changed, 54 insertions(+), 6 deletions(-) diff --git a/components/Dropdown.vue b/components/Dropdown.vue index 1440170f3..d354dd257 100644 --- a/components/Dropdown.vue +++ b/components/Dropdown.vue @@ -3,10 +3,16 @@ :open.sync="isPopoverOpen" :open-group="Math.random().toString()" :placement="placement" + :disabled="disabled" trigger="manual" :offset="offset" > - +
@@ -29,6 +38,7 @@ let mouseLeaveTimer = null export default { props: { placement: { type: String, default: 'bottom-end' }, + disabled: { type: Boolean, default: false }, offset: { type: [String, Number], default: '16' } }, data() { @@ -36,6 +46,11 @@ export default { isPopoverOpen: false } }, + computed: { + isOpen() { + return this.isPopoverOpen + } + }, watch: { isPopoverOpen: { immediate: true, @@ -43,11 +58,13 @@ export default { console.log('isOpen', isOpen) try { if (isOpen) { - setTimeout(() => { - document - .getElementsByTagName('body')[0] - .classList.add('dropdown-open') - }, 10) + this.$nextTick(() => { + setTimeout(() => { + document + .getElementsByTagName('body')[0] + .classList.add('dropdown-open') + }, 20) + }) } else { document .getElementsByTagName('body')[0] @@ -63,9 +80,37 @@ export default { }, methods: { toggleMenu() { + if (this.disabled) { + return + } + clearTimeout(mouseEnterTimer) + clearTimeout(mouseLeaveTimer) this.isPopoverOpen = !this.isPopoverOpen }, + openMenu(useTimeout) { + if (this.disabled) { + return + } + if (useTimeout) { + this.popoverMouseEnter() + } else { + this.isPopoverOpen = true + } + }, + closeMenu(useTimeout) { + if (this.disabled) { + return + } + if (useTimeout) { + this.popoveMouseLeave() + } else { + this.isPopoverOpen = false + } + }, popoverMouseEnter() { + if (this.disabled) { + return + } clearTimeout(mouseEnterTimer) clearTimeout(mouseLeaveTimer) if (!this.isPopoverOpen) { @@ -75,6 +120,9 @@ export default { } }, popoveMouseLeave() { + if (this.disabled) { + return + } clearTimeout(mouseEnterTimer) clearTimeout(mouseLeaveTimer) if (this.isPopoverOpen) {