8315-devToTest #1094

Merged
alexm merged 253 commits from 8315-devToTest into test 2024-12-18 10:31:55 +00:00
2 changed files with 49 additions and 21 deletions
Showing only changes of commit b3170108e0 - Show all commits

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref, toRef } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
@ -13,7 +13,7 @@ const DEFAULT_PRICE_KG = 0;
const { t } = useI18n(); const { t } = useI18n();
defineProps({ const props = defineProps({
item: { item: {
type: Object, type: Object,
required: true, required: true,
@ -25,57 +25,63 @@ defineProps({
}); });
const dialog = ref(null); const dialog = ref(null);
const card = toRef(props, 'item');
</script> </script>
<template> <template>
<div class="container order-catalog-item overflow-hidden"> <div class="container order-catalog-item overflow-hidden">
<QCard class="card shadow-6"> <QCard class="card shadow-6">
<div class="img-wrapper"> <div class="img-wrapper">
<VnImg :id="item.id" class="image" zoom-resolution="1600x900" /> <VnImg :id="card.id" class="image" zoom-resolution="1600x900" />
<div v-if="item.hex && isCatalog" class="item-color-container"> <div v-if="card.hex && isCatalog" class="item-color-container">
<div <div
class="item-color" class="item-color"
:style="{ backgroundColor: `#${item.hex}` }" :style="{ backgroundColor: `#${card.hex}` }"
></div> ></div>
</div> </div>
</div> </div>
<div class="content"> <div class="content">
<span class="link"> <span class="link">
{{ item.name }} {{ card.name }}
<ItemDescriptorProxy :id="item.id" /> <ItemDescriptorProxy :id="card.id" />
</span> </span>
<p class="subName">{{ item.subName }}</p> <p class="subName">{{ card.subName }}</p>
<template v-for="index in 4" :key="`tag-${index}`"> <template v-for="index in 4" :key="`tag-${index}`">
<VnLv <VnLv
v-if="item?.[`tag${index + 4}`]" v-if="card?.[`tag${index + 4}`]"
:label="item?.[`tag${index + 4}`] + ':'" :label="card?.[`tag${index + 4}`] + ':'"
:value="item?.[`value${index + 4}`]" :value="card?.[`value${index + 4}`]"
/> />
</template> </template>
<div v-if="item.minQuantity" class="min-quantity"> <div v-if="card.minQuantity" class="min-quantity">
<QIcon name="production_quantity_limits" size="xs" /> <QIcon name="production_quantity_limits" size="xs" />
{{ item.minQuantity }} {{ card.minQuantity }}
</div> </div>
<div class="footer"> <div class="footer">
<div class="price"> <div class="price">
<p v-if="isCatalog"> <p v-if="isCatalog">
{{ item.available }} {{ t('to') }} {{ card.available }} {{ t('to') }}
{{ toCurrency(item.price) }} {{ toCurrency(card.price) }}
</p> </p>
<slot name="price" /> <slot name="price" />
<QIcon v-if="isCatalog" name="add_circle" class="icon"> <QIcon v-if="isCatalog" name="add_circle" class="icon">
<QTooltip>{{ t('globals.add') }}</QTooltip> <QTooltip>{{ t('globals.add') }}</QTooltip>
<QPopupProxy ref="dialog"> <QPopupProxy ref="dialog">
<OrderCatalogItemDialog <OrderCatalogItemDialog
:item="item" :item="card"
@added="() => dialog.hide()" @added="
(quantityAdded) => {
card.available += quantityAdded;
dialog.hide();
}
"
/> />
</QPopupProxy> </QPopupProxy>
</QIcon> </QIcon>
</div> </div>
<p v-if="item.priceKg" class="price-kg"> <p v-if="card.priceKg" class="price-kg">
{{ t('price-kg') }} {{ t('price-kg') }}
{{ toCurrency(item.priceKg) || DEFAULT_PRICE_KG }} {{ toCurrency(card.priceKg) || DEFAULT_PRICE_KG }}
</p> </p>
</div> </div>
</div> </div>

View File

@ -25,6 +25,25 @@ const total = computed(() => state.get('orderTotal'));
// const onItemSaved = inject('onItemSaved'); // const onItemSaved = inject('onItemSaved');
const prices = ref((props.item.prices || []).map((item) => ({ ...item, quantity: 0 }))); const prices = ref((props.item.prices || []).map((item) => ({ ...item, quantity: 0 })));
const isLoading = ref(false); const isLoading = ref(false);
const calculateTotals = (items) => {
return items.reduce(
(acc, item) => {
acc.totalQuantity += item.quantity;
acc.totalSum += item.quantity * item.price;
return acc;
},
{ totalQuantity: 0, totalSum: 0 }
);
};
// const totalSum = (items) =>
// items.reduce((acc, item) => {
// return acc + item.quantity * item.price;
// }, 0);
// const totalQuantity = (items) =>
// items.reduce((acc, item) => {
// return acc + item.quantity;
// }, 0);
const addToOrder = async () => { const addToOrder = async () => {
if (isLoading.value) return; if (isLoading.value) return;
isLoading.value = true; isLoading.value = true;
@ -33,10 +52,13 @@ const addToOrder = async () => {
items, items,
orderFk: Number(route.params.id), orderFk: Number(route.params.id),
}); });
state.set('orderTotal', total.value + 100);
const { totalQuantity, totalSum } = calculateTotals(items);
state.set('orderTotal', total.value + totalSum);
notify(t('globals.dataSaved'), 'positive'); notify(t('globals.dataSaved'), 'positive');
// onItemSaved({ ...props, items, saved: true }); // onItemSaved({ ...props, items, saved: true });
emit('added', items); emit('added', -totalQuantity);
isLoading.value = false; isLoading.value = false;
}; };
const canAddToOrder = () => { const canAddToOrder = () => {