Flaschengeist/flaschengeist-frontend
Flaschengeist
/
flaschengeist-frontend
7
0
Fork 1
Code Issues Pull Requests Projects Releases Activity

[pricelist] Fixed build errors

This commit is contained in:
Ferdinand Thiessen 2021-03-20 18:05:00 +01:00
parent 0b255c481a
commit c5a34ce63f
5 changed files with 83 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumeTable/NewVolume.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<q-btn <q-btn
v-if="cost_price_pro_volume" v-if="pricePerVolume"
color="positive" color="positive"
icon-right="add" icon-right="add"
label="Abgabe hinzufügen" label="Abgabe hinzufügen"
@ -14,56 +14,36 @@
dense dense
label="Liter" label="Liter"
type="number" type="number"
min='0' min="0"
step='0.01' step="0.01"
/> />
</div> </div>
<div class="row justify-between q-pa-sm"> <div class="row justify-between q-pa-sm">
<q-btn v-close-popup label="Abbrechen" @click="cancelAddVolume" /> <q-btn v-close-popup label="Abbrechen" @click="cancelAddVolume" />
<q-btn <q-btn v-close-popup label="Speichern" color="primary" @click="addVolume(rows)" />
v-close-popup
label="Speichern"
color="primary"
@click="addVolume(rows)"
/>
</div> </div>
</q-menu> </q-menu>
</q-btn> </q-btn>
</template> </template>
<script lang='ts'> <script lang="ts">
import { DrinkPriceVolume } from '../../../store'; import { DrinkPriceVolume } from '../../../store';
import { ref } from 'vue'; import { ref, defineComponent } from 'vue';
import {CompositionAPIEmit} from 'vue-typed-emit';
import {SetupContext} from 'vue';
interface Events { export default defineComponent({
addVolume: DrinkPriceVolume
}
interface ExtendedSetupContext extends Omit<SetupContext, 'emit'> {
emit: CompositionAPIEmit<Events>
}
export default {
name: 'NewVolume', name: 'NewVolume',
props: { props: {
cost_price_pro_volume: { pricePerVolume: {
type: undefined, type: Number,
required: true required: true,
}
}, },
emits: ["addVolume"], },
setup(_: any, {emit}: ExtendedSetupContext) { emits: { addVolume: (val: DrinkPriceVolume) => !!val },
setup(_, { emit }) {
const emptyVolume: DrinkPriceVolume = { const emptyVolume: DrinkPriceVolume = {
id: -1, id: -1,
_volume: 0, _volume: 0,
volume: null, min_prices: [{ percentage: 100 }, { percentage: 250 }, { percentage: 300 }],
min_prices: [
{ percentage: 100, price: null },
{ percentage: 250, price: null },
{ percentage: 300, price: null },
],
prices: [], prices: [],
ingredients: [], ingredients: [],
}; };
@ -77,18 +57,16 @@ export default {
}, 200); }, 200);
} }
function addVolume() { function addVolume() {
emit("addVolume", <DrinkPriceVolume>newVolume.value) emit('addVolume', <DrinkPriceVolume>newVolume.value);
} }
return { return {
addVolume, addVolume,
cancelAddVolume, cancelAddVolume,
newVolume, newVolume,
}
}
}; };
},
});
</script> </script>
<style scoped> <style scoped></style>
</style>

81
src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumesTable.vue
View File

