Files
vaquant/src/components/TransactionTagUpdate.vue
2019-08-22 11:50:32 +02:00

47 lines
1.4 KiB
Vue

<template>
<div class="transaction-tag-update field is-horizontal">
<div class="field-label is-normal">
<label class="label" for="tag">Catégorie</label>
</div>
<div class="field-body">
<div class="field">
<p class="control has-icons-left">
<span class="select is-fullwidth">
<select v-model="tagLocale" name="tag" id="tag">
<option
v-for="(transactionTag, k) in transactionTagLabel"
:key="k"
:value="k">
{{ transactionTag.label }}
</option>
</select>
</span>
<span class="icon is-small is-left" v-if="transactionTagLabel[tag]">
<awe-icon :icon="transactionTagLabel[tag].icon" />
</span>
</p>
</div>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue, Model, Watch } from 'vue-property-decorator'
import TransactionTag, { TransactionTagLabel } from '@/enums/TransactionTag'
@Component
export default class TransactionTagUpdate extends Vue {
@Model('input', { type: String })
public tag!: TransactionTag
public tagLocale: TransactionTag = this.tag
public transactionTagLabel: typeof TransactionTagLabel = TransactionTagLabel
@Watch('tagLocale')
public onTagChange(tag: TransactionTag) {
if (tag !== this.tag) {
this.$emit('input', tag)
}
}
}
</script>