54 lines
1.6 KiB
Vue
54 lines
1.6 KiB
Vue
<template>
|
|
<span class="label">{{ getLabel }}</span>
|
|
<div class="button" :style="[bckgrColor('buttonColor'), color('buttonTextColor')]">
|
|
<span class="icon" :style="[{'border-top-color': '#' + $store.state.settings.buttonTextColor + '!important'}]"></span>
|
|
</div>
|
|
<select class="ghost" id="KmTo" name="KmTo" v-model="selectedKm">
|
|
<option value="" selected="selected">{{ $t('front_extern.select_alle') }}</option>
|
|
<option v-for="(km, key) in kms" v-bind:key="key" :value="key">{{km}}</option>
|
|
</select>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
props: ['data', 'lang', 'settings'],
|
|
data() {
|
|
return {
|
|
'kms': {
|
|
1000: "1'000 Km",
|
|
5000: "5'000 Km",
|
|
7500: "7'500 Km",
|
|
10000: "10'000 Km",
|
|
25000: "25'000 Km",
|
|
50000: "50'000 Km",
|
|
60000: "60'000 Km",
|
|
70000: "70'000 Km",
|
|
80000: "80'000 Km",
|
|
90000: "90'000 Km",
|
|
100000: "100'000 Km",
|
|
125000: "125'000 Km",
|
|
150000: "150'000 Km",
|
|
175000: "175'000 Km",
|
|
200000: "200'000 Km",
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
selectedKm: {
|
|
get: function () {
|
|
return this.$store.state.selected['km'];
|
|
},
|
|
set: function (state) {
|
|
this.$store.commit('setSelected', {item: 'km', state: state});
|
|
this.$emit('reloadData')
|
|
}
|
|
},
|
|
getLabel() {
|
|
if(this.$store.state.selected.km == 0) {
|
|
return this.$t('front_extern.select_alle');
|
|
}
|
|
return this.kms[this.$store.state.selected.km];
|
|
},
|
|
},
|
|
}
|
|
</script>
|