@ -49,13 +49,7 @@
label-set="Speichern" label-set="Speichern"
@save="updateVolume(props.row, drink)" @save="updateVolume(props.row, drink)"
> >
<q-input <q-input v-model.number="props.row.volume" dense filled type="number" suffix="L" />
v-model.number="props.row.volume"
dense
filled
type="number"
suffix="L"
/>
</q-popup-edit> </q-popup-edit>
</q-td> </q-td>
<q-td key="min_prices" :props="props"> <q-td key="min_prices" :props="props">
@ -84,38 +78,39 @@
</q-tr> </q-tr>
<q-tr v-show="props.expand" :props="props"> <q-tr v-show="props.expand" :props="props">
<q-td colspan="100%"> <q-td colspan="100%">
<ingredients :ingredients="props.row.ingredients" :volume="props.row" @updateDrink="updateDrink"/> <ingredients
:ingredients="props.row.ingredients"
:volume="props.row"
@updateDrink="updateDrink"
/>
</q-td> </q-td>
</q-tr> </q-tr>
</template> </template>
<template #bottom> <template #bottom>
<div class="full-width row justify-end"> <div class="full-width row justify-end">
<new-volume :cost_price_pro_volume="drink.cost_price_pro_volume" @addVolume="addVolume($event, drink)" /> <new-volume
:cost_price_pro_volume="drink.cost_price_pro_volume"
@addVolume="addVolume($event, drink)"
/>
</div> </div>
</template> </template>
<template #no-data> <template #no-data>
<div class="full-width row justify-end"> <div class="full-width row justify-end">
<new-volume :cost_price_pro_volume="drink.cost_price_pro_volume" @addVolume="addVolume($event, drink)" /> <new-volume
:cost_price_pro_volume="drink.cost_price_pro_volume"
@addVolume="addVolume($event, drink)"
/>
</div> </div>
</template> </template>
</q-table> </q-table>
</template> </template>
<script lang='ts'> <script lang="ts">
import { Drink, DrinkPriceVolume, usePricelistStore } from '../../store'; import { Drink, DrinkPriceVolume, usePricelistStore } from '../../store';
import PriceTable from 'src/plugins/pricelist/components/CalculationTable/PriceTable.vue'; import PriceTable from 'src/plugins/pricelist/components/CalculationTable/PriceTable.vue';
import Ingredients from 'src/plugins/pricelist/components/CalculationTable/Ingredients.vue'; import Ingredients from 'src/plugins/pricelist/components/CalculationTable/Ingredients.vue';
import NewVolume from 'src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumeTable/NewVolume.vue'; import NewVolume from 'src/plugins/pricelist/components/CalculationTable/DrinkPriceVolumeTable/NewVolume.vue';
import {CompositionAPIEmit} from 'vue-typed-emit'; import { PropType, defineComponent } from 'vue';
import {SetupContext} from 'vue'
interface Events {
updateDrink: undefined
}
interface ExtendedSetupContext extends Omit<SetupContext, 'emit'> {
emit: CompositionAPIEmit<Events>
}
const columns = [ const columns = [
{ {
@ -133,40 +128,40 @@ const columns = [
label: 'Preise', label: 'Preise',
field: 'prices', field: 'prices',
}, },
] ];
export default { export default defineComponent({
name: 'DrinkPriceVolumsTable',
components: { PriceTable, Ingredients, NewVolume },
props: { props: {
visibleColumns: { visibleColumns: {
type: Array, type: Array,
default: columns default: columns,
}, },
columns: { columns: {
type: Array, type: Array,
default: columns default: columns,
}, },
rows: { rows: {
type: [] as Array<DrinkPriceVolume>, type: Array as PropType<Array<DrinkPriceVolume>>,
required: true, required: true,
}, },
drink: { drink: {
type: Object as () => Drink, type: Object as PropType<Drink>,
required: true required: true,
}
}, },
name: 'DrinkPriceVolumsTable', },
components: { PriceTable, Ingredients, NewVolume }, emits: { updateDrink: () => true },
setup(_: any, {emit}: ExtendedSetupContext) { setup(_, { emit }) {
const store = usePricelistStore() const store = usePricelistStore();
function addVolume(volume: DrinkPriceVolume, drink: Drink) { function addVolume(volume: DrinkPriceVolume, drink: Drink) {
drink.volumes.push(volume) drink.volumes.push(volume);
updateDrink() updateDrink();
} }
function updateDrink() { function updateDrink() {
emit("updateDrink") emit('updateDrink');
} }
function deleteVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) { function deleteVolume(volume: FG.DrinkPriceVolume, drink: FG.Drink) {
store.deleteVolume(volume, drink); store.deleteVolume(volume, drink);
@ -190,13 +185,9 @@ export default {
}, },
]; ];
return {addVolume, return { addVolume, updateDrink, deleteVolume, column_prices };
updateDrink, },
deleteVolume, column_prices} });
}
};
</script> </script>
<style scoped> <style scoped></style>
</style>

