diff --git a/src/components/Dropdown.vue b/src/components/Dropdown.vue index a5f75d882153e4ee0443ba0d58cc466b669cfc3e..f5b41ba9ad3d0163df9e1b714ca34615d034b9e8 100644 --- a/src/components/Dropdown.vue +++ b/src/components/Dropdown.vue @@ -1,5 +1,6 @@ <template> <div + id="custom-dropdown" :class="[ 'ui fluid search selection dropdown', { 'active visible': isOpen }, @@ -62,12 +63,14 @@ export default { }; }, methods: { - toggleDropdown(){ - this.isOpen = !this.isOpen + toggleDropdown() { + this.isOpen = !this.isOpen; }, select(index) { this.input = ""; - this.isOpen = false; // * ne marche pas, car toggle dropdown est rappelé au même moment :-( + setTimeout(() => { + this.isOpen = false; // * quick & dirty, car toggle dropdown est rappelé plusieurs fois aileurs, à creuser... + }, 500); this.$emit("update:selection", this.options[index]); }, searchOptions(options) { @@ -86,6 +89,17 @@ export default { this.isOpen = true; this.clearSelected(); }, + clickOutsideDropdown(e) { + if (!e.target.closest("#custom-dropdown")) this.isOpen = false; + }, + }, + + created() { + window.addEventListener("mousedown", this.clickOutsideDropdown); + }, + + beforeDestroy() { + window.removeEventListener("mousedown", this.clickOutsideDropdown); }, }; </script> \ No newline at end of file diff --git a/src/store/modules/feature_type.js b/src/store/modules/feature_type.js index 3c0941da4325b7619ce4ff9bec283c3bc0c19b53..3e12c3a114fef4111565a1527e3390eb3c766ed7 100644 --- a/src/store/modules/feature_type.js +++ b/src/store/modules/feature_type.js @@ -10,8 +10,8 @@ const feature_type = { geom_type: "point", title: "Éolienne", is_editable: true, - slug: "2-Éolienne", - feature_type: "2" + slug: "1-Éolienne", + feature_type: "1" }, { geom_type: "linestring",