scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2024-11-10 17:36:33 +08:00
Code Issues Projects Releases Packages Wiki Activity

(fix) Update the multiselect dropdown color switch [SCI-9724] (#6834)

Browse source
This commit is contained in:
Gregor Lasnibat 2023-12-18 13:49:44 +01:00 committed by GitHub
parent d3807b0b4a
commit 8c0724a680
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/javascript/vue/shared/checklist_select.vue
View file

@ -47,7 +47,7 @@
<div v-for="option in options"
:key="option.id"
class="px-3 py-2 rounded hover:bg-sn-super-light-grey cursor-pointer flex gap-1 justify-start items-center"
:class="option.id === this.lastSelectedItem ? 'bg-sn-super-light-blue' : ''"
:class="option.id === this.lastSelectedOption ? 'bg-sn-super-light-blue' : ''"
@change="toggleOption"
>
<div class="sci-checkbox-container">
@ -97,7 +97,7 @@
selectedValues: [],
isOpen: false,
optionPositionStyle: '',
lastSelectedItem: null
lastSelectedOption: null
}
},
mounted() {
@ -136,7 +136,7 @@
}
this.closeDropdown();
}
this.lastSelectedItem = null;
this.lastSelectedOption = null;
},
selectedValues(values) {
this.$emit('update-selected-values', values);
@ -152,13 +152,10 @@
},
toggleOption(option) {
const optionId = option.target._value;
// tracking last selected for highlighting
if (this.selectedValues.includes(optionId)) {
this.lastSelectedItem = optionId;
} else {
this.lastSelectedItem = null;
}
this.setLastSelected(optionId);
},
setLastSelected(optionId) {
this.lastSelectedOption = this.selectedValues.includes(optionId) ? optionId : null;
},
closeDropdown() {
if (!this.isOpen) return;