[pricelist] fixed some computed values, new interfaces
This commit is contained in:
parent
e4851bd178
commit
7e01ffc507
|
@ -61,11 +61,13 @@ declare namespace FG {
|
|||
}
|
||||
interface DrinkMinPrice {
|
||||
percentage: number;
|
||||
//price: ComputedRef<number>;
|
||||
price: number;
|
||||
}
|
||||
interface DrinkPriceVolume {
|
||||
id: number;
|
||||
volume: number;
|
||||
//computed_volume: ComputedRef<number>;
|
||||
min_prices: DrinkMinPrice[];
|
||||
prices: Array<DrinkPrice>;
|
||||
ingredients: Array<DrinkIngredient & ExtraIngredient>;
|
||||
|
|
|
@ -55,20 +55,32 @@
|
|||
:icon="props.expand ? 'mdi-chevron-up' : 'mdi-chevron-down'"
|
||||
v-if="volumes.row.cost_price_pro_volume == null"
|
||||
/>
|
||||
<q-btn
|
||||
size="xs"
|
||||
color="negative"
|
||||
round
|
||||
dense
|
||||
icon="mdi-delete"
|
||||
class="q-mx-sm"
|
||||
v-if="props.row.ingredients.length === 0 && props.row.prices.length === 0"
|
||||
@click="deleteVolume(props.row, volumes.row)"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td key="volume" :props="props">
|
||||
{{ props.row.volume }}L
|
||||
{{ parseFloat(props.row.volume.value).toFixed(3) }}L
|
||||
<!--{{ props.row.volume }}-->
|
||||
<q-popup-edit
|
||||
buttons
|
||||
label-cancel="Abbrechen"
|
||||
label-set="Speichern"
|
||||
v-model="props.row.volume"
|
||||
v-model="props.row.volume.value"
|
||||
v-if="volumes.row.cost_price_pro_volume"
|
||||
@save="updateVolume(props.row, volumes.row)"
|
||||
>
|
||||
<q-input
|
||||
dense
|
||||
filled
|
||||
v-model.number="props.row.volume"
|
||||
v-model.number="props.row.volume.value"
|
||||
type="number"
|
||||
suffix="L"
|
||||
/>
|
||||
|
@ -84,7 +96,8 @@
|
|||
<q-badge color="primary">{{ min_price.percentage }}%</q-badge>
|
||||
</div>
|
||||
<div class="col" style="text-align: end">
|
||||
{{ parseFloat(min_price.price).toFixed(3) }}€
|
||||
<!--{{ parseFloat(min_price.price).toFixed(3) }}€-->
|
||||
{{ min_price.price.value.toFixed(3) }}€
|
||||
</div>
|
||||
</div>
|
||||
</q-td>
|
||||
|
@ -116,7 +129,6 @@
|
|||
:options="drinks"
|
||||
option-label="name"
|
||||
v-model="ingredient.drink_ingredient"
|
||||
@input="calc_min_prices(props.row)"
|
||||
/>
|
||||
<q-input
|
||||
class="col q-px-sm"
|
||||
|
@ -125,7 +137,6 @@
|
|||
filled
|
||||
dense
|
||||
v-model.number="ingredient.volume"
|
||||
@change="calc_min_prices(props.row)"
|
||||
step="0.01"
|
||||
min="0"
|
||||
/>
|
||||
|
@ -141,7 +152,6 @@
|
|||
color="positive"
|
||||
label="Zutat hinzufügen"
|
||||
@click="addIngredient(props.row.ingredients, props.row.id)"
|
||||
@change="calc_min_prices(props.row)"
|
||||
/>
|
||||
</div>
|
||||
</q-td>
|
||||
|
@ -180,9 +190,15 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onBeforeMount, ref, computed } from '@vue/composition-api';
|
||||
import store, { calc_min_prices } from '../store/altStore';
|
||||
import {
|
||||
defineComponent,
|
||||
onBeforeMount,
|
||||
ref,
|
||||
computed,
|
||||
WritableComputedRef
|
||||
} from '@vue/composition-api';
|
||||
import { v4 } from 'uuid';
|
||||
import store, { create_volume, DrinkPriceVolume, Drink } from '../store/altStore';
|
||||
import PriceTable from 'src/plugins/pricelist/components/CalculationTable/PriceTable.vue';
|
||||
export default defineComponent({
|
||||
name: 'CalculationTable',
|
||||
|
@ -285,31 +301,37 @@ export default defineComponent({
|
|||
'description',
|
||||
'public'
|
||||
]);
|
||||
const emptyVolume = {
|
||||
const emptyVolume: DrinkPriceVolume = {
|
||||
id: -1,
|
||||
volume: 0,
|
||||
_volume: 0,
|
||||
volume: null,
|
||||
min_prices: [
|
||||
{ percentage: 100, price: 0 },
|
||||
{ percentage: 250, price: 0 },
|
||||
{ percentage: 300, price: 0 }
|
||||
{ percentage: 100, price: null },
|
||||
{ percentage: 250, price: null },
|
||||
{ percentage: 300, price: null }
|
||||
],
|
||||
prices: [],
|
||||
ingredients: []
|
||||
};
|
||||
const newVolume = ref(emptyVolume);
|
||||
function addVolume(drink: FG.Drink) {
|
||||
store.actions.setVolume(newVolume.value, drink);
|
||||
const newVolume = ref<DrinkPriceVolume>(emptyVolume);
|
||||
function addVolume(drink: Drink) {
|
||||
store.actions.setVolume(<DrinkPriceVolume>newVolume.value, drink);
|
||||
cancelAddVolume();
|
||||
}
|
||||
function cancelAddVolume() {
|
||||
setTimeout(() => {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
newVolume.value = emptyVolume;
|
||||
}, 200);
|
||||
}
|
||||
function updateVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
function updateVolume(volume: DrinkPriceVolume, drink: Drink) {
|
||||
console.log(volume);
|
||||
store.actions.updateVolume(volume, drink);
|
||||
}
|
||||
function deleteVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
store.actions.deleteVolume(volume, drink);
|
||||
}
|
||||
|
||||
function addIngredient(ingredients: FG.Ingredient[]) {
|
||||
ingredients.push({ id: -1, volume_id: 0, drink_ingredient: null, extra_ingredient: null });
|
||||
|
@ -325,8 +347,8 @@ export default defineComponent({
|
|||
cancelAddVolume,
|
||||
newVolume,
|
||||
updateVolume,
|
||||
deleteVolume,
|
||||
addIngredient,
|
||||
calc_min_prices,
|
||||
console
|
||||
};
|
||||
}
|
||||
|
|
|
@ -132,7 +132,7 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, ref } from '@vue/composition-api';
|
||||
import store from '../../store/altStore';
|
||||
import store, { DrinkPriceVolume } from '../../store/altStore';
|
||||
export default defineComponent({
|
||||
name: 'PriceTable',
|
||||
props: {
|
||||
|
@ -145,7 +145,7 @@ export default defineComponent({
|
|||
required: true
|
||||
},
|
||||
row: {
|
||||
type: Object as () => FG.DrinkPriceVolume,
|
||||
type: Object as () => DrinkPriceVolume,
|
||||
required: true
|
||||
},
|
||||
visibleColumns: {
|
||||
|
@ -161,7 +161,7 @@ export default defineComponent({
|
|||
public: true
|
||||
};
|
||||
const newPrice = ref(emptyPrice);
|
||||
function addPrice(volume: FG.DrinkPriceVolume) {
|
||||
function addPrice(volume: DrinkPriceVolume) {
|
||||
store.actions.setPrice({ ...newPrice.value }, volume);
|
||||
cancelAddPrice();
|
||||
}
|
||||
|
@ -170,7 +170,7 @@ export default defineComponent({
|
|||
newPrice.value = emptyPrice;
|
||||
}, 200);
|
||||
}
|
||||
function updatePrice(price: FG.DrinkPrice, volume: FG.DrinkPriceVolume) {
|
||||
function updatePrice(price: FG.DrinkPrice, volume: DrinkPriceVolume) {
|
||||
console.log(price);
|
||||
store.actions.updatePrice(price, volume);
|
||||
}
|
||||
|
|
|
@ -1,38 +1,87 @@
|
|||
import { reactive } from '@vue/composition-api';
|
||||
import { reactive, computed, ComputedRef, WritableComputedRef } from '@vue/composition-api';
|
||||
import { axios } from 'src/boot/axios';
|
||||
import { AxiosResponse } from 'axios';
|
||||
import ExtraIngredient = FG.ExtraIngredient;
|
||||
|
||||
const state = reactive<{ drinks: FG.Drink[]; tags: FG.Tag[]; drinkTypes: FG.DrinkType[] }>({
|
||||
const state = reactive<{ drinks: Drink[]; tags: FG.Tag[]; drinkTypes: FG.DrinkType[] }>({
|
||||
drinks: [],
|
||||
tags: [],
|
||||
drinkTypes: []
|
||||
});
|
||||
|
||||
interface MinPrice extends Omit<FG.DrinkMinPrice, 'price'> {
|
||||
price: WritableComputedRef<number> | null;
|
||||
}
|
||||
interface DrinkPriceVolume extends Omit<Omit<FG.DrinkPriceVolume, 'volume'>, 'min_prices'> {
|
||||
_volume: number;
|
||||
volume: WritableComputedRef<number> | null;
|
||||
min_prices: MinPrice[];
|
||||
}
|
||||
interface Drink extends Omit<FG.Drink, 'volumes'> {
|
||||
volumes: DrinkPriceVolume[];
|
||||
}
|
||||
|
||||
const actions = {
|
||||
getDrinks() {
|
||||
axios
|
||||
.get('pricelist/drinks')
|
||||
.then((response: AxiosResponse<FG.Drink[]>) => {
|
||||
state.drinks = response.data;
|
||||
console.log(state.drinks);
|
||||
state.drinks.forEach((drink: FG.Drink) => {
|
||||
drink.volumes.forEach((volume: FG.DrinkPriceVolume) => {
|
||||
//state.drinks = [...response.data];
|
||||
/*state.drinks.forEach((drink: Drink) => {
|
||||
drink.volumes.forEach((volume: DrinkPriceVolume) => {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
volume._volume = volume.volume;
|
||||
volume.volume = create_volume(drink, volume);
|
||||
volume.min_prices = [
|
||||
{ percentage: 100, price: (drink.cost_price_pro_volume || 0) * volume.volume * 1 },
|
||||
{ percentage: 250, price: (drink.cost_price_pro_volume || 0) * volume.volume * 2.5 },
|
||||
{ percentage: 300, price: (drink.cost_price_pro_volume || 0) * volume.volume * 3 }
|
||||
];
|
||||
if (volume.ingredients.length > 0) {
|
||||
calc_min_prices(volume);
|
||||
{
|
||||
percentage: 100,
|
||||
price: create_min_prices(drink, volume, 100)
|
||||
},
|
||||
{
|
||||
percentage: 250,
|
||||
price: create_min_prices(drink, volume, 250)
|
||||
},
|
||||
{
|
||||
percentage: 300,
|
||||
price: create_min_prices(drink, volume, 300)
|
||||
}
|
||||
];
|
||||
this.sortPrices(volume);
|
||||
});
|
||||
});*/
|
||||
response.data.forEach(drink => {
|
||||
const newDrink: Drink = { ...drink, volumes: [] };
|
||||
drink.volumes.forEach(volume => {
|
||||
const newVolume: DrinkPriceVolume = {
|
||||
...volume,
|
||||
_volume: volume.volume,
|
||||
min_prices: [],
|
||||
volume: null
|
||||
};
|
||||
newVolume.volume = create_volume(newDrink, newVolume);
|
||||
newVolume.min_prices = [
|
||||
{
|
||||
percentage: 100,
|
||||
price: create_min_prices(newDrink, newVolume, 100)
|
||||
},
|
||||
{
|
||||
percentage: 250,
|
||||
price: create_min_prices(newDrink, newVolume, 250)
|
||||
},
|
||||
{
|
||||
percentage: 300,
|
||||
price: create_min_prices(newDrink, newVolume, 300)
|
||||
}
|
||||
];
|
||||
console.log(newVolume);
|
||||
newDrink.volumes.push(newVolume);
|
||||
});
|
||||
state.drinks.push(newDrink);
|
||||
});
|
||||
})
|
||||
.catch(err => console.warn(err));
|
||||
},
|
||||
setPrice(price: FG.DrinkPrice, volume: FG.DrinkPriceVolume) {
|
||||
setPrice(price: FG.DrinkPrice, volume: DrinkPriceVolume) {
|
||||
axios
|
||||
.post(`pricelist/volumes/${volume.id}/prices`, price)
|
||||
.then((response: AxiosResponse<FG.DrinkPrice>) => {
|
||||
|
@ -41,7 +90,7 @@ const actions = {
|
|||
})
|
||||
.catch(err => console.warn(err));
|
||||
},
|
||||
sortPrices(volume: FG.DrinkPriceVolume) {
|
||||
sortPrices(volume: DrinkPriceVolume) {
|
||||
volume.prices.sort((a, b) => {
|
||||
if (a.price > b.price) return 1;
|
||||
if (b.price > a.price) return -1;
|
||||
|
@ -59,31 +108,61 @@ const actions = {
|
|||
})
|
||||
.catch(err => console.warn(err));
|
||||
},
|
||||
updatePrice(price: FG.DrinkPrice, volume: FG.DrinkPriceVolume) {
|
||||
updatePrice(price: FG.DrinkPrice, volume: DrinkPriceVolume) {
|
||||
axios
|
||||
.put(`pricelist/prices/${price.id}`, price)
|
||||
.then((response: AxiosResponse<FG.DrinkPrice>) => {
|
||||
const index = volume.prices.findIndex(a => a.id === price.id);
|
||||
if (index > -1) {
|
||||
//volume.prices[index] = response.data;
|
||||
this.sortPrices(volume);
|
||||
}
|
||||
})
|
||||
.catch(err => console.log(err));
|
||||
},
|
||||
setVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
setVolume(volume: DrinkPriceVolume, drink: Drink) {
|
||||
console.log(volume);
|
||||
axios
|
||||
.post(`pricelist/drinks/${drink.id}/volumes`, volume)
|
||||
.post(`pricelist/drinks/${drink.id}/volumes`, { ...volume, volume: volume.volume })
|
||||
.then((response: AxiosResponse<FG.DrinkPriceVolume>) => {
|
||||
drink.volumes.push(response.data);
|
||||
const a: DrinkPriceVolume = {
|
||||
...response.data,
|
||||
min_prices: [],
|
||||
_volume: response.data.volume,
|
||||
volume: null
|
||||
};
|
||||
a.volume = create_volume(drink, a);
|
||||
a.min_prices = [
|
||||
{
|
||||
percentage: 100,
|
||||
price: create_min_prices(drink, a, 100)
|
||||
},
|
||||
{
|
||||
percentage: 250,
|
||||
price: create_min_prices(drink, a, 250)
|
||||
},
|
||||
{
|
||||
percentage: 300,
|
||||
price: create_min_prices(drink, a, 300)
|
||||
}
|
||||
];
|
||||
console.log(a);
|
||||
drink.volumes.push(a);
|
||||
})
|
||||
.catch(err => console.warn(err));
|
||||
},
|
||||
updateVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
updateVolume(volume: DrinkPriceVolume, drink: Drink) {
|
||||
axios
|
||||
.put(`pricelist/volumes/${volume.id}`, volume)
|
||||
.put(`pricelist/volumes/${volume.id}`, { ...volume, volume: volume.volume?.value })
|
||||
.catch(err => console.warn(err));
|
||||
},
|
||||
deleteVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
axios
|
||||
.delete(`pricelist/volumes/${volume.id}`)
|
||||
.then(() => {
|
||||
//calc_min_prices_by_drink(volume, drink);
|
||||
const index = drink.volumes.findIndex(a => a.id === volume.id);
|
||||
if (index > -1) {
|
||||
drink.volumes.splice(index, 1);
|
||||
}
|
||||
})
|
||||
.catch(err => console.warn(err));
|
||||
}
|
||||
|
@ -91,31 +170,59 @@ const actions = {
|
|||
|
||||
const getters = {};
|
||||
|
||||
function calc_min_prices_by_drink(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
|
||||
volume.min_prices.forEach(min_price => {
|
||||
min_price.price =
|
||||
((drink.cost_price_pro_volume || 0) * volume.volume * min_price.percentage) / 100;
|
||||
});
|
||||
}
|
||||
|
||||
function calc_min_prices(row: FG.DrinkPriceVolume) {
|
||||
row.volume = 0;
|
||||
let cost_price = 0;
|
||||
row.ingredients.forEach((ingredient: FG.DrinkIngredient & FG.ExtraIngredient) => {
|
||||
console.log(ingredient);
|
||||
if (ingredient.drink_ingredient) {
|
||||
row.volume = row.volume + ingredient.volume;
|
||||
cost_price += ingredient.volume * (ingredient.drink_ingredient.cost_price_pro_volume || 0);
|
||||
} else if (ingredient.name && ingredient.price) {
|
||||
cost_price += ingredient.price;
|
||||
function create_volume(drink: Drink, volume: DrinkPriceVolume) {
|
||||
return computed<number>({
|
||||
get: () => {
|
||||
if (volume.ingredients.some(ingredient => !!ingredient.drink_ingredient)) {
|
||||
let retVal = 0;
|
||||
volume.ingredients.forEach(ingredient => {
|
||||
if (ingredient.volume) {
|
||||
retVal += ingredient.volume;
|
||||
}
|
||||
});
|
||||
row.min_prices.forEach(min_price => {
|
||||
min_price.price = (cost_price * min_price.percentage) / 100;
|
||||
volume._volume = retVal;
|
||||
return retVal;
|
||||
} else {
|
||||
return volume._volume;
|
||||
}
|
||||
},
|
||||
set: val => (volume._volume = val)
|
||||
});
|
||||
}
|
||||
|
||||
export { calc_min_prices };
|
||||
function create_min_prices(drink: Drink, volume: DrinkPriceVolume, percentage: number) {
|
||||
if (drink.cost_price_pro_volume) {
|
||||
if (volume.ingredients.every(ingredient => !!ingredient.drink_ingredient)) {
|
||||
return computed<number>(() => {
|
||||
let retVal = (drink.cost_price_pro_volume || 0) * (volume.volume?.value || 0);
|
||||
volume.ingredients.forEach((ingredient: FG.ExtraIngredient) => {
|
||||
retVal += ingredient.price;
|
||||
});
|
||||
retVal = (retVal * percentage) / 100;
|
||||
return retVal;
|
||||
});
|
||||
} else {
|
||||
return computed<number>(
|
||||
() => ((drink.cost_price_pro_volume || 0) * (volume.volume?.value || 0) * percentage) / 100
|
||||
);
|
||||
}
|
||||
} else {
|
||||
return computed<number>(() => {
|
||||
let retVal = 0;
|
||||
volume.ingredients.forEach(ingredient => {
|
||||
if (ingredient.drink_ingredient) {
|
||||
retVal += ingredient.volume * (ingredient.drink_ingredient.cost_price_pro_volume || 0);
|
||||
}
|
||||
if (ingredient.name) {
|
||||
retVal += ingredient.price;
|
||||
}
|
||||
});
|
||||
console.log(volume);
|
||||
return (retVal * percentage) / 100;
|
||||
});
|
||||
}
|
||||
}
|
||||
export { create_min_prices, create_volume, DrinkPriceVolume, MinPrice, Drink };
|
||||
export default {
|
||||
state,
|
||||
actions,
|
||||
|
|
Loading…
Reference in New Issue