38
src/plugins/pricelist/components/CalculationTable/Ingredients.vue
View File

@ -118,6 +118,7 @@
/> />
<q-input <q-input
v-else-if="newIngredient && newIngredient.price" v-else-if="newIngredient && newIngredient.price"
v-model="newIngredient.price"
filled filled
dense dense
label="Preis" label="Preis"
@ -126,7 +127,6 @@
step="0.1" step="0.1"
fill-mask="0" fill-mask="0"
mask="#.##" mask="#.##"
v-model='newIngredient.price'
suffix="€" suffix="€"
/> />
</div> </div>
@ -150,17 +150,6 @@
import { computed, defineComponent, PropType, ref } from 'vue'; import { computed, defineComponent, PropType, ref } from 'vue';
import { DrinkPriceVolume, usePricelistStore } from '../../store'; import { DrinkPriceVolume, usePricelistStore } from '../../store';
import {CompositionAPIEmit} from 'vue-typed-emit';
import {SetupContext} from 'vue';
interface Events {
updateDrink: undefined
}
interface ExtendedSetupContext extends Omit<SetupContext, 'emit'> {
emit: CompositionAPIEmit<Events>
}
export default defineComponent({ export default defineComponent({
name: 'Ingredients', name: 'Ingredients',
props: { props: {
@ -173,8 +162,8 @@ export default defineComponent({
required: true, required: true,
}, },
}, },
emits: ["updateDrink"], emits: { updateDrink: () => true },
setup(_:any, {emit}: ExtendedSetupContext) { setup(_, { emit }) {
const store = usePricelistStore(); const store = usePricelistStore();
const emptyIngredient: FG.Ingredient = { const emptyIngredient: FG.Ingredient = {
@ -185,10 +174,8 @@ export default defineComponent({
const newIngredient = ref<FG.Drink | FG.ExtraIngredient>(); const newIngredient = ref<FG.Drink | FG.ExtraIngredient>();
const newIngredientVolume = ref<number>(0); const newIngredientVolume = ref<number>(0);
function addIngredient(volume: DrinkPriceVolume) { function addIngredient(volume: DrinkPriceVolume) {
let ingredient : FG.Ingredient
if ((<FG.Drink>newIngredient.value)?.volume && newIngredient.value) { if ((<FG.Drink>newIngredient.value)?.volume && newIngredient.value) {
volume.ingredients.push( volume.ingredients.push({
{
id: -1, id: -1,
drink_ingredient: { drink_ingredient: {
id: -1, id: -1,
@ -196,23 +183,20 @@ export default defineComponent({
volume: newIngredientVolume.value, volume: newIngredientVolume.value,
}, },
extra_ingredient: undefined, extra_ingredient: undefined,
}, });
);
} else if (newIngredient.value) { } else if (newIngredient.value) {
volume.ingredients.push( volume.ingredients.push({
{
id: -1, id: -1,
drink_ingredient: undefined, drink_ingredient: undefined,
extra_ingredient: <FG.ExtraIngredient>newIngredient.value, extra_ingredient: <FG.ExtraIngredient>newIngredient.value,
}, });
);
} }
updateDrink() updateDrink();
cancelAddIngredient(); cancelAddIngredient();
} }
function updateDrink() { function updateDrink() {
console.log("updateDrink from Ingredients") console.log('updateDrink from Ingredients');
emit("updateDrink") emit('updateDrink');
} }
function cancelAddIngredient() { function cancelAddIngredient() {
setTimeout(() => { setTimeout(() => {
@ -224,7 +208,7 @@ export default defineComponent({
} }
const drinks = computed(() => const drinks = computed(() =>
store.drinks.filter((drink) => { store.drinks.filter((drink) => {
console.log("computed drinks", drink.name, drink.cost_price_pro_volume) console.log('computed drinks', drink.name, drink.cost_price_pro_volume);
return drink.cost_price_pro_volume; return drink.cost_price_pro_volume;
}) })
); );

27
src/plugins/pricelist/components/CalculationTable/PriceTable.vue
View File

@ -48,11 +48,7 @@
</q-popup-edit> </q-popup-edit>
</q-td> </q-td>
<q-td key="public" :props="prices_props"> <q-td key="public" :props="prices_props">
<q-toggle <q-toggle v-model="prices_props.row.public" dense @update:modelValue="updateDrink" />
v-model="prices_props.row.public"
dense
@update:modelValue="updateDrink"
/>
</q-td> </q-td>
<q-td> <q-td>
@ -142,17 +138,6 @@
import { defineComponent, ref } from 'vue'; import { defineComponent, ref } from 'vue';
import { DrinkPriceVolume, usePricelistStore } from '../../store'; import { DrinkPriceVolume, usePricelistStore } from '../../store';
import {CompositionAPIEmit} from 'vue-typed-emit';
import {SetupContext} from 'vue';
interface Events {
updateDrink: undefined
}
interface ExtendedSetupContext extends Omit<SetupContext, 'emit'> {
emit: CompositionAPIEmit<Events>
}
export default defineComponent({ export default defineComponent({
name: 'PriceTable', name: 'PriceTable',
props: { props: {
@ -173,8 +158,8 @@ export default defineComponent({
required: true, required: true,
}, },
}, },
emits: ["updateDrink"], emits: { updateDrink: () => true },
setup(props, {emit}: ExtendedSetupContext) { setup(props, { emit }) {
const store = usePricelistStore(); const store = usePricelistStore();
const emptyPrice: FG.DrinkPrice = { const emptyPrice: FG.DrinkPrice = {
@ -185,12 +170,12 @@ export default defineComponent({
}; };
const newPrice = ref(emptyPrice); const newPrice = ref(emptyPrice);
function addPrice(volume: DrinkPriceVolume) { function addPrice(volume: DrinkPriceVolume) {
volume.prices.push(newPrice.value) volume.prices.push(newPrice.value);
updateDrink() updateDrink();
cancelAddPrice(); cancelAddPrice();
} }
function updateDrink() { function updateDrink() {
emit("updateDrink") emit('updateDrink');
} }
function cancelAddPrice() { function cancelAddPrice() {
setTimeout(() => { setTimeout(() => {

6
src/plugins/pricelist/store.ts
View File

@ -4,11 +4,11 @@ import { AxiosResponse } from 'axios';
import { computed, WritableComputedRef } from 'vue'; import { computed, WritableComputedRef } from 'vue';
interface MinPrice extends Omit<FG.MinPrices, 'price'> { interface MinPrice extends Omit<FG.MinPrices, 'price'> {
price: WritableComputedRef<number> | null; price?: WritableComputedRef<number>;
} }
interface DrinkPriceVolume extends Omit<Omit<FG.DrinkPriceVolume, 'volume'>, 'min_prices'> { interface DrinkPriceVolume extends Omit<Omit<FG.DrinkPriceVolume, 'volume'>, 'min_prices'> {
_volume: number; _volume: number;
volume: WritableComputedRef<number> | null; volume?: WritableComputedRef<number>;
min_prices: MinPrice[]; min_prices: MinPrice[];
} }
interface Drink extends Omit<Omit<FG.Drink, 'cost_price_pro_volume'>, 'volumes'> { interface Drink extends Omit<Omit<FG.Drink, 'cost_price_pro_volume'>, 'volumes'> {
@ -17,7 +17,7 @@ interface Drink extends Omit<Omit<FG.Drink, 'cost_price_pro_volume'>, 'volumes'>
_cost_price_pro_volume?: number; _cost_price_pro_volume?: number;
} }
class DrinkPriceVolume { class DrinkPriceVolume implements DrinkPriceVolume {
constructor({ id, volume, min_prices, prices, ingredients }: FG.DrinkPriceVolume, drink: Drink) { constructor({ id, volume, min_prices, prices, ingredients }: FG.DrinkPriceVolume, drink: Drink) {
this.id = id; this.id = id;
this._volume = volume; this._volume = volume;