Feat(Tags): transform graph_tags_comparison legend

This commit is contained in:
Bertrand Benjamin 2019-01-28 09:47:41 +01:00
parent ecf7db6a8f
commit bc7f771d25
2 changed files with 24 additions and 8 deletions

View File

@ -1,7 +1,17 @@
<template> <template>
<div>
<div class="container"> <div class="container">
<pie :chart-data="chartdata" :options="options" v-if="spendings[0] !== 0"></pie> <pie :chart-data="chartdata" :options="options" v-if="spendings[0] !== 0"></pie>
</div> </div>
<div class="text-center">
<b-button-group size="sm">
<b-button v-for="tag in selected_tags"
:style="{'background-color': backgroundColor(tag)}">
{{ tag }}
</b-button>
</b-button-group>
</div>
</div>
</template> </template>
<script> <script>
@ -20,6 +30,7 @@ export default {
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
legend: { legend: {
display: false,
position: 'left' position: 'left'
} }
} }
@ -46,11 +57,7 @@ export default {
label: 'Dépenses', label: 'Dépenses',
data: this.spendings, data: this.spendings,
backgroundColor: this.selected_tags.map(t => { backgroundColor: this.selected_tags.map(t => {
if (this.tag(t)) { return this.backgroundColor(t)
return this.tag(t).color
} else {
return '#A9A9A9'
}
}) })
} }
] ]
@ -69,6 +76,13 @@ export default {
} }
}, },
methods: { methods: {
backgroundColor (t) {
if (this.tag(t)) {
return this.tag(t).color
} else {
return '#A9A9A9'
}
}
} }
} }

View File

@ -20,8 +20,10 @@
</b-row> </b-row>
</b-container> </b-container>
<b-card-group deck class="mb-3" v-for="categorie in categories"> <b-card-group deck class="mb-3">
<div v-for="categorie in categories">
<card-categorie @click.native="set_categories_filter([categorie.name])" :categoriename="categorie.name"></card-categorie> <card-categorie @click.native="set_categories_filter([categorie.name])" :categoriename="categorie.name"></card-categorie>
</div>
</b-card-group> </b-card-group>
<tags-comparison></tags-comparison> <tags-comparison></tags-comparison>