[pricelist] improved add drink

This commit is contained in:
Tim Gröger 2021-03-21 23:02:25 +01:00
parent cd937f111c
commit 14206d9117
3 changed files with 143 additions and 157 deletions

View File

@ -26,64 +26,8 @@
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-btn label="neues Getränk" color="positive" icon-right="add"> <q-btn label="neues Getränk" color="positive" icon-right="add">
<q-menu anchor="center middle" self="center middle"> <q-menu v-model="showNewDrink" anchor="center middle" self="center middle">
<div class="q-pa-sm"> <new-drink @close="showNewDrink = false" />
<div class="q-table__title q-pa-sm">Neues Getränk</div>
<div class="row">
<q-input
v-model="newDrink.name"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Getränkname"
/>
<q-input
v-model="newDrink.article_id"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Artikelnummer"
/>
<q-select
v-model="newDrink.type"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Kategorie"
:options="drinkTypes"
option-label="name"
/>
<q-input
v-model.number="newDrink.volume"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Inhalt in L/Gebinde"
type="number"
/>
<q-input
v-model.number="newDrink.package_size"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Gebindegröße"
type="number"
/>
<q-input
v-model.number="newDrink.cost_price_package_netto"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Preis Netto/Gebinde"
type="number"
/>
<q-input
v-model="cost_price_pro_volume"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Preis mit 19%/Liter"
:disable="calc_price_pro_volume"
/>
</div>
<div class="row justify-between">
<q-btn v-close-popup label="Abbrechen" @click="cancelAddDrink" />
<q-btn v-close-popup label="Speichern" color="primary" @click="addDrink" />
</div>
</div>
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-select <q-select
@ -315,11 +259,12 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, onBeforeMount, ref, ComputedRef, computed } from 'vue'; import { defineComponent, onBeforeMount, ComputedRef, computed, ref } from 'vue';
import DrinkPriceVolumesTable from 'src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumesTable.vue'; import DrinkPriceVolumesTable from 'src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumesTable.vue';
import { useMainStore } from 'src/store'; import { useMainStore } from 'src/store';
import { Drink, usePricelistStore } from 'src/plugins/pricelist/store'; import { Drink, usePricelistStore } from 'src/plugins/pricelist/store';
import MinPriceSetting from 'src/plugins/pricelist/components/MinPriceSetting.vue'; import MinPriceSetting from 'src/plugins/pricelist/components/MinPriceSetting.vue';
import NewDrink from 'src/plugins/pricelist/components/CalculationTable/NewDrink.vue';
function sort(a: string | number, b: string | number) { function sort(a: string | number, b: string | number) {
if (a > b) return 1; if (a > b) return 1;
@ -328,7 +273,7 @@ function sort(a: string | number, b: string | number) {
} }
export default defineComponent({ export default defineComponent({
name: 'CalculationTable', name: 'CalculationTable',
components: { MinPriceSetting, DrinkPriceVolumesTable }, components: { MinPriceSetting, DrinkPriceVolumesTable, NewDrink },
setup() { setup() {
const mainStore = useMainStore(); const mainStore = useMainStore();
const store = usePricelistStore(); const store = usePricelistStore();
@ -445,52 +390,8 @@ export default defineComponent({
rowsPerPage: store.drinks.length; rowsPerPage: store.drinks.length;
}); });
const emptyDrink: FG.Drink = {
id: -1,
article_id: undefined,
package_size: undefined,
name: '',
volume: undefined,
cost_price_pro_volume: undefined,
cost_price_package_netto: undefined,
tags: [],
type: undefined,
volumes: [],
};
const newDrink = ref<FG.Drink>(emptyDrink);
const calc_price_pro_volume = computed(
() =>
!!newDrink.value.cost_price_package_netto &&
!!newDrink.value.volume &&
!!newDrink.value.package_size
);
const cost_price_pro_volume = computed({
get: () => {
if (calc_price_pro_volume.value) {
const retVal =
((newDrink.value.cost_price_package_netto || 0) /
((newDrink.value.volume || 0) * (newDrink.value.package_size || 0))) *
1.19;
// eslint-disable-next-line vue/no-side-effects-in-computed-properties
newDrink.value.cost_price_pro_volume = Math.round(retVal * 1000) / 1000;
}
return newDrink.value.cost_price_pro_volume;
},
set: (val) => {
newDrink.value.cost_price_pro_volume = val;
},
});
const drinkTypes = computed(() => store.drinkTypes); const drinkTypes = computed(() => store.drinkTypes);
function addDrink() {
void store.setDrink(newDrink.value);
cancelAddDrink();
}
function cancelAddDrink() {
setTimeout(() => (newDrink.value = emptyDrink), 200);
}
function updateDrink(drink: Drink) { function updateDrink(drink: Drink) {
void store.updateDrink(drink); void store.updateDrink(drink);
} }
@ -498,6 +399,8 @@ export default defineComponent({
store.deleteDrink(drink); store.deleteDrink(drink);
} }
const showNewDrink = ref(false);
return { return {
drinks: computed(() => store.drinks), drinks: computed(() => store.drinks),
pagination, pagination,
@ -505,14 +408,10 @@ export default defineComponent({
column_calc, column_calc,
column_prices, column_prices,
visibleColumn, visibleColumn,
newDrink,
cost_price_pro_volume,
calc_price_pro_volume,
drinkTypes, drinkTypes,
addDrink,
cancelAddDrink,
updateDrink, updateDrink,
deleteDrink, deleteDrink,
showNewDrink,
console, console,
}; };
}, },

View File

@ -0,0 +1,134 @@
<template>
<div class="q-pa-sm">
<div class="q-table__title q-pa-sm">Neues Getränk</div>
<q-form @submit="addDrink" @reset="cancelAddDrink">
<q-input
v-model="newDrink.name"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Getränkname"
lazy-rules
:rules="[notEmpty]"
/>
<q-input
v-model="newDrink.article_id"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Artikelnummer"
/>
<q-select
v-model="newDrink.type"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Kategorie"
:options="drinkTypes"
option-label="name"
lazy-rules
:rules="[notEmpty]"
/>
<q-input
v-model.number="newDrink.volume"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Inhalt in L/Gebinde"
type="number"
/>
<q-input
v-model.number="newDrink.package_size"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Gebindegröße"
type="number"
/>
<q-input
v-model.number="newDrink.cost_price_package_netto"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Preis Netto/Gebinde"
type="number"
/>
<q-input
v-model="cost_price_pro_volume"
class="col-sm-4 col-xs-6 q-pa-sm"
filled
label="Preis mit 19%/Liter"
:disable="calc_price_pro_volume"
/>
<div class="row justify-between">
<q-btn v-close-popup label="Abbrechen" type="reset" />
<q-btn label="Speichern" type="submit" />
</div>
</q-form>
</div>
</template>
<script lang="ts">
import { computed, defineComponent, ref } from 'vue';
import { usePricelistStore } from 'src/plugins/pricelist/store';
import { notEmpty } from 'src/utils/validators';
export default defineComponent({
name: 'NewDrink',
emits: { close },
setup(_, { emit }) {
const store = usePricelistStore();
const emptyDrink: FG.Drink = {
id: -1,
article_id: undefined,
package_size: undefined,
name: '',
volume: undefined,
cost_price_pro_volume: undefined,
cost_price_package_netto: undefined,
tags: [],
type: undefined,
volumes: [],
};
const calc_price_pro_volume = computed(
() =>
!!newDrink.value.cost_price_package_netto &&
!!newDrink.value.volume &&
!!newDrink.value.package_size
);
const cost_price_pro_volume = computed({
get: () => {
if (calc_price_pro_volume.value) {
const retVal =
((newDrink.value.cost_price_package_netto || 0) /
((newDrink.value.volume || 0) * (newDrink.value.package_size || 0))) *
1.19;
// eslint-disable-next-line vue/no-side-effects-in-computed-properties
newDrink.value.cost_price_pro_volume = Math.round(retVal * 1000) / 1000;
}
return newDrink.value.cost_price_pro_volume;
},
set: (val) => {
newDrink.value.cost_price_pro_volume = val;
},
});
function addDrink() {
void store.setDrink(newDrink.value);
cancelAddDrink();
setTimeout(() => emit('close'), 200);
}
function cancelAddDrink() {
setTimeout(() => (newDrink.value = emptyDrink), 200);
}
const newDrink = ref<FG.Drink>(emptyDrink);
return {
drinkTypes: computed(() => store.drinkTypes),
newDrink,
calc_price_pro_volume,
cost_price_pro_volume,
addDrink,
cancelAddDrink,
notEmpty,
};
},
});
</script>
<style scoped></style>

View File

@ -83,50 +83,6 @@ class Drink {
} }
} }
function create_min_prices(drink: Drink, volume: DrinkPriceVolume, percentage: number) {
if (drink.name == 'Elbhang Rot') {
console.log(drink.name, drink.cost_price_pro_volume, volume.volume, drink, volume);
}
if (drink.cost_price_pro_volume?.value) {
if (volume.ingredients.every((ingredient) => !!ingredient.drink_ingredient)) {
return computed<number>(() => {
let retVal = (drink.cost_price_pro_volume?.value || 0) * (volume.volume?.value || 0);
volume.ingredients.forEach((ingredient) => {
if (ingredient.extra_ingredient) {
retVal += ingredient.extra_ingredient.price;
}
});
retVal = (retVal * percentage) / 100;
return retVal;
});
} else {
return computed<number>(
() =>
((drink.cost_price_pro_volume?.value || 0) * (volume.volume?.value || 0) * percentage) /
100
);
}
} else {
return computed<number>(() => {
let retVal = 0;
let extraIngredientPrice = 0;
volume.ingredients.forEach((ingredient) => {
if (ingredient.drink_ingredient) {
const _drink = usePricelistStore().drinks.find(
(a) => a.id === ingredient.drink_ingredient?.drink_ingredient_id
);
retVal +=
ingredient.drink_ingredient.volume * (_drink?.cost_price_pro_volume?.value || 0);
}
if (ingredient.extra_ingredient) {
extraIngredientPrice += ingredient.extra_ingredient.price;
}
});
return (retVal * percentage) / 100 + extraIngredientPrice;
});
}
}
export const usePricelistStore = defineStore({ export const usePricelistStore = defineStore({
id: 'pricelist', id: 'pricelist',
@ -308,9 +264,6 @@ export const usePricelistStore = defineStore({
create_min_prices() { create_min_prices() {
this.drinks.forEach((drink) => { this.drinks.forEach((drink) => {
drink.volumes.forEach((volume) => { drink.volumes.forEach((volume) => {
if (drink.name == 'Elbhang Rot2') {
console.log(drink.name, drink.cost_price_pro_volume, volume, drink);
}
volume.min_prices = []; volume.min_prices = [];
this.min_prices.forEach((min_price) => { this.min_prices.forEach((min_price) => {
let computedMinPrice: ComputedRef; let computedMinPrice: ComputedRef;
@ -350,4 +303,4 @@ export const usePricelistStore = defineStore({
}, },
}); });
export { create_min_prices, DrinkPriceVolume, MinPrice, Drink }; export { DrinkPriceVolume, MinPrice, Drink };