add strangeness range input in LibraryOptions

This commit is contained in:
axolotle
2021-03-11 16:05:16 +01:00
parent dd357a8487
commit d2a4c7c7c6
3 changed files with 28 additions and 6 deletions
@@ -6,7 +6,7 @@
> >
<template v-slot="{ tags, disabled, addTag, removeTag }"> <template v-slot="{ tags, disabled, addTag, removeTag }">
<b-dropdown <b-dropdown
:text="$t('tags')" size="sm" :text="buttonText" size="sm"
variant="outline-secondary" class="d-block rounded-0" variant="outline-secondary" class="d-block rounded-0"
> >
<b-dropdown-item-button <b-dropdown-item-button
@@ -37,7 +37,8 @@ export default {
props: { props: {
value: { type: Array, required: true }, value: { type: Array, required: true },
options: { type: Array, required: true } options: { type: Array, required: true },
buttonText: { type: String, required: true }
}, },
computed: { computed: {
+1 -2
View File
@@ -29,6 +29,5 @@
"title": "Rechercher" "title": "Rechercher"
} }
}, },
"siblings": "Textes rebonds", "siblings": "Textes rebonds"
"tags": "Tags"
} }
+24 -2
View File
@@ -15,9 +15,27 @@
<b-form-group <b-form-group
v-if="currentMode !== 'tree-map'" v-if="currentMode !== 'tree-map'"
:label="$t('options.filters.title')" :label="$t('options.filters.title')"
label-for="tags-select"
> >
<multiple-tags-select id="tags-select" v-model="selectedTags" :options="tags" /> <b-form-group
:label="$t('options.filters.choices.tags')"
label-for="tags-select"
>
<multiple-tags-select
id="tags-select" :button-text="$t('options.filters.choices.tags')"
v-model="selectedTags" :options="tags"
/>
</b-form-group>
<b-form-group
:label="$t('options.filters.choices.strangeness')"
label-for="strangeness-input"
>
<b-form-input
id="strangeness-input"
type="range" min="0" max="5"
v-model="strangeness"
/>
</b-form-group>
</b-form-group> </b-form-group>
<b-form-group <b-form-group
@@ -56,6 +74,7 @@ export default {
], ],
currentMode: this.mode, currentMode: this.mode,
selectedTags: [], selectedTags: [],
strangeness: 0,
search: '' search: ''
} }
}, },
@@ -69,4 +88,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep fieldset > div {
display: flex;
}
</style> </style>