diff options
Diffstat (limited to 'viewer/src/components/LdProposition.vue')
-rw-r--r-- | viewer/src/components/LdProposition.vue | 17 |
1 files changed, 9 insertions, 8 deletions
diff --git a/viewer/src/components/LdProposition.vue b/viewer/src/components/LdProposition.vue index 1a1d387..c69a7c3 100644 --- a/viewer/src/components/LdProposition.vue +++ b/viewer/src/components/LdProposition.vue | |||
@@ -20,10 +20,7 @@ | |||
20 | 20 | ||
21 | <template> | 21 | <template> |
22 | <div class="proposition"> | 22 | <div class="proposition"> |
23 | <h2 | 23 | <h2 v-if="showCategory && proposedTags.length" class="subtitle category">{{title}}</h2> |
24 | v-if="showTitle && proposedTags.length" | ||
25 | class="subtitle category" | ||
26 | >{{title || $t('panelLeft.propositions.other')}}</h2> | ||
27 | <div v-for="proposed in proposedTags" :key="proposed.rawTag"> | 24 | <div v-for="proposed in proposedTags" :key="proposed.rawTag"> |
28 | <a | 25 | <a |
29 | class="operation-btns link" | 26 | class="operation-btns link" |
@@ -58,8 +55,8 @@ import { Operation } from "@/@types/Operation"; | |||
58 | 55 | ||
59 | @Component | 56 | @Component |
60 | export default class LdProposition extends Vue { | 57 | export default class LdProposition extends Vue { |
61 | @Prop({ type: String, required: true }) readonly title!: string; | 58 | @Prop() readonly category?: Tag.Node; |
62 | @Prop({ type: Boolean, required: true }) readonly showTitle!: boolean; | 59 | @Prop({ type: Boolean, required: true }) readonly showCategory!: boolean; |
63 | @Prop({ type: Array, required: true }) readonly currentTags!: string[]; | 60 | @Prop({ type: Array, required: true }) readonly currentTags!: string[]; |
64 | @Prop({ required: true }) readonly tagsIndex!: Tag.Index; | 61 | @Prop({ required: true }) readonly tagsIndex!: Tag.Index; |
65 | @PropSync("searchFilters", { type: Array, required: true }) model!: Tag.Search[]; | 62 | @PropSync("searchFilters", { type: Array, required: true }) model!: Tag.Search[]; |
@@ -91,6 +88,10 @@ export default class LdProposition extends Vue { | |||
91 | .map(entry => ({ rawTag: entry[0], count: entry[1] })); | 88 | .map(entry => ({ rawTag: entry[0], count: entry[1] })); |
92 | } | 89 | } |
93 | 90 | ||
91 | get title() { | ||
92 | return this.category?.tag ?? this.$t("panelLeft.propositions.other"); | ||
93 | } | ||
94 | |||
94 | extractDistinctItems(currentTags: Tag.Search[]): Gallery.Item[] { | 95 | extractDistinctItems(currentTags: Tag.Search[]): Gallery.Item[] { |
95 | return [...new Set(currentTags.flatMap(tag => tag.items))]; | 96 | return [...new Set(currentTags.flatMap(tag => tag.items))]; |
96 | } | 97 | } |
@@ -102,8 +103,8 @@ export default class LdProposition extends Vue { | |||
102 | 103 | ||
103 | add(operation: Operation, rawTag: Gallery.RawTag) { | 104 | add(operation: Operation, rawTag: Gallery.RawTag) { |
104 | const node = this.tagsIndex[rawTag]; | 105 | const node = this.tagsIndex[rawTag]; |
105 | const search: Tag.Search = { ...node, operation, display: `${operation}${node.tag}` }; | 106 | const display = this.category ? `${operation}${this.category.tag}:${node.tag}` : `${operation}${node.tag}`; |
106 | this.model.push(search); | 107 | this.model.push({ ...node, parent: this.category, operation, display }); |
107 | } | 108 | } |
108 | } | 109 | } |
109 | </script> | 110 | </script> |