95 lines
2.5 KiB
Vue
95 lines
2.5 KiB
Vue
|
<template>
|
||
|
|
<q-card>
|
||
|
|
<q-card-section>
|
||
|
|
<div class="text-h6">Getränk Bearbeiten</div>
|
||
|
|
</q-card-section>
|
||
|
|
<q-card-section>
|
||
|
|
<div class="fit row">
|
||
|
|
<q-input
|
||
|
|
v-model="edit_drink.article_id"
|
||
|
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||
|
|
filled
|
||
|
|
label="Artikelnummer"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
<q-input
|
||
|
|
v-model="edit_drink.volume"
|
||
|
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||
|
|
filled
|
||
|
|
label="Inhalt"
|
||
|
|
dense
|
||
|
|
suffix="L"
|
||
|
|
/>
|
||
|
|
<q-input
|
||
|
|
v-model="edit_drink.package_size"
|
||
|
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||
|
|
filled
|
||
|
|
label="Gebindegröße"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
<q-input
|
||
|
|
v-model="edit_drink.cost_per_package"
|
||
|
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||
|
|
filled
|
||
|
|
label="Preis Gebinde"
|
||
|
|
suffix="€"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
<q-input
|
||
|
|
v-model="edit_drink.cost_per_volume"
|
||
|
|
class="col-xs-12 col-sm-6 q-pa-sm q-pb-lg"
|
||
|
|
filled
|
||
|
|
label="Preis pro L"
|
||
|
|
hint="Inkl. 19% Mehrwertsteuer"
|
||
|
|
suffix="€"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</q-card-section>
|
||
|
|
<q-card-section>
|
||
|
|
<drink-price-volumes v-model="edit_drink.volumes" editable />
|
||
|
|
</q-card-section>
|
||
|
|
<q-card-actions class="justify-around">
|
||
|
|
<q-btn label="Abbrechen" @click="cancel" />
|
||
|
|
<q-btn label="Speichern" color="primary" @click="save" />
|
||
|
|
</q-card-actions>
|
||
|
|
</q-card>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
import { defineComponent, PropType, ref, onBeforeMount } from 'vue';
|
||
|
|
import { Drink, DrinkPriceVolume } from '../store';
|
||
|
|
import DrinkPriceVolumes from './CalculationTable/DrinkPriceVolumes.vue';
|
||
|
|
import { calc_volume } from 'src/plugins/pricelist/utils/utils';
|
||
|
|
export default defineComponent({
|
||
|
|
name: 'DrinkModify',
|
||
|
|
components: { DrinkPriceVolumes },
|
||
|
|
props: {
|
||
|
|
drink: {
|
||
|
|
type: Object as PropType<Drink>,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
emits: { save: () => true, cancel: () => true },
|
||
|
|
setup(props, { emit }) {
|
||
|
|
onBeforeMount(() => {
|
||
|
|
edit_drink.value = Object.assign({}, props.drink);
|
||
|
|
});
|
||
|
|
|
||
|
|
const edit_drink = ref<Drink>();
|
||
|
|
function save() {
|
||
|
|
emit('save');
|
||
|
|
}
|
||
|
|
function cancel() {
|
||
|
|
emit('cancel');
|
||
|
|
}
|
||
|
|
function updateVolume(volume: DrinkPriceVolume) {
|
||
|
|
if (volume) {
|
||
|
|
console.log('edit_volume', volume);
|
||
|
|
volume.volume = calc_volume(volume);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return { edit_drink, save, cancel, updateVolume };
|
||
|
|
},
|
||
|
|
});
|
||
|
|
</script>
|