54 lines
1.2 KiB
Vue
54 lines
1.2 KiB
Vue
<template>
|
|
<div class="box">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="field">
|
|
<div class="control is-expanded">
|
|
<div class="select is-small is-fullwidth">
|
|
<select v-model="selected_day">
|
|
<option value="Lundi">Lundi</option>
|
|
<option value="Mardi">Mardi</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<p class="control">
|
|
<div class="select is-small">
|
|
<select v-model="selected_meal">
|
|
<option value="Breakfast">Breakfast</option>
|
|
<option value="Lunch">Lunch</option>
|
|
</select>
|
|
</div>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<a @click="$emit('add', getSelectedKey)"
|
|
class="has-text-success">
|
|
<span class="icon is-large">
|
|
<i class="mdi mdi-36px mdi-table-plus"></i>
|
|
</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'SlotSelect',
|
|
data () {
|
|
return {
|
|
selected_day: "Lundi",
|
|
selected_meal: "Breakfast",
|
|
}
|
|
},
|
|
computed: {
|
|
getSelectedKey: function() {
|
|
return [this.selected_day, this.selected_meal];
|
|
}
|
|
}
|
|
}
|
|
</script>
|